@import url("https://fonts.googleapis.com/css2?family=Iansui&family=Noto+Sans+TC:wght@400;500;700;900&family=Caveat:wght@500;700&display=swap");
/* LESS. 溫暖插畫風格：暖色、圓角、手繪 SVG；文字對比皆 ≥ 4.5:1 */
:root{--bg:#fff6ea;--card:#fffdf8;--ink:#3b2f2a;--mute:#6e5a4e;--line:#f0dcc6;--acc:#b8532f;--acc2:#e0734e;--soft:#ffe7cf;--peach:#ffdcc7;--warn:#a2402a;--leaf:#4f6b45;--c:#b8532f}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:17px/1.8 "PingFang TC","Noto Sans TC","Microsoft JhengHei",-apple-system,sans-serif}
a{color:var(--acc);text-underline-offset:3px}
h1{font-size:1.85rem;line-height:1.35;margin:.5em 0 .3em}h2{font-size:1.3rem;margin:1.7em 0 .6em}h3{font-size:1.08rem;margin:.4em 0}
h1 em{font-style:normal;background:linear-gradient(transparent 62%,#ffd29a 62%)}
main{max-width:820px;margin:0 auto;padding:12px 18px 48px}
.ill{display:block;max-width:100%;height:auto}
.top{position:sticky;top:0;z-index:10;background:rgba(255,246,234,.94);backdrop-filter:blur(8px);border-bottom:2px dashed var(--line);padding:8px 14px;display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px}
.logo{font-weight:800;font-size:1.4rem;color:var(--acc);text-decoration:none}.logo span{color:var(--ink)}
.beta{font-size:12px;background:var(--soft);border-radius:99px;padding:2px 10px;color:var(--mute)}
.top nav{display:flex;gap:6px;overflow-x:auto;width:100%;scrollbar-width:none;padding-bottom:2px}
.top nav a{flex:none;padding:8px 14px;min-height:44px;display:flex;align-items:center;border-radius:99px;color:var(--ink);text-decoration:none;font-size:15px;background:#fff}
.top nav a[aria-current]{background:var(--acc);color:#fff;font-weight:700}
@media(min-width:820px){.top nav{width:auto;margin-left:auto}}
.hero{padding:18px 0}.home-hero{display:grid;gap:10px;align-items:center}.home-hero h1{font-size:2.1rem}.hero-ill{width:min(320px,80%);margin:0 auto}
@media(min-width:700px){.home-hero{grid-template-columns:1.2fr 1fr}.home-hero h1{font-size:2.5rem}}
.hub-hero{background:var(--card);border-radius:28px;padding:18px 20px;box-shadow:0 8px 0 var(--line)}.hub-hero .ill{max-width:260px;margin:0 auto}.hero.small h1{font-size:1.8rem}
main>.ill:first-child{width:min(220px,60%);margin:6px auto 0}
.lead{font-size:1.1rem;color:#4e3f37}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:10px 22px;border-radius:99px;border:0;background:var(--acc);color:#fff;font:inherit;font-weight:700;text-decoration:none;cursor:pointer;box-shadow:0 4px 0 #8a3d22;transition:transform .1s}
.btn:active{transform:translateY(2px);box-shadow:0 2px 0 #8a3d22}
.btn.g{background:#fff;color:var(--acc);box-shadow:0 4px 0 var(--line);border:2px solid var(--line)}.btn.big{padding:12px 26px}.btn.danger{background:var(--warn);box-shadow:0 4px 0 #6e2a1c}
.row{display:flex;flex-wrap:wrap;gap:12px;margin:14px 0}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px}.list{display:grid;gap:14px}
.card{display:flex;flex-direction:column;gap:4px;padding:16px 18px;background:var(--card);border-radius:24px;color:var(--ink);text-decoration:none;box-shadow:0 6px 0 var(--line);border:2px solid transparent}
a.card:hover{border-color:var(--acc2)}a.card:focus-visible{border-color:var(--acc)}
.card.hub{box-shadow:0 8px 0 color-mix(in srgb,var(--c) 35%,#fff)}.card.hub .ill{height:100px;width:100%;margin-bottom:4px}.card.hub b{font-size:1.15rem}
.row-card{flex-direction:row;align-items:center;gap:14px}.row-card>span:nth-child(2){flex:1}.num{width:36px;height:36px;border-radius:50%;background:var(--soft);color:var(--acc);font-weight:800;display:grid;place-items:center;flex:none}
.box{background:var(--card);border-radius:22px;padding:16px 18px;margin:14px 0;box-shadow:0 5px 0 var(--line)}
.fb{border:2px dashed #f0b98f;box-shadow:none;animation:in .25s ease}.alert{background:#ffe9dd;box-shadow:0 5px 0 #f3c3aa}
@keyframes in{from{opacity:0;transform:translateY(4px)}to{opacity:1}}
.mute{color:var(--mute)}.small{font-size:14.5px}.warn{color:var(--warn);font-weight:700}.ok{color:var(--leaf);font-weight:700}
.chips{display:flex;flex-wrap:wrap;gap:8px}.chip{display:inline-flex;align-items:center;min-height:44px;padding:6px 16px;border-radius:99px;background:var(--soft);color:#7a3a1f;text-decoration:none;font-size:15px}.chip.alt{background:#e4efdc;color:#3d5634}
.crumb{font-size:14px;color:var(--mute);margin:6px 0 0}
.lesson h1{color:var(--ink)}.research,.philo{border-radius:24px;padding:14px 18px;margin:20px 0}.research{background:#eef4ea}.philo{background:#f6eefb}
.ev{display:inline-block;font-size:12px;font-weight:700;padding:2px 10px;border-radius:99px;vertical-align:middle}.ev-e{background:#dbe9d3;color:#2f4a28}.ev-s{background:#f6dcc6;color:#6b3a1c}.ev-h{background:#e4dcf2;color:#45386a}
.opts{display:grid;gap:10px;margin:12px 0}
.opt-btn{text-align:left;min-height:48px;padding:12px 18px;border:2px solid var(--line);background:#fff;border-radius:20px;font:inherit;color:var(--ink);cursor:pointer}
.opt-btn:hover:not(:disabled){border-color:var(--acc2);background:#fffaf3}.opt-btn.sel{border-color:var(--acc);background:var(--soft);font-weight:700}.opt-btn:disabled:not(.sel){opacity:.6}
.fb3{margin-top:12px;padding-top:12px;border-top:2px dashed var(--line)}details{margin:6px 0}summary{cursor:pointer;color:var(--acc);min-height:44px;display:flex;align-items:center;font-weight:600}
textarea,input[type=text],select{width:100%;font:inherit;padding:12px;border:2px solid var(--line);border-radius:16px;background:#fff;margin-top:4px;overflow-wrap:anywhere;color:var(--ink)}
textarea:focus,input:focus,select:focus{border-color:var(--acc2);outline:none;box-shadow:0 0 0 3px #ffd9bf}
label.q{display:block;margin:14px 0}fieldset{border:0;padding:0;margin:16px 0}legend{font-weight:700;margin-bottom:8px}
.opt{display:flex;gap:10px;align-items:center;min-height:48px;padding:6px 14px;border:2px solid var(--line);border-radius:99px;margin:8px 0;background:#fff}.opt.inline{display:inline-flex;margin:0}
.scale{display:grid;grid-template-columns:repeat(auto-fit,minmax(118px,1fr));gap:8px}.scale label{display:flex;gap:8px;align-items:center;min-height:48px;padding:6px 12px;border:2px solid var(--line);border-radius:16px;background:#fff;font-size:15px}
.scale label:has(input:checked),.opt:has(input:checked){border-color:var(--acc);background:var(--soft)}
input[type=radio],input[type=checkbox]{accent-color:var(--acc);width:20px;height:20px}
.item{border-bottom:2px dashed var(--line);padding-bottom:14px}
.bar{display:grid;grid-template-columns:7.5em 1fr 3.5em;align-items:center;gap:8px;margin:8px 0;font-size:15px}.bar i{display:block;height:14px;border-radius:99px;background:var(--acc2);min-width:4px}.bar b{text-align:right}
.result .big{font-size:2.2rem;font-weight:800;margin:0;color:var(--acc)}
.ifthen{background:#fff0d9;border-radius:20px;padding:12px 16px}
.debate{display:grid;gap:14px}@media(min-width:640px){.debate{grid-template-columns:1fr 1fr}}.side{display:grid;gap:10px;align-content:start;background:var(--card);border-radius:24px;padding:14px}
.stats{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}@media(min-width:640px){.stats{grid-template-columns:repeat(4,1fr)}}.stats div{background:var(--card);border-radius:22px;padding:14px;text-align:center;box-shadow:0 5px 0 var(--line)}.stats b{display:block;font-size:1.8rem;color:var(--acc)}.stats span{font-size:13px;color:var(--mute)}
.how{background:var(--card);border-radius:24px;padding:16px 16px 16px 40px;box-shadow:0 5px 0 var(--line)}.how li{margin:6px 0}
.hubrow{background:var(--card);border-radius:26px;padding:16px 20px;margin:18px 0;box-shadow:0 6px 0 color-mix(in srgb,var(--c) 30%,#fff)}.hubrow .ill{height:80px;width:auto;float:right;margin-left:10px}.hubrow h2{margin:0}.hubrow h2 a{color:var(--ink);text-decoration:none}.hubrow ol{clear:none}
.pager{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:28px;padding-top:14px;border-top:2px dashed var(--line)}.pager a{min-height:44px;display:flex;align-items:center;font-weight:600}
.hot{list-style:none;padding:0}.hot li{margin:8px 0}.hot a{font-size:1.25rem;text-decoration:none;display:inline-flex;min-height:44px;align-items:center;padding:0 12px;background:#fff;border-radius:99px;margin-right:6px}
.empty{text-align:center;padding:8px 0}.empty-ill{width:120px;margin:0 auto}
.overlay{position:fixed;inset:0;background:rgba(59,47,42,.45);display:flex;align-items:flex-end;justify-content:center;z-index:50;padding:12px}@media(min-width:640px){.overlay{align-items:center}}
.modal{background:var(--card);border-radius:28px;padding:20px;max-width:520px;width:100%;max-height:92vh;overflow:auto}
.ck{display:flex;gap:10px;align-items:center;min-height:44px;font-size:14.5px}
#toast{position:fixed;left:50%;bottom:20px;transform:translateX(-50%);background:var(--ink);color:#fff;padding:12px 18px;border-radius:99px;opacity:0;transition:.2s;pointer-events:none;z-index:60}#toast.show{opacity:1}
.foot{max-width:820px;margin:0 auto;padding:20px 18px 30px}.safety{font-size:14.5px;background:var(--peach);border-radius:22px;padding:12px 16px;color:#4a2c20}.safety a{color:#7a2e14}
:focus-visible{outline:3px solid #b8532f;outline-offset:2px}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
.navbtn{flex:none;min-height:44px;padding:8px 14px;border-radius:99px;border:2px solid var(--line);background:#fff;color:var(--ink);font:inherit;font-size:15px;cursor:pointer}
input[type=email],input[type=password]{width:100%;font:inherit;padding:12px;border:2px solid var(--line);border-radius:16px;background:#fff;margin-top:4px;color:var(--ink)}
button.card{font:inherit;text-align:left;cursor:pointer}.pick:hover{border-color:var(--acc2)}
.trend{display:block;width:220px;max-width:100%;height:50px;margin:6px 0}
.acct{order:2;margin-left:auto;display:flex;gap:6px;align-items:center;flex:none}
.top nav{order:3}
.acct .navbtn{display:inline-flex;align-items:center;text-decoration:none;white-space:nowrap}
.acct a.navbtn[aria-current]{background:var(--acc);color:#fff;border-color:var(--acc)}
.avatar{width:44px;height:44px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;background:var(--acc);color:#fff;font-weight:700;text-decoration:none}
@media(max-width:380px){.beta{display:none}}
@media(min-width:820px){.top nav{order:2}.acct{order:3;margin-left:0}}
.avatar{background:none;padding:0;overflow:hidden}.avatar svg{width:44px;height:44px;display:block}
.avatar[aria-current]{outline:3px solid var(--acc);outline-offset:2px}
.avpick{border:0;padding:0;margin:12px 0}.avpick legend{font-weight:700;margin-bottom:8px}
.avgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(76px,1fr));gap:8px}
.av{display:flex;flex-direction:column;align-items:center;gap:4px;min-height:44px;padding:8px 4px;border:2px solid var(--line);border-radius:18px;background:#fff;cursor:pointer;font-size:14px;position:relative}
.av input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.av:has(input:checked){border-color:var(--acc);background:var(--soft)}.av:has(input:focus-visible){outline:3px solid var(--acc);outline-offset:2px}
.price .big{font-size:1.8rem;font-weight:800;color:var(--acc);margin:0}
.testpay{background:#fff3c4;border-radius:12px;padding:8px 12px;font-weight:700;color:#5a4300}
.grid2{display:grid;gap:12px}@media(min-width:700px){.grid2{grid-template-columns:1fr 1fr}}
.card.locked{opacity:.75}.card.locked span::before{content:"🔒 "}
.card.soon{background:#f6efe6;box-shadow:none;border:2px dashed var(--line)}
.scale{display:flex;flex-wrap:wrap;gap:6px}.scale label{min-height:44px;display:flex;align-items:center;gap:6px;padding:6px 12px;border:2px solid var(--line);border-radius:99px;background:#fff}
.cmp{width:100%;border-collapse:collapse;font-size:15px}.cmp td,.cmp th{border-bottom:1px solid var(--line);padding:8px;text-align:left}
pre.book{white-space:pre-wrap;font:inherit;background:#fff;border-radius:20px;padding:16px;box-shadow:0 4px 0 var(--line)}

.safe-note{background:#fff4e8;border-left:4px solid #d9822b;padding:8px 10px;border-radius:8px}
.fb3 details.more,.fb details.more{margin-top:8px}
.first-q h1{font-size:clamp(1.6rem,4vw,2.3rem)}
.first-q .tagline{color:var(--c,#b5653b);margin:0 0 .4rem}
.fq{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:.6rem;margin:1rem 0}
.fq-opt{display:block;text-decoration:none;text-align:left}
.help-entry{margin:1rem 0;background:#fff4ea}
.next-steps{margin-top:1rem}
.summary-card{margin-top:1rem;border-left:4px solid var(--c,#d9905f);background:#fffaf3}
.summary-card h3{margin-top:0}
.fq-intro{text-align:center;max-width:32rem;margin:3rem auto 1rem}
.fq-quote{font-size:1.4rem;font-weight:600}
.steps{display:flex;gap:6px;list-style:none;padding:0;margin:8px 0 4px;font-size:13px;color:var(--mute);flex-wrap:wrap}
.steps li{padding:2px 10px;border-radius:999px;background:#f6ece2}
.steps li.on{background:var(--c,#e0734e);color:#fff;font-weight:700}
.steps li.done{background:#efe3d6;color:var(--ink)}
.cue{margin:6px 0 2px;color:var(--c,#b8532f);font-weight:600;font-size:15px}
.flow-q{font-size:clamp(1.2rem,3.2vw,1.6rem);line-height:1.45;margin:4px 0 12px}
.flow .opts,.step .opts{display:grid;gap:8px}
.flow-title{margin-top:10px}
.step{scroll-margin-top:12px}
.card-fold{border-radius:20px;padding:12px 16px;margin:12px 0}
.card-fold summary{cursor:pointer;list-style-position:inside}
.research.card-fold{background:#eef4ea}.philo.card-fold{background:#f6eefb}
[hidden]{display:none!important}
/* 深入版卡片與點選對照 */
.card-fold summary .hook{display:block;margin-top:.35rem;font-weight:600;color:#5b3a29;line-height:1.5}
dl.deep{margin:.6rem 0}dl.deep dt{font-weight:700;color:#8a4b2c;margin-top:.55rem;font-size:.92rem}dl.deep dd{margin:.15rem 0 0}
blockquote.pq{margin:.6rem 0;padding:.5rem .8rem;border-left:4px solid #e0b48f;background:#fff7ef;border-radius:6px}
ol.argue{margin:.3rem 0 .6rem 1.2rem}
.tapq{margin:1rem 0}.tapq h3{margin:.2rem 0 .5rem}
.opt-btn[aria-pressed=true]{outline:3px solid #e0734e;background:#fff1e8}
.safe-opt{border-style:dashed}
.safe-card .safe-note{display:block}
.exp-pick .exp-btn{text-align:left}
/* 固定頁首不蓋住捲動到的內容 */
.step,details,.box,.tapq,#sumc,#safec,#closec,#nextq,#efb,#wfb,#endc{scroll-margin-top:140px}
@media (min-width:700px){.step,details,.box,.tapq,#sumc,#safec,#closec,#nextq,#efb,#wfb,#endc{scroll-margin-top:96px}}
.close-card{border:2px solid #e0b48f;background:#fff7ef}

/* 被接住：感受句、呼吸、柔和動態 */
.fb .feel,.fb3 .feel,.feel{font-weight:600;color:#7a4b2a;margin-top:0}
.nod .feel::before{content:"";display:inline-block;width:1.1em;height:1.1em;margin-right:.4em;vertical-align:-.15em;border-radius:50% 50% 45% 45%;background:radial-gradient(circle at 35% 40%,#5a3a22 7%,transparent 8%),radial-gradient(circle at 65% 40%,#5a3a22 7%,transparent 8%),#f6c98e;animation:nod 1.2s ease-in-out 2}
@keyframes nod{0%,100%{transform:rotate(0)}30%{transform:rotate(-12deg) translateY(1px)}60%{transform:rotate(8deg)}}
.fb,.fb3,.tfb>.box{animation:softopen .45s ease-out both;transform-origin:top}
@keyframes softopen{from{opacity:0;transform:scaleY(.96) translateY(-4px)}to{opacity:1;transform:none}}
.echo{background:#fff6ea;border-radius:10px;padding:.5em .8em}
.pause{text-align:center;background:#f3f7f1}
.breath{width:64px;height:64px;margin:.8em auto;border-radius:50%;background:radial-gradient(circle,#bfe0c4,#8fc39a);animation:breathe 8s ease-in-out 3}
@keyframes breathe{0%,100%{transform:scale(.6);opacity:.7}50%{transform:scale(1.15);opacity:1}}
.opt-btn.unsure{border-style:dashed}
.welcome{background:#fff6ea}
.stay-fb:empty{display:none}
@media (prefers-reduced-motion:reduce){.fb,.fb3,.tfb>.box,.nod .feel::before,.breath{animation:none!important}.breath{transform:none}}

/* 會長大的地圖 */
.gmap{width:100%;max-width:560px;display:block;margin:.4em auto}
.gmap .trail{fill:none;stroke:#e6d3b8;stroke-width:6;stroke-dasharray:2 12;stroke-linecap:round}
.gmap .rg path{fill:var(--c);opacity:.12;stroke:var(--c);stroke-width:2;transition:opacity .6s}
.gmap .rg.lv1 path{opacity:.3}.gmap .rg.lv2 path{opacity:.48}.gmap .rg.lv3 path{opacity:.66}.gmap .rg.lv4 path{opacity:.85}
.gmap text{font-size:14px;fill:#4a3426;font-weight:600}
.gmap .spark{fill:#ffd36b}
.gmap .rg.pop path{animation:lightup 1.4s ease-out}
.gmap .rg.pop .spark{animation:twinkle 1.4s ease-out}
@keyframes lightup{0%{opacity:.1;filter:brightness(1.6)}60%{opacity:.95}100%{}}
@keyframes twinkle{0%{transform:scale(0);transform-origin:center}70%{transform:scale(1.6)}100%{transform:scale(1)}}
.pathmap .st circle{fill:#f4ead9;stroke:#d9c2a3;stroke-width:2}
.pathmap .st.lit circle{fill:#ffcf7a;stroke:#e09a3c}
.pathmap .st.ver circle{stroke:#7cb48a;stroke-width:4}
.pathmap .st.lock{opacity:.35}.pathmap .st.lock circle{stroke-dasharray:3 4}
.pats{list-style:none;padding:0}.pat{display:flex;gap:.6em;align-items:center;justify-content:space-between;padding:.4em 0;border-bottom:1px dashed #eadbc6}
.btn.small{padding:.3em .8em;font-size:.9em}
/* 多種玩法 */
.tap-btn.hid{display:none}
.pl{margin:.5em 0 .8em}.pl-name{font-size:.85em;color:#a0612e;font-weight:700;margin:.2em 0}
.pl-flip{width:100%;min-height:120px;border:0;border-radius:16px;background:linear-gradient(135deg,#ffd9a8,#f6b8a0);font-size:1.1em;font-weight:700;color:#5a3a22;cursor:pointer;transition:transform .5s}
.pl-flip.flipped{transform:rotateY(360deg);background:#fff6ea}
.pl-pair{display:grid;grid-template-columns:1fr auto 1fr;gap:.5em;align-items:center}.vs{color:#a0612e}
.rank{display:inline-block;min-width:1.4em;border-radius:50%;background:#e09a3c;color:#fff;text-align:center}
.spec{display:grid;grid-template-columns:1fr auto 1fr;gap:.5em;align-items:center}.spec .end{font-size:.9em}
.dots{display:flex;gap:.5em;background:linear-gradient(90deg,#f6b8a0,#f3e3c4,#a8d5b5);padding:.6em;border-radius:99px}
.dot{width:30px;height:30px;border-radius:50%;border:2px solid #fff;background:#fffaf3;cursor:pointer}.dot.sel{background:#e09a3c}
.paras{display:grid;gap:.6em}@media(min-width:700px){.paras{grid-template-columns:1fr 1fr}.pl-pair{gap:1em}}
.para{background:#fff6ea;border-radius:12px;padding:.6em .8em}.para.alt{background:#eef5ef}
@media(max-width:480px){.pl-pair,.spec{grid-template-columns:1fr}.vs{text-align:center}}
.exp-loop{background:#eef5ef;border-radius:12px;padding:.6em .9em;margin-top:.5em}
.exp-ask{background:#eef5ef}
@media (prefers-reduced-motion:reduce){.gmap .rg.pop path,.gmap .rg.pop .spark,.pl-flip{animation:none!important;transition:none!important}.pl-flip.flipped{transform:none}}
.notme{white-space:nowrap;flex-shrink:0}
.pat .go1,.pat .notme{white-space:nowrap;flex:none}.pat[data-c="few"]{flex-wrap:wrap}.pat[data-c="few"] .go1{margin-top:6px}
.aha{background:linear-gradient(160deg,#fff8ec,#f3ecff);border:1px solid #e6d6f5}
.aha-k{font-weight:700;color:#8a5bb8;margin:.2em 0 .6em}
.aha-q .row{flex-wrap:wrap}
.aha-say{font-size:1.08em;line-height:1.7}
.aha-tw{background:#fff;border-left:4px solid #c9a7ee;padding:.5em .8em;border-radius:6px}
@keyframes ahaUnfold{from{opacity:0;transform:perspective(600px) rotateX(-70deg)}to{opacity:1;transform:none}}
.tarot{perspective:1200px;max-width:520px;margin:0 auto}
.tarot-in{display:grid;transition:transform .6s cubic-bezier(.3,.7,.3,1);transform-style:preserve-3d}
.tarot.flipped .tarot-in{transform:rotateY(180deg)}
.t-face{grid-area:1/1;backface-visibility:hidden;-webkit-backface-visibility:hidden;border-radius:16px}
.t-front{transform:rotateY(180deg)}
.tarot-btn{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.6rem;width:100%;height:100%;min-height:300px;border:0;border-radius:16px;cursor:pointer;color:#f6ead2;font:inherit;background:radial-gradient(circle at 50% 40%,#5a3f7a,#2f2346 70%);box-shadow:0 8px 24px rgba(47,35,70,.25),inset 0 0 0 3px #3d2d5a,inset 0 0 0 5px #e9d9b8}
.tarot-btn:focus-visible{outline:3px solid #c9a7ee;outline-offset:4px}
.tarot-btn:hover{transform:translateY(-2px)}
.tb-art{width:120px;height:170px}.tb-hint{font-size:.95rem;letter-spacing:.1em}
.aha-card{background:#fffdf8;border:1px solid #e6d6f5;border-radius:16px;padding:1rem 1.1rem;box-shadow:0 8px 24px rgba(138,91,184,.12);height:100%;box-sizing:border-box}
.aha-card:focus{outline:none}
.aha-card.swap{animation:ahaSwap .4s ease-out both}@keyframes ahaSwap{from{opacity:.2}to{opacity:1}}
.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
@media (prefers-reduced-motion:reduce){.tarot-in{transition:none;transform:none!important}.tarot.flipped .tarot-in{transform:none}.t-front{transform:none;opacity:0;transition:opacity .2s}.t-back{transition:opacity .2s}.tarot.flipped .t-front{opacity:1}.tarot.flipped .t-back{opacity:0;pointer-events:none}.aha-card.swap{animation:none}.tarot-btn:hover{transform:none}}
.retmap{border-left:4px solid var(--accent,#5f7fa3)}.minimap{width:100%;max-width:420px;height:auto;display:block;margin:.4rem auto}.minimap .mm-path{stroke:#bdb6ab;stroke-width:1.5;stroke-dasharray:3 5}.minimap text{font-size:11px;fill:#6b655d}.minimap .isl-halo{opacity:0}.minimap .glow .isl-halo{opacity:.28;animation:mmGlow 2.6s ease-in-out infinite}.minimap.lighting .glow ellipse:not(.isl-halo){animation:mmLight 1.2s ease-out both}.minimap .glow text{fill:#3d3a35;font-weight:600}@keyframes mmGlow{0%,100%{opacity:.14}50%{opacity:.36}}@keyframes mmLight{from{fill-opacity:.15}}.mm-line{text-align:center}.litmo{margin:.6rem 0 1rem;padding:.6rem .8rem;border-radius:12px;background:rgba(95,127,163,.06);text-align:center}.litmo-t{margin:.2rem 0}
@media (prefers-reduced-motion:reduce){.minimap .glow .isl-halo{animation:none;opacity:.28}.minimap.lighting .glow ellipse{animation:none}}
.archsvg{width:100%;height:auto;display:block;border-radius:18px}.arch-note{background:#fff4e6;border-radius:10px;padding:.4rem .7rem;font-size:.95rem}.alink.draw{stroke-dasharray:100;stroke-dashoffset:100;animation:alDraw 1.6s ease-out forwards;animation-delay:calc(.4s + var(--i)*.5s)}@keyframes alDraw{to{stroke-dashoffset:0}}.alinkc{border-left:4px solid #c0684a;animation:ahaUnfold .7s ease-out both}.alink-t{color:#c0684a;margin:.1rem 0}.portrait{font-size:1.05rem;line-height:1.9;background:#fffaf2;border-radius:12px;padding:.6rem .9rem;margin:.8rem 0}.aflag{cursor:pointer}.mm-tip{text-align:center;font-size:1.1rem;font-weight:600;min-height:1.4em;margin:.2rem 0}.minimap .isl{cursor:pointer}.minimap .isl.picked text{font-size:14px;fill:#3d3a35;font-weight:700}
@media (prefers-reduced-motion:reduce){.alink.draw{animation:none;stroke-dashoffset:0}.alinkc{animation:none}}
.alegend{margin:.6rem 0;background:#fffaf2;border-radius:12px;padding:.4rem .8rem}.alegend summary{cursor:pointer;font-weight:600;padding:.4rem 0;min-height:44px;display:flex;align-items:center}.alegend ul{list-style:none;padding:0;margin:.2rem 0;display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:.3rem}.alegend li{display:flex;align-items:center;gap:.4rem;padding:.25rem .4rem;border-radius:10px;font-size:.95rem;transition:background .3s}.alegend li.hl{background:#f6dcc8;outline:2px solid #c0684a}.legico{width:48px;height:46px;flex:none}.ai.lit{cursor:pointer}.ai.picked .ai-land{stroke:#c0684a;stroke-width:3;stroke-opacity:1}
@media (prefers-reduced-motion:reduce){.alegend li{transition:none}}
.tarot-in{grid-template-columns:minmax(0,1fr)}.t-back{justify-self:center;align-self:start;width:min(100%,330px)}.tarot-btn{min-height:0;height:auto;aspect-ratio:1/1.95}.tarot:not(.flipped) .t-front{height:0;overflow:hidden}

.tarot:not(.flipped) .tarot-btn{animation:tbPulse 2.6s ease-in-out infinite}@keyframes tbPulse{0%,100%{box-shadow:0 8px 24px rgba(47,35,70,.25),inset 0 0 0 3px #3d2d5a,inset 0 0 0 5px #e9d9b8}50%{box-shadow:0 10px 30px rgba(201,167,238,.55),inset 0 0 0 3px #3d2d5a,inset 0 0 0 5px #f6ead2}}
@media (prefers-reduced-motion:reduce){.tarot:not(.flipped) .tarot-btn{animation:none}}
.paywall ul{margin:.3rem 0 .6rem;padding-left:1.2rem}.testbadge{background:#eef6ee;border:1px dashed #6a9a6a;border-radius:10px;padding:.5rem .8rem}
.pm-btn.sel{background:#3d3a35;color:#fff}.receipt .rc{display:grid;grid-template-columns:auto 1fr;gap:.3rem .9rem;margin:0}.receipt dt{color:#7a746b}.receipt dd{margin:0;font-weight:600;word-break:break-all}
table.orders{width:100%;border-collapse:collapse;font-size:.95rem}table.orders th,table.orders td{text-align:left;padding:.4rem .3rem;border-bottom:1px solid #eee3d3;vertical-align:top}
.t-back{width:100%}.tarot-btn{aspect-ratio:auto;height:60vh;min-height:320px;max-height:640px}
@media (max-width:600px){#sumc{padding-left:0;padding-right:0;border-left:0;border-right:0;border-radius:0;background:none;box-shadow:none}#sumc .aha{padding-left:2px;padding-right:2px;border:0;background:none;box-shadow:none}#sumc>*:not(.aha){padding-left:2px;padding-right:2px}.tarot-btn{min-height:0;height:60vh}}

/* ===== v2-ui ===== */
.navmore{position:relative;flex:none}
.navmore summary{list-style:none;padding:8px 14px;min-height:44px;display:flex;align-items:center;border-radius:99px;background:#fff;cursor:pointer;font-size:15px}
.navmore summary::-webkit-details-marker{display:none}
.navmore summary::after{content:"▾";margin-left:4px;font-size:12px}
.navmore summary.cur{background:var(--acc);color:#fff;font-weight:700}
.navmore-p{position:absolute;right:0;top:calc(100% + 6px);background:#fff;border-radius:18px;padding:6px;box-shadow:0 8px 24px rgba(80,50,30,.15);display:flex;flex-direction:column;gap:4px;z-index:20;min-width:140px}
.navmore-p a{background:transparent!important;color:var(--ink)!important}
.navmore-p a[aria-current]{background:var(--soft)!important;font-weight:700}
.top nav{overflow:visible;flex-wrap:nowrap}
@media(max-width:819px){.top nav{overflow-x:auto;overflow-y:visible;-webkit-mask-image:linear-gradient(90deg,#000 88%,transparent);mask-image:linear-gradient(90deg,#000 88%,transparent);padding-right:24px}
.navmore-p{position:fixed;right:12px;top:118px}}
.navbtn.login-s{min-height:36px;padding:4px 12px;font-size:14px;border-width:1px;color:var(--mute)}
.safety-wrap{margin:0 0 10px}
.safety-wrap>summary{cursor:pointer;color:#7a2e14;font-size:14.5px;padding:8px 0;min-height:44px;display:flex;align-items:center;gap:6px}
.safety-wrap>summary::before{content:"♡";}
.safety-wrap[open]>summary{font-weight:700}
.aha:has(.tarot){background:none;border:0;box-shadow:none;padding:0}
.box:has(> #aha .tarot),#sumc:has(.tarot){border-left:0!important}
.tarot-btn{box-shadow:inset 0 0 0 2px #c9a46a,inset 0 0 0 6px #2f2346,inset 0 0 0 7px rgba(233,217,184,.6),0 10px 28px rgba(47,35,70,.35)}
.tb-line{font-size:1rem;letter-spacing:.12em;color:#f6ead2}
.tb-isle{font-size:.85rem;color:#e9d9b8;opacity:.85;letter-spacing:.08em}
.tarot-btn::after{content:"";position:absolute;inset:0;border-radius:16px;background:linear-gradient(115deg,transparent 35%,rgba(255,236,190,.18) 50%,transparent 65%);background-size:250% 100%;animation:tbShine 3.6s ease-in-out infinite;pointer-events:none}
.tarot-btn{position:relative;overflow:hidden}
@keyframes tbShine{0%{background-position:120% 0}60%,100%{background-position:-120% 0}}
@media (prefers-reduced-motion:reduce){.tarot-btn::after{animation:none;display:none}}
.aha-fbrow{gap:10px;margin-top:6px}
.aha-fbrow .btn{flex:1;min-height:44px}
.aha-more summary{display:inline-flex;align-items:center;min-height:40px;padding:4px 14px;border:2px solid var(--line);border-radius:99px;cursor:pointer;color:var(--acc);font-weight:700;list-style:none}
.aha-more summary::-webkit-details-marker{display:none}
.aha-more summary::after{content:" ▾"}
.txtlink{color:var(--acc);font-weight:700;align-self:center;padding:10px 4px}
.ret-row{align-items:center}
.mm-next-t{text-align:center;margin:.2em 0 .6em}
.ret-last{border-top:1px dashed var(--line);margin-top:14px;padding-top:10px}
.gmap text{font-size:17px;fill:#3a271b;font-weight:700}
.few-all{line-height:1.7}
.stats-line{font-size:1rem;color:var(--ink);background:var(--card);border-radius:22px;padding:14px 18px;box-shadow:0 5px 0 var(--line)}
.paywall .price{font-size:1.4rem;margin:.6em 0}
.paywall .price b{color:var(--acc)}
.opts{display:grid;grid-template-columns:minmax(0,1fr)}
.opts .opt-btn{width:100%;justify-self:stretch;box-sizing:border-box}
/* ===== 背景音樂按鈕 ===== */
.snd-btn{position:fixed;right:14px;bottom:14px;z-index:30;width:44px;height:44px;border-radius:50%;border:1px solid var(--line);background:rgba(255,253,248,.92);color:var(--mute);display:flex;align-items:center;justify-content:center;padding:0;cursor:pointer;box-shadow:0 4px 12px rgba(80,50,30,.12);opacity:.8}
.snd-btn:hover,.snd-btn:focus-visible{opacity:1}.snd-btn:focus-visible{outline:3px solid var(--acc);outline-offset:2px}
.snd-btn svg{width:20px;height:20px}.snd-btn[hidden]{display:none}
@media print{.snd-btn{display:none}}

.aha-turn{margin:.35em 0 .5em;font-size:.95em;line-height:1.6;color:#4f6b45}

/* ===== 雨夜復古漫畫風（2026-10-27）：紙色、粗墨框硬陰影、酒紅／暗金／赤陶 ===== */
:root{--bg:#f1e6d2;--card:#fbf4e6;--ink:#2a1f1a;--mute:#6a5848;--line:#d9c6a6;--acc:#7a2632;--acc2:#c0643f;--soft:#f6e3cf;--peach:#e7b98f;--warn:#8e2a2a;--leaf:#4d5f2f;--gold:#a8813a;--wine:#7a2632;--terra:#c0643f;--paper2:#fbf4e6;--accent:#7a2632}
body{background-color:var(--bg);font-family:"Noto Sans TC","PingFang TC","Microsoft JhengHei",sans-serif;background-image:radial-gradient(rgba(90,60,30,.07) 1px,transparent 1px),radial-gradient(rgba(90,60,30,.05) 1px,transparent 1px);background-size:5px 5px,9px 9px;background-position:0 0,2px 3px}
h1,h2,h3{font-weight:900;letter-spacing:.02em}h1 em{background:linear-gradient(transparent 62%,#e7b98f 62%)}
a{color:var(--wine)}
.top{background:rgba(241,230,210,.96);border-bottom:3px solid var(--ink);backdrop-filter:none}
.logo{color:var(--ink);font-weight:900;letter-spacing:.06em}.logo span{color:var(--terra)}
.beta{background:var(--ink);color:#f6ead2;border-radius:0;font-weight:700}
.top nav a{background:transparent;border-radius:0;border:2px solid transparent}.top nav a:hover{border-color:var(--ink)}
.top nav a[aria-current]{background:var(--ink);color:#fbf4e6;box-shadow:3px 3px 0 var(--terra)}
.navmore summary{color:var(--ink)}.navmore-p{background:var(--card)!important;border:3px solid var(--ink)!important;border-radius:0!important;box-shadow:4px 4px 0 var(--ink)!important}
.btn{border-radius:0;background:var(--terra);color:#fffaf0;border:2px solid var(--ink);box-shadow:3px 3px 0 var(--ink);min-height:48px}
.btn:active{transform:translate(2px,2px);box-shadow:1px 1px 0 var(--ink)}
.btn.g{background:var(--card);color:var(--ink);border:2px solid var(--ink);box-shadow:3px 3px 0 var(--ink)}.btn.danger{background:var(--wine);box-shadow:3px 3px 0 var(--ink)}
.card,.box,.hubrow,.stats div,.how,.side,.hub-hero,.research,.philo,.ifthen{border-radius:0!important;background:var(--card);border:3px solid var(--ink);box-shadow:4px 4px 0 var(--ink)}
.card.hub,.hubrow{box-shadow:4px 4px 0 var(--ink)}a.card:hover{border-color:var(--wine);box-shadow:6px 6px 0 var(--wine)}
.research{background:#f3ead4}.philo{background:#f4e6dc}.ifthen{background:#f6e3cf}
.fb{border:2px dashed var(--ink);box-shadow:none}.alert{background:#f4dcd2;border-color:var(--wine);box-shadow:4px 4px 0 var(--wine)}
.ok{color:var(--leaf)}.warn{color:var(--warn)}
.chip{border-radius:0;background:var(--soft);color:var(--ink);border:2px solid var(--ink)}.chip.alt{background:#e9e2c8;color:var(--ink)}
.ev{border-radius:0;border:1.5px solid var(--ink)}
/* 選項＝對話框 */
.opt-btn{position:relative;border:2px solid var(--ink);border-radius:22px;background:var(--card);min-height:52px;margin-bottom:6px;color:var(--ink)}
.opt-btn::after{content:"";position:absolute;left:24px;bottom:-8px;width:12px;height:12px;background:inherit;border-right:2px solid var(--ink);border-bottom:2px solid var(--ink);transform:rotate(45deg)}
.opt-btn:hover:not(:disabled){border-color:var(--wine);background:var(--soft)}
.opt-btn.sel,.opt-btn[aria-pressed=true]{background:var(--wine);color:#fbf4e6;border-color:var(--ink)}
a.opt-btn{display:flex;align-items:center;text-decoration:none}
.opt-btn.safe-opt{border-style:solid;border-color:var(--wine);color:var(--wine)}
.opt,.scale label{border:2px solid var(--ink);border-radius:0;background:var(--card)}
.scale label:has(input:checked),.opt:has(input:checked){background:var(--soft);border-color:var(--wine);box-shadow:3px 3px 0 var(--wine)}
input[type=radio],input[type=checkbox]{accent-color:var(--wine)}
textarea,input[type=text],input[type=email],input[type=password],select{border:2px solid var(--ink);border-radius:0;background:#fffaf0}
textarea:focus,input:focus,select:focus{border-color:var(--wine);box-shadow:3px 3px 0 var(--wine)}
summary{color:var(--wine)}
.num{border-radius:0;background:var(--ink);color:#fbf4e6}
.stats b,.result .big{color:var(--wine)}.bar i{background:var(--terra);border-radius:0}
.item,.pager,.fb3{border-color:var(--line)}
.hot a{border:2px solid var(--ink);border-radius:0;background:var(--card)}
/* 插畫 */
.comic-ill{border:3px solid var(--ink);box-shadow:4px 4px 0 var(--ink);object-fit:cover;background:#3a2e28}
.hero-ill.comic-ill{width:100%;max-width:520px;aspect-ratio:4/3;height:auto}
.band.comic-ill,main>.comic-ill:first-child{width:100%!important;max-width:none;height:180px!important;margin:8px 0 6px}
@media(min-width:700px){.band.comic-ill,main>.comic-ill:first-child{height:240px!important}}
.isle-ill.comic-ill{border:0;box-shadow:none;background:none;object-fit:contain}
.card.hub .isle-ill{height:120px;background:url(img/sea.jpg) center/cover;border:2px solid var(--ink);margin:-4px -6px 6px;width:calc(100% + 12px)}
.hubrow .isle-ill{height:90px;width:120px;float:right}.hub-hero .isle-ill{max-width:260px;height:auto}
/* 漫畫群島地圖 */
.minimap.comicmap{position:relative;width:100%;max-width:640px;aspect-ratio:16/11;margin:.6rem auto;background:url(img/sea.jpg) center/cover;border:3px solid var(--ink);box-shadow:4px 4px 0 var(--ink);overflow:hidden}
.comicmap .mm-route{position:absolute;inset:0;width:100%;height:100%}
.comicmap .mm-route line{stroke:#f0cf7a;stroke-width:.7;stroke-dasharray:1.6 1.6;vector-effect:non-scaling-stroke;stroke-width:2.5}
.comicmap .isl{position:absolute;width:30%;transform:translate(-50%,-60%);display:flex;flex-direction:column;align-items:center;text-decoration:none;color:var(--ink);min-height:48px}
.comicmap .isl img{width:100%;height:auto;display:block;transition:filter .3s,transform .3s}
.comicmap .isl.dim img{filter:saturate(.35) sepia(.25) brightness(1.08) contrast(.9);opacity:.82}
.comicmap .isl.lit img{filter:drop-shadow(0 0 10px rgba(255,214,140,.75))}
.comicmap .isl-n{margin-top:6px;font-size:13px;font-weight:700;background:var(--card);border:2px solid var(--ink);border-radius:14px;padding:1px 9px;white-space:nowrap;box-shadow:2px 2px 0 var(--ink);line-height:1.5}
.comicmap .isl.dim .isl-n{border-style:dashed;color:var(--mute)}
.comicmap .isl:hover img,.comicmap .isl:focus-visible img{transform:translateY(-3px)}
.comicmap .isl:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
.comicmap .isl-halo{position:absolute;left:10%;right:10%;top:15%;bottom:30%;border-radius:50%;background:radial-gradient(rgba(255,226,150,.85),transparent 70%);opacity:0;pointer-events:none}
.comicmap .glow .isl-halo{animation:mmGlow 2.4s ease-in-out infinite}
.comicmap .isl.picked .isl-n{background:var(--wine);color:#fbf4e6}
@keyframes mmGlow{0%,100%{opacity:.25}50%{opacity:.9}}
@media(max-width:520px){.comicmap .isl-n{font-size:12px;padding:0 6px}.comicmap .isl{width:31%}}
.retmap{border-left:3px solid var(--ink)}
/* 翻牌：酒紅底、暗金斜紋 */
.tarot-btn{border-radius:0!important;background-color:var(--wine)!important;background-image:repeating-linear-gradient(45deg,rgba(168,129,58,.28) 0 2px,transparent 2px 14px)!important;border:3px solid var(--ink)!important;box-shadow:5px 5px 0 var(--ink)!important;color:#fbf4e6}
.tarot-btn::after{border-radius:0}
.t-front{border-radius:0!important;border:3px solid var(--ink);box-shadow:5px 5px 0 var(--ink);background:var(--card)}
@media (prefers-reduced-motion:reduce){.comicmap .glow .isl-halo{animation:none;opacity:.5}.comicmap .isl img{transition:none}.btn,.opt-btn{transition:none}}
.safety{background:var(--card);border:2px solid var(--wine);border-radius:0;color:var(--ink)}.safety a{color:var(--wine)}
.foot{border-top:3px solid var(--ink)}
.t-art{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;border-bottom:3px solid var(--ink);margin-bottom:8px}
.comicmap .isl-pic{all:unset;display:block;width:100%;cursor:pointer;min-height:44px}.comicmap .isl-pic:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
.comicmap a.isl-n{color:var(--ink);text-decoration:none;min-height:32px;display:inline-flex;align-items:center;position:relative}.comicmap a.isl-n::before{content:"";position:absolute;inset:-8px -4px}
.comicmap .isl.dim a.isl-n{color:var(--mute)}
.comicmap .mm-m{display:none}
.comicmap .isl.dim img{filter:saturate(.5) sepia(.15) brightness(1.06);opacity:1}
@media(max-width:520px){.minimap.comicmap{aspect-ratio:auto;display:grid;grid-template-columns:1fr 1fr;gap:4px 6px;padding:10px 6px 12px}.comicmap .mm-route{display:none}
.comicmap .isl{position:relative;left:auto!important;top:auto!important;width:auto;transform:none}.comicmap .isl img{width:86%;margin:0 auto}.comicmap .isl-n{margin-top:2px}}
.navbtn,.login-s,.navmore summary{border-radius:0!important;border:2px solid var(--ink)!important;background:var(--card)!important;color:var(--ink)!important;box-shadow:2px 2px 0 var(--ink)}
#app[data-page=lesson]::before,#app[data-page=session]::before,#app[data-page=play]::before{content:"";display:block;height:150px;margin:10px 0 6px;background:#3a2e28 url(img/station.jpg) center 30%/cover;border:3px solid var(--ink);box-shadow:4px 4px 0 var(--ink)}
@media(min-width:700px){#app[data-page=lesson]::before,#app[data-page=session]::before,#app[data-page=play]::before{height:210px}}
.gmap .trail{stroke:#c9a46a}.gmap text{fill:var(--ink)}.pathmap,.growmap{background:var(--card)}
/* 揭曉卡：手機一屏內（390x844 ≤780px）；牌背 60vh */
@media (max-width:600px){.tarot-btn{height:60vh!important;min-height:0!important;max-height:none!important}
.t-front .t-art{aspect-ratio:3/1;margin-bottom:2px;border-bottom-width:2px}
.t-front .aha-card{padding:8px 12px!important;font-size:15.5px;line-height:1.55}.t-front .aha-card p{line-height:1.55;margin:4px 0}
.t-front .aha-k{margin:0 0 2px!important}.t-front .aha-say{margin:4px 0!important;font-size:16.5px;line-height:1.5}
.t-front .aha-turn{margin:2px 0 4px!important;font-size:15px;line-height:1.5}.t-front .aha-did{margin:4px 0!important;font-size:14.5px;line-height:1.5}
.t-front .aha-tw{margin:4px 0!important;padding:4px 10px!important;font-size:14.5px;line-height:1.5}
.t-front .aha-more{margin:2px 0!important}.t-front .aha-more summary{min-height:36px;padding:0 10px}
.t-front .small.mute{margin:4px 0!important;font-size:13px;line-height:1.45}.t-front .aha-fbrow{margin:4px 0!important}.t-front .aha-fbrow .btn{min-height:44px;padding:6px 16px}}
@media (min-width:601px){.t-back,.t-front{width:min(100%,520px);justify-self:center}}
.aha-card{background:var(--card);border:0;border-radius:0;box-shadow:none}.aha-k{color:var(--wine);font-family:Caveat,"Noto Sans TC",sans-serif}
.aha-tw{background:#f6e3cf;border-left:4px solid var(--gold);border-radius:0}.aha-turn{color:var(--leaf)}
.aha-more summary{border-radius:0!important;border:2px solid var(--ink)!important;background:var(--card)!important;color:var(--wine)}
.t-front{overflow:hidden}
.tarot-btn:focus-visible{outline:3px solid var(--gold)!important}@media (min-width:601px){.t-front .t-art{aspect-ratio:21/9}}
.archsvg,.gmap{filter:sepia(.6) saturate(1.3) brightness(.97);border:2px solid var(--ink);border-radius:0!important;background:#f6e3cf}.stats-line,.mylearn-sum{border-radius:0!important}

/* font5: 標題 Iansui（單一字重，禁止合成粗體），內文 Noto Sans TC */
h1,h2,h3,h4,.aha-say,.aha-say b,.brand,[class*=title]{font-family:"Iansui","Noto Sans TC",sans-serif;font-synthesis:none}

/* desktop-fit: 桌機翻開的牌含頂部選單一屏放得下（正反同寬） */
@media (min-width:601px){.t-back,.t-front{width:min(100%,660px)}.tarot{max-width:660px}
.t-front .t-art{aspect-ratio:4/1;margin-bottom:2px}
.t-front .aha-card{padding:10px 18px!important;line-height:1.55}.t-front .aha-card p{margin:5px 0;line-height:1.55}
.t-front .aha-say{margin:4px 0!important}.t-front .aha-turn,.t-front .aha-did,.t-front .aha-tw{margin:4px 0!important}
.t-front .aha-more{margin:2px 0!important}.t-front .small.mute{margin:4px 0!important}.t-front .aha-fbrow{margin:6px 0 2px!important}}

/* 漫畫群島：我的地圖 */
.archsvg{border-radius:0;border:3px solid var(--ink);box-shadow:4px 4px 0 var(--ink);background:#3a2e28}
.archsvg .ai-pic{filter:drop-shadow(0 0 6px rgba(255,214,140,.6))}.archsvg .ai.dim .ai-pic{filter:url(#agray)}
.ai.picked .ai-land{stroke:#f2c14e;stroke-width:4;stroke-opacity:1}.ai.picked .albl rect{fill:#7a2430}.ai.picked .albl text{fill:#fbf4e6}
.growmap .gmap{border:3px solid var(--ink);box-shadow:4px 4px 0 var(--ink);background:#3a2e28}
.growmap .gmap .trail{stroke:#e8cf9c;opacity:.85}
.growmap .gmap .rg path{fill:#e8cf9c;stroke:#2a1d14;stroke-opacity:.3}
.growmap .gmap .rg .rgi{transition:opacity .6s,filter .6s}
.growmap .gmap .rg.lv0 .rgi{opacity:.35;filter:grayscale(1) brightness(1.1)}.growmap .gmap .rg.lv1 .rgi{opacity:.6;filter:saturate(.5)}.growmap .gmap .rg.lv2 .rgi{opacity:.78}.growmap .gmap .rg.lv3 .rgi{opacity:.9}.growmap .gmap .rg.lv4 .rgi{opacity:1;filter:drop-shadow(0 0 6px rgba(255,214,140,.7))}
.growmap .gmap text{fill:#2a1d14;paint-order:stroke;stroke:#f7efdf;stroke-width:5px;stroke-linejoin:round}
@media (prefers-reduced-motion:reduce){.growmap .gmap .rg .rgi{transition:none}}
/* 手機：沒走過的島更淡 */
@media(max-width:520px){.comicmap .isl.dim img{filter:grayscale(.9) brightness(1.12) contrast(.7);opacity:.42}.comicmap .isl.dim .isl-n{opacity:.75}}

/* (b) 證據卡標題列：標籤不壓字 */
.card-fold>summary{display:block!important;line-height:1.5}
.card-fold>summary>b{display:inline}
.card-fold>summary .ev{display:inline-block;white-space:nowrap;writing-mode:horizontal-tb;margin:2px 4px;line-height:1.4;vertical-align:baseline}
.card-fold>summary .hook{display:block;margin-top:.4rem}
/* (a) 選中狀態要有足夠對比 */
.btn.sel,.aha-o.sel,.pl-opt.sel,.exp-btn.sel,.btn[aria-pressed=true],.opt-btn[aria-pressed=true],.opt-btn.sel{background:var(--wine)!important;color:#fbf4e6!important;border-color:var(--ink)!important;outline:0}
.btn.sel *,.aha-o.sel *,.opt-btn.sel *,.opt-btn[aria-pressed=true] *{color:inherit!important}
.scale label:has(input:checked),.opt:has(input:checked),.av:has(input:checked){background:var(--wine)!important;color:#fbf4e6!important;border-color:var(--ink)!important}
.scale label:has(input:checked) *,.opt:has(input:checked) *{color:inherit!important}
.steps li.on{background:var(--wine)!important;color:#fbf4e6!important}
/* (c) 翻牌後收起牌背，不留空白 */
.tarot.flipped .tarot-in{align-items:start}
.tarot.flipped .t-back{height:0!important;min-height:0!important;overflow:hidden;visibility:hidden}
.tarot.flipped .t-back .tarot-btn{height:0!important;min-height:0!important}
.growmap .gmap .rg path{opacity:.22!important}.growmap .gmap .rg.lv0 path{opacity:.1!important}

/* ===== feedback round (CSS only) ===== */
/* (10) 內文字級與對比 */
:root{--mute:#4f4034}
.mute{font-size:15px;color:var(--mute)}
.small{font-size:15px}
.ev{font-size:13px}
/* (1)(2) 手機導覽：矮、找人釘右、可滑提示 */
@media(max-width:819px){
 .top{padding:4px 10px;row-gap:0}
 .top .brand{font-size:18px;line-height:1.2}
 .top nav{gap:2px;-webkit-mask-image:none;mask-image:none;padding-bottom:0}
 .top nav a,.navmore summary{padding:4px 9px;min-height:48px;font-size:14.5px;white-space:nowrap}
 .top nav a[href^="help"]{order:9;position:sticky;right:0;z-index:2;background:var(--card)!important;box-shadow:-8px 0 10px -2px rgba(241,230,210,.95)}
 .top nav a[href^="help"][aria-current]{background:var(--ink)!important}
 .navmore{order:8}
 .navmore-p{top:96px}
 .acct .navbtn{min-height:40px}
}
/* (3) 首頁首屏：地圖改三欄 */
@media(max-width:520px){
 .minimap.comicmap{grid-template-columns:repeat(3,1fr);gap:2px 4px;padding:6px 4px 8px}
 .comicmap .isl img{max-height:84px;object-fit:contain}
}
/* (4) 靜音鍵：小一點、不擋內容 */
@media(max-width:600px){.snd-btn{width:40px;height:40px;right:8px;bottom:8px;opacity:.75}
 main,#app{padding-bottom:60px}}
/* (5) 安全卡：不淡入、高對比 */
.safe-card,.fb .safe-card,.fb:has(.safe-card){animation:none!important;opacity:1!important}
.safe-card,.safe-card *{color:var(--ink)!important}
.safe-card .safe-note{background:#fffaf0;border-left-color:var(--wine)}
.safe-card a,.safe-card .btn{opacity:1!important;filter:none!important}
.safe-card .btn.p,.safe-card a.btn:not(.g){background:var(--wine)!important;color:#fbf4e6!important}
.safety,.safety *{color:var(--ink)}.safety a,.safety-wrap>summary{color:#6e1f2b}
/* (6) 翻牌鍵：裝飾層不吃點擊 */
.tarot-btn::before,.tarot-btn::after,.tarot-btn *,.t-art,.tarot::before,.tarot::after{pointer-events:none}
.tarot-btn{position:relative;z-index:2}
/* (7) 看起來可點 */
.fb{border:2px solid var(--ink)!important;box-shadow:3px 3px 0 var(--ink)!important;color:var(--ink)}
.fb .feel{color:#5a2e14}
a.card{display:block;position:relative;border:2px solid var(--ink);box-shadow:3px 3px 0 var(--ink);padding-right:42px;min-height:48px;color:var(--ink);text-decoration:none}
a.card::after{content:"→";position:absolute;right:14px;top:50%;transform:translateY(-50%);font-weight:700;font-size:20px}
a.card:active{transform:translate(2px,2px);box-shadow:1px 1px 0 var(--ink)}
/* (8) 平行時空與滑桿分組 */
.pl-name{font-size:1em;color:#7a3f14}
.para b{font-size:1.02em}
.spec{background:var(--card);border:2px solid var(--ink);padding:10px 12px;margin-bottom:6px}
.spec+*,.spec~.tap-btn:first-of-type{margin-top:4px}
.play-spec .tap-btn{margin-left:12px;width:calc(100% - 12px);border-left:4px solid var(--wine)}
/* (9) 徽章不壓標題 */
.ev{position:static!important;margin:0 4px 0 0}
.beta{white-space:nowrap;flex:none}
h1 .ev,h2 .ev,h3 .ev{display:inline-block;margin-left:6px;transform:none}
@media(max-width:819px){.top nav a,.navmore summary{height:48px;line-height:1.2;box-sizing:border-box}.top nav{align-items:center}}
@media(max-width:819px){.top nav{height:50px;padding:0!important;margin:0!important}}
.snd-tip{position:absolute;right:calc(100% + 6px);top:50%;transform:translateY(-50%);white-space:nowrap;font-size:13px;line-height:1.3;background:var(--card);color:var(--ink);border:1.5px solid var(--ink);padding:3px 8px;pointer-events:none}
/* (11) 手機地圖：三欄格狀，標籤在島下，不壓地標 */
@media(max-width:520px){
 .minimap.comicmap{display:grid!important;grid-template-columns:repeat(3,1fr)!important;aspect-ratio:auto!important;height:auto!important;gap:4px!important;padding:8px 6px!important;background-size:cover}
 .comicmap .mm-route{display:none!important}
 .comicmap .isl{position:relative!important;left:auto!important;top:auto!important;width:auto!important;transform:none!important;display:flex;flex-direction:column;align-items:center}
 .comicmap .isl img{width:100%;max-height:80px;object-fit:contain}
 .comicmap .isl-n,.comicmap a.isl-n{position:static!important;transform:none!important;margin-top:2px;font-size:12.5px;white-space:nowrap;background:var(--card)}
}
/* (12) 圖例：加大、手繪感 */
.alegend li svg,.alegend li img{flex:none;width:48px!important;height:48px!important;padding:4px;box-sizing:border-box;background:var(--card);border:2px solid var(--ink);border-radius:46% 54% 50% 50%/55% 45% 55% 45%;box-shadow:2px 2px 0 var(--ink)}
.alegend li svg *{stroke-linecap:round;stroke-linejoin:round}
.alegend li{font-size:15px;gap:.6rem}
/* (13) 結帳：停用與選中 */
button[disabled],.btn[disabled],.btn[aria-disabled=true],button[aria-disabled=true]{background:#d9d0c0!important;color:#5a4d40!important;border:2px dashed #7a6a58!important;box-shadow:none!important;cursor:not-allowed;transform:none!important;filter:grayscale(1)}
button[disabled]::after,.btn[aria-disabled=true]::after{content:" ·暫不可用";font-size:.85em;font-weight:400}
[aria-pressed=true]:not(.snd-btn):not(.isl-pic){background:var(--wine)!important;color:#fbf4e6!important;border:2px solid var(--ink)!important;box-shadow:3px 3px 0 var(--ink)!important;position:relative}
[aria-pressed=true]:not(.snd-btn):not(.isl-pic)::before{content:"✓ "}
/* (14) 手機框中框 */
@media(max-width:600px){
 main{padding-left:10px!important;padding-right:10px!important}
 .box .box,.box .card:not(a),.hero .box,.box .para{border:0!important;box-shadow:none!important;background:transparent!important;padding-left:0!important;padding-right:0!important}
 .box{padding-left:14px;padding-right:14px}
}
/* (15) 重排鈕 */
.pl-reset{min-height:48px!important;min-width:96px;font-size:16px!important;padding:8px 18px!important}
/* (16) 情境卡正面：漫畫風 */
.pl-flip:not(.flipped){background:radial-gradient(rgba(42,31,26,.18) 1.2px,transparent 1.4px) 0 0/7px 7px,linear-gradient(rgba(251,244,230,.35),rgba(251,244,230,.35)),url(img/station.jpg) center/cover!important;border:3px solid var(--ink)!important;border-radius:0!important;box-shadow:5px 5px 0 var(--ink);min-height:150px;color:var(--ink)}
.pl-flip:not(.flipped) span{display:inline-block;background:var(--card);border:2.5px solid var(--ink);padding:6px 16px;border-radius:50% 50% 50% 50%/60% 60% 40% 40%;font-family:"Iansui","Noto Sans TC",sans-serif;font-size:1.1em;box-shadow:2px 2px 0 var(--ink)}
.pl-flip:not(.flipped) span::after{content:" ↻";color:var(--wine)}
.btn[aria-pressed=false]{background:var(--card)!important;color:var(--ink)!important;border:2px solid var(--ink)!important}

/* ===== art round：外部插圖 site/art/（不內嵌；缺圖時退回既有圖或無圖） ===== */
.t-front{position:relative}
/* 結帳、收據橫幅（缺圖時只剩紙色網點，不破圖） */
#paybox::before,.receipt::before{content:"";display:block;aspect-ratio:16/9;margin:-4px 0 12px;border:3px solid var(--ink);box-shadow:4px 4px 0 var(--ink);background:url(art/checkout.webp) center/cover,radial-gradient(rgba(42,31,26,.12) 1px,transparent 1.3px) 0 0/7px 7px,var(--card)}
.receipt::before{background-image:url(art/receipt.webp),radial-gradient(rgba(42,31,26,.12) 1px,transparent 1.3px)}
/* 給 Less 之後加的站點插圖 <img class="st-art"> 用：漫畫格框、缺圖隱藏 */
.st-art{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover;border:3px solid var(--ink);box-shadow:4px 4px 0 var(--ink);background:radial-gradient(rgba(42,31,26,.12) 1px,transparent 1.3px) 0 0/7px 7px,var(--card);margin:0 0 14px}
.st-art[data-broken]{display:none}
@media(max-width:600px){.st-art{aspect-ratio:16/9;box-shadow:3px 3px 0 var(--ink)}}

/* ===== B：新 hook 漫畫風 ===== */
.tarot{cursor:pointer}
.paid-line,.theme-note,#owned,.owned{background:var(--card);border:2px solid var(--ink);box-shadow:3px 3px 0 var(--ink);padding:8px 12px;color:var(--ink);font-size:15px}
.paid-line::before{content:"✓ ";color:var(--wine);font-weight:700}
#owned,.owned{border-left:6px solid var(--wine)}
.theme-note{background:#f3ead6;border-style:dashed}
details.wk{background:var(--card);border:2px solid var(--ink);box-shadow:3px 3px 0 var(--ink);margin:10px 0;padding:0 12px}
details.wk>summary{min-height:48px;display:flex;align-items:center;gap:6px;cursor:pointer;font-weight:700;font-family:"Iansui","Noto Sans TC",sans-serif;list-style:none}
details.wk>summary::-webkit-details-marker{display:none}
details.wk>summary::after{content:"＋";margin-left:auto;font-weight:700}
details.wk[open]>summary::after{content:"－"}
details.wk[open]>summary{border-bottom:2px dashed var(--ink)}
.recap{background:#fffaf0;border:2px solid var(--ink);border-radius:18px 18px 18px 4px;padding:10px 14px;box-shadow:3px 3px 0 var(--ink);color:var(--ink);position:relative}
#pwPreview{border:3px solid var(--ink);box-shadow:4px 4px 0 var(--ink);background:radial-gradient(rgba(42,31,26,.1) 1px,transparent 1.3px) 0 0/7px 7px,var(--card);padding:12px 14px;position:relative}
#pwPreview::before{content:"試讀";position:absolute;top:-12px;left:12px;background:var(--ink);color:#fbf4e6;font-size:13px;font-weight:700;padding:1px 10px}
.safety-note{background:#fffaf0;border:2px solid var(--wine);border-left-width:6px;padding:8px 12px;color:var(--ink);font-size:15px}
.safety-note a{color:#6e1f2b;font-weight:700}
.gate-hint{display:inline-block;background:#f3ead6;border:2px dashed var(--ink);padding:6px 12px;color:var(--ink);font-size:15px}
.gate-hint::before{content:"🔒 "}
.spec-lbl{display:flex;justify-content:space-between;gap:8px;font-size:15px;font-weight:700;color:var(--ink);margin:4px 0}
.spec-lbl>*{background:var(--card);border:1.5px solid var(--ink);padding:0 8px}
.pl-rank{background:var(--card);border:2px solid var(--ink);box-shadow:3px 3px 0 var(--ink);padding:8px 12px;font-size:15px!important;color:var(--ink);line-height:1.7}
.pl-howto{font-size:15px;color:var(--ink);background:#f3ead6;border-left:4px solid var(--ink);padding:6px 10px;margin:6px 0 10px}
.pl-reset{border:2px solid var(--ink)!important;box-shadow:2px 2px 0 var(--ink)!important;background:var(--card)!important;color:var(--ink)!important}
.pl-reset::before{content:"↺ "}
.step-folded{opacity:1;background:#f3ead6;border:2px dashed var(--ink);padding:4px 12px;color:var(--ink)}
.fold-tog{min-height:48px;min-width:48px;padding:6px 14px;background:var(--card);border:2px solid var(--ink);box-shadow:2px 2px 0 var(--ink);color:var(--ink);font:inherit;font-size:15px;font-weight:700;cursor:pointer}
.fold-tog:active{transform:translate(2px,2px);box-shadow:none}
.ai-fog{fill:#e6dcc8;stroke:var(--ink);stroke-width:1.5;stroke-dasharray:4 5;opacity:.7}
.legico{width:48px;height:40px;flex:none;background:var(--card);border:2px solid var(--ink);border-radius:46% 54% 50% 50%/55% 45% 55% 45%;box-shadow:2px 2px 0 var(--ink);padding:3px}
.pay-off{border:2px dashed #7a6a58!important;background:#e8e0d0!important;color:#4a3d30!important;box-shadow:none!important}
#payHint{display:block;font-size:15px;color:var(--ink);background:#fffaf0;border:2px solid var(--ink);padding:6px 10px;margin-top:8px}
#payHint:empty{display:none}
.pm-btn{min-height:48px;border:2px solid var(--ink)!important;background:var(--card)!important;color:var(--ink)!important;box-shadow:3px 3px 0 var(--ink)}
.pm-btn.sel,.pm-btn.pm-on,.pm-on,.pm-btn[aria-pressed=true]{background:var(--wine)!important;color:#fbf4e6!important;box-shadow:3px 3px 0 var(--ink)!important}
.pm-btn.sel::before,.pm-btn.pm-on::before{content:"✓ "}
.snd-blocked,.snd-btn.snd-blocked{opacity:1!important;border:2px solid var(--wine)!important;animation:sndPulse 1.6s ease-in-out 3}
@keyframes sndPulse{50%{box-shadow:0 0 0 6px rgba(122,38,50,.25)}}
@media (prefers-reduced-motion:reduce){.snd-blocked{animation:none!important}}
.pl-opt[aria-pressed=true]::before,.tap-btn[aria-pressed=true]::before,.opt-btn[aria-pressed=true]::before,.aha-o[aria-pressed=true]::before{content:none!important}

/* ===== hooks2 ===== */
.st-art[data-broken]{display:none!important}
.pay-proc{display:flex;align-items:center;gap:10px;background:#fffaf0;border:2px solid var(--ink);box-shadow:3px 3px 0 var(--ink);padding:10px 14px;color:var(--ink);font-weight:700;font-size:15px}
.spin{flex:none;display:inline-block;width:22px;height:22px;border:3px solid var(--ink);border-right-color:transparent;border-radius:50%;animation:lessSpin .8s linear infinite}
@keyframes lessSpin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.spin{animation:none;border-right-color:var(--ink);border-style:dotted}}
#paybox.paying,[aria-busy=true]{cursor:progress;position:relative;outline:3px dashed var(--wine);outline-offset:4px}
#paybox.paying .btn,#paybox.paying button,[aria-busy=true] .btn,[aria-busy=true] button{filter:none!important;opacity:1!important;cursor:pointer}
#paybox.paying .btn::after,#paybox.paying button::after,[aria-busy=true] .btn::after,[aria-busy=true] button::after{content:none!important}
#payLegal{font-size:14.5px!important;color:var(--ink)!important;background:#f3ead6;border-left:4px solid var(--ink);padding:6px 10px;line-height:1.7}
#payLegal a{color:#6e1f2b;font-weight:700}
.draft-badge{display:inline-block;background:#fff3c4;border:2px dashed var(--ink);padding:4px 12px;color:var(--ink);font-size:14.5px;transform:rotate(-1deg);box-shadow:2px 2px 0 var(--ink)}
#backOrig{min-height:48px;background:var(--wine)!important;color:#fbf4e6!important;border:2px solid var(--ink)!important;box-shadow:3px 3px 0 var(--ink)!important}
#backOrig::before{content:"← "}

/* ===== 揭曉卡牌面：雨夜復古漫畫 ===== */
/* 牌面：粗黑框＋網點紙 */
.tarot .t-front{border:3px solid var(--ink)!important;background:radial-gradient(rgba(42,31,26,.09) 1px,transparent 1.3px) 0 0/6px 6px,#f7efdf!important;box-shadow:5px 5px 0 var(--ink);padding:8px!important;box-sizing:border-box}
/* 插圖放進一格 */
.tarot .t-front .t-art{border:3px solid var(--ink)!important;margin:0 0 8px!important;box-shadow:3px 3px 0 var(--ink);filter:contrast(1.05) saturate(.9)}
/* 內容區：分格 */
.t-front .aha-card{display:grid;gap:7px;padding:0!important;background:none!important;border:0!important;box-shadow:none!important;font-family:"Noto Sans TC",sans-serif;color:var(--ink)}
.t-front .aha-card>*{margin:0!important}
/* 段落格（之後五段：加 .aha-seg 或 section 即套用） */
.t-front .aha-card>:is(.aha-did,.aha-tw,.aha-turn,.aha-seg,section,details){background:#fffaf0;border:2.5px solid var(--ink);padding:6px 10px;line-height:1.6;font-size:15px;color:var(--ink)}
/* 旁白框：標頭 */
.t-front .aha-k{justify-self:start;background:var(--ink);color:#fbf4e6!important;font-family:"Iansui","Noto Sans TC",sans-serif;font-size:15px;font-weight:400;padding:2px 12px;letter-spacing:.06em;box-shadow:3px 3px 0 var(--wine)}
/* 對話框：主句 */
.t-front .aha-say{position:relative;background:#fff;border:3px solid var(--ink);border-radius:22px 22px 22px 6px;padding:8px 14px;margin-bottom:6px!important}
.t-front .aha-say b{font-family:"Iansui","Noto Sans TC",sans-serif;font-weight:400;font-size:18px;line-height:1.5;color:var(--ink)}
.t-front .aha-say::after{content:"";position:absolute;left:22px;bottom:-12px;width:16px;height:12px;background:#fff;border:3px solid var(--ink);border-top:0;border-right:0;transform:skewX(-35deg);border-radius:0 0 0 4px}
/* 另一種看法：酒紅側條 */
.t-front .aha-turn{border-left:7px solid var(--wine)!important;font-weight:700;color:#4a1a22!important}
/* 你點了什麼：旁白（米黃） */
.t-front .aha-did{background:#f3e3b8!important;font-size:14.5px!important}
.t-front .aha-did::before,.t-front .aha-tw::before,.t-front .aha-seg[data-l]::before{display:block;font-family:"Iansui","Noto Sans TC",sans-serif;font-size:13px;color:var(--wine);letter-spacing:.05em}
.t-front .aha-did::before{content:"你點了什麼"}
.t-front .aha-tw::before{content:"研究怎麼說"}
.t-front .aha-seg[data-l]::before{content:attr(data-l)}
/* 折疊格 */
.t-front .aha-more{padding:0!important}
.t-front .aha-more>summary{min-height:48px;display:flex;align-items:center;padding:0 10px;font-family:"Iansui","Noto Sans TC",sans-serif;font-weight:400;cursor:pointer;list-style:none;color:var(--ink)}
.t-front .aha-more>summary::-webkit-details-marker{display:none}
.t-front .aha-more>summary::after{content:"＋";margin-left:auto}
.t-front .aha-more[open]>summary::after{content:"－"}
.t-front .aha-more[open]>summary{border-bottom:2px dashed var(--ink)}
.t-front .aha-more>:not(summary){padding:4px 10px;margin:0!important}
.t-front .aha-card .small.mute{font-size:13.5px!important;color:#4f4034!important}
/* 回饋列 */
.t-front .aha-fbrow{display:grid!important;grid-template-columns:1fr 1fr;gap:8px}
.t-front .aha-fbrow .btn{min-height:48px!important;border:2.5px solid var(--ink)!important;background:#fff!important;color:var(--ink)!important;box-shadow:3px 3px 0 var(--ink)!important;font-family:"Iansui","Noto Sans TC",sans-serif;font-size:16px!important}
.t-front .aha-fbrow .btn[aria-pressed=true],.t-front .aha-fbrow .btn.sel{background:var(--wine)!important;color:#fbf4e6!important}
.t-front .aha-fbrow .btn:active{transform:translate(2px,2px);box-shadow:1px 1px 0 var(--ink)!important}
@media (prefers-reduced-motion:reduce){.t-front .aha-fbrow .btn:active{transform:none}}
/* 新結構：details.aha-why 內含 turn/tw/src/alt/exp */
.t-front .aha-card>details{padding:0!important;background:#fffaf0}
.t-front .aha-card>details>summary{min-height:48px;display:flex;align-items:center;padding:0 10px;font-family:"Iansui","Noto Sans TC",sans-serif;font-weight:400;font-size:16px;cursor:pointer;list-style:none;color:var(--ink)}
.t-front .aha-card>details>summary::-webkit-details-marker{display:none}
.t-front .aha-card>details>summary::after{content:"＋";margin-left:auto;font-weight:700}
.t-front .aha-card>details[open]>summary::after{content:"－"}
.t-front .aha-card>details[open]>summary{border-bottom:2.5px solid var(--ink)}
.t-front .aha-card>details>:not(summary){margin:6px 8px!important;padding:5px 9px;border:2px solid var(--ink);background:#fff;font-size:14.5px;line-height:1.6;color:var(--ink)}
.t-front .aha-card>details>.aha-src{border:0;background:none;padding:0 2px;font-size:13px!important}
.t-front .aha-card>details>.aha-alt{background:#eef0ea;border-style:dashed}
.t-front .aha-card>details>.aha-exp{background:#f3e3b8;box-shadow:2px 2px 0 var(--ink)}
.t-front .aha-card>details>:is(.aha-alt,.aha-exp)>b:first-child{font-family:"Iansui","Noto Sans TC",sans-serif;font-weight:400;color:var(--wine)}
.t-front .aha-card>details>.aha-turn{border-left:6px solid var(--wine)}
/* 展開時壓縮：插圖格變窄、段落緊排，守住 ≤780 */
.tarot .t-front:has(.aha-card>details[open]) .t-art{aspect-ratio:6/1!important;object-position:center 30%}
.t-front .aha-card>details[open]>:not(summary){margin:4px 6px!important;padding:3px 8px;line-height:1.5;border-width:0 0 0 3px}
.t-front .aha-card>details[open]>.aha-exp{border-width:2px}
.t-front .aha-card:has(>details[open]){gap:5px}
.t-front .aha-card:has(>details[open])>.aha-did{line-height:1.5}
@media(max-width:600px){
 .tarot .t-front:has(.aha-card>details[open]){padding:6px!important}
 .tarot .t-front:has(.aha-card>details[open]) .t-art{aspect-ratio:8/1!important;margin-bottom:5px!important}
 .t-front .aha-card>details[open]>:not(summary){font-size:14px;margin:3px 4px!important}
 .t-front .aha-card:has(>details[open])>.aha-say{padding:6px 12px}
 .t-front .aha-card:has(>details[open])>.aha-say b{font-size:17px}
}
.t-front .aha-say::after{content:"";position:absolute;left:24px;bottom:-15px;width:20px;height:15px;background:var(--ink);border:0;border-radius:0;transform:none;clip-path:polygon(0 0,100% 0,10% 100%)}
.t-front .aha-say::before{content:"";position:absolute;z-index:1;left:28px;bottom:-8px;width:12px;height:9px;background:#fff;clip-path:polygon(0 0,100% 0,8% 100%)}

/* ===== r5 2300：揭曉五段對齊、限高、adds、不是諮商、peek、已選、手機導航 ===== */
/* 五段標籤：一律用 data-l，蓋掉舊「你點了什麼／研究怎麼說」 */
.t-front .aha-did::before,.t-front .aha-tw::before{content:attr(data-l)}
.t-front .aha-card>details>.aha-seg[data-l]::before{display:block;font-family:"Iansui","Noto Sans TC",sans-serif;font-size:13px;font-weight:400;color:var(--wine);letter-spacing:.06em;margin-bottom:1px}
.t-front .aha-card>details>.aha-seg[data-l]{border:0 0 0 3px solid var(--ink)}
.t-front .aha-card>details>.aha-tw{background:#f6e3cf;border-left:4px solid var(--gold)!important}
.t-front .aha-card>details>.aha-turn{color:#4a1a22;font-weight:700}
/* 修正行 */
.aha-fix{font-family:"Noto Sans TC",sans-serif;font-size:14px;line-height:1.5;color:#2a1d14;background:#fff;border:2.5px dashed var(--wine);padding:5px 10px 5px 30px;position:relative;margin:0}
.aha-fix::before{content:"✎";position:absolute;left:9px;top:4px;color:var(--wine);font-weight:700}
/* 1) 展開後牌內可捲：summary 黏頂、底部可見提示 */
.t-front .aha-card>details.aha-why[open]{max-height:var(--why-max,290px);overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;scrollbar-width:thin;scrollbar-color:var(--wine) #f1e6d2;
 background:linear-gradient(#fffaf0 30%,rgba(255,250,240,0)) center top/100% 28px no-repeat local,linear-gradient(rgba(255,250,240,0),#fffaf0 70%) center bottom/100% 28px no-repeat local,radial-gradient(farthest-side at 50% 100%,rgba(36,24,16,.35),transparent) center bottom/100% 14px no-repeat scroll,#fffaf0!important}
.t-front .aha-card>details.aha-why[open]>summary{position:sticky;top:0;z-index:2;background:#fffaf0}
.t-front .aha-card>details.aha-why[open]::after{content:"▼ 往下滑看完整內容";position:sticky;bottom:0;display:block;text-align:center;font-family:"Iansui","Noto Sans TC",sans-serif;font-size:12.5px;color:#fbf4e6;background:var(--ink);padding:2px 0;margin-top:4px;pointer-events:none}
.t-front .aha-card>details.aha-why[open]::-webkit-scrollbar{width:6px}
.t-front .aha-card>details.aha-why[open]::-webkit-scrollbar-thumb{background:var(--wine)}
@media(min-width:820px){.t-front .aha-card>details.aha-why[open]{--why-max:200px}}
/* 2) adds 獨立成行 */
.card-adds,.price-adds{display:block!important;margin:4px 0 6px;font-size:14px;line-height:1.55;color:#3a2a1e;font-weight:400}
.card-adds{border-left:4px solid var(--terra);padding-left:8px}
.price-adds{background:#f3e3b8;border:2px solid var(--ink);padding:6px 10px}
/* 3) 不是諮商（頁尾、真人協助、關於）與 peek */
.not-counsel{background:#fffaf0;border:2.5px solid var(--ink);box-shadow:4px 4px 0 var(--ink);border-radius:0;padding:8px 12px 8px 40px;position:relative;color:#2a1d14;line-height:1.6}
.not-counsel::before{content:"!";position:absolute;left:10px;top:8px;width:22px;height:22px;display:flex;align-items:center;justify-content:center;background:var(--wine);color:#fbf4e6;font-family:"Iansui","Noto Sans TC",sans-serif;font-weight:700;border-radius:50%}
.not-counsel b{font-family:"Iansui","Noto Sans TC",sans-serif;font-weight:400;color:var(--wine)}
.box.alert.not-counsel{background:#fffaf0!important;border:2.5px solid var(--ink)!important;border-radius:0!important}
.box.alert.not-counsel p{margin:0}
footer .not-counsel,.foot .not-counsel{box-shadow:2px 2px 0 var(--ink);font-size:13.5px;padding:6px 10px 6px 36px}
footer .not-counsel::before,.foot .not-counsel::before{top:6px;width:20px;height:20px}
.peek{background:#fff;border:2.5px solid var(--ink);box-shadow:5px 5px 0 var(--terra);border-radius:0;padding:10px 14px;margin:14px 0;position:relative}
.peek::before{content:"偷看下一段";display:inline-block;background:var(--ink);color:#fbf4e6;font-family:"Iansui","Noto Sans TC",sans-serif;font-size:13px;padding:1px 8px;margin-bottom:6px}
.peek p{margin:4px 0;color:#2a1d14}
/* 4) 已選：底色＋粗框＋勾號，非只靠顏色 */
[aria-pressed=true]:not(.snd-btn):not(.isl-pic),.btn.sel,.opt-btn.sel,.aha-o.sel,.pl-opt.sel,.exp-btn.sel,.tap-btn.sel{background:#5e1a26!important;color:#fff!important;border:3px solid var(--ink)!important;box-shadow:3px 3px 0 var(--ink),inset 0 0 0 2px #fbf4e6!important;font-weight:700!important}
[aria-pressed=true]:not(.snd-btn):not(.isl-pic)::before,.btn.sel::before,.opt-btn.sel::before,.aha-o.sel::before,.pl-opt.sel::before,.exp-btn.sel::before,.tap-btn.sel::before{content:"✓ "!important;font-weight:900}
[aria-pressed=true]:not(.snd-btn):not(.isl-pic) *,.sel *{color:inherit!important}
/* 5) 手機導航：找人移上排、更多不被蓋；聲音鈕 48、提示泡泡上移不壓內容 */
@media(max-width:600px){
 .top{position:sticky}
 .top nav{gap:4px!important;justify-content:space-between}
 .top nav a,.navmore summary{padding:4px 8px!important;font-size:14.5px}
 .top nav a[href^="help"]{position:absolute!important;top:4px;right:72px;height:48px!important;min-height:48px!important;box-shadow:none!important;border:2px solid var(--ink)!important;order:0}
 .acct .navbtn,.top .login-s{min-height:48px!important;height:48px}
 .snd-btn{width:48px!important;height:48px!important;right:8px;bottom:10px;opacity:1}
 .snd-tip{right:0!important;left:auto;top:auto!important;bottom:calc(100% + 8px);transform:none!important;font-size:12.5px}
 main,.wrap{padding-bottom:72px}
}
@media(max-width:600px){.snd-tip{position:absolute!important;width:1px!important;height:1px!important;overflow:hidden!important;clip:rect(0 0 0 0)!important;white-space:nowrap;padding:0!important;border:0!important}}

/* ===== r6 2355：桌機整張牌一屏內；.aha-cat、.arch-empty ===== */
.tarot,.tarot .t-front{scroll-margin-top:96px}
@media(min-width:601px){
 .tarot.flipped .t-front{display:flex!important;flex-direction:column;max-height:calc(100vh - 116px);max-height:calc(100dvh - 116px);overflow:hidden;box-sizing:border-box}
 .tarot.flipped .t-front>*{flex:0 0 auto}
 .tarot.flipped .t-front .t-art{flex:0 1 auto;min-height:36px;height:clamp(36px,calc(100dvh - 620px),180px)!important;aspect-ratio:auto!important;width:100%;object-fit:cover;object-position:center 30%}
 .tarot.flipped .t-front:has(.aha-card>details[open]) .t-art{height:clamp(36px,calc(100dvh - 700px),110px)!important}
 .tarot.flipped .t-front .aha-card{flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:var(--wine) #f1e6d2;padding-right:4px!important;
  background:linear-gradient(#f7efdf 30%,rgba(247,239,223,0)) center top/100% 24px no-repeat local,linear-gradient(rgba(247,239,223,0),#f7efdf 70%) center bottom/100% 24px no-repeat local,radial-gradient(farthest-side at 50% 0,rgba(36,24,16,.3),transparent) center top/100% 12px no-repeat scroll,radial-gradient(farthest-side at 50% 100%,rgba(36,24,16,.38),transparent) center bottom/100% 14px no-repeat scroll!important}
 .tarot.flipped .t-front .aha-card>details.aha-why[open]{max-height:none!important;overflow:visible!important}
 .tarot.flipped .t-front .aha-card>details.aha-why[open]>summary{position:static}
}
/* 每一題的分類 */
.t-front .aha-card>details>.aha-cat,.aha-cat{background:#fff!important;border:2px solid var(--ink)!important;border-left-width:2px!important;box-shadow:2px 2px 0 var(--ink);font-size:14px;line-height:1.7;color:#2a1d14;counter-reset:cat}
.aha-cat::before{color:var(--wine)!important}
/* 空白群島 */
.arch-empty{position:relative;margin:14px auto!important;max-width:30em;background:#fffaf0;border:2.5px solid var(--ink);border-radius:20px 20px 20px 6px;box-shadow:4px 4px 0 var(--ink);padding:10px 14px 10px 44px;color:#3a2a1e!important;font-size:14.5px!important;line-height:1.65}
.arch-empty::before{content:"🏝";position:absolute;left:12px;top:9px;font-size:20px;filter:grayscale(.6) sepia(.4)}
@media(max-width:600px){.tarot,.tarot .t-front{scroll-margin-top:120px}}

/* ===== r7 0030：aha-echo、res-plain、lens-*、heavy3 ===== */
/* 跨站回聲：在 details 牌內捲動區內，緊湊不增高 */
.t-front .aha-card>details>.aha-echo{background:#eef0ea!important;border:0!important;border-left:3px dotted var(--ink)!important;padding:3px 8px!important;margin:4px 6px!important;font-size:13.5px!important;line-height:1.5;color:#2a1d14;font-style:normal}
.t-front .aha-card>details>.aha-echo::before{color:#3d5a4a!important}
/* 研究白話一句 */
.res-plain{background:#f3e3b8;border:2.5px solid var(--ink);box-shadow:3px 3px 0 var(--ink);padding:8px 12px;margin:8px 0 10px;line-height:1.6;color:#2a1d14}
.res-plain b{font-family:"Iansui","Noto Sans TC",sans-serif;font-weight:400;color:var(--wine);margin-right:2px}
/* 哲學：你站哪邊 */
.lens-turn{margin:14px 0 4px;background:#fff;border:2.5px solid var(--ink);box-shadow:4px 4px 0 var(--wine);padding:10px 12px;position:relative}
.lens-turn::before{content:"你站哪邊？";position:absolute;top:-12px;left:10px;background:var(--ink);color:#fbf4e6;font-family:"Iansui","Noto Sans TC",sans-serif;font-size:13px;padding:1px 8px}
.lens-t{margin:6px 0 4px!important;color:#3a2a1e;line-height:1.6;font-size:14.5px}
.lens-q{margin:4px 0 8px!important}
.lens-q b{font-family:"Iansui","Noto Sans TC",sans-serif;font-weight:400;font-size:17px;color:var(--ink)}
.lens-turn .row{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr));gap:8px}
.lens-side{min-height:48px!important;height:auto!important;white-space:normal!important;text-align:left;justify-content:flex-start;border:2.5px solid var(--ink)!important;background:#fffaf0!important;color:var(--ink)!important;border-radius:0!important;box-shadow:2px 2px 0 var(--ink);padding:8px 12px!important;line-height:1.45}
.lens-side[aria-pressed=true]{background:#5e1a26!important;color:#fff!important;border:3px solid var(--ink)!important;box-shadow:3px 3px 0 var(--ink),inset 0 0 0 2px #fbf4e6!important}
.lens-fb{margin:8px 0 0!important;min-height:1.4em;color:#4f4034!important;font-size:13.5px}
.lens-fb:not(:empty){border-top:2px dashed var(--ink);padding-top:6px}
/* 1925 小卡 */
.box.heavy3{background:#fffaf0!important;border:2.5px solid var(--ink)!important;border-radius:0!important;box-shadow:4px 4px 0 var(--ink)!important;padding:10px 12px 10px 44px!important;margin:12px 0!important;position:relative;display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.box.heavy3::before{content:"☎";position:absolute;left:12px;top:10px;width:22px;height:22px;display:flex;align-items:center;justify-content:center;background:var(--wine);color:#fbf4e6;border-radius:50%;font-size:13px}
.box.heavy3 p{margin:0;flex:1 1 220px;line-height:1.6;color:#2a1d14}
.box.heavy3 b{font-family:"Iansui","Noto Sans TC",sans-serif;font-weight:400;font-size:18px;color:var(--wine)}
.heavy3-skip{min-height:48px!important;min-width:72px;border:2px solid var(--ink)!important;background:#fff!important;color:var(--ink)!important;border-radius:0!important;margin-left:auto}

/* ===== r8 0100：我的句子 .ex-*、小實驗回訪 .xr-*、重走 .rv-* ===== */
.ex-wrap,.xr-card,.rv-wrap,.rv-list{background:var(--card)!important;border:3px solid var(--ink)!important;border-radius:0!important;box-shadow:5px 5px 0 var(--ink)!important;padding:14px!important;margin:16px 0!important;max-width:100%;overflow-wrap:anywhere}
:is(.ex-wrap,.xr-card,.rv-wrap,.rv-list) h2{font-family:"Iansui","Noto Sans TC",sans-serif;font-weight:400}
:is(.ex-wrap,.xr-card,.rv-wrap,.rv-list) .tag,.ex-card .tag{display:inline-block;background:var(--ink)!important;color:#fbf4e6!important;font-family:"Iansui","Noto Sans TC",sans-serif;font-size:13px;padding:1px 8px;border-radius:0!important;margin:0 0 6px;border:0}
:is(.ex-wrap,.xr-card,.rv-wrap,.rv-list) .mute{color:#4f4034!important}
/* 匯出 */
.ex-layout{display:grid;gap:16px;grid-template-columns:minmax(0,1fr)}
@media(min-width:820px){.ex-layout{grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);align-items:start}}
.ex-pick>p.small{margin:12px 0 6px;font-family:"Iansui","Noto Sans TC",sans-serif}
.ex-list{max-height:min(46vh,320px);overflow-y:auto;overscroll-behavior:contain;border:2.5px solid var(--ink);background:#fffaf0;padding:6px;display:grid;gap:6px;scrollbar-width:thin;scrollbar-color:var(--wine) #f1e6d2;
 background:linear-gradient(#fffaf0 30%,rgba(255,250,240,0)) center top/100% 20px no-repeat local,linear-gradient(rgba(255,250,240,0),#fffaf0 70%) center bottom/100% 20px no-repeat local,radial-gradient(farthest-side at 50% 100%,rgba(36,24,16,.35),transparent) center bottom/100% 12px no-repeat scroll,#fffaf0}
.ex-item{display:flex;align-items:center;gap:10px;min-height:48px;padding:6px 10px;border:2px solid var(--ink);background:#fff;cursor:pointer;line-height:1.5;color:var(--ink)}
.ex-item input{flex:none;width:22px;height:22px;margin:0;accent-color:#5e1a26}
.ex-item .mute{display:block;font-size:12.5px}
.ex-item:has(input:checked){background:#5e1a26;color:#fff;border:3px solid var(--ink);box-shadow:2px 2px 0 var(--ink),inset 0 0 0 2px #fbf4e6;font-weight:700}
.ex-item:has(input:checked) .mute{color:#f3e3d0!important;font-weight:400}
.ex-item:has(input:focus-visible){outline:3px solid var(--gold);outline-offset:2px}
.ex-shape,.ex-date{display:flex;flex-wrap:wrap;gap:8px}
.ex-opt{min-height:48px!important;border:2.5px solid var(--ink)!important;border-radius:0!important;background:#fffaf0!important;color:var(--ink)!important;box-shadow:2px 2px 0 var(--ink)}
.ex-preview{display:grid;gap:10px;justify-items:center;min-width:0}
.ex-card{width:100%;max-width:420px;aspect-ratio:4/5;background:radial-gradient(rgba(42,31,26,.09) 1px,transparent 1.3px) 0 0/6px 6px,#f7efdf;border:4px solid var(--ink);box-shadow:6px 6px 0 var(--ink);padding:14px;display:flex;flex-direction:column;gap:10px;overflow:hidden;box-sizing:border-box}
.ex-card[data-r="11"]{aspect-ratio:1/1}
.ex-card[data-r="wall"]{aspect-ratio:9/16;max-width:min(100%,340px)}
@media(min-width:820px){.ex-card[data-r="wall"]{max-width:none;width:auto;height:min(68vh,560px)}.ex-card{max-height:68vh}.ex-card[data-r="45"]{width:min(100%,calc(68vh*.8))}.ex-card[data-r="11"]{width:min(100%,68vh)}}
.ex-card .tag{align-self:flex-start;margin:0}
.ex-art{display:block;width:100%;flex:1 1 50%;min-height:0;object-fit:cover;object-position:center 35%;border:3px solid var(--ink);box-shadow:3px 3px 0 var(--ink);filter:contrast(1.05) saturate(.9)}
.ex-quote{flex:1 1 auto;min-height:0;margin:0!important;background:#fff;border:3px solid var(--ink);border-radius:22px 22px 22px 6px;padding:10px 14px;font-family:"Iansui","Noto Sans TC",sans-serif;font-size:clamp(17px,4.6vw,21px);line-height:1.5;color:var(--ink);display:flex;align-items:center;overflow:hidden}
.ex-foot{margin:0!important;display:flex;justify-content:space-between;gap:8px;font-size:12.5px;color:#3a2a1e;border-top:2px dashed var(--ink);padding-top:6px}
.ex-src{font-family:"Iansui","Noto Sans TC",sans-serif}.ex-dt{font-variant-numeric:tabular-nums;white-space:nowrap}
.ex-preview .row{width:100%;max-width:420px}
.ex-save{flex:1;min-height:52px!important;background:var(--wine)!important;color:#fff!important;border:3px solid var(--ink)!important;border-radius:0!important;box-shadow:3px 3px 0 var(--ink)!important;font-family:"Iansui","Noto Sans TC",sans-serif;font-size:17px}
.ex-hint{margin:0!important;max-width:420px;width:100%;font-size:13px}
.ex-hint::before{content:"🔒 ";filter:grayscale(1)}
.ex-fb{margin:0!important;max-width:420px;width:100%;color:#2a1d14}
.ex-fb:not(:empty){background:#eef0ea;border:2px solid var(--ink);padding:6px 10px}
/* 回訪 */
.xr-q{font-family:"Iansui","Noto Sans TC",sans-serif;font-size:18px;line-height:1.55;background:#fff;border:3px solid var(--ink);border-radius:22px 22px 22px 6px;padding:10px 14px;margin:8px 0 12px!important;color:var(--ink)}
.xr-card>p>b{font-family:"Iansui","Noto Sans TC",sans-serif;font-weight:400;font-size:17px}
.xr-opts{display:flex;flex-direction:column;gap:8px;max-width:520px}
.xr-opt{min-height:48px!important;width:100%;justify-content:flex-start;text-align:left;border:2.5px solid var(--ink)!important;border-radius:0!important;background:#fffaf0!important;color:var(--ink)!important;box-shadow:2px 2px 0 var(--ink);padding:8px 14px!important}
.xr-fb{margin:12px 0 0!important;max-width:520px;color:#2a1d14;line-height:1.6}
.xr-fb:not(:empty){border:2.5px dashed var(--ink);background:#fffaf0;padding:8px 12px}
.xr-next{margin-top:10px;max-width:520px}
.xr-next .btn{flex:1;min-height:48px;background:var(--wine)!important;color:#fff!important;border:3px solid var(--ink)!important;border-radius:0!important;box-shadow:3px 3px 0 var(--ink)!important}
/* 重走 */
.rv-tabs{display:flex;border:2.5px solid var(--ink);margin:10px 0}
.rv-tab{flex:1;min-height:48px!important;border:0!important;border-radius:0!important;box-shadow:none!important;background:#fffaf0!important;color:var(--ink)!important}
.rv-tab+.rv-tab{border-left:2.5px solid var(--ink)!important}
.rv-tabs .rv-tab[aria-pressed=true]{box-shadow:inset 0 0 0 2px #fbf4e6!important;border:0!important}
.rv-pair{display:grid;gap:12px;grid-template-columns:minmax(0,1fr)}
.rv-col{background:#fff;border:3px solid var(--ink);padding:10px 12px;min-width:0}
.rv-col[data-w=then]{background:#f3ead8}
.rv-col[data-w=now]{box-shadow:4px 4px 0 var(--wine)}
.rv-h{margin:0 0 4px!important}.rv-h b{font-family:"Iansui","Noto Sans TC",sans-serif;font-weight:400;font-size:17px}
.rv-row{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 8px;border-top:2px dashed var(--ink);padding:8px 0;min-height:48px;box-sizing:border-box}
.rv-row>.mute{flex:1 0 100%}
.rv-pick{font-weight:700;color:#2a1d14}
.rv-same{display:inline-block;font-size:12px;line-height:1.5;background:#eef0ea;color:#2a3d30;border:1.5px solid var(--ink);padding:0 7px}
.rv-end{margin:12px 0 0!important;border-top:2px dashed var(--ink);padding-top:8px}
@media(max-width:819px){.rv-wrap[data-show=then] .rv-col[data-w=now],.rv-wrap[data-show=now] .rv-col[data-w=then]{display:none}}
@media(min-width:820px){.rv-tabs{display:none!important}.rv-pair{grid-template-columns:1fr 1fr}.rv-col{display:block!important}}
.rv-list>p{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;border-top:2px dashed var(--ink);padding:8px 0;margin:0}
.rv-again{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;margin:0!important}
.rv-start{min-height:48px!important;border:2.5px solid var(--ink)!important;border-radius:0!important;background:var(--wine)!important;color:#fff!important;box-shadow:3px 3px 0 var(--ink)!important;font-family:"Iansui","Noto Sans TC",sans-serif}
html body .box.rv-wrap,html body .box .box.rv-wrap{background:var(--card)!important;border:3px solid var(--ink)!important;box-shadow:5px 5px 0 var(--ink)!important;padding:14px!important;margin:16px 0!important;border-radius:0!important}
/* === header auto-hide (phone <=819px; App/standalone leaner) 2026-10-28 === */
@media (max-width:819px){
.top{transition:transform .25s ease;will-change:transform}
html.hdr-hidden .top{transform:translateY(calc(-100% - 4px))}
html.hdr-hidden .top .navmore-p{display:none}
html.standalone .top{padding-top:calc(4px + env(safe-area-inset-top,0px))}
html.standalone .top .beta{display:none}
html.standalone .top .logo{font-size:16px;line-height:1}
html.standalone.hdr-hidden .top{transform:translateY(calc(-100% + 6px + env(safe-area-inset-top,0px)))}
html.standalone.hdr-hidden .top>*{visibility:hidden}
}
@media (max-width:819px) and (display-mode:standalone){
.top{padding-top:calc(4px + env(safe-area-inset-top,0px))}
.top .beta{display:none}
}
@media (prefers-reduced-motion:reduce){.top{transition:none!important}}
/* === end header auto-hide === */

/* 「其他」短句輸入（Less 合併時加，UI 設計師可再調） */
.oth-box{display:grid;gap:8px}.oth-box input{width:100%;box-sizing:border-box;font:inherit;padding:10px 12px;border:1px solid #ccc;border-radius:10px}
/* 頁首自動收合：錨點跳轉時標題不被頁首蓋住（Less 2026-10-28 修，UI 設計師可再調） */
@media (max-width:819px){#app h1,#app h2{scroll-margin-top:96px}}

/* ---- 給 UI 設計師（2026-10-28 14:00）：站內位置列 .posbar。只新增這一塊＋把 h1 的 scroll-margin 加大，沒有動既有規則。
   位置列黏在 header 下方（--pb-top 由 JS 依 header 是否收起設定），所以不會被 header 蓋住，也不會蓋住標題。 ---- */
.posbar{position:sticky;top:var(--pb-top,0px);z-index:9;display:block;margin:0 -14px 10px;padding:9px 14px 7px;background:#fffaf2;box-shadow:0 2px 6px rgba(0,0,0,.06);border-bottom:1px solid var(--line);color:var(--ink);text-decoration:none;font-size:13px;line-height:1.35;transition:top .25s ease}
.posbar .pb-l1{display:flex;gap:8px;align-items:baseline;white-space:nowrap}
.posbar .pb-l1 b{overflow:hidden;text-overflow:ellipsis;max-width:46%}
.posbar .pb-step{margin-left:auto;font-weight:700;color:var(--acc)}
.posbar .pb-desc{display:block;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;opacity:.8}
.posbar .pb-dots{display:flex;gap:4px;margin-top:4px;flex-wrap:wrap}
.pb-dot{width:7px;height:7px;border-radius:50%;border:1.5px solid var(--ink);opacity:.55}
.pb-dot.done{background:var(--ink);opacity:.8}
.pb-dot.cur{background:var(--acc);border-color:var(--acc);opacity:1;transform:scale(1.35)}
@media (max-width:819px){#app h1,#app h2{scroll-margin-top:160px}}
@media (prefers-reduced-motion:reduce){.posbar{transition:none}}
/* ---- 給 UI 設計師（14:05）：站底「最近這樣的感覺很重？這裡有人可以聊」一行。低調但永遠找得到；只新增這一條。 ---- */
.safe-line{margin:18px 0 6px;text-align:center}.safe-line-btn{background:none;border:0;padding:10px 4px;min-height:44px;color:var(--ink);opacity:.75;font-size:14px;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
/* ---- 給 UI 設計師（14:10）：滑桿光譜改用新 class .spec2（舊 .spec 規則不再被用到，沒刪）。兩端標籤貼齊線的兩端；五個圓點平均分佈，第一個在最左、最後一個在最右、中間的正中。 ---- */
.spec2{background:var(--card);border:2px solid var(--ink);padding:10px 12px;margin-bottom:8px}
.spec2 .spec-ends{display:flex;justify-content:space-between;gap:12px;font-weight:700;font-size:15px;line-height:1.35}
.spec2 .se-l{text-align:left;max-width:48%}.spec2 .se-r{text-align:right;max-width:48%;margin-left:auto}
.spec2 .spec-hint{margin:8px 0 2px;font-size:13px;opacity:.75}
.spec2 .spec-track{position:relative;display:flex;justify-content:space-between;align-items:center;height:48px;padding:0;cursor:pointer}
.spec2 .spec-line{position:absolute;left:14px;right:14px;top:50%;height:3px;margin-top:-1.5px;background:var(--ink);border-radius:2px}
.spec2 .dot{position:relative;flex:none;width:28px;height:28px;margin:0;padding:0;border-radius:50%;border:2px solid var(--ink);background:#fff;cursor:pointer}
.spec2 .dot::after{content:"";position:absolute;inset:-8px}
.spec2 .dot.sel{background:var(--acc);border-color:var(--acc);box-shadow:0 0 0 4px rgba(0,0,0,.08)}
.spec2 .spec-sides{display:flex;justify-content:space-between;gap:6px;margin-top:4px}
.spec2 .spec-side{flex:1 1 0;min-height:44px;background:none;border:1.5px solid var(--ink);padding:4px 6px;font-size:13px;line-height:1.3;color:var(--ink);cursor:pointer}
.spec2 .spec-side:first-child{text-align:left}.spec2 .spec-side:last-child{text-align:right}.spec2 .spec-side:nth-child(2){flex:0 0 auto}
.spec-other{margin-top:8px}

/* [2026-10-28 我的專屬作品] 信紙與作品預留位置（新增，不改既有樣式） */
.letter{background:#fbf4e6;border:1px solid #d8c6a3;border-radius:6px;padding:22px 20px;line-height:1.95;font-size:1.02rem;box-shadow:0 2px 0 #e9dcc2}
.letter p{margin:0 0 .7em}.letter .lt-to{font-weight:600}.letter .lt-from{text-align:right;margin-top:1em;color:#5b4636}
.works-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px}
.work-ph-art{aspect-ratio:3/4;border:2px dashed #c9b48f;border-radius:8px;display:flex;align-items:center;justify-content:center;color:#9a8a78;font-size:.9rem;background:#fffaf2}
.work-ph p{margin:.4em 0 0}

/* [2026-10-28 圖例] 你的島上的地貌：一行一句，不分兩欄 */
.alegend ul.alegend-me{grid-template-columns:1fr}

/* [2026-10-28 價格] 兩種購買選項並排；手機上下排 */
.buy-opts{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px;margin:.6rem 0}
.buy-opt{border:1px solid #d8c6a3;border-radius:10px;padding:12px 14px;background:#fffaf2}
.buy-opt p{margin:.2rem 0}.buy-opt .btn{margin-top:.5rem;width:100%;text-align:center}
.price-list{white-space:nowrap}
.works-next{margin:14px 0 0}.works-next .btn{width:100%}.works-toc{margin:8px 0 14px}