/* PIGGY CHEF shared chrome for sub pages (v47). Tokens follow the retro home. */
:root{--pc-navy:#0A2342;--pc-pink:#F2A3B8;--pc-aqua:#3FA7C4;--pc-orange:#E8833A;--pc-paper:#FAF8F4;--pc-ink:#1F2937}
.sc-header{width:min(1120px,calc(100% - 32px));margin:0 auto;padding:18px 0 10px;display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.sc-logo{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--pc-navy)}
.sc-logo img{width:34px;height:auto}
.sc-logo b{display:block;font:900 22px/1 Georgia,'Times New Roman',serif;letter-spacing:.5px}
.sc-logo small{display:block;font-size:12px;letter-spacing:6px;margin-top:4px}
.sc-nav{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.sc-link{padding:6px 14px;border:2px solid var(--pc-navy);border-radius:999px;font-weight:700;font-size:14px;line-height:1.6;text-decoration:none;background:var(--pc-paper);transition:transform .18s cubic-bezier(.3,1.6,.5,1),background .2s}
.sc-link:hover,.sc-link.is-active{background:var(--pc-pink);transform:translateY(-2px) rotate(-1.5deg)}
.sc-cta{display:inline-flex;align-items:center;gap:6px;padding:9px 18px;border:2px solid var(--pc-navy);border-radius:12px 4px;background:var(--pc-orange);color:var(--pc-navy)!important;font-weight:900;font-size:15px;text-decoration:none;box-shadow:4px 4px 0 var(--pc-navy);transition:transform .15s,box-shadow .15s}
.sc-cta:hover{transform:translate(-2px,-2px) rotate(-1deg);box-shadow:6px 6px 0 var(--pc-navy)}
.sc-cta:active{transform:translate(3px,3px);box-shadow:1px 1px 0 var(--pc-navy)}
.sc-footer{margin-top:64px;background:var(--pc-navy);color:var(--pc-paper);padding:40px 16px 28px;position:relative}
.sc-footer a{color:var(--pc-pink)}
.sc-footer-in{width:min(1120px,100%);margin:0 auto;display:flex;justify-content:space-between;gap:28px;flex-wrap:wrap}
.sc-footer-title{font:400 clamp(30px,4vw,44px)/1.05 Georgia,'Times New Roman',serif;margin:0 0 8px}
.sc-footer-pig{width:44px;height:auto;display:block;margin:0 0 10px;animation:pc-bob 4.5s ease-in-out infinite}
.sc-footer-links{display:grid;grid-template-columns:repeat(2,minmax(120px,auto));gap:10px 36px;align-content:start;font-size:15px}
.sc-copy{width:min(1120px,100%);margin:26px auto 0;font-size:13px;opacity:.85}
.sc-progress{position:fixed;inset:0 0 auto 0;height:5px;z-index:50;background:transparent}
.sc-progress span{display:block;height:100%;width:0;background:repeating-linear-gradient(90deg,var(--pc-pink) 0 14px,var(--pc-orange) 14px 18px);box-shadow:0 1px 0 var(--pc-navy)}
.sc-page{width:min(920px,calc(100% - 32px));margin:auto}
.sc-cta-box{margin:56px auto 8px;max-width:760px;display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap;padding:22px 24px;border:3px solid var(--pc-navy);border-radius:22px 6px;background:#FFF1F5;box-shadow:6px 6px 0 var(--pc-pink);position:relative}
.sc-cta-box:before{content:"";position:absolute;inset:8px;border:1.5px dashed var(--pc-navy);border-radius:16px 4px;pointer-events:none;opacity:.5}
.sc-cta-kicker{margin:0;font:700 12px Georgia,serif;letter-spacing:3px;color:var(--pc-aqua)}
.sc-cta-title{margin:4px 0;font-size:22px;font-weight:900;text-shadow:2px 2px var(--pc-pink)}
.sc-cta-box p{margin:4px 0}
.faq-item{margin:10px 0;border:2px solid var(--pc-navy);border-radius:16px 5px;background:var(--pc-paper);box-shadow:3px 4px 0 var(--pc-pink);padding:4px 18px;transition:box-shadow .2s,transform .2s}
.faq-item[open]{box-shadow:5px 6px 0 var(--pc-aqua)}
.faq-item summary{list-style:none;padding:10px 32px 10px 0;position:relative}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary:after{content:"+";position:absolute;right:0;top:50%;width:28px;height:28px;margin-top:-14px;border-radius:50%;background:var(--pc-pink);display:grid;place-items:center;font-weight:900;transition:transform .25s cubic-bezier(.3,1.6,.5,1)}
.faq-item[open] summary:after{transform:rotate(135deg)}
.faq-links{font-size:14px}
.faq-more{text-align:center;margin-top:28px}
.souv-figure{margin:12px auto;max-width:420px}
.souv-figure img,.souv-card img{width:100%;height:auto;border-radius:12px}
.souv-card{text-decoration:none;display:block}
.camper-rest{display:flex;justify-content:center;margin:48px 0 40px;position:relative;z-index:2;pointer-events:none}
.camper-rest img{width:min(440px,78vw);height:auto;border:3px solid var(--pc-navy);border-radius:18px 6px;box-shadow:6px 6px 0 var(--pc-pink);background:#fff;rotate:-2deg;animation:pc-bob 4.5s ease-in-out infinite;transform-origin:50% 90%}
@media(max-width:700px){.sc-header{padding-top:12px}.sc-nav{gap:6px}.sc-link{padding:4px 10px;font-size:13px}.sc-cta{font-size:14px;padding:8px 14px}.sc-footer-links{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px 18px}}
@media print{.sc-header,.sc-footer,.sc-progress,.sc-cta-box{display:none!important}}

/* v47 tool showcase additions */
.ui-panel-extra .ui-extra-shot{border:2px solid var(--pc-navy);border-radius:10px;overflow:hidden;background:#fff;aspect-ratio:1280/760}
.ui-panel-extra .ui-extra-shot img{width:100%;height:100%;object-fit:cover;object-position:top left;display:block}
.toolbook-strip{width:min(1140px,calc(100% - 32px));margin:48px auto 0;display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:28px;align-items:center;padding:28px;border:3px solid var(--pc-navy);border-radius:24px 8px;background:#FFF1F5;box-shadow:7px 7px 0 var(--pc-aqua)}
.toolbook-strip h3{font-size:clamp(22px,2.6vw,30px);margin:6px 0 10px;text-shadow:2px 2px var(--pc-pink)}
.toolbook-pages{display:flex;gap:14px;justify-content:center}
.toolbook-pages a{display:block;width:46%;transition:transform .3s cubic-bezier(.3,1.6,.5,1)}
.toolbook-pages a:first-child{rotate:-3deg}.toolbook-pages a:last-child{rotate:2.5deg;margin-top:22px}
.toolbook-pages a:hover{transform:translateY(-8px) scale(1.03)}
.toolbook-pages img{width:100%;height:auto;display:block;border:2px solid var(--pc-navy);box-shadow:5px 5px 0 var(--pc-navy);background:#fff}
@media(max-width:800px){.toolbook-strip{grid-template-columns:1fr;padding:20px}}
@media(max-width:700px){.sc-header{flex-wrap:nowrap;flex-direction:column;align-items:flex-start;gap:8px}.sc-nav{flex-wrap:nowrap;overflow-x:auto;width:100%;padding-bottom:4px;scrollbar-width:none}.sc-nav::-webkit-scrollbar{display:none}.sc-link,.sc-cta{flex:0 0 auto}}
.ui-panel-05{grid-column:span 6;margin-top:10px}
.ui-panel-06{grid-column:span 6;margin-top:28px;box-shadow:4px 5px 0 var(--lake,#3FA7C4)}
.ui-panel-06 .ui-panel-stamp{transform:rotate(7deg);background:var(--lake,#3FA7C4)}
@media(max-width:900px){.ui-panel-05,.ui-panel-06{grid-column:1/-1;margin-top:0}}
/* folded source list on guide pages */
details.sources{margin:36px 0 8px;padding:6px 18px;border:1.5px dashed var(--pc-navy);border-radius:14px 4px;background:var(--pc-paper);font-size:14px}
details.sources summary{font-weight:700;min-height:40px;display:flex;align-items:center}
details.sources ul{margin:4px 0 12px;padding-left:1.1em}
details.sources li{margin:6px 0}
.src-date{margin-left:8px;font-size:12px;color:#5b6472;white-space:nowrap}

/* 出遊漫畫：第五本加入後，電腦版一排五本 */
@media (min-width:701px){.comic-belt-group{grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:28px 26px!important;max-width:960px;margin:0 auto}}

/* 紀念品：電腦版卡片一樣大（使用者 2026-10-25 指示） */
@media (min-width:1051px){
  .souvenir-grid.hanging-products{align-items:stretch!important;padding-left:6px;padding-right:10px}
  .hanging-products .hanging-product{display:flex;flex-direction:column;height:100%}
  .hanging-product .souvenir-art{width:100%;max-width:185px;aspect-ratio:1/1;object-fit:contain}
  .hanging-product>a{margin-top:auto;padding-top:8px}
}
@media (min-width:761px){
  .article-list:has(.souv-card){display:flex;flex-wrap:wrap;justify-content:center;gap:22px}
  .article-list:has(.souv-card) .souv-card{flex:0 0 calc((100% - 44px) / 3);display:flex;flex-direction:column}
  .souv-card img{aspect-ratio:1/1;object-fit:contain}
}

/* N°4 招牌：容器高度跟著圖片，不留大片空白（2026-10-25） */
#guides>.journal-plaque{height:auto!important;margin:0 auto 22px!important}
#guides>.journal-plaque .approved-journal-sign{display:block;width:100%;height:auto}
#guides.section{padding-top:28px!important}
#price.section,.price-section{padding-bottom:12px!important}
@media (max-width:700px){#guides.section{padding-top:18px!important}}
