/* Layout concept: a framed, sunlit forest "stage" (CGWoods' own hero) that the reader travels through —
   cream parchment clearings for reading, deep pine night-glades (after cgorig's dark gold-lit panels) for
   immersive moments, and notched game-UI plates for every control. Single committed look. */
:root{
  --paper:#fafbf6; --moss:#edf2e7; --moss-2:#dfe8d6; --line:#d3dec8;
  --pine:#214d39; --ink:#203d31; --ink-soft:#4b6556;
  --night:#0f2219; --night-2:#16301f; --night-line:rgba(196,170,105,.28);
  --gold:#c4aa69; --gold-hi:#ecd9a1; --gold-deep:#946719;
  --sky:#376799; --berry:#b4443d;
  --f-display:"Noto Serif TC","Songti TC","PMingLiU",serif;
  --f-body:"Noto Sans TC","PingFang TC","Microsoft JhengHei",system-ui,sans-serif;
  --f-ui:"Chakra Petch","Noto Sans TC",system-ui,sans-serif;
  --notch:14px; --r:22px; --gutter:clamp(16px,3.2vw,40px); --max:1240px;
  --ease:cubic-bezier(.2,.7,.2,1);
  color-scheme:light;
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font:400 16px/1.75 var(--f-body);overflow-x:hidden}
img{max-width:100%;display:block}
a{color:inherit}
button{font:inherit;color:inherit}
h1,h2,h3,h4{text-wrap:balance;line-height:1.25;margin:0}
p{margin:0}
:focus-visible{outline:3px solid var(--gold-deep);outline-offset:3px;border-radius:4px}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:fixed;left:16px;top:-60px;z-index:100;background:var(--pine);color:var(--paper);padding:10px 16px;border-radius:8px;text-decoration:none;transition:top .2s}
.skip:focus{top:calc(12px + env(safe-area-inset-top,0px))}
.wrap{max-width:var(--max);margin-inline:auto;padding-inline:var(--gutter)}
.latin{font-family:var(--f-ui);letter-spacing:.02em}
.num{font-family:var(--f-ui);font-variant-numeric:tabular-nums}

/* ---------- Notched plates & buttons ---------- */
.plate{clip-path:polygon(0 0,calc(100% - var(--notch)) 0,100% var(--notch),100% 100%,var(--notch) 100%,0 calc(100% - var(--notch)))}
.btn{--bg:var(--pine);--fg:var(--paper);position:relative;display:inline-flex;align-items:center;gap:.6em;min-height:48px;padding:.7em 1.3em;border:0;background:var(--bg);color:var(--fg);
  font:600 15px/1.2 var(--f-ui);letter-spacing:.04em;text-decoration:none;cursor:pointer;overflow:hidden;isolation:isolate;
  clip-path:polygon(0 0,calc(100% - 12px) 0,100% 12px,100% 100%,12px 100%,0 calc(100% - 12px));transition:transform .25s var(--ease),filter .25s}
.btn::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(105deg,transparent 30%,rgba(236,217,161,.45) 48%,transparent 66%);transform:translateX(-120%);transition:transform .7s var(--ease)}
.btn:hover::after,.btn:focus-visible::after{transform:translateX(120%)}
.btn:hover{transform:translateY(-2px)}
.btn:active{transform:translateY(0)}
.btn.gold{--bg:linear-gradient(180deg,#e5cf91,#c4aa69 55%,#a98a45);--fg:var(--night)}
.btn.ghost{--bg:rgba(250,251,246,.9);--fg:var(--ink);box-shadow:inset 0 0 0 1px var(--line)}
.btn.line-gold{--bg:transparent;--fg:var(--gold-hi);box-shadow:inset 0 0 0 1.5px var(--gold)}
.btn svg{width:18px;height:18px;flex:none}
.chip{display:inline-flex;align-items:center;gap:.35em;padding:.18em .7em;border-radius:999px;font:600 12px/1.6 var(--f-ui);letter-spacing:.06em;background:var(--moss);color:var(--pine);white-space:nowrap}
.chip.pin{background:var(--gold);color:var(--night)}
.chip.maint{background:#e3ebf3;color:var(--sky)}
.chip.dark{background:rgba(15,34,25,.78);color:var(--gold-hi);backdrop-filter:blur(6px)}
.eyebrow{display:flex;align-items:center;gap:.6em;font:600 13px/1.4 var(--f-ui);letter-spacing:.16em;color:var(--gold-deep)}
.eyebrow::before{content:"";width:22px;height:1px;background:currentColor}
.on-night .eyebrow{color:var(--gold)}

/* ---------- Header ---------- */
.site-header{position:sticky;top:env(safe-area-inset-top,0px);z-index:40;padding-block:12px;transition:background .3s,box-shadow .3s}
.site-header.scrolled{background:rgba(250,251,246,.86);backdrop-filter:blur(12px) saturate(1.2);box-shadow:0 1px 0 var(--line)}
.header-row{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:12px}
.header-left,.header-right{display:flex;gap:8px;align-items:center}
.header-right{justify-content:flex-end}
.nav-pill{display:inline-flex;align-items:center;min-height:44px;padding:0 16px;background:rgba(250,251,246,.92);border-radius:4px;box-shadow:inset 0 0 0 1px var(--line);
  font:600 14px/1 var(--f-body);color:var(--ink);text-decoration:none;transition:background .2s,color .2s}
.nav-pill:hover{background:var(--moss)}
.nav-pill[aria-current="page"]{background:var(--pine);color:var(--paper);box-shadow:none}
.icon-btn{width:44px;height:44px;display:grid;place-items:center;border:0;background:rgba(250,251,246,.92);box-shadow:inset 0 0 0 1px var(--line);cursor:pointer;
  clip-path:polygon(0 0,calc(100% - 10px) 0,100% 10px,100% 100%,0 100%)}
.icon-btn svg{width:20px;height:20px}
.brand-mark{display:block;width:62px;height:62px;margin:-8px 0;filter:drop-shadow(0 4px 10px rgba(32,61,49,.25));transition:transform .4s var(--ease)}
.brand-mark:hover{transform:rotate(-6deg) scale(1.06)}
.home .site-header:not(.scrolled) .brand-mark{opacity:0;pointer-events:none}
@media (max-width:820px){.hide-sm{display:none!important}.header-row{grid-template-columns:auto 1fr auto}.brand-mark{width:50px;height:50px;margin:-6px auto}}

/* Drawer menu */
.drawer{position:fixed;inset:0;z-index:60;display:grid;grid-template-columns:min(420px,100%) 1fr;visibility:hidden}
.drawer.open{visibility:visible}
.drawer-panel{background:var(--night);color:var(--paper);padding:calc(20px + env(safe-area-inset-top,0px)) 28px 28px;display:flex;flex-direction:column;gap:24px;overflow:auto;
  transform:translateX(-102%);transition:transform .45s var(--ease);background-image:radial-gradient(120% 60% at 0 0,rgba(196,170,105,.16),transparent 60%)}
.drawer.open .drawer-panel{transform:none}
.drawer-scrim{background:rgba(15,34,25,.5);opacity:0;transition:opacity .4s;border:0}
.drawer.open .drawer-scrim{opacity:1}
.drawer-logo{width:220px}
.drawer nav{display:grid;gap:2px}
.drawer nav a{display:flex;justify-content:space-between;align-items:baseline;padding:14px 4px;border-bottom:1px solid var(--night-line);text-decoration:none;font:700 22px/1.3 var(--f-display)}
.drawer nav a small{font:500 12px var(--f-ui);letter-spacing:.14em;color:var(--gold)}
.drawer nav a:hover{color:var(--gold-hi)}
.drawer .ext{display:flex;gap:10px;flex-wrap:wrap}
.drawer .close{align-self:flex-end;background:transparent;box-shadow:inset 0 0 0 1px var(--night-line)}
.drawer .close svg{stroke:var(--paper)}

/* ---------- Route transition veil ---------- */
.veil{position:fixed;inset:0;z-index:80;pointer-events:none;background:radial-gradient(circle at 50% 50%,#2c5a42,var(--night));clip-path:circle(0% at var(--vx,50%) var(--vy,50%))}
.veil img{position:absolute;left:50%;top:50%;width:120px;transform:translate(-50%,-50%) scale(.6);opacity:0}
.veil.in{animation:veilIn .42s var(--ease) forwards}
.veil.in img{animation:markPop .42s var(--ease) forwards}
.veil.out{clip-path:circle(150% at 50% 50%);animation:veilOut .5s var(--ease) forwards}
@keyframes veilIn{to{clip-path:circle(150% at var(--vx,50%) var(--vy,50%))}}
@keyframes veilOut{to{clip-path:circle(0% at 50% 50%)}}
@keyframes markPop{to{opacity:1;transform:translate(-50%,-50%) scale(1)}}
main{display:block;min-height:60vh}
main.enter > *{animation:rise .6s var(--ease) both}
main.enter > *:nth-child(2){animation-delay:.06s}
main.enter > *:nth-child(3){animation-delay:.12s}
@keyframes rise{from{transform:translateY(18px)}to{transform:none}}

/* ---------- Hero (original CGWoods composition, extended) ---------- */
.hero{padding-inline:clamp(10px,2vw,28px);margin-top:-80px}
.hero-stage{position:relative;max-width:1680px;margin-inline:auto;aspect-ratio:1672/941;max-height:calc(100vh - 40px);min-height:560px;width:100%;border-radius:var(--r);overflow:hidden;isolation:isolate;
  box-shadow:0 30px 80px -40px rgba(15,34,25,.55);background:#7aa36a}
.hero-notch{position:absolute;left:50%;top:-1px;transform:translateX(-50%);z-index:5;width:200px;height:56px;background:var(--paper);
  clip-path:polygon(0 0,100% 0,82% 100%,18% 100%);display:grid;place-items:center}
.hero-notch img{width:52px;margin-top:-4px;filter:drop-shadow(0 3px 6px rgba(32,61,49,.3));animation:bob 5s ease-in-out infinite}
.hero-bg{position:absolute;inset:-3%;z-index:-2;transition:transform .9s var(--ease)}
.hero-bg img{width:100%;height:100%;object-fit:cover;object-position:50% 40%}
.hero-stage.intro .hero-bg img{animation:heroIn 2.4s var(--ease) both}
@keyframes heroIn{from{transform:scale(1.12);filter:saturate(.78) brightness(1.08)}to{transform:none;filter:none}}
.hero-light{position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:radial-gradient(60% 50% at 50% 18%,rgba(255,250,215,.55),transparent 70%),
             linear-gradient(180deg,transparent 55%,rgba(15,34,25,.42) 100%)}
.rays{position:absolute;inset:-20% 0 0;z-index:-1;pointer-events:none;mix-blend-mode:soft-light;opacity:.7;
  background:repeating-conic-gradient(from 200deg at 55% -10%,rgba(255,248,210,.0) 0deg,rgba(255,248,210,.55) 4deg,rgba(255,248,210,0) 9deg,rgba(255,248,210,0) 16deg);
  -webkit-mask:linear-gradient(180deg,#000 10%,transparent 75%);mask:linear-gradient(180deg,#000 10%,transparent 75%);animation:sway 12s ease-in-out infinite alternate}
@keyframes sway{from{transform:rotate(-2deg)}to{transform:rotate(2deg)}}
#motes{position:absolute;inset:0;z-index:0;pointer-events:none;width:100%;height:100%}
.hero-center{position:absolute;left:50%;top:14%;transform:translateX(-50%);z-index:2;display:grid;justify-items:center;gap:12px;width:min(46%,560px)}
.hero-logo{width:100%;filter:drop-shadow(0 10px 22px rgba(25,40,20,.45));transition:transform .9s var(--ease)}
.hero-stage.intro .hero-logo{animation:logoIn 1.4s .35s var(--ease) both}
@keyframes logoIn{from{transform:translateY(-30px) scale(.9);filter:drop-shadow(0 0 0 transparent) brightness(2.2)}to{transform:none}}
.hero-domain{font:600 13px/1 var(--f-ui);letter-spacing:.14em;padding:8px 12px;background:rgba(33,77,57,.88);color:var(--paper);border-radius:3px;box-shadow:0 0 0 1px rgba(236,217,161,.35)}
.hero-dl{position:absolute;left:50%;bottom:17%;transform:translateX(-50%);z-index:4;display:flex;gap:18px}
.hero-stage.intro .dl-group{animation:up .8s var(--ease) both}
.hero-stage.intro .dl-group:nth-child(1){animation-delay:1s}.hero-stage.intro .dl-group:nth-child(2){animation-delay:1.1s}.hero-stage.intro .dl-group:nth-child(3){animation-delay:1.2s}
@keyframes up{from{transform:translateY(24px)}to{transform:none}}
.dl-group{position:relative}
.dl-toggle{min-width:206px;justify-content:center;background:rgba(33,77,57,.94);box-shadow:inset 0 0 0 1px rgba(236,217,161,.3),0 12px 30px -12px rgba(15,34,25,.7)}
.dl-toggle .chev{transition:transform .25s}
.dl-group.open .dl-toggle .chev{transform:rotate(180deg)}
.dl-menu{position:absolute;left:0;right:0;bottom:calc(100% + 8px);background:rgba(15,34,25,.94);backdrop-filter:blur(10px);padding:6px;display:grid;gap:4px;
  border-radius:6px;box-shadow:0 0 0 1px var(--night-line),0 20px 40px -10px rgba(0,0,0,.5);opacity:0;transform:translateY(8px);visibility:hidden;transition:.25s var(--ease)}
.dl-group.open .dl-menu{opacity:1;transform:none;visibility:visible}
.dl-menu a{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:11px 12px;color:var(--paper);text-decoration:none;border-radius:4px;font:600 14px/1.2 var(--f-body)}
.dl-menu a:hover,.dl-menu a:focus-visible{background:rgba(196,170,105,.18);color:var(--gold-hi)}
.dl-menu a small{font:500 11px var(--f-ui);color:var(--gold);letter-spacing:.06em}
.hero-bar{position:absolute;left:3%;right:3%;bottom:0;z-index:3;display:flex;justify-content:space-between;align-items:center;gap:16px;padding:14px 0;border-top:1px solid rgba(250,251,246,.35);color:var(--paper);font-size:14px}
.hero-bar a{color:var(--paper);text-decoration:none;display:inline-flex;align-items:center;gap:8px}
.hero-bar a:hover{color:var(--gold-hi)}
.ticker{display:flex;align-items:center;gap:12px;min-width:0}
.ticker b{font:600 12px var(--f-ui);letter-spacing:.12em;color:var(--gold-hi);white-space:nowrap}
.ticker span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.hero-bar .links{display:flex;gap:20px;flex:none}
.scroll-cue{position:absolute;left:50%;bottom:58px;transform:translateX(-50%);z-index:3;display:grid;justify-items:center;gap:2px;color:var(--paper);font:600 11px var(--f-ui);letter-spacing:.2em;text-decoration:none}
.scroll-cue svg{width:20px;animation:cue 1.8s ease-in-out infinite}
@keyframes cue{50%{transform:translateY(5px)}}
@keyframes bob{50%{transform:translateY(-3px)}}
@media (max-width:900px){
  .hero{margin-top:-74px}
  .hero-stage{aspect-ratio:941/1500;max-height:none;min-height:0}
  .hero-center{top:13%;width:82%}
  .hero-dl{flex-direction:column;bottom:13%;width:min(84%,340px);gap:10px}
  .dl-toggle{width:100%}
  .dl-menu{bottom:auto;top:calc(100% + 6px);z-index:6}
  .hero-bar .links,.scroll-cue{display:none}
  .hero-notch{width:150px;height:48px}.hero-notch img{width:42px}
}

/* ---------- Section scaffolding ---------- */
.section{padding-block:clamp(56px,8vw,112px)}
.sec-head{display:flex;justify-content:space-between;align-items:end;gap:20px;flex-wrap:wrap;margin-bottom:clamp(24px,4vw,44px)}
.sec-head h2{font:900 clamp(30px,4.4vw,52px)/1.15 var(--f-display);letter-spacing:.02em;margin-top:10px}
.sec-head p.lede{color:var(--ink-soft);margin-top:8px;max-width:46ch}
.more{display:inline-flex;align-items:center;gap:6px;font:600 14px var(--f-ui);letter-spacing:.06em;color:var(--pine);text-decoration:none;padding:8px 0;border-bottom:1.5px solid var(--gold)}
.more:hover{color:var(--gold-deep)}
.on-night{background:var(--night);color:var(--paper);position:relative;isolation:isolate}
.on-night .more{color:var(--gold-hi)}
.on-night .lede{color:#b9c9bc!important}
.divider{display:flex;align-items:center;justify-content:center;gap:14px;color:var(--gold);margin-block:0}
.divider::before,.divider::after{content:"";height:1px;flex:1;max-width:240px;background:linear-gradient(90deg,transparent,currentColor)}
.divider::after{transform:scaleX(-1)}

/* ---------- News: cgorig-style illustrated dispatches + quest log ---------- */
.news-feature{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.dispatch{position:relative;display:flex;flex-direction:column;text-decoration:none;color:var(--paper);background:var(--night);border-radius:10px;overflow:hidden;
  box-shadow:0 0 0 1px rgba(32,61,49,.12),0 18px 40px -26px rgba(15,34,25,.6);transition:transform .35s var(--ease),box-shadow .35s}
.dispatch:hover{transform:translateY(-6px);box-shadow:0 0 0 1px var(--gold),0 26px 50px -24px rgba(15,34,25,.7)}
.dispatch .art{aspect-ratio:16/10;overflow:hidden}
.dispatch .art img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease)}
.dispatch:hover .art img{transform:scale(1.07)}
.dispatch .chips{position:absolute;left:12px;top:12px;display:flex;gap:6px}
.dispatch .cap{padding:14px 16px 16px;display:grid;gap:4px;background:linear-gradient(180deg,var(--night-2),var(--night))}
.dispatch h3{font:700 16px/1.45 var(--f-body)}
.dispatch time{font:500 12px var(--f-ui);color:var(--gold);letter-spacing:.08em}
.quest-log{margin-top:28px;display:grid;grid-template-columns:1fr 1fr;column-gap:40px}
.log-row{display:grid;grid-template-columns:auto 1fr auto auto;align-items:center;gap:14px;padding:15px 4px;border-bottom:1px solid var(--line);text-decoration:none;transition:background .2s,padding .25s var(--ease)}
.log-row:hover{background:var(--moss);padding-inline:12px}
.log-row h3{font:600 15px/1.5 var(--f-body);min-width:0}
.log-row time{font:500 13px var(--f-ui);color:var(--ink-soft)}
.log-row .go{color:var(--gold-deep);transition:transform .25s}
.log-row:hover .go{transform:translate(3px,-3px)}
.tabs{display:flex;gap:4px;flex-wrap:wrap}
.tab{border:0;background:transparent;padding:8px 14px;cursor:pointer;font:600 14px var(--f-body);color:var(--ink-soft);border-bottom:2px solid transparent}
.tab[aria-pressed="true"]{color:var(--pine);border-color:var(--gold-deep)}
@media (max-width:1000px){.news-feature{grid-template-columns:repeat(2,minmax(0,1fr))}.quest-log{grid-template-columns:1fr}}
@media (max-width:520px){.news-feature{grid-template-columns:1fr}.log-row{grid-template-columns:auto 1fr auto}.log-row .go{display:none}}

/* ---------- Guide cards (field notes) ---------- */
.guide-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:22px}
.note-card{position:relative;display:flex;flex-direction:column;text-decoration:none;color:var(--ink);background:#fff;border-radius:6px;overflow:hidden;
  box-shadow:0 0 0 1px var(--line);transition:transform .35s var(--ease),box-shadow .35s;transform-style:preserve-3d}
.note-card:hover{box-shadow:0 0 0 1px var(--gold),0 24px 40px -26px rgba(32,61,49,.55)}
.note-card .art{position:relative;aspect-ratio:4/3;overflow:hidden;background:var(--moss);clip-path:polygon(0 0,100% 0,100% 88%,88% 100%,0 100%)}
.note-card .art img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease)}
.note-card:hover .art img{transform:scale(1.06)}
.note-card .chips{position:absolute;left:10px;top:10px;display:flex;gap:6px}
.note-card .body{padding:16px 18px 20px;display:flex;flex-direction:column;gap:8px;flex:1}
.note-card .cat{font:600 12px var(--f-ui);letter-spacing:.12em;color:var(--gold-deep)}
.note-card h3{font:700 18px/1.4 var(--f-display)}
.note-card p{color:var(--ink-soft);font-size:14px;line-height:1.7;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.note-card .foot{margin-top:auto;display:flex;justify-content:space-between;align-items:center;padding-top:8px;font:500 12px var(--f-ui);color:var(--ink-soft)}
.note-card .read{color:var(--pine);font-weight:600}

/* ---------- Versions: character-select panels ---------- */
.versions{background:linear-gradient(180deg,var(--paper),var(--moss) 18%,var(--moss) 82%,var(--paper));}
.select-tabs{display:inline-flex;padding:5px;background:var(--paper);border-radius:6px;box-shadow:inset 0 0 0 1px var(--line);gap:4px}
.select-tabs button{border:0;cursor:pointer;padding:10px 18px;border-radius:4px;background:transparent;font:600 15px var(--f-body);color:var(--ink-soft);display:flex;gap:8px;align-items:baseline}
.select-tabs button b{font:700 20px var(--f-ui)}
.select-tabs button[aria-selected="true"]{background:var(--pine);color:var(--paper)}
.edition{position:relative;margin-top:24px;min-height:520px;border-radius:var(--r);overflow:hidden;isolation:isolate;display:grid;align-items:center;color:var(--ink)}
.edition .bg{position:absolute;inset:0;z-index:-2}
.edition .bg img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease)}
.edition .shade{position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(250,251,246,.97) 0%,rgba(250,251,246,.9) 32%,rgba(250,251,246,0) 64%)}
.edition.v37 .shade{background:linear-gradient(270deg,rgba(250,251,246,.97) 0%,rgba(250,251,246,.9) 32%,rgba(250,251,246,0) 64%)}
.edition .content{padding:clamp(28px,5vw,64px);max-width:560px;display:grid;gap:16px}
.edition.v37 .content{margin-left:auto}
.edition .label{display:flex;align-items:baseline;gap:12px}
.edition .label span{font:700 clamp(56px,8vw,96px)/.9 var(--f-ui);color:var(--pine);letter-spacing:-.02em;background:linear-gradient(180deg,#2d6a4c,#163a29);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.edition .label b{font:700 18px var(--f-display);color:var(--gold-deep)}
.edition h3{font:900 clamp(24px,3vw,34px)/1.3 var(--f-display)}
.edition p{color:var(--ink-soft)}
.stats{display:flex;flex-wrap:wrap;gap:8px;list-style:none;padding:0;margin:4px 0}
.stats li{padding:6px 12px;background:rgba(33,77,57,.08);border:1px solid rgba(33,77,57,.18);font:600 13px var(--f-body);clip-path:polygon(8px 0,100% 0,100% calc(100% - 8px),calc(100% - 8px) 100%,0 100%,0 8px)}
.edition .acts{display:flex;gap:10px;flex-wrap:wrap}
.edition[hidden]{display:none}
.edition.swap .content{animation:slideIn .6s var(--ease) both}
.edition.swap .bg img{animation:zoomOut 1.2s var(--ease) both}
@keyframes slideIn{from{transform:translateX(-24px)}to{transform:none}}
@keyframes zoomOut{from{transform:scale(1.08)}to{transform:none}}
@media (max-width:760px){
  .edition{min-height:0;align-items:end}
  .edition .bg{position:relative;inset:auto;aspect-ratio:16/9}
  .edition{display:flex;flex-direction:column}
  .edition .shade{display:none}
  .edition .content{background:var(--paper);max-width:none}
}

/* ---------- Professions ---------- */
.prof-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.prof{position:relative;border-radius:14px;overflow:hidden;background:var(--night-2);color:var(--paper);display:flex;flex-direction:column;box-shadow:0 0 0 1px var(--night-line);transition:transform .4s var(--ease)}
.prof .art{aspect-ratio:4/3;overflow:hidden;position:relative}
.prof .art img{width:100%;height:100%;object-fit:cover;transition:transform 1s var(--ease)}
.prof .art::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,var(--night-2))}
.prof:hover .art img{transform:scale(1.06)}
.prof .txt{padding:6px 24px 26px;display:grid;gap:10px;flex:1}
.prof .idx{font:600 12px var(--f-ui);letter-spacing:.16em;color:var(--gold)}
.prof h3{font:900 30px/1.2 var(--f-display);color:var(--gold-hi)}
.prof p{color:#c9d6cc;font-size:15px}
.prof a{margin-top:auto;color:var(--paper);font:600 14px var(--f-ui);letter-spacing:.06em;text-decoration:none;display:inline-flex;gap:6px;padding-top:8px}
.prof a:hover{color:var(--gold-hi)}
.glade-bg{position:absolute;inset:0;z-index:-1;background:
  radial-gradient(50% 60% at 15% 0%,rgba(196,170,105,.18),transparent 70%),
  radial-gradient(40% 50% at 100% 100%,rgba(55,103,153,.18),transparent 70%)}
@media (max-width:900px){.prof-grid{grid-template-columns:1fr}.prof{flex-direction:row}.prof .art{width:42%;aspect-ratio:auto}.prof .art::after{background:linear-gradient(90deg,transparent 60%,var(--night-2))}}
@media (max-width:560px){.prof{flex-direction:column}.prof .art{width:auto;aspect-ratio:16/10}.prof .art::after{background:linear-gradient(180deg,transparent 55%,var(--night-2))}}

/* ---------- CTA band ---------- */
.cta{display:grid;grid-template-columns:1.1fr 1fr;gap:clamp(24px,4vw,56px);align-items:center;background:var(--pine);color:var(--paper);border-radius:var(--r);overflow:hidden;position:relative}
.cta .img{position:relative;height:100%;min-height:380px}
.cta .img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 60%}
.cta .t{padding:clamp(28px,5vw,56px);display:grid;gap:16px}
.cta h2{font:900 clamp(28px,3.6vw,44px)/1.25 var(--f-display)}
.cta .acts{display:flex;gap:10px;flex-wrap:wrap}
@media (max-width:760px){.cta{grid-template-columns:1fr}.cta .img{min-height:0;aspect-ratio:16/10}.prose .note{padding:12px 12px}}

/* ---------- Page banners (inner pages) ---------- */
.banner{position:relative;margin-inline:clamp(10px,2vw,28px);border-radius:var(--r);overflow:hidden;isolation:isolate;min-height:340px;display:flex;align-items:flex-end;margin-top:4px}
.banner .bg{position:absolute;inset:0;z-index:-2}
.banner .bg img{width:100%;height:100%;object-fit:cover;object-position:var(--pos,70% 40%)}
.banner::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(237,242,231,.97) 0%,rgba(237,242,231,.88) 40%,rgba(237,242,231,.1) 75%)}
.banner.dark::before{background:linear-gradient(90deg,rgba(15,34,25,.96) 0%,rgba(15,34,25,.82) 45%,rgba(15,34,25,.15) 85%)}
.banner.dark{color:var(--paper)}
.banner .inner{width:100%;max-width:var(--max);margin-inline:auto;padding:clamp(28px,5vw,64px) var(--gutter);display:grid;gap:12px}
.crumb{font:500 13px var(--f-body);color:var(--ink-soft);display:flex;gap:6px;flex-wrap:wrap}
.crumb a{text-decoration:none}.crumb a:hover{text-decoration:underline}
.banner.dark .crumb{color:#b9c9bc}
.banner h1{font:900 clamp(32px,5.4vw,64px)/1.12 var(--f-display);max-width:18ch;letter-spacing:.01em}
.banner .sub{color:var(--ink-soft);max-width:52ch}
.banner.dark .sub{color:#c9d6cc}
@media (max-width:700px){.banner::before{background:linear-gradient(180deg,rgba(237,242,231,.55) 0%,rgba(237,242,231,.96) 60%)}.banner.dark::before{background:linear-gradient(180deg,rgba(15,34,25,.4),rgba(15,34,25,.95) 60%)}.banner{min-height:300px}}

/* ---------- Catalog tools ---------- */
.tools{position:sticky;top:calc(72px + env(safe-area-inset-top,0px));z-index:20;display:grid;gap:12px;padding:14px;background:rgba(250,251,246,.92);backdrop-filter:blur(10px);border-radius:10px;box-shadow:0 0 0 1px var(--line),0 12px 30px -24px rgba(32,61,49,.5);margin-bottom:24px}
.tools-row{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.search{flex:1 1 260px;display:flex;align-items:center;gap:8px;background:#fff;border-radius:6px;box-shadow:inset 0 0 0 1.5px var(--line);padding:0 12px;min-height:46px;transition:box-shadow .2s}
.search:focus-within{box-shadow:inset 0 0 0 2px var(--pine)}
.search svg{width:18px;flex:none;color:var(--ink-soft)}
.search input{flex:1;min-width:0;border:0;outline:0;background:transparent;font:16px var(--f-body);color:var(--ink);padding:10px 0}
.search kbd{font:600 11px var(--f-ui);padding:2px 6px;border-radius:3px;box-shadow:inset 0 0 0 1px var(--line);color:var(--ink-soft)}
.select{min-height:46px;border-radius:6px;border:0;box-shadow:inset 0 0 0 1.5px var(--line);background:#fff;padding:0 34px 0 12px;font:500 15px var(--f-body);color:var(--ink);appearance:none;
  background-image:linear-gradient(45deg,transparent 50%,var(--ink) 50%),linear-gradient(135deg,var(--ink) 50%,transparent 50%);background-position:calc(100% - 18px) 50%,calc(100% - 13px) 50%;background-size:5px 5px;background-repeat:no-repeat}
.filters{display:flex;gap:6px;flex-wrap:wrap}
.fchip{border:0;cursor:pointer;min-height:36px;padding:0 14px;border-radius:999px;background:var(--moss);font:600 14px var(--f-body);color:var(--ink);transition:background .2s,color .2s}
.fchip:hover{background:var(--moss-2)}
.fchip[aria-pressed="true"]{background:var(--pine);color:var(--paper)}
.fchip .n{font:500 12px var(--f-ui);opacity:.7;margin-left:4px}
.count{font:500 14px var(--f-body);color:var(--ink-soft)}
.count b{font-family:var(--f-ui);color:var(--pine)}
.view-toggle{display:inline-flex;gap:2px;margin-left:auto}
.view-toggle button{width:40px;height:40px;border:0;border-radius:6px;background:transparent;cursor:pointer;display:grid;place-items:center;color:var(--ink-soft)}
.view-toggle button[aria-pressed="true"]{background:var(--moss);color:var(--pine)}
.view-toggle svg{width:18px}
.empty{padding:56px 20px;text-align:center;display:grid;gap:10px;justify-items:center;color:var(--ink-soft)}
.empty h3{font:700 22px var(--f-display);color:var(--ink)}
@media (max-width:700px){.tools{position:static}}

/* News catalog cards (list view) */
.news-list{display:grid;gap:12px}
.news-item{display:grid;grid-template-columns:200px 1fr auto;gap:20px;align-items:center;padding:12px;background:#fff;border-radius:8px;box-shadow:0 0 0 1px var(--line);text-decoration:none;transition:box-shadow .25s,transform .3s var(--ease)}
.news-item:hover{box-shadow:0 0 0 1px var(--gold),0 18px 30px -24px rgba(32,61,49,.6);transform:translateX(4px)}
.news-item .art{aspect-ratio:16/10;border-radius:4px;overflow:hidden;background:var(--moss)}
.news-item .art img{width:100%;height:100%;object-fit:cover}
.news-item .meta{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:6px}
.news-item h3{font:700 clamp(17px,2vw,20px)/1.45 var(--f-display)}
.news-item time{font:500 13px var(--f-ui);color:var(--ink-soft)}
.news-item .go{font:600 20px var(--f-ui);color:var(--gold-deep);padding-right:10px}
.news-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:18px}
@media (max-width:640px){.news-item{grid-template-columns:110px 1fr;gap:14px}.news-item .go{display:none}}
mark.hl{background:rgba(196,170,105,.4);color:inherit;border-radius:2px;padding:0 1px}

/* ---------- Downloads ---------- */
.dl-switch{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:22px}
.dl-switch button{border:0;cursor:pointer;display:grid;gap:2px;text-align:left;padding:14px 22px;min-width:180px;background:#fff;box-shadow:inset 0 0 0 1.5px var(--line);color:var(--ink);
  clip-path:polygon(0 0,calc(100% - 14px) 0,100% 14px,100% 100%,0 100%);transition:background .25s,color .25s}
.dl-switch button b{font:700 28px/1 var(--f-ui)}
.dl-switch button span{font:600 14px var(--f-body)}
.dl-switch button[aria-pressed="true"]{background:var(--pine);color:var(--paper);box-shadow:none}
.detect{display:flex;align-items:center;gap:10px;margin-bottom:18px;color:var(--ink-soft);font-size:15px}
.detect::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--gold-deep);box-shadow:0 0 0 4px rgba(196,170,105,.3)}
.platforms{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.pcard{position:relative;display:flex;flex-direction:column;gap:14px;padding:28px 26px 26px;background:#fff;border-radius:12px;box-shadow:0 0 0 1px var(--line);overflow:hidden;isolation:isolate;transition:transform .35s var(--ease),box-shadow .35s}
.pcard:hover{transform:translateY(-4px);box-shadow:0 0 0 1px var(--gold),0 24px 40px -28px rgba(32,61,49,.6)}
.pcard.rec{box-shadow:0 0 0 2px var(--gold),0 24px 40px -28px rgba(32,61,49,.6)}
.pcard .rec-badge{position:absolute;right:16px;top:16px;font:600 12px var(--f-body);background:var(--gold);color:var(--night);padding:3px 10px;border-radius:999px}
.pcard .glyph{width:56px;height:56px;display:grid;place-items:center;background:var(--moss);border-radius:12px;color:var(--pine)}
.pcard .glyph svg,.pcard .glyph img{width:28px;height:28px}
.pcard .kind{font:500 13px var(--f-body);color:var(--ink-soft)}
.pcard h3{font:700 34px/1 var(--f-ui);letter-spacing:.01em;color:var(--ink)}
.pcard .vers{font:600 14px var(--f-body);color:var(--gold-deep)}
.facts{display:grid;grid-template-columns:auto 1fr;gap:4px 14px;margin:0;font-size:13px;color:var(--ink-soft);padding:12px 0;border-block:1px dashed var(--line)}
.facts dt{font-weight:600;color:var(--ink)}
.facts dd{margin:0;font-family:var(--f-ui);font-variant-numeric:tabular-nums;word-break:break-all}
.pcard .btn{width:100%;justify-content:center;min-height:54px;font-size:16px}
.pcard .warn{font-size:13px;color:var(--berry);display:flex;gap:6px;align-items:flex-start}
.pcard .note{font-size:13px;color:var(--ink-soft)}
.pcard .note a{color:var(--pine);font-weight:600}
.pcard::before{content:"";position:absolute;right:-40px;bottom:-40px;width:160px;height:160px;border-radius:50%;background:radial-gradient(circle,rgba(196,170,105,.18),transparent 70%);z-index:-1}
@media (max-width:900px){.platforms{grid-template-columns:1fr}}
.matrix-wrap{overflow-x:auto;border-radius:10px;box-shadow:0 0 0 1px var(--line);background:#fff}
.matrix{width:100%;border-collapse:collapse;min-width:640px;font-size:14px}
.matrix th,.matrix td{padding:14px 16px;text-align:left;border-bottom:1px solid var(--line);vertical-align:middle}
.matrix thead th{background:var(--moss);font:600 13px var(--f-body);color:var(--ink-soft)}
.matrix tbody th{font:700 16px var(--f-ui)}
.matrix td a{font-weight:600;color:var(--pine)}
.matrix .na{color:var(--berry)}
.steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;counter-reset:s;list-style:none;padding:0;margin:0}
.steps li{padding:22px;border-radius:10px;background:var(--night-2);color:var(--paper);box-shadow:0 0 0 1px var(--night-line);display:grid;gap:8px}
.steps b{font:700 13px var(--f-ui);letter-spacing:.14em;color:var(--gold)}
.steps h3{font:700 20px var(--f-display);color:var(--gold-hi)}
.steps p{color:#c9d6cc;font-size:15px}
@media (max-width:800px){.steps{grid-template-columns:1fr}}

/* ---------- Detail reading ---------- */
.progress{position:fixed;left:0;top:0;height:3px;width:100%;z-index:70;background:linear-gradient(90deg,var(--gold-deep),var(--gold-hi));transform-origin:0 50%;transform:scaleX(0)}
.reading{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:clamp(24px,4vw,48px);align-items:start;margin-top:-56px;position:relative;z-index:2}
.paper{background:#fff;border-radius:14px;box-shadow:0 0 0 1px var(--line),0 30px 60px -40px rgba(32,61,49,.45);padding:clamp(22px,5vw,56px);min-width:0}
.aside{position:sticky;top:calc(84px + env(safe-area-inset-top,0px));display:grid;gap:18px}
.aside .box{background:var(--paper);border-radius:10px;box-shadow:0 0 0 1px var(--line);padding:18px}
.aside h4{font:600 12px var(--f-ui);letter-spacing:.16em;color:var(--gold-deep);margin-bottom:10px}
.toc{display:grid;gap:2px;max-height:40vh;overflow:auto}
.toc a{display:block;padding:7px 10px;border-left:2px solid var(--line);text-decoration:none;font-size:14px;color:var(--ink-soft);line-height:1.5}
.toc a.active,.toc a:hover{border-color:var(--gold-deep);color:var(--pine);background:var(--moss)}
.orig{display:flex;align-items:center;gap:8px;font:600 14px var(--f-body);color:var(--pine);text-decoration:none;word-break:break-all}
.orig small{display:block;font:500 12px var(--f-ui);color:var(--ink-soft)}
.related a{display:grid;grid-template-columns:64px 1fr;gap:10px;align-items:center;padding:8px 0;text-decoration:none;border-bottom:1px solid var(--line)}
.related a:last-child{border:0}
.related img{width:64px;height:44px;object-fit:cover;border-radius:4px}
.related span{font-size:14px;line-height:1.45}
.related time{display:block;font:500 11px var(--f-ui);color:var(--ink-soft)}
.pager{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:28px}
.pager a{display:grid;gap:4px;padding:16px 18px;border-radius:10px;box-shadow:0 0 0 1px var(--line);text-decoration:none;background:#fff;transition:box-shadow .2s}
.pager a:hover{box-shadow:0 0 0 1.5px var(--gold)}
.pager small{font:600 12px var(--f-ui);letter-spacing:.12em;color:var(--gold-deep)}
.pager .next{text-align:right}
@media (max-width:1000px){.reading{grid-template-columns:1fr}.aside{position:static}}
/* Article prose — normalises the original inline-styled HTML into one reading voice */
.prose{font-size:16.5px;line-height:1.9;color:#2a4436;max-width:76ch;margin-inline:auto;overflow-wrap:anywhere}
.prose > * + *{margin-top:1em}
.prose p{margin:0 0 .8em}
.prose h2{font:800 clamp(21px,2.4vw,26px)/1.4 var(--f-display);color:var(--pine);margin:1.8em 0 .7em;padding:.1em 0 .1em .7em;border-left:4px solid var(--gold-deep);scroll-margin-top:100px}
.prose h3{font:700 19px/1.45 var(--f-display);color:var(--pine);margin:1.4em 0 .5em;scroll-margin-top:100px}
.prose h4{font:700 17px var(--f-body);margin:1.2em 0 .4em}
.prose strong,.prose b{color:var(--ink)}
.prose a{color:var(--sky);text-underline-offset:3px}
.prose a:hover{color:var(--gold-deep)}
.prose ul,.prose ol{padding-left:1.4em;margin:.4em 0 1em}
.prose li{margin:.25em 0}
.prose hr{border:0;height:1px;background:var(--line);margin:2em 0}
.prose img{border-radius:8px;height:auto;margin-inline:auto}
.prose .note{background:var(--moss);border-left:3px solid var(--gold-deep);padding:14px 18px;border-radius:0 8px 8px 0;margin:1em 0}
.prose .note > :last-child{margin-bottom:0}
.prose .table-scroll{overflow-x:auto;margin:1.2em 0;border-radius:8px;box-shadow:0 0 0 1px var(--line)}
.prose table{border-collapse:collapse;width:100%;font-size:14.5px;line-height:1.6}
.prose th{background:var(--moss);color:var(--pine);font-weight:700;white-space:nowrap}
.prose th,.prose td{min-width:4.5em;padding:10px 12px;border:1px solid var(--line);text-align:left;vertical-align:top}
.prose tbody tr:nth-child(even){background:#f7f9f3}
.prose .img-missing{display:inline-block;font-size:12px;padding:2px 8px;border-radius:4px;background:var(--moss);color:var(--ink-soft);border:1px dashed var(--line)}
.prose > div:first-child > div:first-child{margin-top:0}
.detail-art{display:block;width:100%;max-width:420px;border-radius:12px;box-shadow:0 20px 40px -20px rgba(0,0,0,.6);border:3px solid rgba(250,251,246,.9);transform:rotate(1.5deg)}
.banner .detail-grid{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:32px;align-items:end}
.meta-line{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
@media (max-width:860px){.detail-art{display:none}.banner .detail-grid{grid-template-columns:1fr}}

/* ---------- Footer ---------- */
.footer{margin:clamp(48px,7vw,96px) clamp(10px,2vw,28px) 16px;background:var(--pine);color:var(--paper);border-radius:var(--r);overflow:hidden;position:relative}
.footer::before{content:"";position:absolute;inset:0;background:radial-gradient(60% 80% at 0 0,rgba(196,170,105,.16),transparent 70%);pointer-events:none}
.footer .top{display:grid;grid-template-columns:1.2fr 1fr 1fr;gap:32px;padding:clamp(28px,5vw,56px)}
.footer .logo{width:220px}
.footer p{color:#c9d6cc;font-size:14px;margin-top:12px}
.footer h4{font:600 12px var(--f-ui);letter-spacing:.16em;color:var(--gold);margin-bottom:12px}
.footer nav{display:grid;gap:8px}
.footer nav a{text-decoration:none;color:var(--paper);font-size:15px}
.footer nav a:hover{color:var(--gold-hi)}
.footer .bottom{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;padding:18px clamp(28px,5vw,56px);border-top:1px solid rgba(250,251,246,.14);font:500 13px var(--f-ui);color:#b9c9bc}
.footer .word{font:700 clamp(40px,9vw,120px)/.9 var(--f-ui);letter-spacing:-.02em;color:rgba(250,251,246,.08);padding:0 clamp(20px,4vw,48px) 10px;white-space:nowrap;overflow:hidden}
@media (max-width:800px){.footer .top{grid-template-columns:1fr 1fr}.footer .top > :first-child{grid-column:1/-1}}

/* reveal (content is visible at rest; only a gentle lift is animated) */
.reveal{transition:transform .9s var(--ease)}
.reveal.pre{transform:translateY(28px)}
.tilt{will-change:transform}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  .reveal.pre{transform:none}
  #motes,.rays{display:none}
}

/* =====================================================================
   v2 · 首頁深度優化
   首屏回到原站構圖（缺口外框、框內導覽、無額外光效），其餘區塊精簡文案、
   改為「收藏感」的卡片與深淺交錯的節奏。
   ===================================================================== */

/* ---------- Hero：與 cgwoods.com 首屏同構 ---------- */
.hero{padding:0;margin:24px 24px 0}
.hero-stage{position:relative;max-width:none;aspect-ratio:auto;max-height:none;width:auto;height:min(810px,calc(100svh - 44px));min-height:620px;
  border-radius:0;overflow:visible;box-shadow:none;background:transparent;isolation:isolate}
.scene-window{position:absolute;inset:0;overflow:hidden;border-radius:10px;background:#7aa36a;z-index:-1;
  clip-path:polygon(0 0,43.7% 0,45.4% 4.8%,54.6% 4.8%,56.3% 0,100% 0,100% 95%,93% 95%,90.8% 100%,9.2% 100%,7% 95%,0 95%)}
.hero-bg{position:absolute;inset:0;z-index:0;transition:none}
.hero-bg picture,.hero-bg img{display:block;width:100%;height:100%;object-fit:cover;object-position:center 55%}
.hero-shade{position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(15,34,25,.18),transparent 22%,transparent 55%,rgba(15,34,25,.58))}
.notch-brand{position:absolute;top:-9px;left:50%;transform:translateX(-50%);width:94px;height:46px;display:grid;place-items:center;z-index:3}
.notch-brand>img{width:50px;height:42px;object-fit:contain;filter:drop-shadow(0 2px 4px rgba(32,61,49,.3));animation:bob 5s ease-in-out infinite}
.hero-nav{position:absolute;inset:22px 26px auto;display:flex;justify-content:space-between;align-items:center;z-index:4}
.nav-links{display:flex;align-items:center;gap:10px}
.icon-button{width:47px;height:47px;background:#fff;display:grid;place-items:center;border:0;color:#244b39;cursor:pointer;border-radius:3px;
  clip-path:polygon(0 0,76% 0,100% 24%,100% 100%,24% 100%,0 76%);transition:background .2s}
.icon-button svg{width:21px;height:21px}
.icon-button:hover,.wbtn:hover{background:var(--moss)}
.wbtn{display:inline-flex;align-items:center;height:43px;padding:0 20px;background:#fff;color:#244b39;font:600 13px/1 var(--f-ui);letter-spacing:.04em;border-radius:3px;
  clip-path:polygon(0 0,calc(100% - 9px) 0,100% 9px,100% 100%,0 100%);transition:background .2s}
.dark-button{display:inline-flex;align-items:center;justify-content:center;gap:10px;height:43px;padding:0 22px;background:#214d39;color:#fff;border-radius:3px;font:600 13px/1 var(--f-ui);letter-spacing:.04em;
  clip-path:polygon(0 0,calc(100% - 10px) 0,100% 10px,100% 100%,0 100%);transition:background .2s}
.dark-button:hover{background:#356344}
.dark-button svg{width:15px;height:15px}
.hero-center{top:12%;width:min(440px,34vw);min-width:260px;gap:8px;z-index:2}
.hero-logo{filter:drop-shadow(0 3px 8px rgba(18,51,36,.45))}
.hero-domain{font:600 12px/1 var(--f-ui);letter-spacing:.12em;padding:5px 11px;background:rgba(21,61,45,.74);color:#fffdf0;border-radius:3px;box-shadow:none;margin-top:-2px}
.hero-dl{bottom:150px;gap:14px;z-index:4}
.dl-toggle{min-width:196px;min-height:46px;font-size:13px;background:rgba(21,61,45,.82);backdrop-filter:blur(6px);box-shadow:inset 0 0 0 1px rgba(255,255,255,.16),0 10px 26px -12px rgba(8,24,16,.7)}
.dl-toggle:hover{background:rgba(33,77,57,.96)}
.hero-bar{left:26px;right:26px;bottom:76px;padding:14px 0 0;border-top:1px solid rgba(248,255,222,.32);font-size:12px;text-shadow:0 1px 5px #173b26;z-index:3}
.ticker b{font:600 11px var(--f-ui);color:#e2e8c4}
.ticker span{font-weight:500}
.scroll-cue{bottom:24px;font-size:11px;text-shadow:0 1px 4px #20302b;z-index:3}
/* 外层保持静止，避免与背景图叠加缩放、滤镜和画布重绘。 */
.hero-stage.intro .scene-window{animation:none}
.hero-stage.intro .hero-logo{animation:logoIn 1.2s .3s var(--ease) both}

/* 首頁的固定導覽：離開首屏後才滑出 */
body.home .site-header{position:fixed;left:0;right:0;top:0;transform:translateY(-140%);transition:transform .5s var(--ease)}
body.home .site-header.scrolled{transform:none}
body.home .site-header:not(.scrolled) .brand-mark{opacity:1}

@media (max-width:900px){
  .hero{margin:12px 12px 0}
  .hero-stage{aspect-ratio:auto;height:calc(100svh - 24px);min-height:560px;max-height:760px}
  .hero-nav{inset:16px 14px auto}
  .hero-center{top:13%;width:min(78%,360px)}
  .hero-dl{bottom:56px;flex-direction:column;width:min(84%,320px);gap:10px}
  .dl-toggle{width:100%;min-width:0}
  .scroll-cue{display:none}
}

/* ---------- 共用：滑鼠光澤 ---------- */
.glare{position:absolute;inset:0;z-index:2;pointer-events:none;opacity:0;transition:opacity .35s;mix-blend-mode:soft-light;
  background:radial-gradient(420px circle at var(--mx,50%) var(--my,50%),rgba(255,244,200,.85),transparent 62%)}
.tilt:hover .glare{opacity:1}
.tilt{transition:transform .25s var(--ease),box-shadow .35s}

/* ---------- 章節標題 ---------- */
.sec-head h2{font-size:clamp(32px,4.6vw,56px);letter-spacing:.01em}
.eyebrow::before{width:30px;height:2px;background:var(--gold)}

/* ---------- 森境來信：主推 + 時間軸 ---------- */
.news-board{display:grid;grid-template-columns:1.08fr 1fr;gap:clamp(20px,3vw,44px);align-items:stretch}
.lead{position:relative;display:flex;align-items:flex-end;min-height:460px;border-radius:22px;overflow:hidden;isolation:isolate;color:#fff;text-decoration:none;
  box-shadow:0 30px 50px -34px rgba(15,34,25,.8)}
.lead>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;transition:transform 1.1s var(--ease)}
.lead:hover>img{transform:scale(1.06)}
.lead::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(10,26,18,.05) 30%,rgba(10,26,18,.9))}
.lead .chips{position:absolute;left:20px;top:20px;display:flex;gap:6px;z-index:3}
.lead .cap{position:relative;z-index:3;padding:clamp(22px,3vw,36px);display:grid;gap:10px}
.lead time{font:600 13px var(--f-ui);letter-spacing:.14em;color:var(--gold-hi)}
.lead h3{font:900 clamp(26px,3vw,40px)/1.25 var(--f-display)}
.lead .go{display:inline-flex;align-items:center;gap:8px;font:600 14px var(--f-ui);color:var(--gold-hi);transition:gap .25s}
.lead:hover .go{gap:14px}
.quest-log{margin:0;display:grid;grid-template-columns:1fr;align-content:space-between}
.log-row{grid-template-columns:84px 1fr auto 22px;gap:18px;padding:18px 10px;border-bottom:1px solid var(--line);border-radius:0;position:relative}
.log-row:first-child{border-top:2px solid var(--ink)}
.log-row h3{font:700 17px/1.5 var(--f-display)}
.log-row .date{display:grid;gap:5px;line-height:1;font:500 11px var(--f-ui);letter-spacing:.08em;color:var(--ink-soft)}
.log-row .date b{font:700 36px/1 var(--f-ui);letter-spacing:-.02em;color:var(--pine);transition:color .25s}
.log-row:hover{background:linear-gradient(90deg,var(--moss),transparent);padding-inline:18px}
.log-row:hover .date b{color:var(--gold-deep)}

/* ---------- 冒險手帳（深色收藏區）与卡片 ---------- */
.vault{border-radius:0;position:relative;isolation:isolate;margin:clamp(40px,6vw,90px) 24px 0;padding-block:clamp(72px,9vw,120px);color:var(--paper);background:var(--night);border-radius:10px;
  clip-path:polygon(0 0,16% 0,19% 26px,82% 26px,85% 0,100% 0,100% calc(100% - 25px),84% calc(100% - 25px),81% 100%,20% 100%,17% calc(100% - 25px),0 calc(100% - 25px))}
.vault::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:radial-gradient(50% 60% at 12% 0%,rgba(196,170,105,.2),transparent 70%),radial-gradient(40% 50% at 100% 100%,rgba(55,103,153,.2),transparent 70%)}
.vault .sec-head h2{color:var(--paper)}
.vault .eyebrow{color:var(--gold)}
.vault .more{color:var(--gold-hi)}
.guide-grid{grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:24px}
.note-card{background:linear-gradient(180deg,#183b2b,#10271c);color:var(--paper);border-radius:18px;
  box-shadow:0 0 0 1px rgba(196,170,105,.24),0 26px 40px -30px #000}
.note-card:hover{box-shadow:0 0 0 1px var(--gold),0 0 44px -10px rgba(196,170,105,.5),0 34px 50px -28px #000}
.note-card .stretch{position:absolute;inset:0;z-index:3;border-radius:18px}
.note-card .art{aspect-ratio:4/3;background:var(--night-2);clip-path:polygon(0 0,100% 0,100% 90%,86% 90%,79% 100%,0 100%)}
.note-card .art::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(10,26,18,.55));pointer-events:none}
.note-card .chips{z-index:2}
.note-card .no{position:absolute;left:14px;bottom:20px;z-index:2;font:600 11px var(--f-ui);letter-spacing:.22em;color:rgba(250,251,246,.9)}
.note-card .body{padding:14px 20px 20px}
.note-card .cat{color:var(--gold)}
.note-card h3{color:var(--paper);transition:color .25s}
.note-card:hover h3{color:var(--gold-hi)}
.note-card p{color:#b9c9bc}
.note-card .foot{color:#9db39a;border-top:1px dashed rgba(196,170,105,.25);margin-top:6px;padding-top:12px}
.note-card .read{color:var(--gold-hi)}
.fav{position:absolute;top:0;right:14px;z-index:4;width:36px;height:50px;padding-top:10px;display:grid;place-items:start center;border:0;cursor:pointer;color:#fff;
  background:rgba(10,26,18,.68);backdrop-filter:blur(6px);clip-path:polygon(0 0,100% 0,100% 100%,50% 80%,0 100%);transition:height .25s var(--ease),background .25s}
.fav svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:2;stroke-linejoin:round}
.fav:hover{height:58px;background:var(--night)}
.fav.on{height:58px;background:linear-gradient(180deg,var(--gold-hi),var(--gold));color:var(--night)}
.fav.on svg{fill:currentColor;animation:beat .5s var(--ease)}
@keyframes beat{40%{transform:scale(1.5) rotate(-12deg)}}
.toast{position:fixed;left:50%;bottom:28px;z-index:90;transform:translate(-50%,140px);padding:12px 22px;border-radius:999px;background:var(--night);color:var(--gold-hi);
  font:600 14px var(--f-body);box-shadow:0 0 0 1px var(--night-line),0 18px 36px -10px #0008;transition:transform .45s cubic-bezier(.2,.9,.3,1.25)}
.toast.show{transform:translate(-50%,0)}

/* ---------- 版本 / 職業 / CTA 精簡 ---------- */
.edition{min-height:480px}
.edition .content{gap:18px}
.prof{text-decoration:none;border-radius:18px}
.prof:hover{transform:translateY(-8px);box-shadow:0 0 0 1px var(--gold),0 0 44px -12px rgba(196,170,105,.5)}
.prof .art{aspect-ratio:5/4}
.prof .txt{padding:4px 26px 26px;gap:8px}
.prof h3{font-size:36px}
.prof .go{margin-top:auto;display:inline-flex;gap:6px;padding-top:6px;color:var(--paper);font:600 14px var(--f-ui);letter-spacing:.06em;transition:gap .25s,color .25s}
.prof:hover .go{gap:12px;color:var(--gold-hi)}
.cta h2{font-size:clamp(32px,4.4vw,56px)}

@media (max-width:1000px){.news-board{grid-template-columns:1fr}.lead{min-height:360px}}
@media (max-width:640px){
  .vault{margin-inline:12px}
  .log-row{grid-template-columns:64px 1fr 22px}.log-row .chip{display:none}
  .log-row .date b{font-size:28px}
}
.wbtn,.dark-button,.lead,.prof{text-decoration:none}

/* ---------- Footer（對齊原站：品牌 / 導覽 / 邀請卡） ---------- */
.footer{margin:clamp(56px,7vw,96px) 24px 0;padding:62px clamp(24px,4vw,48px) 24px;border-radius:14px;background:#173d2e;overflow:visible}
.footer::before{display:none}
.f-main{display:grid;grid-template-columns:1.1fr 1.25fr 1fr;gap:clamp(32px,4vw,72px);align-items:start;max-width:1450px;margin:0 auto}
.f-brand .logo{width:250px;margin:-14px 0 0 -10px}
.f-brand p{font-size:13px;line-height:1.9;color:#c3d2b8;margin:10px 0 18px}
.f-top{font:600 12px var(--f-ui);color:#e0e5c9;text-decoration:none}
.f-top:hover,.f-nav a:hover{color:#fff;text-decoration:underline;text-underline-offset:5px}
.f-nav{display:grid;grid-template-columns:1fr 1fr;gap:30px;padding-top:8px}
.f-nav nav{display:flex;flex-direction:column;align-items:flex-start;gap:14px}
.f-nav h4{font:600 13px var(--f-ui);color:#d4dda7;margin:0 0 4px;letter-spacing:.1em}
.f-nav a{font-size:13px;color:#e3ebdc;text-decoration:none}
.f-invite{border-radius:10px;overflow:hidden;background:#284e39}
.f-invite img{width:100%;height:150px;object-fit:cover;object-position:center 47%}
.f-invite>div{padding:16px 18px;display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap}
.f-invite p{font-size:13px;color:#e3ebd7;margin:0}
.f-invite .btn{min-height:40px;font-size:13px;padding:.5em 1em}
.f-bottom{max-width:1450px;margin:36px auto 0;padding-top:20px;border-top:1px solid rgba(174,191,140,.25);display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
.f-bottom b{font:700 26px/1 var(--f-ui);letter-spacing:.02em;color:#8fa57f}
.f-bottom span{font:500 12px var(--f-ui);color:#b6c7a9}
@media (max-width:900px){.f-main{grid-template-columns:1fr 1fr}.f-brand{grid-column:1/-1}.f-invite{grid-column:1/-1}}
@media (max-width:560px){.footer{margin-inline:12px}.f-main{grid-template-columns:1fr}.f-nav{padding-top:0}}
.f-nav a{white-space:nowrap}.f-invite{min-height:230px}
.footer{margin-bottom:24px}
@media (max-width:560px){.footer{margin-bottom:12px}}

/* ---------- 配色節奏：紙白 → 森綠 → 苔綠 → 羊皮紙 → 森綠(頁尾) ---------- */
:root{--forest:#173d2e;--forest-2:#21503c;--parch:#f4efdc}
.vault,.footer{background:var(--forest)}
.vault::before{background:radial-gradient(50% 60% at 12% 0%,rgba(196,170,105,.22),transparent 70%),radial-gradient(40% 50% at 100% 100%,rgba(120,170,130,.2),transparent 70%)}
.note-card{background:linear-gradient(180deg,var(--forest-2),#1a4332)}
.zz-unused .prof{background:#fff;color:var(--ink);box-shadow:0 0 0 1px rgba(148,103,25,.18),0 24px 40px -30px rgba(80,60,20,.45)}
.zz-unused .prof:hover{box-shadow:0 0 0 1px var(--gold),0 0 40px -12px rgba(196,170,105,.6),0 30px 44px -28px rgba(80,60,20,.5)}
.zz-unused .prof .art::after{background:linear-gradient(180deg,transparent 60%,#fff)}
.zz-unused .prof .idx{color:var(--gold-deep)}
.zz-unused .prof h3{color:var(--pine)}
.zz-unused .prof .go{color:var(--pine)}
.zz-unused .prof:hover .go{color:var(--gold-deep)}
@media (max-width:900px){.zz-unused .prof .art::after{background:linear-gradient(90deg,transparent 60%,#fff)}}
@media (max-width:560px){.zz-unused .prof .art::after{background:linear-gradient(180deg,transparent 60%,#fff)}}

/* =====================================================================
   版本 / 職業 v4：對齊原站——苔綠大底板 + 斜角卡片 + 髮絲外框
   ===================================================================== */
:root{--hair:rgba(23,61,46,.3)}
.versions{margin:clamp(40px,6vw,90px) 24px 0;padding-block:clamp(52px,6vw,88px);background:#e4ecd8;border-radius:14px}
.ed-slot,.role{filter:drop-shadow(1px 0 0 var(--hair)) drop-shadow(-1px 0 0 var(--hair)) drop-shadow(0 1px 0 var(--hair)) drop-shadow(0 -1px 0 var(--hair))}
.ed-slot{margin-top:22px}
.edition{display:grid;align-items:center;min-height:420px;margin:0;padding:0;border-radius:0;overflow:hidden;background:#f2f6ec;isolation:isolate;box-shadow:none}
.edition .bg{position:absolute;inset:0;z-index:-2}
.edition .bg img{width:100%;height:100%;object-fit:cover;object-position:80% 40%}
.edition.v37 .bg img{object-position:22% 40%}
.edition .shade{display:block;position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#f2f6ec 0,rgba(242,246,236,.94) 34%,rgba(242,246,236,0) 68%)}
.edition.v37 .shade{background:linear-gradient(270deg,#f2f6ec 0,rgba(242,246,236,.94) 34%,rgba(242,246,236,0) 68%)}
.edition .content{max-width:580px;padding:clamp(30px,4vw,56px) clamp(30px,5vw,76px);gap:16px;background:none}
.edition.v37 .content{margin-left:auto}
.edition .label span{font-size:clamp(58px,6.5vw,84px)}
.edition .stats{gap:6px 18px}
.edition .stats li{padding:4px 0;background:none;border:0;border-bottom:1px solid rgba(23,61,46,.28);border-radius:0;clip-path:none;font-size:13px}

.roles{padding-top:clamp(56px,7vw,100px)}
.role-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:26px}
.role{display:block;color:var(--ink);text-decoration:none;transition:transform .35s var(--ease)}
.role:hover{transform:translateY(-8px)}
.role .rin{display:flex;flex-direction:column;height:100%;background:#f7f2e5;overflow:hidden}
.role:nth-child(2) .rin{background:#eef1ee}
.role .art{aspect-ratio:16/10;overflow:hidden}
.role .art img{width:100%;height:100%;object-fit:cover;transition:transform .9s var(--ease)}
.role:hover .art img{transform:scale(1.06)}
.role .txt{display:grid;gap:8px;padding:22px 26px 24px;flex:1;align-content:start}
.role .idx{font:600 12px var(--f-ui);letter-spacing:.16em;color:var(--ink-soft)}
.role h3{font:900 32px/1.2 var(--f-display);color:var(--pine)}
.role p{font-size:14px;color:var(--ink-soft)}
.role .go{margin-top:8px;padding-top:14px;border-top:1px solid rgba(23,61,46,.16);display:flex;align-items:center;gap:6px;font:600 13px var(--f-ui);letter-spacing:.04em;transition:color .25s,gap .25s}
.role:hover .go{color:var(--gold-deep);gap:12px}

@media (max-width:900px){.role-grid{grid-template-columns:1fr 1fr}}
@media (max-width:760px){
  .versions{margin-inline:12px}
  .edition{min-height:0;display:flex;flex-direction:column;align-items:stretch}
  .edition .bg{position:relative;inset:auto;aspect-ratio:16/10;z-index:0}
  .edition .shade{display:none}
  .edition .content,.edition.v37 .content{max-width:none;margin:0;padding:26px 24px 30px;background:#f2f6ec}
  .role-grid{grid-template-columns:1fr}
}

/* =====================================================================
   v5 · 公告 / 攻略頁
   ===================================================================== */
/* 頂部橫幅：缺口外框，與首屏呼應 */
.banner{margin-top:6px;min-height:320px;border-radius:0;overflow:hidden;background:var(--moss)}
.banner h1{font-size:clamp(34px,5vw,60px);max-width:none}
.banner .sub{font:500 14px var(--f-ui);letter-spacing:.08em;color:var(--ink-soft)}
.banner.dark .sub{color:#c9d6cc}
.banner .sub b{color:var(--gold-deep)}
.banner.dark .sub b{color:var(--gold-hi)}

/* 工具列 */
.tools{border-radius:14px;box-shadow:0 0 0 1px var(--hair),0 16px 30px -24px rgba(23,61,46,.5);top:calc(76px + env(safe-area-inset-top,0px))}
.seg{display:inline-flex;gap:2px;padding:3px;border-radius:10px;background:var(--moss)}
.seg button{border:0;cursor:pointer;padding:0 14px;min-height:40px;border-radius:8px;background:none;font:600 13px var(--f-ui);letter-spacing:.04em;color:var(--ink-soft);transition:background .2s,color .2s}
.seg button:hover{color:var(--ink)}
.seg button[aria-pressed="true"]{background:var(--pine);color:#fff}
.tools-row .view-toggle{margin-left:auto}

/* 公告：置頂雙卡 + 月份時間軸 */
.pin-strip{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-bottom:8px}
.pin-card,.news-grid .dispatch{filter:drop-shadow(1px 0 0 var(--hair)) drop-shadow(-1px 0 0 var(--hair)) drop-shadow(0 1px 0 var(--hair)) drop-shadow(0 -1px 0 var(--hair))}
.pin-card{display:block;color:var(--ink);text-decoration:none;transition:transform .35s var(--ease)}
.pin-card:hover{transform:translateY(-6px)}
.pin-in{display:grid;grid-template-columns:44% 1fr;min-height:180px;background:#f7f2e5;overflow:hidden}
.pin-in img{width:100%;height:100%;object-fit:cover}
.pin-in .t{display:grid;align-content:center;gap:10px;padding:22px 26px}
.pin-in .meta{display:flex;gap:6px}
.pin-in h3{font:900 22px/1.4 var(--f-display);color:var(--pine)}
.pin-in time{font:500 13px var(--f-ui);color:var(--ink-soft)}
.month{display:grid;grid-template-columns:150px 1fr;gap:clamp(18px,3vw,40px);margin-top:44px}
.mh{position:sticky;top:170px;align-self:start;line-height:1}
.mh b{display:block;font:700 76px/1 var(--f-ui);letter-spacing:-.04em;color:transparent;-webkit-text-stroke:1.5px var(--pine)}
.mh span{display:block;margin-top:8px;font:600 13px var(--f-ui);letter-spacing:.22em;color:var(--gold-deep)}
.mitems{border-top:2px solid var(--ink)}
.news-item{grid-template-columns:132px 1fr auto;gap:22px;padding:16px 10px;background:none;border-radius:0;box-shadow:none;border-bottom:1px solid var(--line);position:relative;transition:padding .3s var(--ease),background .25s}
.news-item:hover{box-shadow:none;transform:none;padding-left:20px;background:linear-gradient(90deg,var(--moss),transparent)}
.news-item .art{aspect-ratio:16/10;border-radius:8px}
.news-item .art img{transition:transform .6s var(--ease)}
.news-item:hover .art img{transform:scale(1.08)}
.news-item h3{font:700 clamp(17px,1.7vw,20px)/1.5 var(--f-display);color:var(--ink)}
.news-item .go{transition:transform .25s}
.news-item:hover .go{transform:translate(4px,-4px)}
.news-grid{gap:24px}
.news-grid .dispatch{border-radius:0;box-shadow:none;clip-path:polygon(22px 0,100% 0,100% calc(100% - 22px),calc(100% - 22px) 100%,0 100%,0 22px)}
.news-grid .dispatch:hover{box-shadow:none}

/* 攻略：森綠收藏盒 */
.vault-panel{position:relative;isolation:isolate;background:var(--forest);color:var(--paper);border-radius:10px;padding:clamp(48px,5vw,68px) clamp(16px,3vw,40px) clamp(52px,6vw,80px)}
.vault-panel::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(50% 40% at 10% 0%,rgba(196,170,105,.2),transparent 70%),radial-gradient(40% 40% at 100% 100%,rgba(120,170,130,.18),transparent 70%)}
.vault-panel .tools{background:rgba(15,34,25,.82);backdrop-filter:blur(12px);box-shadow:0 0 0 1px rgba(196,170,105,.28),0 20px 40px -24px #000}
.vault-panel .search{background:rgba(255,255,255,.08);box-shadow:inset 0 0 0 1px rgba(255,255,255,.14)}
.vault-panel .search:focus-within{box-shadow:inset 0 0 0 2px var(--gold)}
.vault-panel .search svg{color:#9db39a}
.vault-panel .search input{color:#fff}
.vault-panel .search input::placeholder{color:#8fa68e}
.vault-panel .search kbd{color:#9db39a;box-shadow:inset 0 0 0 1px rgba(255,255,255,.2)}
.vault-panel .seg{background:rgba(255,255,255,.08)}
.vault-panel .seg button{color:#c3d2b8}
.vault-panel .seg button:hover{color:#fff}
.vault-panel .seg button[aria-pressed="true"]{background:var(--gold-hi);color:var(--night)}
.vault-panel .select{background-color:rgba(255,255,255,.08);color:#fff;box-shadow:inset 0 0 0 1px rgba(255,255,255,.14);background-image:linear-gradient(45deg,transparent 50%,#fff 50%),linear-gradient(135deg,#fff 50%,transparent 50%)}
.vault-panel .select option{color:#163a2b}
.vault-panel .fchip{background:rgba(255,255,255,.08);color:#dfe8d6}
.vault-panel .fchip:hover{background:rgba(255,255,255,.16)}
.vault-panel .fchip[aria-pressed="true"]{background:var(--gold-hi);color:var(--night)}
.vault-panel .count{color:#9db39a}
.vault-panel .count b{color:var(--gold-hi)}
.mine{display:inline-flex;align-items:center;gap:8px;min-height:46px;padding:0 16px;border:0;border-radius:8px;cursor:pointer;font:600 14px var(--f-body);color:var(--gold-hi);background:transparent;box-shadow:inset 0 0 0 1.5px var(--gold);transition:background .2s,color .2s}
.mine svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2}
.mine b{min-width:22px;padding:0 6px;border-radius:99px;background:var(--gold);color:var(--night);font:700 12px var(--f-ui);text-align:center}
.mine:hover,.mine[aria-pressed="true"]{background:var(--gold);color:var(--night)}
.mine[aria-pressed="true"] b{background:var(--night);color:var(--gold-hi)}
.mine[aria-pressed="true"] svg{fill:currentColor}
.vault-panel .guide-grid{grid-template-columns:repeat(auto-fill,minmax(250px,1fr));grid-auto-flow:dense;margin-top:28px}
.note-card.feature{grid-column:span 2;grid-row:span 2}
.note-card.feature .art{aspect-ratio:auto;flex:1;min-height:300px}
.note-card.feature h3{font-size:26px}
.note-card.feature p{font-size:15px;-webkit-line-clamp:4}
.vault-panel .empty{color:#9db39a}
.vault-panel .empty h3{color:var(--paper)}
.vault-panel .empty .btn.ghost{--bg:transparent;--fg:var(--gold-hi);box-shadow:inset 0 0 0 1.5px var(--gold)}

/* 詳情頁：收藏按鈕 */
.fav-text{gap:8px}
.fav-text svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2}
.fav-text.on{--bg:linear-gradient(180deg,var(--gold-hi),var(--gold));--fg:var(--night)}
.fav-text.on svg{fill:currentColor}

@media (max-width:900px){.pin-strip{grid-template-columns:1fr}.note-card.feature{grid-column:span 1;grid-row:span 1}.note-card.feature .art{aspect-ratio:4/3;flex:none;min-height:0}}
@media (max-width:700px){
  .month{grid-template-columns:1fr;gap:6px;margin-top:32px}
  .mh{position:static;display:flex;align-items:baseline;gap:10px}.mh b{font-size:46px}.mh span{margin:0}
  .news-item{grid-template-columns:96px 1fr;gap:14px}.news-item .go{display:none}
  .pin-in{grid-template-columns:1fr}.pin-in img{aspect-ratio:16/9;height:auto}
  .vault-panel{padding-inline:12px}
}
.note-card.feature .body{flex:none}.note-card.feature .art{flex:1 1 auto}

/* =====================================================================
   v6 · 首頁細節統一（Opus 精修）
   - 字體：中文全站單一字族 Noto Sans TC；Chakra Petch 只負責數字與拉丁字
   - 間距：一組節奏 --sec-y（區塊之間）/ --pad（面板內）/ --gap（卡片之間）
   - 形狀：首屏與面板用「圓角缺口」，卡片統一「圓角斜切 + 髮絲外框」
   ===================================================================== */
:root{
  --f-display:"Noto Sans TC","PingFang TC","Microsoft JhengHei",system-ui,sans-serif;
  --f-body:"Noto Sans TC","PingFang TC","Microsoft JhengHei",system-ui,sans-serif;
  --f-ui:"Noto Sans TC","PingFang TC","Microsoft JhengHei",system-ui,sans-serif;
  --f-num:"Chakra Petch","Noto Sans TC",system-ui,sans-serif;
  --edge:24px; --sec-y:clamp(84px,9vw,132px); --pad:clamp(64px,7vw,104px); --gap:24px;
  --hair-g:rgba(196,170,105,.34);
}
body{font-family:var(--f-body);letter-spacing:.01em}
.sec-head h2,.lead h3,.edition h3,.role h3,.banner h1{font-feature-settings:"palt" 1}
.num,.latin,.chip.num,.hero-domain,.mine b,.f-bottom b,.edition .label span,.log-row .date,.mh b,.mh span,.note-card .no,.lead time,.dl-switch button b,.pcard h3,.matrix tbody th{font-family:var(--f-num)}

/* 標題層級：同一字族，以字重與字距區分 */
.sec-head{margin-bottom:clamp(30px,3.4vw,44px);align-items:flex-end}
.sec-head h2,.vault .sec-head h2{font:800 clamp(30px,3.5vw,46px)/1.2 var(--f-display);letter-spacing:-.005em;margin-top:14px}
.eyebrow{font:700 12px/1.4 var(--f-body);letter-spacing:.26em}
.eyebrow::before{width:28px;height:1.5px}
.more{font:600 14px var(--f-body);letter-spacing:.04em;padding:6px 0;border-bottom-width:1.5px}
.btn{font:600 14px/1.2 var(--f-body);letter-spacing:.06em}
.wbtn,.dark-button{font:600 13px/1 var(--f-body);letter-spacing:.06em}
.chip{font:600 11.5px/1.6 var(--f-body);letter-spacing:.08em}

/* 節奏：首屏 → 公告 → 手帳 → 版本 → 職業 → 頁尾 */
.section{padding-block:var(--sec-y)}
.vault{margin:0 var(--edge);padding-block:var(--pad)}
.versions{margin:var(--sec-y) var(--edge) 0;padding-block:var(--pad)}
.roles{padding-block:var(--sec-y)}
body.home .footer{margin-top:0}
.footer{margin-inline:var(--edge)}

/* 公告：主推卡改為斜切 + 外框 */
.news-board{grid-template-columns:1.1fr 1fr;gap:clamp(28px,3.4vw,48px)}
.lead-w{display:block;filter:drop-shadow(1px 0 0 var(--hair)) drop-shadow(-1px 0 0 var(--hair)) drop-shadow(0 1px 0 var(--hair)) drop-shadow(0 -1px 0 var(--hair)) drop-shadow(0 26px 26px rgba(23,61,46,.22))}
.lead{height:100%;min-height:440px;border-radius:0;box-shadow:none}
.lead h3{font:800 clamp(24px,2.6vw,34px)/1.3 var(--f-display)}
.lead time{font-size:12px;letter-spacing:.18em}
.log-row{padding:17px 8px}
.log-row h3{font:600 16px/1.5 var(--f-body)}
.log-row .date{font-size:11px;letter-spacing:.1em}
.log-row .date b{font:700 32px/1 var(--f-num)}

/* 冒險手帳卡：外層承載傾斜與外框，內層斜切 */
.nc{display:flex;filter:drop-shadow(1px 0 0 var(--hair-g)) drop-shadow(-1px 0 0 var(--hair-g)) drop-shadow(0 1px 0 var(--hair-g)) drop-shadow(0 -1px 0 var(--hair-g));transition:transform .25s var(--ease),filter .35s}
.nc:hover{--hair-g:rgba(236,217,161,.85)}
.nc>.note-card{flex:1;border-radius:0;box-shadow:none}
.nc>.note-card:hover{box-shadow:none}
.note-card .art{clip-path:none}
.note-card .stretch{border-radius:0}
.note-card .body{padding:16px 20px 20px;gap:6px}
.note-card h3{font:700 17px/1.45 var(--f-body)}
.note-card p{font-size:13.5px}
.note-card .cat{font:700 11.5px var(--f-body);letter-spacing:.18em}
.guide-grid{gap:var(--gap)}
.nc.feature{grid-column:span 2;grid-row:span 2}
.nc.feature .art{aspect-ratio:auto;flex:1 1 auto;min-height:300px}
.nc.feature .body{flex:none}
.nc.feature h3{font-size:24px}
.nc.feature p{font-size:15px;-webkit-line-clamp:4}

/* 版本 / 職業：字級與首頁其他卡片一致 */
.edition h3{font:800 clamp(24px,2.6vw,32px)/1.35 var(--f-display)}
.edition .label b{font:700 15px var(--f-body);letter-spacing:.1em}
.role h3{font:800 26px/1.25 var(--f-display)}
.role-grid,.prof-grid{gap:var(--gap)}
.ed-slot+.ed-slot{margin-top:var(--gap)}

/* 頁尾字體 */
.f-nav h4{font:700 12px var(--f-body);letter-spacing:.2em}
.f-top{font:600 12px var(--f-body)}

/* three.js 光點層 */
.fx-canvas{position:absolute;inset:0;width:100%!important;height:100%!important;pointer-events:none;opacity:0;transition:opacity 1.6s var(--ease)}
.fx-canvas.on{opacity:1}
.fx-petals{z-index:1}
.hero-shade{z-index:2}
.fx-fireflies{z-index:-1}

@media (max-width:900px){.nc.feature{grid-column:span 1;grid-row:span 1}.nc.feature .art{aspect-ratio:4/3;flex:none;min-height:0}}
@media (max-width:640px){:root{--edge:16px;--gap:18px}.lead{min-height:340px}}
/* 斜切角落避讓：標籤不壓到切角 */
.note-card .chips{left:28px;top:12px}
.lead .chips{left:44px;top:22px}
/* 響應式收尾（須在 v6 覆寫之後） */
@media (max-width:1000px){.news-board{grid-template-columns:minmax(0,1fr)}.lead{min-height:360px}}
.news-board>*,.quest-log,.log-row{min-width:0}
.hero{margin:var(--edge) var(--edge) 0}
@media (max-width:640px){.vault,.versions,.footer{margin-inline:var(--edge)}}
/* 首屏預設滿屏：視窗高度扣掉上下外距 */
.hero-stage{height:calc(100vh - var(--edge) * 2);height:calc(100svh - var(--edge) * 2);min-height:560px;max-height:none}
@media (max-width:900px){.hero-stage{height:calc(100svh - var(--edge) * 2);max-height:none}}

/* 外框改用 SVG 描邊：移除所有 drop-shadow 外框濾鏡 */
.ed-slot,.role,.nc,.lead-w,.pin-card,.news-grid .dispatch{filter:none}
.rin,.pin-in,.note-card,.lead,.edition{position:relative}
svg.ol{position:absolute;left:0;top:0;z-index:6;pointer-events:none;overflow:visible}
svg.ol path{fill:none;stroke:var(--ol,rgba(23,61,46,.32));stroke-width:2;transition:stroke .35s}
.note-card{--ol:rgba(196,170,105,.4)}
.nc:hover .note-card{--ol:rgba(236,217,161,.9)}
.role:hover .rin,.pin-card:hover .pin-in{--ol:rgba(148,103,25,.55)}
.lead-w .lead{--ol:rgba(255,255,255,.25)}

/* 冒險手帳 × 版本選擇 合為一組：苔綠底板向上延伸至手帳面板後方，
   從手帳底部缺口透出，兩塊面板接成一體，省去「留白 + 留白」 */
:root{--join:clamp(140px,14vw,220px)}
.vault{position:relative;z-index:1}
.versions{position:relative;z-index:0;margin-top:calc(var(--join) * -1);padding-top:calc(var(--pad) * .8 + var(--join));scroll-margin-top:calc(var(--join) * -1 + 64px)}

/* =====================================================================
   內文閱讀 v2：取消側欄，內文佔滿內容寬度；目錄改為吸頂標籤列；
   收藏 / 下載 / 繼續閱讀 移到文末
   ===================================================================== */
.banner .inner{padding-bottom:clamp(72px,8vw,104px)}
.reading.wide{display:block;max-width:none;margin-top:-56px}
.reading.wide .paper{padding:clamp(22px,4.4vw,64px) clamp(18px,5vw,80px) clamp(28px,4vw,56px);border-radius:16px}
.reading.wide .prose{max-width:960px;font-size:17px;line-height:1.95}
.reading.wide .prose .table-scroll{border-radius:10px}
.reading.wide .prose table{font-size:15px}
.reading.wide .prose th,.reading.wide .prose td{padding:12px 14px}
.reading.wide .prose img{max-width:100%;border-radius:10px}
.prose h2{scroll-margin-top:150px}

.toc-bar{position:sticky;top:calc(72px + env(safe-area-inset-top,0px));z-index:8;display:flex;align-items:center;gap:14px;
  max-width:960px;margin:0 auto 28px;padding:10px 12px;border-radius:12px;background:rgba(250,251,246,.9);backdrop-filter:blur(12px);
  box-shadow:0 0 0 1px var(--line),0 12px 24px -20px rgba(23,61,46,.5)}
.toc-bar[hidden]{display:none}
.toc-label{flex:none;font:700 12px var(--f-body);letter-spacing:.2em;color:var(--gold-deep);padding-left:4px}
.toc-bar .toc{display:flex;gap:6px;max-height:none;overflow-x:auto;scrollbar-width:none;flex:1;min-width:0}
.toc-bar .toc::-webkit-scrollbar{display:none}
.toc-bar .toc a{flex:none;white-space:nowrap;padding:6px 14px;border:0;border-radius:999px;font:500 13.5px var(--f-body);color:var(--ink-soft);background:transparent;transition:background .2s,color .2s}
.toc-bar .toc a:hover{background:var(--moss);color:var(--pine)}
.toc-bar .toc a.active{background:var(--pine);color:#fff}

.paper-acts{max-width:960px;margin:44px auto 0;padding-top:28px;border-top:1px dashed var(--line);display:flex;gap:12px;flex-wrap:wrap;justify-content:center}
.reading.wide .pager{max-width:960px;margin:24px auto 0}

.related-row{margin-top:clamp(48px,6vw,80px)}
.related-row .eyebrow{margin-bottom:20px}
.rel-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:var(--gap)}
.rel{display:grid;gap:8px;text-decoration:none;color:var(--ink)}
.rel .art{aspect-ratio:16/10;border-radius:12px;overflow:hidden;background:var(--moss)}
.rel .art img{width:100%;height:100%;object-fit:cover;transition:transform .7s var(--ease)}
.rel:hover .art img{transform:scale(1.06)}
.rel .t{font:700 15px/1.5 var(--f-body);transition:color .2s}
.rel:hover .t{color:var(--gold-deep)}
.rel time{font-size:12px;color:var(--ink-soft)}
@media (max-width:700px){.reading.wide{margin-top:-40px}.toc-bar{top:64px;margin-inline:-6px}.toc-label{display:none}.reading.wide .prose{font-size:16px}}

/* ---------- 內文目錄 v3：文首章節卡 + 底部浮動章節鈕 ---------- */
.toc-card{max-width:960px;margin:0 auto 40px;padding:22px 24px 18px;border-radius:14px;background:var(--moss)}
.toc-card[hidden]{display:none}
.toc-card .eyebrow{margin-bottom:12px}
.toc-card .toc{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:2px 20px;max-height:none;overflow:visible}
.toc-card .toc a,.tf-panel a{display:flex;align-items:baseline;gap:12px;padding:9px 10px;border:0;border-radius:8px;text-decoration:none;
  font:500 14.5px/1.5 var(--f-body);color:var(--ink-soft);background:none;transition:background .2s,color .2s}
.toc-card .toc a b,.tf-panel a b{flex:none;font:700 12px var(--f-num);color:var(--gold-deep);letter-spacing:.06em}
.toc-card .toc a:hover{background:rgba(255,255,255,.7);color:var(--pine)}
.toc-card .toc a.active{color:var(--pine);font-weight:700;background:rgba(255,255,255,.85)}

.toc-float{position:fixed;left:50%;bottom:calc(20px + env(safe-area-inset-bottom,0px));z-index:45;transform:translate(-50%,24px);opacity:0;pointer-events:none;
  transition:opacity .35s var(--ease),transform .45s var(--ease)}
.toc-float.show{opacity:1;transform:translate(-50%,0);pointer-events:auto}
.tf-btn{display:flex;align-items:center;gap:12px;max-width:min(520px,calc(100vw - 32px));height:48px;padding:0 18px 0 8px;border:0;border-radius:999px;cursor:pointer;
  background:var(--forest);color:#f7faef;box-shadow:0 0 0 1px rgba(196,170,105,.35),0 18px 36px -12px rgba(15,34,25,.6);font:600 14px var(--f-body)}
.tf-k{flex:none;padding:6px 12px;border-radius:999px;background:var(--gold-hi);color:var(--night);font:700 12px var(--f-body);letter-spacing:.14em}
.tf-cur{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tf-btn .chev{flex:none;width:16px;height:16px;transform:rotate(180deg);transition:transform .3s}
.toc-float.open .tf-btn .chev{transform:none}
.tf-panel{position:absolute;left:50%;bottom:calc(100% + 10px);width:min(440px,calc(100vw - 32px));max-height:min(60vh,480px);overflow:auto;padding:8px;border-radius:16px;
  background:rgba(250,251,246,.97);backdrop-filter:blur(14px);box-shadow:0 0 0 1px var(--line),0 24px 48px -16px rgba(15,34,25,.45);
  transform:translate(-50%,10px);opacity:0;visibility:hidden;transition:.3s var(--ease)}
.toc-float.open .tf-panel{transform:translate(-50%,0);opacity:1;visibility:visible}
.tf-panel a:hover{background:var(--moss);color:var(--pine)}
.tf-panel a.active{background:var(--moss);color:var(--pine);font-weight:700}

/* =====================================================================
   v7 · 下載頁重做 + 公告 / 攻略細節
   ===================================================================== */
/* 下載：苔綠面板（與首頁「版本選擇」同一語彙） */
.dl-panel{margin:28px var(--edge) 0;padding-block:var(--pad);background:#e4ecd8;border-radius:14px}
.dl-panel .sec-head{align-items:flex-end}
.detect{display:inline-flex;align-items:center;gap:10px;margin:0;padding:8px 16px;border-radius:999px;background:rgba(255,255,255,.7);font:500 13.5px var(--f-body);color:var(--ink-soft)}
.detect::before{width:8px;height:8px}

.ver-pick.dl-switch{display:grid;grid-template-columns:1fr 1fr;gap:var(--gap);margin:0}
.ver-pick.dl-switch button.vp{all:unset;display:block;cursor:pointer;clip-path:none;min-width:0;box-shadow:none;background:none;padding:0;transition:transform .3s var(--ease)}
.vp:hover{transform:translateY(-4px)}
.vp:focus-visible{outline:3px solid var(--gold-deep);outline-offset:4px}
.vp-in{position:relative;display:grid;grid-template-columns:44% 1fr;align-items:center;min-height:150px;background:#f2f6ec;overflow:hidden;--ol:rgba(23,61,46,.28);transition:background .3s}
.vp-art{height:100%;overflow:hidden}
.vp-art img{width:100%;height:100%;object-fit:cover;filter:saturate(.7);transition:filter .4s,transform .8s var(--ease)}
.vp-t{display:flex;align-items:baseline;gap:12px;padding:0 28px}
.vp-t b{font:700 clamp(44px,5vw,64px)/1 var(--f-num);letter-spacing:-.03em;color:var(--pine)}
.vp-t span{font:700 16px var(--f-body);letter-spacing:.1em;color:var(--gold-deep)}
.vp-dot{position:absolute;right:22px;top:50%;width:22px;height:22px;margin-top:-11px;border-radius:50%;box-shadow:inset 0 0 0 2px rgba(23,61,46,.3);transition:.3s}
.vp[aria-pressed="true"] .vp-in{background:#fff;--ol:var(--gold-deep)}
.vp[aria-pressed="true"] .vp-art img{filter:none;transform:scale(1.04)}
.vp[aria-pressed="true"] .vp-dot{background:var(--pine);box-shadow:inset 0 0 0 6px #d9e6c9}
.vp[aria-pressed="true"] svg.ol path{stroke-width:3}

.platforms{gap:var(--gap)}
.pc{transition:transform .35s var(--ease)}
.pc:hover{transform:translateY(-6px)}
.pc-in{position:relative;display:flex;flex-direction:column;gap:10px;height:100%;padding:26px 26px 24px;background:#fff;overflow:hidden;--ol:rgba(23,61,46,.22)}
.pc.rec .pc-in{--ol:var(--gold)}
.pc-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px}
.pc .glyph{width:52px;height:52px;display:grid;place-items:center;border-radius:14px;background:var(--moss)}
.pc .glyph img{width:26px;height:26px}
.pc h3{font:700 32px/1 var(--f-num);letter-spacing:-.01em;color:var(--ink)}
.pc .kind{font:500 13.5px var(--f-body);color:var(--ink-soft)}
.facts2{display:flex;flex-wrap:wrap;gap:6px;list-style:none;margin:8px 0 14px;padding:0}
.facts2 li{padding:3px 10px;border-radius:999px;background:var(--moss);font-size:12px;color:var(--pine)}
.pc .btn{margin-top:auto;width:100%;justify-content:center;min-height:52px}
.pc .note{font-size:12.5px;color:var(--ink-soft);text-align:center}
.pc .note a{color:var(--pine);font-weight:700}

/* 安裝指引：輕量三步驟（與公告月份大字同語彙） */
.dl-more{padding-top:var(--sec-y)}
.steps2{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--gap);list-style:none;margin:0;padding:0}
.steps2 li{display:flex;gap:18px;align-items:flex-start;padding:24px 0;border-top:2px solid var(--ink)}
.steps2 b{flex:none;font:700 54px/.9 var(--f-num);color:transparent;-webkit-text-stroke:1.5px var(--pine);letter-spacing:-.04em}
.steps2 h3{font:700 18px/1.4 var(--f-body);color:var(--ink);margin-bottom:6px}
.steps2 p{font-size:14px;color:var(--ink-soft)}

/* 一覽表 */
.matrix-wrap{border-radius:14px;box-shadow:0 0 0 1px var(--line)}
.matrix th,.matrix td{padding:16px 20px}
.matrix tbody th{display:flex;align-items:center;gap:10px;font:700 15px var(--f-num)}
.matrix tbody th img{width:18px;height:18px;opacity:.75}
.matrix td{vertical-align:middle}
.matrix .mx{display:inline-flex;align-items:center;gap:6px;margin-right:12px;padding:6px 14px;border-radius:999px;background:var(--pine);color:#fff;font:600 13px var(--f-num);text-decoration:none;transition:background .2s}
.matrix .mx:hover{background:var(--gold-deep)}
.matrix .mx svg{width:14px;height:14px}
.matrix td .num{font-size:12px;color:var(--ink-soft)}
.matrix .na{font-size:13px;color:var(--ink-soft)}

/* 攻略：特色卡改為橫向雙欄，比例更穩 */
.nc.feature{grid-column:span 2;grid-row:auto}
.nc.feature .note-card{flex-direction:row}
.nc.feature .art{flex:1.15 1 0;aspect-ratio:auto;min-height:100%}
.nc.feature .body{flex:1 1 0;justify-content:center;padding:28px 28px 24px}
.nc.feature .foot{margin-top:14px}

/* 公告：橫幅「最近更新」 */
.banner .sub b.num{font-size:15px}

@media (max-width:900px){
  .ver-pick.dl-switch{grid-template-columns:1fr}
  .steps2{grid-template-columns:1fr}
  .nc.feature{grid-column:span 1}.nc.feature .note-card{flex-direction:column}.nc.feature .art{aspect-ratio:4/3;flex:none;min-height:0}
}
@media (max-width:640px){.dl-panel{margin-inline:var(--edge)}.vp-in{grid-template-columns:40% 1fr;min-height:120px}.vp-t{padding:0 18px}.detect{border-radius:12px}}
.ver-pick .vp .vp-t b{font:700 clamp(44px,5vw,64px)/1 var(--f-num);letter-spacing:-.03em;color:var(--pine)}
.ver-pick .vp .vp-t span{font:700 16px var(--f-body);letter-spacing:.1em;color:var(--gold-deep)}
.ver-pick .vp span{font:inherit}
.matrix tbody th{display:table-cell;white-space:nowrap}
.matrix tbody th img{display:inline-block;vertical-align:-3px;margin-right:10px}

/* =====================================================================
   v8 · 下載頁：單一雙欄「控制台」構圖
   左：苔綠側欄（選版本 + 安裝提示）；右：三個平台橫列。整頁只有橫幅一個大標題
   ===================================================================== */
.dl2{padding-top:clamp(40px,5vw,64px)}
.dl2-grid{display:grid;grid-template-columns:minmax(300px,4fr) 7fr;gap:clamp(24px,3vw,40px);align-items:start}
.step-k{display:flex;align-items:center;gap:12px;margin:0 0 14px;font:700 15px var(--f-body);letter-spacing:.08em;color:var(--ink)}
.step-k b{font:700 13px var(--f-num);color:var(--gold-deep);letter-spacing:.1em;padding:3px 8px;border-radius:6px;background:rgba(196,170,105,.18)}

.dl2-side{position:sticky;top:calc(88px + env(safe-area-inset-top,0px));padding:26px;border-radius:16px;background:#e4ecd8}
.vp2-list.dl-switch{display:grid;gap:12px;margin:0 0 30px}
.dl2 .vp2-list button.vp2{all:unset;box-sizing:border-box;position:relative;display:grid;grid-template-columns:96px 1fr 24px;align-items:center;gap:16px;padding:10px 16px 10px 10px;
  border-radius:12px;background:rgba(255,255,255,.55);cursor:pointer;box-shadow:inset 0 0 0 1px rgba(23,61,46,.12);transition:background .25s,box-shadow .25s,transform .3s var(--ease)}
.dl2 .vp2:hover{transform:translateX(4px);background:rgba(255,255,255,.85)}
.dl2 .vp2:focus-visible{outline:3px solid var(--gold-deep);outline-offset:3px}
.dl2 .vp2-art{display:block;width:96px;height:64px;border-radius:8px;overflow:hidden}
.dl2 .vp2-art img{width:100%;height:100%;object-fit:cover;filter:saturate(.6);transition:filter .3s}
.dl2 .vp2-t{display:flex;align-items:baseline;gap:10px}
.dl2 .vp2 .vp2-t b{font:700 34px/1 var(--f-num);letter-spacing:-.02em;color:var(--pine)}
.dl2 .vp2 .vp2-t span{font:700 14px var(--f-body);letter-spacing:.08em;color:var(--gold-deep)}
.dl2 .vp2-dot{width:20px;height:20px;border-radius:50%;box-shadow:inset 0 0 0 2px rgba(23,61,46,.3);transition:.25s}
.dl2 .vp2[aria-pressed="true"]{background:#fff;box-shadow:inset 0 0 0 2px var(--pine),0 14px 26px -18px rgba(23,61,46,.6)}
.dl2 .vp2[aria-pressed="true"] .vp2-art img{filter:none}
.dl2 .vp2[aria-pressed="true"] .vp2-dot{background:var(--pine);box-shadow:inset 0 0 0 5px #dfe9d2}

.tips{list-style:none;counter-reset:t;margin:0;padding:0;display:grid;gap:12px}
.tips li{counter-increment:t;position:relative;padding-left:30px;font-size:14px;line-height:1.7;color:var(--ink-soft)}
.tips li::before{content:counter(t);position:absolute;left:0;top:2px;width:20px;height:20px;border-radius:50%;display:grid;place-items:center;background:var(--pine);color:#fff;font:700 11px var(--f-num)}
.tips a{color:var(--pine);font-weight:700;text-underline-offset:3px}

.dl2-head{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:14px}
.dl2-head .step-k{margin:0}
.dl2 .detect{padding:6px 14px;background:var(--moss);font-size:13px}
.prows{display:grid;gap:14px}
.prow{transition:transform .3s var(--ease)}
.prow:hover{transform:translateY(-3px)}
.prow-in{position:relative;display:grid;grid-template-columns:60px 1fr auto;align-items:center;gap:20px;padding:22px 26px;background:#fff;overflow:hidden;--ol:rgba(23,61,46,.2)}
.prow.rec .prow-in{--ol:var(--gold)}
.prow .glyph{width:60px;height:60px;display:grid;place-items:center;border-radius:16px;background:var(--moss)}
.prow .glyph img{width:28px;height:28px}
.pr-t{min-width:0}
.pr-t h3{display:flex;align-items:center;gap:10px;font:700 26px/1.1 var(--f-num);color:var(--ink)}
.pr-t h3 .chip{font-family:var(--f-body)}
.pr-t>p{margin-top:4px;font-size:13.5px;color:var(--ink-soft)}
.pr-t .facts2{margin:10px 0 0}
.pr-t .note{margin-top:8px;font-size:12.5px;color:var(--ink-soft)}
.pr-t .note a{color:var(--pine);font-weight:700}
.pr-act .btn{min-width:132px;min-height:50px;justify-content:center}

@media (max-width:960px){.dl2-grid{grid-template-columns:1fr}.dl2-side{position:static}.vp2-list.dl-switch{grid-template-columns:1fr 1fr}}
@media (max-width:560px){
  .vp2-list.dl-switch{grid-template-columns:1fr}
  .prow-in{grid-template-columns:48px 1fr;gap:14px;padding:18px}
  .prow .glyph{width:48px;height:48px;border-radius:12px}
  .pr-act{grid-column:1/-1}.pr-act .btn{width:100%}
}
.dl2-grid{align-items:stretch}
.dl2-side{position:static;display:flex;flex-direction:column}
.dl2-side .tips{margin-bottom:auto}

/* =====================================================================
   v9 · 下載頁（以原站版面為骨架）
   原站：橫幅 → 選擇版本（標籤）→ 三張平台卡（米白卡 + 淡綠邊）→ 苔綠「小提醒」面板
   優化：版本全景插畫帶貫穿三卡、圖示浮於插畫邊緣、檔案資訊標籤、裝置推薦、斜切外框
   ===================================================================== */
.dl3{padding-top:clamp(48px,6vw,80px)}
.dl3-head{margin-bottom:18px}
.dl3-head .lede{margin-top:10px;color:var(--ink-soft);font-size:15px}

.dl3 .seg2.dl-switch{display:inline-flex;gap:4px;padding:5px;margin:0;border-radius:14px;background:var(--moss);box-shadow:inset 0 0 0 1px rgba(23,61,46,.08)}
.dl3 .seg2.dl-switch button{all:unset;box-sizing:border-box;display:inline-flex;align-items:baseline;gap:8px;padding:12px 22px;border-radius:10px;cursor:pointer;color:var(--ink-soft);transition:background .25s,color .25s}
.dl3 .seg2.dl-switch button b{font:700 22px/1 var(--f-num);letter-spacing:-.01em}
.dl3 .seg2.dl-switch button span{font:700 14px var(--f-body);letter-spacing:.06em}
.dl3 .seg2.dl-switch button:hover{color:var(--pine)}
.dl3 .seg2.dl-switch button[aria-pressed="true"]{background:var(--pine);color:#fff;box-shadow:0 10px 20px -12px rgba(23,61,46,.8)}
.dl3 .seg2.dl-switch button:focus-visible{outline:3px solid var(--gold-deep);outline-offset:2px}

.dl3 .detect{margin:0 0 28px;padding:0;background:none;border-radius:0;font-size:14px}

.platforms3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--gap)}
.pc3{transition:transform .35s var(--ease)}
.pc3:hover{transform:translateY(-6px)}
.pc3-in{position:relative;display:flex;flex-direction:column;height:100%;background:#fffef9;overflow:hidden;--ol:rgba(150,180,130,.75)}
.pc3.rec .pc3-in{--ol:var(--gold)}
.pc3-art{height:132px;background-size:310% auto;background-repeat:no-repeat;transition:background-image .4s,transform .9s var(--ease)}
.pc3:hover .pc3-art{transform:scale(1.04)}
.pc3-art::after{content:"";display:block;height:100%;background:linear-gradient(180deg,transparent 45%,rgba(255,254,249,.55))}
.pc3-rec{position:absolute;top:14px;right:16px;z-index:2}
.pc3-sym{position:relative;z-index:2;display:grid;place-items:center;width:60px;height:60px;margin:-30px 0 0 30px;border-radius:16px;background:#fff;
  box-shadow:0 0 0 1px rgba(23,61,46,.08),0 12px 24px -12px rgba(23,61,46,.5)}
.pc3-sym img{width:28px;height:28px}
.pc3-b{display:flex;flex-direction:column;gap:4px;flex:1;padding:18px 30px 30px}
.pc3 .kind{font:500 13px var(--f-body);letter-spacing:.06em;color:var(--ink-soft)}
.pc3 h3{font:700 36px/1.1 var(--f-num);letter-spacing:-.01em;color:var(--ink)}
.pc3 .cap{font:700 14px var(--f-body);letter-spacing:.06em;color:var(--gold-deep)}
.pc3 .facts2{margin:14px 0 22px}
.pc3 .btn{margin-top:auto;width:100%;justify-content:center;min-height:52px}
.pc3 .note{margin-top:10px;font-size:12.5px;color:var(--ink-soft);text-align:center}
.pc3 .note a{color:var(--pine);font-weight:700}

.notes3{display:grid;grid-template-columns:200px 1fr auto;align-items:center;gap:clamp(24px,3vw,48px);margin-top:clamp(48px,6vw,72px);padding:clamp(28px,3.4vw,44px);border-radius:16px;background:#e4ecd8}
.n3-head .eyebrow{margin-bottom:10px}
.n3-head h3{font:800 24px/1.3 var(--f-display)}
.n3-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2.4vw,32px);list-style:none;margin:0;padding:0}
.n3-list li{display:flex;gap:14px;align-items:flex-start}
.n3-list b{flex:none;font:700 40px/.9 var(--f-num);color:transparent;-webkit-text-stroke:1.4px var(--pine);letter-spacing:-.04em}
.n3-list h4{font:700 16px/1.4 var(--f-body);margin:0 0 4px;color:var(--ink)}
.n3-list p{font-size:13.5px;line-height:1.7;color:var(--ink-soft)}
.notes3 .btn{white-space:nowrap}

@media (max-width:1060px){.notes3{grid-template-columns:1fr}.notes3 .btn{justify-self:start}}
@media (max-width:900px){.platforms3{grid-template-columns:1fr}.pc3-art{background-size:cover;background-position:center 42%!important}.n3-list{grid-template-columns:1fr}}
@media (max-width:640px){.dl3 .seg2.dl-switch{width:100%}.dl3 .seg2.dl-switch button{flex:1;justify-content:center}}
.dl3{padding-bottom:clamp(64px,7vw,104px)}

/* =====================================================================
   v10 · 下載頁：中軸對稱（原站骨架 + 原站卡片樣式：米白、淡綠 1px 邊、16px 圓角）
   ===================================================================== */
.dl4{padding-block:clamp(56px,7vw,96px) clamp(72px,8vw,112px)}
.dl4-head{display:flex;flex-direction:column;align-items:center;text-align:center;margin-bottom:clamp(36px,4vw,52px)}
.dl4-head .eyebrow{justify-content:center}
.dl4-head .eyebrow::after{content:"";width:28px;height:1.5px;background:currentColor}
.dl4-head h2{font:800 clamp(30px,3.5vw,46px)/1.2 var(--f-display);margin:14px 0 10px;font-feature-settings:"palt" 1}
.dl4-head .lede{font-size:15px;color:var(--ink-soft);margin-bottom:26px}
.dl4 .seg2.dl-switch{display:inline-flex;gap:4px;padding:5px;margin:0;border-radius:14px;background:var(--moss);box-shadow:inset 0 0 0 1px rgba(23,61,46,.08)}
.dl4 .seg2.dl-switch button{all:unset;box-sizing:border-box;display:inline-flex;align-items:baseline;justify-content:center;gap:8px;min-width:150px;padding:12px 22px;border-radius:10px;cursor:pointer;color:var(--ink-soft);transition:background .25s,color .25s}
.dl4 .seg2.dl-switch button b{font:700 22px/1 var(--f-num)}
.dl4 .seg2.dl-switch button span{font:700 14px var(--f-body);letter-spacing:.06em}
.dl4 .seg2.dl-switch button:hover{color:var(--pine)}
.dl4 .seg2.dl-switch button[aria-pressed="true"]{background:var(--pine);color:#fff;box-shadow:0 10px 20px -12px rgba(23,61,46,.8)}
.dl4 .seg2.dl-switch button:focus-visible{outline:3px solid var(--gold-deep);outline-offset:2px}
.dl4 .detect{margin:16px 0 0;padding:0;background:none;font-size:13.5px}

.platforms4{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--gap)}
.pc4{position:relative;display:grid;grid-template-rows:auto auto auto auto auto 1fr auto;justify-items:center;text-align:center;
  padding:40px 32px 22px;border-radius:16px;background:#fffef9;border:1px solid #dbe5ce;transition:transform .35s var(--ease),box-shadow .35s,border-color .35s}
.pc4:hover{transform:translateY(-6px);border-color:#c9d8b8;box-shadow:0 26px 40px -30px rgba(23,61,46,.55)}
.pc4.rec{border-color:var(--gold);box-shadow:0 0 0 1px var(--gold)}
.pc4-rec{position:absolute;top:0;left:50%;transform:translate(-50%,-50%);padding:4px 14px;border-radius:999px;background:var(--gold);color:var(--night);font:700 12px var(--f-body);letter-spacing:.1em;white-space:nowrap}
.pc4-sym{display:grid;place-items:center;width:72px;height:72px;margin-bottom:18px;border-radius:50%;background:radial-gradient(circle at 50% 35%,#fff,var(--moss));box-shadow:0 0 0 1px #dbe5ce,0 0 0 8px #f3f6ec}
.pc4-sym img{width:30px;height:30px}
.pc4 .kind{font:500 13px var(--f-body);letter-spacing:.08em;color:var(--ink-soft)}
.pc4 h3{font:700 36px/1.15 var(--f-num);letter-spacing:-.01em;color:var(--ink);margin:4px 0 6px}
.pc4 .cap{font:700 14px var(--f-body);letter-spacing:.08em;color:var(--gold-deep)}
.pc4 .facts2{justify-content:center;margin:16px 0 26px;align-self:start}
.pc4 .btn{width:100%;justify-content:center;min-height:52px}
.pc4 .note{min-height:20px;margin-top:12px;font-size:12.5px;line-height:20px;color:var(--ink-soft)}
.pc4 .note a{color:var(--pine);font-weight:700}

.notes4{display:flex;flex-direction:column;align-items:center;text-align:center;margin-top:clamp(56px,6vw,80px);padding:clamp(36px,4vw,52px) clamp(24px,4vw,56px);border-radius:16px;background:#e4ecd8}
.notes4 .eyebrow{justify-content:center}
.notes4 .eyebrow::after{content:"";width:28px;height:1.5px;background:currentColor}
.notes4 h3{font:800 26px/1.3 var(--f-display);margin:10px 0 clamp(26px,3vw,36px)}
.n4-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(20px,3vw,48px);width:100%;max-width:980px;list-style:none;margin:0 0 32px;padding:0}
.n4-list li{display:flex;flex-direction:column;align-items:center}
.n4-list b{font:700 44px/1 var(--f-num);color:transparent;-webkit-text-stroke:1.4px var(--pine);letter-spacing:-.03em;margin-bottom:12px}
.n4-list h4{font:700 16px/1.4 var(--f-body);margin:0 0 6px}
.n4-list p{max-width:22em;font-size:13.5px;line-height:1.75;color:var(--ink-soft)}
.notes4 .btn{min-width:180px;justify-content:center}

@media (max-width:900px){.platforms4{grid-template-columns:1fr;max-width:460px;margin-inline:auto}.n4-list{grid-template-columns:1fr}}
@media (max-width:640px){.dl4 .seg2.dl-switch{width:100%}.dl4 .seg2.dl-switch button{flex:1;min-width:0}}
.dl4 .btn{clip-path:none;border-radius:12px}
.dl4 .btn::after{border-radius:12px}
.n4-list p,.dl4-head .lede,.pc4 .note{text-wrap:balance}
.n4-list p{max-width:20em}

/* =====================================================================
   v11 · 下載頁：還原原站樣式（數值取自 cgwoods.com pages.css / catalog.css）
   ===================================================================== */
.dl-o-wrap{max-width:1200px;margin:48px auto 64px;padding-inline:var(--gutter)}
.dl-o .download-heading h2{font:800 28px/1.3 var(--f-display);color:var(--ink)}
.dl-o .download-heading p{margin-top:12px;color:#718463;font-size:15px}
.dl-o .ver-tabs.dl-switch{display:flex;gap:10px;margin:24px 0 0;flex-wrap:wrap}
.dl-o .ver-tabs.dl-switch button{all:unset;box-sizing:border-box;cursor:pointer;padding:13px 22px;border-radius:4px;background:#edf2e7;color:#3c5a48;font:600 13px var(--f-body);letter-spacing:.04em;transition:background .2s,color .2s}
.dl-o .ver-tabs.dl-switch button:hover{background:#e2ebd8}
.dl-o .ver-tabs.dl-switch button[aria-pressed="true"]{background:#214d39;color:#fff}
.dl-o .ver-tabs.dl-switch button:focus-visible{outline:3px solid var(--gold-deep);outline-offset:2px}
.dl-o .download-device-hint{font-size:14px;line-height:1.8;color:#567247;margin:20px 0 16px}

.dl-o .pcards-o{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.dl-o .platform-card{position:relative;display:flex;flex-direction:column;align-items:flex-start;padding:34px;background:#fffef9;border:1px solid #dbe5ce;border-radius:16px;transition:border-color .25s,box-shadow .25s}
.dl-o .platform-card:hover{border-color:#c5d6b1;box-shadow:0 18px 34px -28px rgba(33,77,57,.45)}
.dl-o .platform-card.recommended{border-color:#72935e;box-shadow:0 0 0 1px #72935e;background:#f5f8ee}
.dl-o .device-recommend-badge{position:absolute;right:18px;top:18px;background:#254e39;color:#fffef5;border-radius:5px;padding:6px 10px;font:600 12px var(--f-body)}
.dl-o .platform-symbol{margin-bottom:20px}
.dl-o .platform-symbol img{width:42px;height:42px;opacity:.75}
.dl-o .platform-card>p,.dl-o .version-caption{color:#70865d;font-size:13px}
.dl-o .platform-card h3{font:700 32px/1.2 var(--f-num);margin:8px 0;color:var(--ink)}
.dl-o .file-meta{margin-top:6px;font-size:12px;color:#8a9b7c;letter-spacing:.02em}
.dl-o .platform-card .btn{margin-top:auto;width:100%;justify-content:center;padding:15px;min-height:0;font-size:13px}
.dl-o .platform-card .version-caption+.btn,.dl-o .platform-card .file-meta+.btn{margin-top:32px}
.dl-o .platform-card .btn:disabled{--bg:#edf0e8;--fg:#829078;cursor:not-allowed;transform:none}
.dl-o .card-hint{margin-top:12px;font-size:12px;color:#70865d}
.dl-o .card-hint a{color:#214d39;font-weight:700}

.dl-o .install-notes{margin-top:38px;padding:30px;background:#eaf0e1;border-radius:14px}
.dl-o .install-notes h2{font:800 22px/1.3 var(--f-display);color:var(--ink)}
.dl-o .install-notes>div{display:grid;grid-template-columns:repeat(3,1fr);gap:30px;margin:24px 0;line-height:1.9;font-size:14px;color:#3c5a48}
.dl-o .install-notes b{display:inline-block;margin-bottom:10px;color:var(--ink)}
.dl-o .install-notes .btn{padding:14px 24px;min-height:0;font-size:13px}

@media (max-width:850px){.dl-o .pcards-o{gap:12px}.dl-o .platform-card{padding:22px}}
@media (max-width:600px){.dl-o .pcards-o,.dl-o .install-notes>div{grid-template-columns:1fr}.dl-o .platform-card{padding:26px}.dl-o .platform-symbol{margin-bottom:8px}.dl-o .download-heading h2{font-size:24px}.dl-o .install-notes{padding:24px}}
.dl-o .install-notes p{text-wrap:pretty}

/* =====================================================================
   v12 · 攻略頁：還原原站 catalog 版面（數值取自 cgwoods.com catalog.css）
   ===================================================================== */
/* 主題橫幅：米白漸層 + 手繪主題圖（原站 body[data-catalog] .catalog-hero） */
.banner.theme::before{background:linear-gradient(90deg,#fbf6e8f5 0%,#fbf6e8df 45%,#fbf6e870 100%)}
.banner.theme .bg img{object-position:var(--pos,72% center)}
.banner.theme .sub{font:500 14px/1.8 var(--f-body);letter-spacing:.02em;color:#526e48}

.cat-o-wrap{position:relative;max-width:1280px;margin:34px auto 70px;padding:0 20px}
.catalog-tools{display:flex;align-items:center;gap:16px;flex-wrap:wrap;padding:18px 20px;background:#edf2e5;border:1px solid #dce5d1;border-radius:10px}
.cats-o{display:flex;gap:7px;flex-wrap:wrap;flex:1}
.cats-o button{border:0;cursor:pointer;background:#fafbf6;padding:10px 15px;border-radius:5px;font:600 12.5px var(--f-body);color:#234a34;transition:background .2s,color .2s}
.cats-o button .n{opacity:.55;font-size:11px;margin-left:2px}
.cats-o button:hover{background:#fff}
.cats-o button[aria-pressed="true"]{background:#214d39;color:#fff}
.search-o{display:flex;align-items:stretch;gap:8px;margin:0 0 0 auto;min-width:0}
.search-o input{background:#fff;border:1px solid #d4dfc9;border-radius:6px;padding:10px 12px;width:200px;font:14px var(--f-body);color:#234a34;outline:none}
.search-o input:focus{border-color:#214d39}
.search-submit{border:0;cursor:pointer;background:#234e38;color:#fffef6;padding:0 18px;border-radius:6px;min-height:42px;white-space:nowrap;font:600 13px var(--f-body)}
.search-submit:hover{background:#346447}
.ver-o{display:flex;align-items:center;gap:8px;font:600 12.5px var(--f-body);color:#234a34}
.ver-o select{appearance:auto;background:#fff;border:1px solid #d4dfc9;border-radius:6px;padding:10px;color:#234a34;font:14px var(--f-body)}
.mine-o{display:inline-flex;align-items:center;gap:7px;border:1px solid #d4dfc9;cursor:pointer;background:#fff;padding:0 14px;min-height:42px;border-radius:6px;font:600 12.5px var(--f-body);color:#234a34;transition:background .2s,color .2s,border-color .2s}
.mine-o svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:2}
.mine-o b{min-width:20px;padding:0 6px;border-radius:99px;background:#edf2e5;font-size:11px;text-align:center}
.mine-o:hover{border-color:#214d39}
.mine-o[aria-pressed="true"]{background:#214d39;border-color:#214d39;color:#fff}
.mine-o[aria-pressed="true"] svg{fill:currentColor}
.mine-o[aria-pressed="true"] b{background:var(--gold-hi);color:var(--night)}

.result-count{margin:22px 0 18px;font-size:12.5px;letter-spacing:.05em;color:#70815f}
.result-count b{color:#214d39}
.guide-results-o{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:38px 26px}
.guide-card-o{position:relative;display:flex;flex-direction:column;padding:12px 12px 20px;border:1px solid #e0e7d7;background:#fffef8;border-radius:12px;transition:box-shadow .2s,transform .2s}
.guide-card-o:hover{box-shadow:0 10px 28px #234a3412;transform:translateY(-3px)}
.guide-card-o .stretch{position:absolute;inset:0;z-index:1;border-radius:12px}
.guide-card-o .cover{position:relative;height:220px;border-radius:10px;overflow:hidden;background:#e8eedf}
.guide-card-o .cover img{width:100%;height:100%;object-fit:cover;transition:transform .4s}
.guide-card-o:hover .cover img{transform:scale(1.035)}
.guide-card-o .no-cover{display:grid;place-items:center;height:100%;color:#70885a}
.guide-card-o .badges{position:absolute;left:12px;top:12px;display:flex;gap:6px}
.guide-card-o .badge{display:inline-block;padding:4px 9px;border-radius:3px;font-size:10.5px;font-weight:700;background:#fafbf6;color:#4c6b3c}
.guide-card-o .badge.pin{background:#214d39;color:#fff;font-family:var(--f-body)}
.fav-o{position:absolute;right:10px;top:10px;z-index:2;width:34px;height:34px;display:grid;place-items:center;border:0;border-radius:8px;cursor:pointer;
  background:rgba(250,251,246,.9);color:#4c6b3c;opacity:0;transform:translateY(-4px);transition:opacity .2s,transform .2s,background .2s}
.fav-o svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2}
.guide-card-o:hover .fav-o,.fav-o:focus-visible,.fav-o.on{opacity:1;transform:none}
.fav-o:hover{background:#fff}
.fav-o.on{background:#214d39;color:var(--gold-hi)}
.fav-o.on svg{fill:currentColor}
.guide-card-o .category-label{display:block;margin:15px 8px 8px;font-size:11.5px;letter-spacing:.06em;color:#65804f}
.guide-card-o h2{margin:0 8px;font:700 20px/1.5 var(--f-body);color:var(--ink)}
.guide-card-o p{margin:12px 8px;font-size:13px;line-height:1.8;color:#667b56;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.guide-card-o .read-more{display:flex;justify-content:space-between;align-items:center;margin:auto 8px 0;padding-top:14px;border-top:1px solid #dce5d1;font:600 12.5px var(--f-body);color:#234a34}
.guide-card-o .read-more time{font-size:12px;font-weight:500;color:#8a9b7c}
.guide-card-o:hover .read-more>span{color:var(--gold-deep)}
.pager-o{display:flex;justify-content:center;gap:8px;margin-top:38px}
.pager-o:empty{display:none}
.pager-o button{border:0;cursor:pointer;min-width:40px;padding:10px 15px;border-radius:5px;background:#edf2e5;font:600 12.5px var(--f-num);color:#234a34}
.pager-o button[aria-current]{background:#214d39;color:#fff}
.cat-o .empty .btn.ghost{--bg:#fff}

@media (max-width:1000px){.guide-results-o{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 16px}.guide-card-o .cover{height:170px}}
@media (max-width:700px){
  .cat-o-wrap{padding:0;margin-top:24px}
  .cat-o-wrap{padding-inline:var(--edge)}
  .catalog-tools{padding:15px 12px;gap:12px}
  .cats-o{flex-basis:100%}
  .search-o{width:100%;margin:0}.search-o input{flex:1;width:0;min-width:0}
  .guide-results-o{grid-template-columns:1fr;gap:20px}
  .guide-card-o .cover{height:190px}
  .fav-o{opacity:1;transform:none}
}
.catalog-tools{row-gap:14px}
.cats-o{flex:1 1 100%}
.search-o{flex:1;margin:0}
.search-o input{flex:1;width:auto;min-width:0}
/* <main> 只作為換頁後的無障礙焦點目標，不顯示焦點框（Safari 會對程式聚焦畫出外框，造成選單下方的金色橫線） */
main:focus,main:focus-visible{outline:none}

/* =====================================================================
   全站統一內容寬度：以攻略頁為準（1240px 內容寬），所有容器共用同一個 token
   ===================================================================== */
:root{--content:1240px}
.wrap,.banner .inner,.cat-o-wrap,.dl-o-wrap{max-width:calc(var(--content) + var(--gutter) * 2);margin-inline:auto;padding-inline:var(--gutter)}
.cat-o-wrap{padding-inline:var(--gutter)}
.dl-o-wrap{margin-top:34px;margin-bottom:70px}
.f-main,.f-bottom{max-width:var(--content)}

/* 公告 / 攻略 / 下載 三個列表頁橫幅：同一高度 */
.banner.lb{min-height:clamp(300px,23vw,332px)}
.banner.lb .inner{padding-top:clamp(28px,4vw,48px);padding-bottom:clamp(40px,4.4vw,56px)}
@media (max-width:700px){.banner.lb{min-height:300px}}
/* 工具列欄寬不得被搜尋框的固有寬度撐開（WebKit 手機寬度溢出） */
.tools{grid-template-columns:minmax(0,1fr)}
.tools-row>*{min-width:0}
.search{min-width:0}
.search input{width:100%;min-width:0}

/* =====================================================================
   選單：還原原站「林間告示牌」（米白卡 + 手繪藤蔓框 forest-menu-companions.webp）
   ===================================================================== */
.drawer{display:block}
.drawer-scrim{position:absolute;inset:0;z-index:0;background:rgba(18,52,35,.33);backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px)}
.drawer-panel{position:absolute;z-index:1;top:18px;left:18px;bottom:auto;
  --mw:min(450px,calc(100vw - 24px));--u:calc(var(--mw) / 887);
  width:var(--mw);height:calc(100dvh - 36px);max-height:960px;padding:0;overflow:hidden;isolation:isolate;
  display:block;gap:0;background:#fffef3;color:var(--ink);border-radius:20px;box-shadow:0 20px 70px rgba(16,44,30,.4);background-image:none;
  transform:translateX(calc(-100% - 40px));transition:transform .5s var(--ease)}
.drawer.open .drawer-panel{transform:none}
.menu-frame{position:absolute;inset:0;z-index:0;pointer-events:none;border-style:solid;border-color:transparent;
  border-width:calc(300 * var(--u)) calc(110 * var(--u)) calc(520 * var(--u));
  border-image:url(/images/senjing/forest-menu-companions.webp) 300 110 520 110 / calc(300 * var(--u)) calc(110 * var(--u)) calc(520 * var(--u)) stretch round}
.menu-close{position:absolute;top:18px;right:18px;z-index:3;width:36px;height:36px;display:grid;place-items:center;border:0;border-radius:8px;cursor:pointer;
  background:rgba(245,247,235,.94);color:#234a34;box-shadow:0 0 0 1px rgba(35,74,52,.12);transition:background .2s}
.menu-close:hover{background:#fff}
.menu-close svg{width:18px;height:18px}
.menu-canvas{position:absolute;z-index:1;top:calc(110 * var(--u));left:calc(110 * var(--u));right:calc(110 * var(--u));bottom:calc(330 * var(--u));
  overflow-y:auto;overflow-x:hidden;scrollbar-width:none;padding:6px 4px 16px}
.menu-canvas::-webkit-scrollbar{display:none}
.menu-logo{display:block;width:100%;height:96px;object-fit:contain;margin:0 auto 22px}
.drawer .menu-canvas nav{display:flex;flex-direction:column;gap:0}
.drawer .menu-canvas nav a{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:15px 4px;border-bottom:1px solid rgba(120,149,92,.19);border-radius:5px;
  font:700 19px/1.3 var(--f-body);letter-spacing:.04em;color:var(--ink);text-decoration:none;transition:padding .2s,background .2s,color .2s}
.drawer .menu-canvas nav a:hover{padding-left:12px;background:rgba(233,239,219,.6);color:#456b30}
.mr-t{display:flex;align-items:center;gap:9px;white-space:nowrap}
.mr-t .leaf{font-style:normal;font-size:15px;color:#6b8750}
.mr-t svg.leaf{width:16px;height:16px}
.mr-d{display:flex;align-items:center;gap:10px;font:500 11.5px var(--f-body);letter-spacing:.06em;color:#647b50;white-space:nowrap}
.mr-d b{font-size:15px;font-weight:400;color:#3b603f}
.menu-services{display:grid;gap:10px;margin-top:22px}
.menu-services a{display:block;padding:13px 14px;border-radius:6px;background:#e5ecd7;border:1px solid rgba(139,159,99,.19);
  font:600 13px var(--f-body);color:#234a34;text-decoration:none;transition:background .2s}
.menu-services a:hover{background:#dbe5c9}
@media (max-width:520px){
  .drawer-panel{top:12px;left:12px;height:calc(100dvh - 24px)}
  .menu-logo{height:72px;margin-bottom:12px}
  .drawer .menu-canvas nav a{padding:12px 2px;font-size:17px}
  .mr-d{font-size:10px;gap:6px}
}

/* =====================================================================
   選單 v2：去背藤蔓框（forest-menu-frame.webp，帶透明）＋ 內嵌米白卡
   ===================================================================== */
.drawer-panel{background:none;box-shadow:none;border-radius:0;overflow:visible;
  --mw:min(460px,calc(100vw - 24px));--u:calc(var(--mw) / 887);height:min(calc(100dvh - 36px),calc(var(--mw) * 2))}
.menu-card{position:absolute;z-index:0;top:calc(46 * var(--u));left:calc(52 * var(--u));right:calc(52 * var(--u));bottom:calc(70 * var(--u));
  border-radius:22px;background:#fffef3;box-shadow:0 30px 70px -20px rgba(16,44,30,.55),0 0 0 1px rgba(120,149,92,.18)}
.menu-frame{z-index:1;border-image:url(/images/senjing/forest-menu-frame.webp) 300 110 520 110 / calc(300 * var(--u)) calc(110 * var(--u)) calc(520 * var(--u)) stretch round;
  filter:drop-shadow(0 6px 10px rgba(16,44,30,.22))}
.menu-close{z-index:4;top:calc(120 * var(--u));right:calc(130 * var(--u))}
.menu-canvas{z-index:2;top:calc(150 * var(--u));left:calc(118 * var(--u));right:calc(118 * var(--u));bottom:calc(400 * var(--u));padding:0 2px 12px}
.menu-logo{height:86px;margin:0 auto 14px}

.drawer .menu-canvas nav a{display:grid;grid-template-columns:40px 1fr auto;align-items:center;gap:14px;padding:10px 8px;border-bottom:1px solid rgba(120,149,92,.16);border-radius:10px;font:inherit}
.drawer .menu-canvas nav a:hover{padding-left:12px;background:rgba(229,236,215,.7);color:inherit}
.mi{display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:#e9efdc;color:#2f5a3e;transition:background .25s,color .25s}
.mi svg{width:19px;height:19px}
.drawer .menu-canvas nav a:hover .mi{background:#214d39;color:#f0e2b4}
.mt{display:grid;gap:1px;min-width:0}
.mt b{font:700 17px/1.3 var(--f-body);letter-spacing:.04em;color:var(--ink)}
.mt small{font:500 11.5px var(--f-body);letter-spacing:.08em;color:#7a8d68}
.ma{font-size:15px;color:#6b8750;transition:transform .25s}
.drawer .menu-canvas nav a:hover .ma{transform:translate(3px,-3px);color:var(--gold-deep)}
.drawer .menu-canvas nav a[aria-current="page"] .mi,.drawer .menu-canvas nav a.here .mi{background:#214d39;color:#f0e2b4}

.menu-news{margin-top:20px;padding:14px 14px 8px;border-radius:12px;background:#f3f6ea;border:1px solid rgba(120,149,92,.18)}
.mn-h{display:flex;justify-content:space-between;align-items:center;margin:0 0 6px;font:700 12px var(--f-body);letter-spacing:.16em;color:#6b8750}
.mn-h a{font-size:11.5px;letter-spacing:.06em;color:#3b603f;text-decoration:none}
.mn-h a:hover{color:var(--gold-deep)}
#menuNews a{display:grid;grid-template-columns:44px 1fr;gap:8px;align-items:baseline;padding:8px 0;border-top:1px dashed rgba(120,149,92,.25);text-decoration:none;color:var(--ink)}
#menuNews a:first-child{border-top:0}
#menuNews time{font-size:12px;font-weight:700;color:var(--gold-deep)}
#menuNews span{font:500 13.5px/1.5 var(--f-body);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#menuNews a:hover span{color:#456b30}

.menu-services{grid-template-columns:1fr 1fr;gap:10px;margin-top:14px}
.menu-services a{text-align:center;padding:12px 10px}
@media (max-width:520px){
  .menu-logo{height:64px;margin-bottom:8px}
  .drawer .menu-canvas nav a{grid-template-columns:34px 1fr auto;gap:10px;padding:8px 6px}
  .mi{width:34px;height:34px}.mi svg{width:17px;height:17px}
  .mt b{font-size:15.5px}.mt small{font-size:10.5px}
  .menu-news{margin-top:12px;padding:10px 12px 4px}
}
/* 選單 v2.1：收緊行高；內容超出時於人物上方柔和淡出，而非硬切 */
.drawer-panel{height:min(calc(100dvh - 36px),calc(var(--mw) * 2.05))}
.menu-canvas{top:calc(140 * var(--u));bottom:calc(330 * var(--u));padding-bottom:40px;
  -webkit-mask-image:linear-gradient(180deg,#000 calc(100% - 56px),transparent);mask-image:linear-gradient(180deg,#000 calc(100% - 56px),transparent)}
.menu-logo{height:70px;margin-bottom:10px}
.drawer .menu-canvas nav a{padding:7px 8px;gap:12px}
.mi{width:36px;height:36px}.mi svg{width:18px;height:18px}
.mt b{font-size:16px}.mt small{font-size:11px}
.menu-services{margin-top:12px}
.menu-services a{padding:10px}
.menu-news{margin-top:12px;padding:10px 12px 4px}
#menuNews a{padding:6px 0}
@media (max-width:520px){.menu-logo{height:56px;margin-bottom:6px}.drawer .menu-canvas nav a{padding:6px 4px}.mi{width:32px;height:32px}}

/* =====================================================================
   選單 v3：使用原站插圖原檔（不去背），整張即為卡片；內容於藤框內垂直置中
   ===================================================================== */
.drawer-panel{--mw:min(450px,calc(100vw - 24px));--u:calc(var(--mw) / 887);
  height:min(calc(100dvh - 36px),calc(var(--mw) * 2));overflow:hidden;border-radius:20px;background:#fefef3;box-shadow:0 20px 70px rgba(16,44,30,.4)}
.menu-frame{z-index:0;filter:none;border-image:url(/images/senjing/forest-menu-companions.webp) 300 110 520 110 / calc(300 * var(--u)) calc(110 * var(--u)) calc(520 * var(--u)) stretch round}
.menu-close{top:18px;right:18px;background:rgba(254,254,243,.92);box-shadow:0 0 0 1px rgba(35,74,52,.14),0 4px 10px -4px rgba(16,44,30,.3)}
.menu-close:focus,.menu-close:focus-visible{outline:none}
.menu-close:focus-visible{box-shadow:0 0 0 2px #6b8750,0 4px 10px -4px rgba(16,44,30,.3)}
.menu-canvas{display:flex;flex-direction:column;top:calc(118 * var(--u));left:calc(112 * var(--u));right:calc(112 * var(--u));bottom:calc(340 * var(--u));
  padding:0 2px;-webkit-mask-image:none;mask-image:none}
.menu-stack{margin-block:auto;padding-block:8px}
.menu-logo{height:78px;margin:0 auto 14px}
.menu-news{background:rgba(255,255,255,.55)}
@media (max-width:520px){.menu-logo{height:58px;margin-bottom:8px}}
/* 選單 v3.1：安全區避開角色頭部；行距收緊；矮視窗不顯示公告區 */
.menu-canvas{top:calc(112 * var(--u));bottom:calc(415 * var(--u))}
.menu-logo{height:64px;margin-bottom:10px}
.drawer .menu-canvas nav a{padding:6px 6px;gap:12px}
.mi{width:34px;height:34px}.mi svg{width:17px;height:17px}
.mt b{font-size:15.5px;line-height:1.25}.mt small{font-size:10.5px}
.menu-services{margin-top:10px}.menu-services a{padding:9px 8px;font-size:12.5px}
.menu-news{margin-top:10px;padding:8px 12px 2px}
.mn-h{margin-bottom:2px}
#menuNews a{padding:5px 0}
#menuNews span{font-size:12.5px}
@media (max-height:760px){.menu-news{display:none}}
@media (max-width:520px){.menu-logo{height:52px;margin-bottom:6px}.drawer .menu-canvas nav a{padding:5px 4px}.mi{width:30px;height:30px}.mt b{font-size:14.5px}}
/* 選單 v3.2：安全區高於角色髮梢；只有放得下時才顯示公告區 */
.menu-canvas{bottom:calc(480 * var(--u))}
@media (max-height:760px){.menu-news{display:none}}
@media (max-height:900px){.menu-news{display:none}}
@media (max-height:740px){.menu-logo{height:50px;margin-bottom:6px}.drawer .menu-canvas nav a{padding:4px 6px}}

/* 選單 v4：Logo 放大置於上方藤蔓凹處；主選單居中於兩側藤蔓之間；
   服務按鈕移到兩位角色之間的空地，填滿下方並與插圖對稱 */
.menu-canvas{top:calc(70 * var(--u));left:calc(118 * var(--u));right:calc(118 * var(--u));bottom:calc(505 * var(--u))}
.menu-logo{height:auto;width:62%;max-width:250px;margin:0 auto 18px}
.menu-foot{position:absolute;z-index:2;left:calc(285 * var(--u));right:calc(285 * var(--u));bottom:calc(215 * var(--u));
  display:flex;flex-direction:column;gap:8px;margin:0}
.menu-foot a{padding:10px 8px;text-align:center;border-radius:999px;background:rgba(229,236,215,.92);box-shadow:0 6px 14px -10px rgba(16,44,30,.45)}
@media (max-height:740px){.menu-logo{width:52%;height:auto;margin-bottom:8px}}
@media (max-width:520px){.menu-logo{width:56%;height:auto;margin-bottom:8px}.menu-foot a{padding:8px 6px;font-size:12px}.menu-foot{gap:6px}}
/* 選單 v4.1：修正頭重腳輕——主選單行高隨可用高度伸展，填滿 Logo 到角色頭頂之間；
   服務按鈕上移至角色之間的中段，與上方內容連成一體 */
.menu-stack{margin-block:0;height:100%;display:flex;flex-direction:column;padding-block:0}
.menu-logo{flex:none}
.drawer .menu-canvas nav{flex:1;justify-content:space-between;min-height:0}
.drawer .menu-canvas nav a{flex:1 1 0;max-height:74px;min-height:44px}
.menu-news{flex:none}
.menu-foot{bottom:calc(265 * var(--u))}
@media (max-width:520px){.drawer .menu-canvas nav a{max-height:62px}.drawer .menu-canvas nav{justify-content:center}}

/* 頁尾中欄：兩組等量導覽，與左右兩欄上下對齊 */
.f-main{align-items:stretch}
.f-nav{display:grid;grid-template-columns:1fr 1fr;gap:16px;padding:0;align-self:stretch}
.f-nav nav{display:flex;flex-direction:column;gap:0;padding:18px 18px 10px;border-radius:12px;background:rgba(255,255,255,.04);box-shadow:inset 0 0 0 1px rgba(212,221,167,.14)}
.f-nav h4{display:flex;justify-content:space-between;align-items:baseline;margin:0 0 6px;padding-bottom:12px;border-bottom:1px solid rgba(212,221,167,.18)}
.f-nav h4 b{font:700 14px var(--f-body);letter-spacing:.14em;color:#ecd9a1}
.f-nav h4 span{font:600 10px var(--f-num);letter-spacing:.2em;color:rgba(212,221,167,.45)}
.f-nav nav a{display:grid;grid-template-columns:14px 1fr auto 14px;align-items:center;gap:8px;padding:11px 4px;border-bottom:1px dashed rgba(212,221,167,.12);
  white-space:nowrap;text-decoration:none;color:#e3ebdc;font-size:14px;transition:padding .25s,color .25s,background .25s;border-radius:6px}
.f-nav nav a:last-child{border-bottom:0}
.f-nav nav a:hover{padding-left:10px;color:#fff;background:rgba(255,255,255,.05);text-decoration:none}
.fl-dot{font-size:10px;color:#a9bf8a;transition:color .25s}
.f-nav nav a small{font-size:11px;letter-spacing:.06em;color:rgba(212,221,167,.5)}
.f-nav nav a i{font-style:normal;font-size:12px;color:#ecd9a1;opacity:0;transform:translate(-4px,4px);transition:.25s}
.f-nav nav a:hover i{opacity:1;transform:none}
.f-nav nav a:hover .fl-dot{color:#ecd9a1}
@media (max-width:560px){.f-nav{grid-template-columns:1fr}}
.f-nav nav{align-items:stretch}.f-nav h4,.f-nav nav a{width:100%;box-sizing:border-box}
/* 頁尾中欄 v2：回到原站的輕量欄位——無外框、無底色，與左右兩欄同一平面 */
.f-nav{gap:clamp(24px,3vw,48px);padding-top:4px}
.f-nav nav{padding:0;background:none;box-shadow:none;border-radius:0}
.f-nav h4{margin:0 0 10px;padding-bottom:12px;border-bottom:1px solid rgba(212,221,167,.16)}
.f-nav h4 b{font-size:13px;letter-spacing:.18em;color:#d4dda7}
.f-nav h4 span{color:rgba(212,221,167,.35)}
.f-nav nav a{grid-template-columns:1fr auto;gap:10px;padding:9px 0;border-bottom:0;border-radius:0;font-size:14px;color:#e3ebdc}
.f-nav nav a:hover{padding-left:6px;background:none;color:#fff}
.fl-dot,.f-nav nav a small{display:none}
/* 頁尾中欄：整組導覽在中欄內水平置中、相對整列垂直置中 */
.f-nav{align-self:center;justify-self:center;width:min(100%,400px);padding-top:0}
/* 頁尾：左右兩欄依內容收窄，中欄吃剩餘空間並置中 → 視覺上左右留白相等 */
@media (min-width:901px){
  .f-main{grid-template-columns:max-content minmax(0,1fr) minmax(300px,390px)}
  .f-brand{max-width:320px}
}

/* =====================================================================
   帳號註冊頁（原站 /registration 版面：左表單 + 右插畫），套用本站語彙
   ===================================================================== */
.reg-wrap{max-width:calc(var(--content) + var(--gutter) * 2);margin:34px auto 70px;padding-inline:var(--gutter);display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:24px;align-items:stretch}
.reg-card{display:flex;flex-direction:column;gap:22px;padding:clamp(24px,3.4vw,40px);background:#fffef8;border:1px solid #e0e7d7;border-radius:16px}
.reg-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;padding-bottom:18px;border-bottom:1px solid #e3eada}
.reg-head h2{font:800 26px/1.3 var(--f-display)}
.reg-head p{margin-top:6px;font-size:13.5px;color:#70865d}
.reg-step{padding:4px 10px;border-radius:999px;background:#edf2e5;font-size:12px;font-weight:700;color:var(--pine);white-space:nowrap}
.reg-label{display:flex;align-items:center;gap:10px;margin:0 0 12px;padding:0;font:700 14px var(--f-body);letter-spacing:.06em;color:var(--ink)}
.reg-label b{padding:2px 7px;border-radius:5px;background:rgba(196,170,105,.2);font-size:11.5px;color:var(--gold-deep);letter-spacing:.08em}
.reg-vers{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:0;padding:0;border:0}
.reg-vers legend{grid-column:1/-1}
.rv input{position:absolute;opacity:0;pointer-events:none}
.rv-in{position:relative;display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;column-gap:10px;align-items:baseline;padding:16px 18px;border-radius:12px;cursor:pointer;
  background:#f6f8f0;box-shadow:inset 0 0 0 1px #dbe5ce;transition:box-shadow .2s,background .2s}
.rv-in b{grid-row:1/3;font:700 40px/1 var(--f-num);letter-spacing:-.02em;color:var(--pine)}
.rv-in>span{font:700 15px var(--f-body);color:var(--ink)}
.rv-in small{font-size:12px;color:#70865d}
.rv-tag{position:absolute;top:12px;right:12px;font-style:normal;padding:2px 8px;border-radius:5px;background:#e5ecd9;font-size:11px;font-weight:700;color:#4c6b3c}
.rv-in:hover{background:#fff}
.rv input:checked+.rv-in{background:#fff;box-shadow:inset 0 0 0 2px var(--pine),0 14px 26px -20px rgba(23,61,46,.6)}
.rv input:checked+.rv-in .rv-tag{background:var(--pine);color:#f0e2b4}
.rv input:focus-visible+.rv-in{outline:3px solid var(--gold-deep);outline-offset:2px}
.reg-row{display:flex;gap:10px;margin-bottom:10px}
.reg-row:last-child{margin-bottom:0}
.reg-card input:not([type=radio]),.reg-card select{flex:1;min-width:0;height:48px;padding:0 14px;border:1px solid #d4dfc9;border-radius:10px;background:#fff;font:15px var(--f-body);color:#234a34;outline:none;transition:border-color .2s,box-shadow .2s}
.reg-card select{flex:0 0 132px;appearance:auto}
.reg-card input:focus,.reg-card select:focus{border-color:var(--pine);box-shadow:0 0 0 3px rgba(33,77,57,.12)}
.reg-getcode{flex:0 0 132px;height:48px;border:0;border-radius:10px;cursor:pointer;background:#234e38;color:#fffef6;font:600 14px var(--f-body);transition:background .2s}
.reg-getcode:hover:not(:disabled){background:#346447}
.reg-getcode:disabled{background:#e5ecd9;color:#7a8d68;cursor:default}
.pw-meter{display:flex;align-items:center;gap:12px;margin:-2px 2px 12px;font-size:12px;color:#70865d}
.pw-bar{display:flex;gap:4px}
.pw-bar i{width:34px;height:4px;border-radius:2px;background:#e3eada;transition:background .25s}
.pw-meter[data-level="1"] .pw-bar i:nth-child(1){background:#c4553a}
.pw-meter[data-level="2"] .pw-bar i:nth-child(-n+2){background:var(--gold)}
.pw-meter[data-level="3"] .pw-bar i{background:#4f8a55}
.pw-meter[data-level="1"] .pw-text{color:#b4443d}
.reg-msg{margin:0;padding:10px 14px;border-radius:10px;font-size:13.5px;background:#fbeeea;color:#9a3a2c}
.reg-msg[data-kind="ok"]{background:#eaf3e2;color:#2f5a3e}
.reg-submit{width:100%;justify-content:center;min-height:54px;font-size:16px;border-radius:12px;clip-path:none}
.reg-submit:disabled{opacity:.7;transform:none}
.reg-tip{margin:0;text-align:center;font-size:12.5px;line-height:1.8;color:#70865d}
.reg-done{display:flex;flex-direction:column;align-items:center;gap:14px;text-align:center;padding:40px 0}
.reg-done-ic{display:grid;place-items:center;width:64px;height:64px;border-radius:50%;background:var(--pine);color:#f0e2b4;font-size:30px}
.reg-done h2{font:800 26px var(--f-display)}
.reg-done p{font-size:14.5px;line-height:1.8;color:var(--ink-soft)}
.reg-done .btn{clip-path:none;border-radius:12px}
.reg-art{position:relative;display:flex;flex-direction:column;justify-content:flex-end;min-height:520px;border-radius:16px;overflow:hidden;isolation:isolate;color:#fff}
.reg-art img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.reg-art::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,transparent 35%,rgba(15,34,25,.88))}
.reg-art-t{padding:clamp(24px,3vw,36px);display:grid;gap:10px;justify-items:start}
.reg-art-t span{font:600 12px var(--f-body);letter-spacing:.18em;color:var(--gold-hi)}
.reg-art-t h2{font:800 clamp(28px,3vw,38px)/1.25 var(--f-display)}
.reg-art-t p{font-size:13px;color:#c9d6cc}
.reg-art-t .btn{margin-top:6px;--bg:rgba(250,251,246,.94);--fg:var(--ink);clip-path:none;border-radius:10px}
@media (max-width:900px){.reg-wrap{grid-template-columns:1fr}.reg-art{min-height:300px;order:-1}}
@media (max-width:560px){.reg-vers{grid-template-columns:1fr}.reg-card select,.reg-getcode{flex-basis:112px}.reg-row.phone{flex-wrap:wrap}.reg-row.phone select{flex:1 1 100%}}

/* =====================================================================
   浮動服務：客服史萊姆按鈕 + 百科 / 客服面板
   ===================================================================== */
.svc-dock{position:fixed;right:22px;bottom:calc(22px + env(safe-area-inset-bottom,0px));z-index:55;display:flex;flex-direction:column;align-items:flex-end;gap:12px;pointer-events:none}
.svc-dock>*{pointer-events:auto}
.svc-fab{order:2;position:relative;display:flex;flex-direction:column;align-items:center;gap:2px;border:0;background:none;cursor:pointer;padding:0;filter:drop-shadow(0 10px 14px rgba(16,44,30,.3));transition:transform .3s var(--ease)}
.svc-fab img{width:66px;height:auto;animation:bob 4s ease-in-out infinite}
.svc-fab span{padding:3px 10px;border-radius:999px;background:#fffef6;box-shadow:0 0 0 1px rgba(35,74,52,.14);font:700 11.5px var(--f-body);color:var(--pine);letter-spacing:.06em}
.svc-fab:hover{transform:translateY(-3px)}
.svc-fab[aria-expanded="true"] img{animation:none}
.svc-badge{position:absolute;top:2px;right:6px;width:12px;height:12px;border-radius:50%;background:#c4553a;box-shadow:0 0 0 2px #fff}
.svc-panel{order:1;display:flex;flex-direction:column;width:min(380px,calc(100vw - 32px));height:min(560px,calc(100dvh - 150px));border-radius:18px;overflow:hidden;
  background:#fffef8;box-shadow:0 0 0 1px rgba(120,149,92,.22),0 30px 60px -18px rgba(16,44,30,.5);
  opacity:0;transform:translateY(14px) scale(.98);transform-origin:bottom right;transition:opacity .25s var(--ease),transform .3s var(--ease)}
.svc-panel.open{opacity:1;transform:none}
.svc-panel[hidden]{display:none}
.svc-head{display:flex;align-items:center;gap:12px;padding:14px 14px 14px 16px;background:var(--forest);color:#f7faef}
.svc-head div{flex:1;display:grid;gap:1px}
.svc-head b{font:700 15px var(--f-body);letter-spacing:.04em}
.svc-head small{display:flex;align-items:center;gap:6px;font-size:11.5px;color:#c3d2b8}
.svc-av{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:rgba(240,226,180,.16);color:#f0e2b4}
.svc-av svg{width:20px;height:20px}
.svc-av.slime{background:#fffef6}
.svc-av.slime img{width:30px}
.svc-x{display:grid;place-items:center;width:32px;height:32px;border:0;border-radius:8px;cursor:pointer;background:rgba(255,255,255,.08);color:#f7faef}
.svc-x:hover{background:rgba(255,255,255,.16)}
.svc-x svg{width:16px;height:16px}
.dot{width:7px;height:7px;border-radius:50%;background:#9aa68a}
.dot.on{background:#7ccf7a;box-shadow:0 0 0 3px rgba(124,207,122,.25)}
.svc-body{flex:1;overflow-y:auto;padding:16px;display:flex;flex-direction:column;gap:10px;background:linear-gradient(180deg,#f6f8f0,#fffef8 120px)}
.wiki-hello{display:grid;gap:6px;padding:16px;border-radius:14px;background:#fff;box-shadow:inset 0 0 0 1px #e0e7d7}
.wiki-hello[hidden]{display:none}
.wh-t{font:700 15px var(--f-body);color:var(--ink)}
.wiki-hello>p:not(.wh-t){font-size:13px;color:#70865d}
.wiki-quick{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.wiki-quick button{border:0;cursor:pointer;padding:7px 12px;border-radius:999px;background:#edf2e5;font:600 12.5px var(--f-body);color:#234a34;transition:background .2s,color .2s}
.wiki-quick button:hover{background:var(--pine);color:#fff}
.chat-note{margin:0 auto 4px;padding:8px 12px;border-radius:10px;background:#edf2e5;font-size:12.5px;color:#4c6b3c;text-align:center}
.bub{max-width:84%;padding:10px 13px;border-radius:14px;font-size:14px;line-height:1.7;word-break:break-word}
.bub.bot{align-self:flex-start;background:#fff;box-shadow:inset 0 0 0 1px #e0e7d7;color:var(--ink);border-bottom-left-radius:4px}
.bub.me{align-self:flex-end;background:var(--pine);color:#f7faef;border-bottom-right-radius:4px}
.bub.err{background:#fbeeea;box-shadow:none;color:#9a3a2c}
.bub time{display:block;margin-top:2px;font-size:10.5px;opacity:.6;text-align:right}
.bub img{max-width:100%;border-radius:8px}
.typing{display:inline-flex;gap:4px}
.typing i{width:6px;height:6px;border-radius:50%;background:#8fa57f;animation:typing 1s infinite ease-in-out}
.typing i:nth-child(2){animation-delay:.15s}.typing i:nth-child(3){animation-delay:.3s}
@keyframes typing{50%{transform:translateY(-4px);opacity:.5}}
.svc-input{display:flex;align-items:flex-end;gap:8px;padding:12px;border-top:1px solid #e3eada;background:#fffef8}
.svc-input textarea{flex:1;resize:none;max-height:120px;padding:11px 14px;border:1px solid #d4dfc9;border-radius:12px;background:#fff;font:14px/1.5 var(--f-body);color:#234a34;outline:none}
.svc-input textarea:focus{border-color:var(--pine)}
.svc-input button{display:grid;place-items:center;flex:none;width:44px;height:44px;border:0;border-radius:12px;cursor:pointer;background:var(--pine);color:#f0e2b4;transition:background .2s}
.svc-input button:hover{background:#346447}
.svc-input button svg{width:18px;height:18px}
@media (max-width:560px){.svc-dock{right:12px;bottom:calc(12px + env(safe-area-inset-bottom,0px))}.svc-fab img{width:54px}.svc-panel{height:min(520px,calc(100dvh - 130px))}}
/* 史萊姆插圖本身已含「聯絡客服」字樣；頭像只取下半部的史萊姆 */
.svc-fab img{width:76px}
.svc-av.slime{overflow:hidden;align-items:end}
.svc-av.slime img{width:46px;margin-bottom:-4px;transform:translateY(6px)}
.reg-card,.reg-art{min-width:0}.reg-vers{min-inline-size:0}.reg-row>*{min-width:0}
@media (max-width:900px){.reg-art{order:0;min-height:260px}}

/* 全站下拉選單：取消瀏覽器原生外觀（Safari 會疊出灰色外框與錯位箭頭），統一自繪箭頭 */
html body select{-webkit-appearance:none!important;-moz-appearance:none!important;appearance:none!important;
  background-color:#fff;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23214d39' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 12px center;background-size:16px 16px;
  padding-right:38px!important;border:1px solid #d4dfc9;border-radius:10px;box-shadow:none;color:#234a34;cursor:pointer;line-height:1.2}
html body select:hover{border-color:#b9cba6}
html body select:focus{outline:none;border-color:var(--pine);box-shadow:0 0 0 3px rgba(33,77,57,.12)}
html body select::-ms-expand{display:none}
.ver-o select{height:42px;padding-left:12px;border-radius:6px}
.reg-card select,.ver-o select,.select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23214d39' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E")!important;background-repeat:no-repeat!important;background-position:right 12px center!important;background-size:16px 16px!important}

/* =====================================================================
   百科助手：置中大視窗（原站尺寸 900px × 85vh；≥1180px 加左側欄並放寬到 1120px；≤768px 全螢幕）
   ===================================================================== */
body.wiki-open{overflow:hidden}
.wiki-modal{position:fixed;inset:0;z-index:90}
.wiki-modal[hidden]{display:none}
.wiki-scrim{position:absolute;inset:0;background:rgba(15,34,25,.48);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);opacity:0;transition:opacity .3s}
.wiki-box{position:absolute;left:50%;top:50%;display:grid;grid-template-columns:1fr;width:min(900px,calc(100vw - 32px));height:min(85vh,860px);
  border-radius:22px;overflow:hidden;background:#fffef8;box-shadow:0 0 0 1px rgba(120,149,92,.2),0 40px 90px -30px rgba(10,30,20,.7);
  transform:translate(-50%,-48%) scale(.97);opacity:0;transition:transform .35s var(--ease),opacity .3s}
.wiki-modal.open .wiki-scrim{opacity:1}
.wiki-modal.open .wiki-box{transform:translate(-50%,-50%);opacity:1}
.wiki-side{display:none}
.wiki-main{display:flex;flex-direction:column;min-width:0;min-height:0}
.wiki-head{display:flex;align-items:center;gap:14px;padding:18px 22px;background:var(--forest);color:#f7faef}
.wiki-head>div{flex:1;min-width:0}
.wiki-head h3{display:flex;align-items:center;gap:8px;font:700 17px var(--f-body);letter-spacing:.04em}
.wiki-head small{font-size:12px;color:#c3d2b8;letter-spacing:.06em}
.wiki-av{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;background:linear-gradient(140deg,var(--gold-hi),var(--gold));color:var(--night);font-size:20px}
.wiki-badge{padding:1px 7px;border-radius:5px;background:rgba(240,226,180,.18);color:var(--gold-hi);font:700 10.5px var(--f-num);letter-spacing:.1em}
.wiki-hbtn{display:grid;place-items:center;height:36px;min-width:36px;padding:0 12px;border:0;border-radius:9px;cursor:pointer;background:rgba(255,255,255,.08);color:#f7faef;font:600 13px var(--f-body)}
.wiki-hbtn:hover{background:rgba(255,255,255,.16)}
.wiki-hbtn.x{padding:0}.wiki-hbtn svg{width:16px;height:16px}
.wiki-msgs{flex:1;min-height:0;overflow-y:auto;padding:26px clamp(18px,4vw,40px);display:flex;flex-direction:column;gap:18px;background:linear-gradient(180deg,#f4f7ee,#fffef8 220px);scroll-behavior:smooth}
.wiki-hello{margin:auto;display:flex;flex-direction:column;align-items:center;text-align:center;width:100%;max-width:520px;padding:24px 8px;background:transparent;border-radius:0;box-shadow:none}
.wiki-hello[hidden]{display:none}
.wh-icon{display:grid;place-items:center;width:48px;height:48px;margin-bottom:12px;border-radius:0;background:transparent;color:var(--gold-deep);font-size:36px;box-shadow:none}
.wh-t{font:800 22px/1.4 var(--f-display);color:var(--ink)}
.wh-s{margin:6px 0 26px;font-size:14.5px;color:#70865d}
.wiki-quick{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:0;width:100%}
.wiki-quick button{min-height:44px;padding:10px 12px;border:1px solid transparent;border-radius:6px;cursor:pointer;background:#edf2e5;font:600 13.5px var(--f-body);color:#234a34;transition:background .2s,color .2s,border-color .2s}
.wiki-quick button:hover{background:#e2ead8;border-color:#becdb1;color:var(--pine)}
.wiki-quick button:focus-visible{outline:2px solid var(--pine);outline-offset:3px}
@media(max-width:520px){.wiki-quick{grid-template-columns:repeat(2,minmax(0,1fr))}.wiki-hello{padding:16px 0}.wh-t{font-size:20px}}
.wmsg{display:flex;gap:12px;align-items:flex-start;max-width:100%}
.wmsg.user{justify-content:flex-end}
.wmsg-av{flex:none;display:grid;place-items:center;width:32px;height:32px;border-radius:10px;background:var(--forest);color:var(--gold-hi);font-size:15px}
.wmsg-b{min-width:0;max-width:min(680px,86%);padding:13px 17px;border-radius:16px;font-size:14.5px;line-height:1.75;word-break:break-word}
.wmsg.user .wmsg-b{background:var(--pine);color:#f7faef;border-bottom-right-radius:4px}
.wmsg.assistant .wmsg-b{background:#fff;color:var(--ink);box-shadow:inset 0 0 0 1px #e0e7d7;border-top-left-radius:4px}
.wmsg.err .wmsg-b{background:#fbeeea;box-shadow:none;color:#9a3a2c}
.wmsg-b>:first-child{margin-top:0}.wmsg-b>:last-child{margin-bottom:0}
.wmsg-b p{margin:.6em 0}
.wmsg-b h3,.wmsg-b h4,.wmsg-b h5,.wmsg-b h6{margin:1.1em 0 .5em;font:700 15.5px/1.45 var(--f-body);color:var(--pine)}
.wmsg-b h3{font-size:16.5px}
.wmsg-b strong{color:var(--pine);font-weight:700;background:linear-gradient(transparent 62%,rgba(236,217,161,.6) 62%)}
.wmsg.user .wmsg-b strong{color:inherit;background:none}
.wmsg-b ul,.wmsg-b ol{margin:.6em 0;padding-left:1.3em}
.wmsg-b li{margin:.3em 0}
.wmsg-b li::marker{color:var(--gold-deep);font-weight:700}
.wmsg-b code{padding:1px 6px;border-radius:5px;background:#edf2e5;font-size:.9em;color:#4c6b3c}
.wmsg-b a{color:var(--pine);font-weight:600;text-underline-offset:3px}
.wmsg-b hr{border:0;height:1px;margin:1.2em 0;background:linear-gradient(90deg,transparent,#dbe5ce,transparent)}
.md-table{max-width:100%;overflow-x:auto;margin:.8em 0;border-radius:10px;box-shadow:inset 0 0 0 1px #e0e7d7}
.md-table table{width:max-content;min-width:100%;border-collapse:collapse;font-size:13.5px}
.md-table th{padding:9px 12px;text-align:left;white-space:nowrap;background:#edf2e5;color:var(--pine);font-weight:700}
.md-table td{padding:9px 12px;border-top:1px solid #e3eada;vertical-align:top;min-width:70px}
.md-table tbody tr:nth-child(even){background:#f8faf4}
.wsrc{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px;padding-top:10px;border-top:1px dashed #dbe5ce}
.wsrc span{padding:3px 9px;border-radius:999px;background:#edf2e5;font-size:11.5px;color:#4c6b3c}
.wiki-input{display:flex;align-items:flex-end;gap:10px;padding:16px clamp(16px,3vw,24px) 18px;border-top:1px solid #e3eada;background:#fffef8}
.wiki-input textarea{flex:1;resize:none;max-height:140px;padding:13px 16px;border:1px solid #d4dfc9;border-radius:14px;background:#fff;font:14.5px/1.5 var(--f-body);color:#234a34;outline:none;transition:border-color .2s,box-shadow .2s}
.wiki-input textarea:focus{border-color:var(--pine);box-shadow:0 0 0 3px rgba(33,77,57,.12)}
.wiki-input .btn{flex:none;min-height:48px;padding:0 20px;border-radius:14px;clip-path:none;gap:8px}
.wiki-input .btn svg{width:17px;height:17px}
.wiki-modal.busy .wiki-input .btn{opacity:.6;pointer-events:none}

@media (min-width:1180px){
  .wiki-box{grid-template-columns:270px minmax(0,1fr);width:min(1120px,calc(100vw - 64px))}
  .wiki-side{display:flex;flex-direction:column;gap:6px;padding:24px 18px;background:#eef3e6;border-right:1px solid #e0e7d7;overflow-y:auto}
  .wiki-logo{width:170px;margin:0 auto 18px}
  .ws-h{margin:14px 6px 6px;font:700 12px var(--f-body);letter-spacing:.18em;color:#6b8750}
  .ws-list{display:grid;gap:2px}
  .ws-list button{display:flex;align-items:center;gap:10px;width:100%;padding:10px 12px;border:0;border-radius:10px;cursor:pointer;background:none;text-align:left;
    font:600 13.5px var(--f-body);color:#234a34;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:background .2s}
  .ws-list button i{flex:none;font-style:normal;color:var(--gold-deep)}
  .ws-list button:hover{background:#fff}
  .ws-recent button{font-weight:500;color:var(--ink-soft)}
  .ws-empty{padding:8px 12px;font-size:12.5px;color:#8a9b7c}
  .ws-foot{margin-top:auto;padding:12px 8px 0;font-size:11.5px;line-height:1.7;color:#8a9b7c}
}
@media (max-width:768px){
  .wiki-box{left:0;top:0;width:100vw;height:100dvh;border-radius:0;transform:translateY(20px)}
  .wiki-modal.open .wiki-box{transform:none}
  .wiki-head{padding:14px 16px;padding-top:calc(14px + env(safe-area-inset-top,0px))}
  .wiki-msgs{padding:18px 14px}
  .wmsg-b{max-width:88%;font-size:14px;padding:11px 14px}
  .wmsg-av{display:none}
  .wiki-input{padding:12px 12px calc(14px + env(safe-area-inset-bottom,0px))}
  .wiki-input .btn span{display:none}.wiki-input .btn{padding:0 14px}
}
/* 百科側欄：收合 / 展開 */
.wiki-box{transition:transform .35s var(--ease),opacity .3s,grid-template-columns .35s var(--ease),width .35s var(--ease)}
.side-t svg{width:18px;height:18px}
.side-t .arr{transition:transform .3s var(--ease);transform-origin:14.5px 12px}
.side-t[aria-expanded="false"] .arr{transform:scaleX(-1)}
.wiki-side{min-width:0}
@media (min-width:1180px){
  .wiki-box.side-collapsed{grid-template-columns:0 minmax(0,1fr);width:min(960px,calc(100vw - 64px))}
  .wiki-box.side-collapsed .wiki-side{padding-inline:0;border-right:0;overflow:hidden;opacity:0;visibility:hidden}
  .wiki-side{transition:opacity .25s,padding .35s var(--ease)}
}
@media (max-width:1179px){
  .wiki-side{position:absolute;z-index:3;top:0;bottom:0;left:0;width:min(280px,82%);display:flex;flex-direction:column;gap:6px;padding:24px 18px;
    background:#eef3e6;box-shadow:20px 0 40px -20px rgba(15,34,25,.45);overflow-y:auto;transform:translateX(-105%);transition:transform .35s var(--ease);visibility:hidden}
  .wiki-box.side-drawer .wiki-side{transform:none;visibility:visible}
  .wiki-box.side-drawer .wiki-main::after{content:"";position:absolute;inset:0;z-index:2;background:rgba(15,34,25,.25)}
  .wiki-main{position:relative}
  .wiki-logo{width:150px;margin:0 auto 14px}
  .ws-h{margin:14px 6px 6px;font:700 12px var(--f-body);letter-spacing:.18em;color:#6b8750}
  .ws-list{display:grid;gap:2px}
  .ws-list button{display:flex;align-items:center;gap:10px;width:100%;padding:10px 12px;border:0;border-radius:10px;cursor:pointer;background:none;text-align:left;font:600 13.5px var(--f-body);color:#234a34;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .ws-list button i{flex:none;font-style:normal;color:var(--gold-deep)}
  .ws-list button:hover{background:#fff}
  .ws-empty{padding:8px 12px;font-size:12.5px;color:#8a9b7c}
  .ws-foot{margin-top:auto;padding:12px 8px 0;font-size:11.5px;line-height:1.7;color:#8a9b7c}
}
.wiki-side{position:relative}
.ws-close{position:absolute;top:14px;right:12px;display:grid;place-items:center;width:30px;height:30px;border:0;border-radius:8px;cursor:pointer;background:rgba(255,255,255,.6);color:#3b603f;transition:background .2s}
.ws-close:hover{background:#fff}
.ws-close svg{width:16px;height:16px}
@media (max-width:1179px){.wiki-side{position:absolute}}

/* 搜尋工具列：公告 / 攻略 共用同一樣式，且不再吸頂（不跟著捲動覆蓋內容） */
.tools{position:static!important;top:auto;margin-bottom:28px;padding:16px;border-radius:14px;background:#fff;box-shadow:0 0 0 1px #e0e7d7}
.tools .mine-o{min-height:46px;border-radius:10px}
.cat-o .tools{margin-bottom:26px}
.cat-o .tools .count{margin-left:auto}
.tools .count{margin-left:auto}

/* 選單 v5：
   1) 藤蔓框改為整張插圖等比例鋪滿（面板鎖定 1:2 比例），消除左上的切片接縫、不變形
   2) 選項分隔線改為直線細線（原本圓角＋底線會出現彎曲的弧線） */
.drawer-panel{--mw:min(450px,calc(100vw - 24px),calc((100dvh - 36px) / 2));width:var(--mw);height:calc(var(--mw) * 2);max-height:none;
  background:#fefef3 url(/images/senjing/forest-menu-companions.webp) center/100% 100% no-repeat}
.menu-frame{display:none}
.drawer .menu-canvas nav a{position:relative;border-bottom:0;border-radius:10px}
.drawer .menu-canvas nav a+a::before{content:"";position:absolute;left:56px;right:8px;top:0;height:1px;background:rgba(120,149,92,.2);pointer-events:none}
.drawer .menu-canvas nav a:hover::before,.drawer .menu-canvas nav a:hover+a::before{opacity:0}
.drawer .menu-canvas nav a{max-height:64px}
.menu-news{box-shadow:none;border:1px solid rgba(120,149,92,.18);background:rgba(255,255,255,.6)}
.menu-foot a{box-shadow:none;border:1px solid rgba(120,149,92,.22)}
@media (max-width:520px){.drawer-panel{top:12px;left:12px;--mw:min(450px,calc(100vw - 24px),calc((100dvh - 24px) / 2))}}
.drawer .menu-canvas nav{justify-content:center}.drawer .menu-canvas nav a{max-height:60px}.menu-stack{justify-content:center}

/* =====================================================================
   客服史萊姆動畫（內嵌 SVG，取代舊的整張動圖 + 外層 bob 疊加）
   ===================================================================== */
.svc-fab{filter:drop-shadow(0 10px 12px rgba(16,44,30,.22))}
.svc-fab img{display:none}
.slm{display:block;width:84px;height:auto;overflow:visible}
.slm *{transform-box:view-box}
.slm-say{fill:#254936;font:600 17px "Noto Sans TC","PingFang TC",sans-serif;letter-spacing:1px}
.slm-shadow{fill:#214d39;opacity:.2;transform-origin:60px 102px}
.slm-body{transform-origin:60px 99px;animation:slmBreath 3.4s cubic-bezier(.45,0,.55,1) infinite}
.slm-hop{transform-origin:60px 99px}
.slm-bubble{transform-origin:62px 55px;animation:slmFloat 4.2s ease-in-out infinite}
.slm-shine{animation:slmShine 3.4s ease-in-out infinite}
.slm-glint{transform-origin:80px 34px;animation:slmGlint 3.4s ease-in-out infinite}
.slm-bub{animation:slmRise 5s ease-in infinite}
.slm-bub.b2{animation-delay:2.4s;animation-duration:4.2s}
.slm-eyes{transform-origin:60px 59px}
.slm-happy{opacity:0;transition:opacity .2s}
.slm-mouth{transform-origin:60px 76px;transition:transform .3s cubic-bezier(.3,1.6,.5,1)}
.slm-blush{transition:opacity .3s}

/* 待機呼吸：橫向微脹、縱向微縮，像果凍 */
@keyframes slmBreath{0%,100%{transform:scale(1,1)}50%{transform:scale(1.025,.972)}}
@keyframes slmFloat{0%,100%{transform:translateY(0) rotate(-.6deg)}50%{transform:translateY(-2.5px) rotate(.6deg)}}
@keyframes slmShine{0%,100%{opacity:.85;transform:translate(0,0)}50%{opacity:1;transform:translate(1.5px,1px)}}
@keyframes slmGlint{0%,100%{opacity:.8}50%{opacity:.45}}
@keyframes slmRise{0%{transform:translateY(0);opacity:0}15%{opacity:.75}100%{transform:translateY(-38px);opacity:0}}

/* 起跳：預備下蹲 → 拉長騰空 → 落地壓扁 → 阻尼回彈 */
.slm.do-hop .slm-hop{animation:slmHop 1.05s cubic-bezier(.3,0,.3,1)}
.slm.do-hop .slm-shadow{animation:slmShade 1.05s cubic-bezier(.3,0,.3,1)}
.slm.do-hop .slm-bubble{animation:slmPop 1.05s ease-out}
@keyframes slmHop{
  0%{transform:translateY(0) scale(1,1)}
  16%{transform:translateY(3px) scale(1.14,.84)}
  34%{transform:translateY(-22px) scale(.88,1.14)}
  50%{transform:translateY(-26px) scale(.96,1.04)}
  66%{transform:translateY(2px) scale(1.18,.82)}
  76%{transform:translateY(0) scale(.92,1.08)}
  86%{transform:translateY(0) scale(1.05,.95)}
  94%{transform:translateY(0) scale(.98,1.02)}
  100%{transform:translateY(0) scale(1,1)}}
@keyframes slmShade{0%,100%{transform:scale(1);opacity:.2}16%{transform:scale(1.1);opacity:.24}42%{transform:scale(.62);opacity:.08}66%{transform:scale(1.15);opacity:.26}}
@keyframes slmPop{0%,30%{transform:translateY(0) scale(1)}46%{transform:translateY(-5px) scale(1.07) rotate(-2deg)}62%{transform:translateY(0) scale(.97) rotate(1deg)}78%,100%{transform:translateY(0) scale(1)}}

/* 眨眼（偶爾連眨兩下） */
.slm.do-blink .slm-eyes{animation:slmBlink .38s ease-in-out}
.slm.do-blink2 .slm-eyes{animation:slmBlink2 .42s ease-in-out}
@keyframes slmBlink{0%,100%{transform:scaleY(1)}45%,55%{transform:scaleY(.1)}}
@keyframes slmBlink2{0%,100%{transform:scaleY(1)}20%,30%{transform:scaleY(.1)}50%{transform:scaleY(1)}70%,80%{transform:scaleY(.1)}}

/* 滑入：探頭長高、嘴巴張大；按下：壓扁；放開：彈回 */
.slm.is-hover .slm-hop{transform:translateY(-3px) scale(.97,1.05);transition:transform .35s cubic-bezier(.3,1.6,.5,1)}
.slm .slm-hop{transition:transform .35s cubic-bezier(.3,1.6,.5,1)}
.slm.is-hover .slm-mouth{transform:scale(1.15,1.3)}
.slm.is-hover .slm-bubble{animation-duration:1.6s}
.slm.is-press .slm-hop{transform:translateY(3px) scale(1.16,.82);transition-duration:.12s}
.slm.do-boing .slm-hop{animation:slmBoing .7s cubic-bezier(.3,0,.3,1)}
@keyframes slmBoing{0%{transform:translateY(3px) scale(1.16,.82)}30%{transform:translateY(-6px) scale(.9,1.12)}55%{transform:scale(1.06,.94)}75%{transform:scale(.98,1.03)}100%{transform:scale(1,1)}}

/* 面板開啟：瞇眼微笑、臉頰更紅、對話泡泡改字 */
.slm.is-open .slm-eyes{opacity:0}
.slm.is-open .slm-happy{opacity:1}
.slm.is-open .slm-blush{opacity:.85}
/* 有新訊息：連續小跳 + 泡泡搖晃 */
.slm.is-alert .slm-hop{animation:slmExcite .62s cubic-bezier(.3,0,.3,1) infinite}
.slm.is-alert .slm-bubble{animation:slmWiggle .62s ease-in-out infinite}
@keyframes slmExcite{0%,100%{transform:translateY(0) scale(1.06,.94)}45%{transform:translateY(-9px) scale(.94,1.07)}}
@keyframes slmWiggle{0%,100%{transform:rotate(-3deg)}50%{transform:rotate(3deg) translateY(-2px)}}

@media (max-width:560px){.slm{width:70px}}
@media (prefers-reduced-motion:reduce){.slm *{animation:none!important;transition:none!important}}
/* 高光保留 SVG 自身的旋轉（不設 transform-origin，否則會被移到嘴邊）；跳躍高度降低，不碰到對話泡泡 */
.slm-glint{transform-origin:0 0}
@keyframes slmHop{
  0%{transform:translateY(0) scale(1,1)}
  16%{transform:translateY(3px) scale(1.14,.84)}
  34%{transform:translateY(-12px) scale(.9,1.12)}
  50%{transform:translateY(-14px) scale(.97,1.03)}
  66%{transform:translateY(2px) scale(1.16,.84)}
  76%{transform:translateY(0) scale(.93,1.07)}
  86%{transform:translateY(0) scale(1.04,.96)}
  94%{transform:translateY(0) scale(.99,1.01)}
  100%{transform:translateY(0) scale(1,1)}}
@keyframes slmPop{0%,26%{transform:translateY(0) scale(1)}42%{transform:translateY(-6px) scale(1.06) rotate(-2deg)}60%{transform:translateY(0) scale(.98) rotate(1deg)}76%,100%{transform:translateY(0) scale(1)}}
/* 客服頭像：只用史萊姆本體（不含「聯絡客服」對話泡泡），置中於圓形頭像內 */
.svc-av.slime{width:42px;height:42px;padding:0;overflow:hidden;align-items:center;background:radial-gradient(circle at 50% 35%,#fffef6,#e9f3e0);box-shadow:0 0 0 2px rgba(240,226,180,.5)}
.svc-av.slime svg{width:40px;height:40px;transform:none;margin:0}
/* 首屏底欄圖示 */
.hero-bar .hb-ic{width:15px;height:15px;flex:none;filter:drop-shadow(0 1px 3px rgba(23,59,38,.6))}
.ticker b{display:inline-flex;align-items:center;gap:7px}
.hero-bar .links a{gap:7px}
@media (max-width:900px){.hero-bar{display:none}}
/* 後台原文的 flex 版面（如屬性標籤列）允許換行，避免撐破閱讀區 */
.prose [style*="display: flex"],.prose [style*="display:flex"]{flex-wrap:wrap;gap:8px}
.prose [style*="display: flex"]>*,.prose [style*="display:flex"]>*{min-width:0}
.prose{overflow-wrap:anywhere}
.prose img,.prose video{max-width:100%;height:auto}
/* 手機：頂部 Logo 必須在頁面正中，才能對齊橫幅缺口 */
@media (max-width:820px){.header-row{grid-template-columns:1fr auto 1fr}.header-row .header-right{justify-content:flex-end}}
/* 百科標題：手機不換行 */
@media (max-width:768px){.wiki-head{gap:10px;padding-inline:12px}.wiki-head h3{font-size:15.5px;white-space:nowrap}.wiki-head small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.wiki-av{width:36px;height:36px;font-size:17px;border-radius:10px}.wiki-hbtn{height:34px;min-width:34px;padding:0 10px}}
@media (max-width:400px){.wiki-head small{display:none}}
/* 內文結尾（沿用原站樣式）：細線 + ✧ + 一句話 + 返回連結，不再額外放下載按鈕 */
.article-end{max-width:960px;margin:48px auto 0;padding-top:40px;border-top:1px solid #e3eada;text-align:center;display:grid;justify-items:center;gap:12px}
.ae-mark{font-size:16px;color:#8fa57f}
.article-end p{font-size:14.5px;letter-spacing:.06em;color:#70865d}
.ae-links{display:flex;align-items:center;gap:18px;flex-wrap:wrap;justify-content:center}
.ae-links a{font-size:14px;color:#4c6b3c;text-decoration:none}
.ae-links a:hover{color:var(--pine);text-decoration:underline;text-underline-offset:4px}
.ae-fav{display:inline-flex;align-items:center;gap:6px;border:0;background:none;padding:0;cursor:pointer;font:500 14px var(--f-body);color:#4c6b3c;--bg:none;min-height:0;clip-path:none}
.ae-fav svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:2}
.ae-fav.on{color:var(--gold-deep)}.ae-fav.on svg{fill:currentColor}
.ae-fav:hover{color:var(--pine)}
.ae-fav::after{display:none}
/* 手機閱讀：內文卡片幾乎貼齊螢幕，壓縮後台原文自帶的大內距與縮排，讓每行能放更多字 */
@media (max-width:700px){
  body:has(.reading.wide) .wrap{padding-inline:8px}
  .reading.wide{margin-top:-32px}
  .reading.wide .paper{padding:20px 14px 28px;border-radius:14px}
  .reading.wide .prose{font-size:15.5px;line-height:1.85}
  .reading.wide .prose [style*="padding"]{padding-left:12px!important;padding-right:12px!important}
  .reading.wide .prose [style*="margin-left"],.reading.wide .prose [style*="margin-right"]{margin-left:0!important;margin-right:0!important}
  .reading.wide .prose [style*="text-indent"]{text-indent:0!important}
  .reading.wide .prose [style*="max-width"]{max-width:100%!important}
  .reading.wide .prose h2{margin:1.4em 0 .6em;padding-left:.6em}
  .toc-card{padding:16px 12px 12px}.toc-card .toc{grid-template-columns:1fr}
  .related-row{padding-inline:6px}
}
.article-end{padding-bottom:4px}
/* 結尾語：細線 → ✧ 與 文案 → 上下篇卡片，上下等距 */
.article-end{margin-top:48px;padding:32px 0;gap:10px}
.reading.wide .article-end+.pager{margin-top:0}
.ae-mark{line-height:1}
.article-end p{margin:0;line-height:1.6}

/* =====================================================================
   文章內容統一樣式（normalizeProse 轉換後的 class）
   ===================================================================== */
.prose{--pc-green:#2f6b4f;--pc-blue:#2d6a8a;--pc-gold:#946719;--pc-red:#b4443d}
.prose .pc-green{color:var(--pc-green)}
.prose .pc-blue{color:var(--pc-blue)}
.prose .pc-gold{color:var(--pc-gold)}
.prose .pc-red{color:var(--pc-red)}
.prose .pc-strong{color:var(--ink)}
.prose strong.pc-blue,.prose b.pc-blue,.prose span.pc-blue{font-weight:700}
.prose .pc-center{text-align:center}
.prose .pc-title{border-left:0;padding-left:0;margin-top:0;text-align:center;font-size:clamp(22px,2.4vw,28px)}
.prose .pc-center>p{color:var(--ink-soft)}

/* 底色區塊 */
.prose .pc-box{margin:14px 0;padding:16px 18px;border-radius:12px;background:var(--moss);box-shadow:inset 0 0 0 1px #e0e7d7}
.prose .pc-box>:first-child{margin-top:0}.prose .pc-box>:last-child{margin-bottom:0}
/* 左側色條提示 */
.prose .pc-note{margin:14px 0;padding:14px 18px;border-radius:0 12px 12px 0;background:var(--moss);border-left:4px solid var(--acc,var(--pc-green))}
.prose .pc-note>:last-child{margin-bottom:0}
/* 上緣色條卡片 */
.prose .pc-card{position:relative;padding:20px 20px 18px;border-radius:14px;background:#fff;box-shadow:inset 0 0 0 1px #e0e7d7;border-top:4px solid var(--acc,var(--pc-green));margin:0}
.prose .pc-card h3,.prose .pc-card h4{margin:10px 0 8px;font-size:18px;color:var(--ink)}
.prose .pc-card ul{list-style:none;padding:0;margin:0}
.prose .pc-card li{position:relative;padding-left:16px;margin:6px 0;font-size:14.5px;color:var(--ink-soft)}
.prose .pc-card li::before{content:"";position:absolute;left:2px;top:.75em;width:6px;height:6px;border-radius:50%;background:var(--acc,var(--pc-green))}
/* 卡片網格 / 橫列 */
.prose .pc-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;margin:18px 0}
.prose .pc-grid>.pc-box{margin:0}
.prose .pc-row{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;margin:8px 0}
.prose .pc-row>*{margin:0}
/* 標籤 */
.prose .pc-tag,.prose .pc-chip{display:inline-flex;align-items:center;gap:4px;width:auto;padding:3px 11px;border-radius:999px;font-size:12.5px;font-weight:700;line-height:1.6;
  background:#fff;box-shadow:inset 0 0 0 1px currentColor;color:var(--pc-green)}
.prose .pc-chip{box-shadow:none;background:var(--moss);color:var(--ink)}
.prose .pc-tag.pc-blue{color:var(--pc-blue)}.prose .pc-tag.pc-gold{color:var(--pc-gold)}.prose .pc-tag.pc-red{color:var(--pc-red)}
/* 表格與清單（去除內嵌後統一） */
.prose table{border-collapse:collapse;width:100%}
.prose ul,.prose ol{padding-left:1.3em}
.prose li::marker{color:var(--gold-deep)}
@media (max-width:700px){.prose .pc-grid{grid-template-columns:1fr}.prose .pc-box,.prose .pc-note{padding:14px}}
/* 卡片內「圖示 + 標籤」橫列：圖示方塊 + 膠囊標籤 */
.prose .pc-card .pc-row>.pc-box{display:grid;place-items:center;width:44px;height:44px;padding:0;margin:0;border-radius:12px;font-size:22px}
.prose .pc-card .pc-tag{color:var(--acc,var(--pc-green))}

/* =====================================================================
   手機頁尾：品牌置中 → 兩欄導覽並排 → 橫向邀請卡 → 底列；整體緊湊
   ===================================================================== */
@media (max-width:700px){
  .footer{padding:44px 18px 18px;margin-bottom:12px}
  .f-main{display:grid;grid-template-columns:1fr;gap:26px}
  .f-brand{display:grid;justify-items:center;text-align:center;grid-column:auto}
  .f-brand .logo{width:190px;margin:0 auto}
  .f-brand p{margin:10px 0 0;font-size:12.5px;line-height:1.8}
  .f-top{display:none}
  .f-nav{grid-template-columns:1fr 1fr;gap:12px;width:100%;padding:16px 0 4px;border-top:1px solid rgba(174,191,140,.2);justify-self:stretch}
  .f-nav h4{margin:0 0 4px;padding-bottom:8px}
  .f-nav h4 span{display:none}
  .f-nav nav a{padding:8px 0;font-size:13.5px}
  .f-nav nav a i{display:none}
  .f-invite{display:grid;grid-template-columns:96px 1fr;align-items:stretch;min-height:0;border-radius:12px;grid-column:auto}
  .f-invite img{width:96px;height:100%;min-height:88px;object-fit:cover}
  .f-invite>div{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:8px;padding:12px 14px}
  .f-invite p{font-size:13px}
  .f-invite .btn{min-height:34px;padding:.4em 1em;font-size:12.5px}
  .f-bottom{margin-top:22px;padding-top:14px;flex-direction:column;align-items:center;gap:4px;text-align:center}
  .f-bottom b{font-size:20px}
  .f-bottom span{font-size:11.5px}
}
/* 捲到頁尾時，浮動目錄鈕讓位，不壓住頁尾內容 */
body.at-footer .toc-float{opacity:0;transform:translate(-50%,24px);pointer-events:none}

/* 公告与攻略共用分页到页尾的间距，避免公告叠加通用 section 底部留白。 */
body[data-route="articles"] main > .section { padding-bottom: 0; }
body[data-route="guides"] .cat-o-wrap { margin-bottom: 0; }
body[data-route="articles"] .footer,
body[data-route="guides"] .footer { margin-top: clamp(64px, 6vw, 96px); }
body[data-route="articles"] .pager-o,
body[data-route="guides"] .pager-o { align-items: center; flex-wrap: wrap; padding: 0; margin-bottom: 0; }

/* 公告与攻略详情共用标题尺度，覆盖正文导入时残留的内联字号。 */
body:is([data-route="article"], [data-route="guide"]) .detail-grid h1 {
  font-size: clamp(34px, 5vw, 60px);
}
body:is([data-route="article"], [data-route="guide"]) .prose :is(h1, h2) {
  font-size: clamp(21px, 2.4vw, 26px) !important;
}
body:is([data-route="article"], [data-route="guide"]) .prose h3 { font-size: 19px !important; }
body:is([data-route="article"], [data-route="guide"]) .prose h4 { font-size: 17px !important; }
body:is([data-route="article"], [data-route="guide"]) .prose :is(h1, h2, h3, h4) * {
  font-size: inherit !important;
}

/* 自定义正文保留居中标题语义和弹性卡片的移动端收缩。 */
.prose :is(h1,h2)[style*="justify-content: center"],
.prose [style*="text-align: center"] > :is(h1,h2),
.prose :is(h1,h2)[style*="text-align: center"] { border-left: 0; padding-left: 0; }
.prose div[style*="flex:"] { max-width: 100%; box-sizing: border-box; }

/* 已确认效果稿：米白插画菜单，图文分别渲染，保留原始 Logo。 */
.drawer{transition:visibility 0s .48s}.drawer.open{transition-delay:0s}
.drawer .forest-menu{left:var(--menu-left,16px);top:var(--menu-top,16px);width:min(840px,calc(100vw - 32px));height:min(765px,calc(100dvh - 32px));max-height:calc(100dvh - 32px);display:block;padding:0;border:0;border-radius:8px 0 8px 0;overflow:auto;background:#fafaf1 url('/images/senjing/menu-approved-background.webp') center/100% 100% no-repeat;transform:none;box-shadow:0 20px 65px #102c3035;clip-path:polygon(var(--menu-x,0px) var(--menu-y,0px),calc(var(--menu-x,0px) + 32px) var(--menu-y,0px),calc(var(--menu-x,0px) + 44px) calc(var(--menu-y,0px) + 12px),calc(var(--menu-x,0px) + 44px) calc(var(--menu-y,0px) + 44px),calc(var(--menu-x,0px) + 12px) calc(var(--menu-y,0px) + 44px),var(--menu-x,0px) calc(var(--menu-y,0px) + 32px));transition:clip-path .48s cubic-bezier(.22,1,.36,1)}
.drawer.open .forest-menu{clip-path:polygon(0 0,calc(100% - 28px) 0,100% 28px,100% 100%,28px 100%,0 calc(100% - 28px))}
.drawer .forest-menu:before,.drawer .forest-menu:after{display:none}
.forest-menu-content{min-height:100%;padding:46px 46px 24px;display:flex;flex-direction:column}
.forest-menu-brand{display:grid;place-items:center;width:47%;max-width:none;margin:0 0 42px}.forest-menu-brand img{display:block;width:250px;max-width:90%;height:auto;object-fit:contain}
.drawer .forest-menu nav{display:flex;flex-direction:column;gap:0;width:47%;margin:0;flex:none}
.drawer .forest-menu nav a{display:flex;align-items:center;gap:22px;min-height:76px;width:100%;margin:0;padding:12px 10px;border:0;border-bottom:1px solid #6b805b40;border-radius:0;background:none;color:#204d3a;text-decoration:none;box-shadow:none}
.drawer .forest-menu nav a:last-child{border-bottom:0}.drawer .forest-menu nav a:after{display:none}
.drawer .forest-menu nav .mi{display:grid;place-items:center;width:32px;height:32px;flex:none;background:none;border:0;border-radius:0;color:#637b50}.forest-menu nav .mi svg{width:30px;height:30px}
.forest-menu nav .mt{display:flex;flex-direction:column;gap:5px;flex:1}.forest-menu nav .mt b{font:600 22px/1.25 var(--f-display);color:inherit;letter-spacing:.02em;white-space:nowrap}.forest-menu nav .mt small{font:400 13px/1.4 var(--f-body);color:#71815a}.forest-menu nav .ma{font-size:24px;color:#9d782d}
.drawer .forest-menu nav a:hover{background:#e5ecd755;color:#234e39}.forest-menu a:focus-visible{outline:2px solid #98752d;outline-offset:3px}
.drawer .forest-menu-news{display:flex;align-items:center;gap:20px;width:83%;margin:14px 0 0;padding:17px 4px;border:0;border-top:1px solid #6b805b40;border-bottom:1px solid #6b805b40;border-radius:0;background:none;font-size:13px}
.forest-news-label{white-space:nowrap;color:#234e39;font-weight:600}.forest-menu #menuNews{min-width:0}.forest-menu #menuNews a{display:block;padding:0;border:0;text-decoration:none}.forest-menu #menuNews time{display:none}.forest-menu #menuNews span{font:400 12px/1.7 var(--f-body);color:#4b6551;white-space:normal}
.forest-menu-services{position:static;display:flex;gap:0;margin:0;padding:20px 4px 0;background:none}.forest-menu-services a{display:flex;align-items:center;gap:20px;border:0;border-radius:0;padding:0 24px;color:#254f38;font-size:13px;font-weight:500;background:none;box-shadow:none;text-decoration:none}.forest-menu-services a:first-child{padding-left:0;border-right:1px solid #6b805b40}.forest-menu-services span{font-size:21px;color:#9d782d}
.drawer .forest-menu .menu-close{top:22px;right:22px;width:38px;height:38px;border:0;border-radius:50%;background:#fafbf6;box-shadow:none}
@media(max-width:600px){.drawer .forest-menu{background-size:auto 100%;background-position:42% center}.forest-menu-content{padding:28px 22px 22px;background:linear-gradient(90deg,#fafaf1e8,#fafaf1c9 65%,#fafaf130)}.forest-menu-brand{width:100%;max-width:none;margin:0 0 36px}.forest-menu-brand img{width:190px}.drawer .forest-menu nav{width:100%}.drawer .forest-menu nav a{min-height:70px;gap:18px;padding:10px 0}.forest-menu nav .mt b{font-size:20px}.forest-menu nav .mt small{font-size:12px}.drawer .forest-menu-news{width:100%;gap:12px}.forest-menu-services a{font-size:12px;gap:10px;padding:0 16px}.drawer .forest-menu .menu-close{top:16px;right:16px}}
@media(prefers-reduced-motion:reduce){.drawer,.drawer .forest-menu{transition:none}}
/* 底部快捷入口沿用文字导航，覆盖旧菜单的整块悬停底色。 */
.forest-menu-services{align-items:center}
.forest-menu-services a{min-height:40px;text-align:left;transition:color .18s}
.forest-menu-services a:hover,.forest-menu-services a:active{background:transparent;color:#946719;box-shadow:none}
.forest-menu-services a:hover span{color:inherit}

/* 下载页出发提醒与手机扫码入口，沿用现有森林配色。 */
.download-preflight{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:32px;margin-top:32px;padding:30px 32px;background:#edf2e7;border:1px solid #dbe5ce;border-radius:14px;color:#3c5a48}
.preflight-notes h2{font:800 22px/1.3 var(--f-display);color:var(--ink);margin:0 0 20px}
.preflight-list{list-style:none;padding:0;margin:0;display:grid;gap:16px}
.preflight-list li{position:relative;padding-left:18px}
.preflight-list li::before{content:"";position:absolute;left:0;top:9px;width:5px;height:5px;background:#a67c2a;border-radius:50%}
.preflight-list b{font-size:14px;font-weight:700;color:var(--ink)}
.preflight-list p{margin:4px 0 0;font-size:13px;line-height:1.8;text-wrap:pretty}
.preflight-list a{color:#214d39;text-decoration:underline;text-underline-offset:3px;font-weight:700}
.download-scan{display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;border-left:1px solid #d2dec5;padding-left:32px;gap:14px}
.download-qr{display:block;background:#fff;border:1px solid #dbe5ce;border-radius:8px;padding:3px;line-height:0}
.download-qr img{display:block;width:148px;height:148px}
.download-scan h3{margin:0;font:700 17px/1.5 var(--f-display);color:var(--ink)}
.download-scan p{font-size:12px;line-height:1.8;margin:6px 0;color:#567247}
.download-scan-domain{font:500 11px/1.5 var(--f-num);color:#718463;letter-spacing:.04em}
.download-preflight a:focus-visible{outline:2px solid var(--gold-deep);outline-offset:4px}
@media(max-width:1000px){.download-preflight{grid-template-columns:minmax(0,1fr) 260px;gap:24px;padding:26px}.download-scan{padding-left:24px}}
@media(max-width:767px){.download-preflight{grid-template-columns:1fr;padding:24px;gap:0}.download-scan{display:none}.preflight-notes h2{font-size:20px}.preflight-list{gap:18px}}

/* 两只宠物组成轻量森林插画，填补提醒与扫码区之间的空白。 */
.download-preflight{grid-template-columns:minmax(0,1fr) minmax(240px,.85fr) 210px;gap:20px;padding:28px}
.preflight-art{display:flex;align-items:center;min-width:0;pointer-events:none}
.preflight-art img{width:100%;height:auto;display:block;mix-blend-mode:multiply;mask-image:radial-gradient(ellipse at center,#000 48%,transparent 73%)}
.download-scan{padding-left:20px;gap:10px}
.download-qr img{width:128px;height:128px}
@media(min-width:768px) and (max-width:1100px){.download-preflight{grid-template-columns:minmax(0,1fr) 190px;gap:20px;padding:24px}.preflight-art{display:none}}
@media(max-width:767px){.download-preflight{grid-template-columns:1fr;padding:24px;gap:0}.preflight-art{display:none}}

/* ---------- 语言切换（繁／简／日／韩）---------- */
html[lang="ja"]{--f-display:"Noto Serif JP","Hiragino Mincho ProN","Yu Mincho",serif;--f-body:"Noto Sans JP","Hiragino Sans","Hiragino Kaku Gothic ProN","Yu Gothic","Meiryo",system-ui,sans-serif;--f-ui:"Chakra Petch","Noto Sans JP","Hiragino Sans",system-ui,sans-serif}
html[lang="ko"]{--f-display:"Noto Serif KR","AppleMyungjo","Batang",serif;--f-body:"Noto Sans KR","Apple SD Gothic Neo","Malgun Gothic",system-ui,sans-serif;--f-ui:"Chakra Petch","Noto Sans KR","Apple SD Gothic Neo",system-ui,sans-serif}
.lang-switch{position:relative;display:inline-block}
.lang-switch>summary{list-style:none;display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 14px;background:rgba(250,251,246,.92);color:#244b39;border-radius:4px;box-shadow:inset 0 0 0 1px var(--line);cursor:pointer;font:600 13px/1 var(--f-body);letter-spacing:.04em;user-select:none;transition:background .2s}
.lang-switch>summary::-webkit-details-marker{display:none}
.lang-switch>summary:hover,.lang-switch[open]>summary{background:var(--moss)}
.lang-switch>summary svg{width:18px;height:18px;flex:none}
.lang-switch .lang-short{display:none}
.lang-switch .lang-menu{position:absolute;right:0;top:calc(100% + 8px);z-index:60;min-width:150px;padding:6px;background:#fafbf6;border-radius:6px;box-shadow:0 12px 32px rgba(32,61,49,.18),inset 0 0 0 1px var(--line);display:grid;gap:2px}
.lang-switch .lang-menu a{display:block;padding:10px 12px;border-radius:4px;color:#244b39;text-decoration:none;font:500 14px/1.2 system-ui,sans-serif}
.lang-switch .lang-menu a:hover{background:var(--moss)}
.lang-switch .lang-menu a[aria-current="true"]{background:var(--pine);color:var(--paper)}
.lang-switch.on-hero>summary{height:43px;min-height:0;padding:0 16px;background:#fff;box-shadow:none;border-radius:3px;clip-path:polygon(0 0,calc(100% - 9px) 0,100% 9px,100% 100%,0 100%)}
.lang-switch.on-hero>summary:hover,.lang-switch.on-hero[open]>summary{background:var(--moss)}
.lang-switch.on-hero .lang-menu{top:calc(100% + 6px)}
@media (max-width:820px){
  .lang-switch .lang-full{display:none}
  .lang-switch .lang-short{display:inline}
  .lang-switch>summary,.lang-switch.on-hero>summary{padding:0 11px;gap:5px}
}
.drawer .menu-langs{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px;padding:0 4px}
.drawer .menu-langs a{display:inline-block;min-height:0;padding:7px 12px;border:0;border-radius:999px;color:#254f38;font:500 13px/1 system-ui,sans-serif;text-decoration:none;background:#fff;box-shadow:inset 0 0 0 1px #6b805b40}
.drawer .menu-langs a[aria-current="true"]{background:#254f38;color:#fafaf1;box-shadow:none}
/* 日韩文字较长：主视觉下载按钮保持单行，按钮随文字加宽 */
html[lang="ja"] .dl-toggle,html[lang="ko"] .dl-toggle{white-space:nowrap;padding-inline:18px}

/* 移动端导航下载入口使用固定尺寸图标，避免翻译长文案撑高顶部。 */
@media (max-width:820px){
  .header-right .nav-download,.hero-nav .nav-download{width:44px;height:44px;min-width:44px;min-height:44px;padding:0;flex:0 0 44px;gap:0;display:inline-flex;align-items:center;justify-content:center}
  .header-right .nav-download>span,.hero-nav .nav-download>span{display:none}
  .header-right .nav-download>svg,.hero-nav .nav-download>svg{width:20px;height:20px;flex:none}
  .hero-nav .nav-download{width:47px;height:47px;min-width:47px;min-height:47px;flex-basis:47px}
}

/* 菜单底部桌面同行排列，窄屏自然换行并保留滚动空间。 */
.forest-menu-footer{display:flex;align-items:center;flex-wrap:wrap;gap:12px 20px;padding-top:20px;flex-shrink:0}
.forest-menu-footer .forest-menu-services{padding-top:0;flex-shrink:0}
.drawer .forest-menu-footer .menu-langs{margin:0;padding:0;gap:6px}
@media(min-width:821px){.drawer .forest-menu-footer .menu-langs{margin-left:auto}}