/* ===== 卯木塔羅紫微｜全站樣式 ===== */
[hidden]{display:none!important}
:root{
  --bg:#ffffff; --card:#ffffff; --nav-bg:rgba(255,255,255,.92); --foot:#fcfbff; --input:#ffffff; --soft:#f7f4ff; --soft2:#fbf8f1; --line:#ece7f6; --line2:#e2d9fa;
  --text:#1f1a2e; --muted:#6c6680; --faint:#9a94ad;
  --pri:#7c3aed; --pri2:#a78bfa; --pri-soft:#f1ebff; --gold:#b8892f; --gold-soft:#fbf3e0;
  --rose:#e8618c; --green:#2f9e6e; --radius:16px; --shadow:0 6px 24px rgba(76,48,140,.08);
  --serif:"Noto Serif TC","Noto Serif CJK TC","Songti TC","PMingLiU",serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--bg)}
body{margin:0;color:var(--text);background:var(--bg);font-family:"Noto Sans TC","Noto Sans CJK TC","PingFang HK","Microsoft JhengHei",system-ui,-apple-system,sans-serif;line-height:1.65;-webkit-font-smoothing:antialiased}
a{color:var(--pri);text-decoration:none}
a:hover{text-decoration:underline}
img,svg{max-width:100%}
.wrap{max-width:1080px;margin:0 auto;padding:0 20px}
.narrow{max-width:820px}
/* --- 導航 --- */
.nav{position:sticky;top:0;z-index:50;background:var(--nav-bg);backdrop-filter:saturate(180%) blur(10px);border-bottom:1px solid var(--line)}
.nav .wrap{display:flex;align-items:center;height:62px;gap:18px}
.brand{display:flex;align-items:center;gap:10px;font-weight:800;color:var(--text);font-size:1.12rem;letter-spacing:.04em;white-space:nowrap}
.brand:hover{text-decoration:none}
.brand svg{width:34px;height:34px;flex:none}
.menu{display:flex;gap:4px;margin-left:auto;align-items:center}
.menu a{color:var(--text);padding:8px 12px;border-radius:10px;font-size:.95rem;white-space:nowrap}
.menu a:hover{background:var(--soft);text-decoration:none}
.menu a.on{color:var(--pri);font-weight:700;background:var(--pri-soft)}
.menu a.cta-btn{background:var(--pri);color:#fff;font-weight:700;margin-left:6px}
.menu a.cta-btn:hover{background:#6d28d9}
.burger{display:none;margin-left:auto;background:none;border:1px solid var(--line);border-radius:10px;width:42px;height:38px;font-size:1.2rem;cursor:pointer;color:var(--text)}
@media (max-width:860px){
  .burger{display:block}
  .menu{display:none;position:absolute;top:62px;left:0;right:0;background:var(--card);flex-direction:column;align-items:stretch;padding:10px 16px 16px;border-bottom:1px solid var(--line);box-shadow:var(--shadow)}
  .menu.open{display:flex}
  .menu a{padding:12px}
  .menu a.cta-btn{margin:6px 0 0;text-align:center}
}
/* --- 標題 / 區塊 --- */
.page-head{text-align:center;padding:52px 0 26px}
.page-head h1{font-size:clamp(1.8rem,4.6vw,2.6rem);margin:0 0 8px;letter-spacing:.04em;font-weight:800}
.page-head p{color:var(--muted);margin:0}
.eyebrow{display:inline-block;font-size:.82rem;color:var(--pri);background:var(--pri-soft);border-radius:999px;padding:3px 12px;margin-bottom:12px;font-weight:600;letter-spacing:.08em}
.checks{display:flex;justify-content:center;gap:16px;flex-wrap:wrap;color:var(--muted);font-size:.88rem;margin-top:10px}
.checks span::before{content:"✓ ";color:var(--pri);font-weight:700}
.section{padding:44px 0}
.band{background:linear-gradient(180deg,var(--soft),var(--bg))}
.band-gold{background:linear-gradient(180deg,var(--soft2),var(--bg))}
.sec-title{font-size:1.5rem;font-weight:800;margin:0 0 4px}
.sec-sub{color:var(--muted);margin:0 0 22px;font-size:.95rem}
hr.thin{border:0;border-top:1px solid var(--line);margin:0}
.center{text-align:center}
.small{font-size:.85rem}
.muted{color:var(--muted)}
/* --- 按鈕 / 晶片 / 表單 --- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;padding:11px 22px;border-radius:12px;border:0;cursor:pointer;font-size:1rem;font-weight:700;color:#fff;background:linear-gradient(135deg,#8b5cf6,var(--pri));box-shadow:0 4px 14px rgba(124,58,237,.25);transition:transform .15s,box-shadow .2s,opacity .2s;font-family:inherit}
.btn:hover{transform:translateY(-1px);box-shadow:0 8px 20px rgba(124,58,237,.3);text-decoration:none}
.btn:active{transform:scale(.98)}
.btn:disabled{opacity:.5;cursor:not-allowed;transform:none}
.btn.ghost{background:var(--card);color:var(--pri);border:1px solid var(--line2);box-shadow:none}
.btn.ghost:hover{background:var(--pri-soft)}
.btn.gold{background:linear-gradient(135deg,#d8b260,var(--gold));box-shadow:0 4px 14px rgba(184,137,47,.25)}
.btn.lg{padding:14px 30px;font-size:1.05rem}
.chips{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}
.chip{display:inline-block;padding:7px 14px;border-radius:999px;background:var(--pri-soft);border:1px solid var(--line2);color:var(--text);font-size:.9rem;cursor:pointer;font-family:inherit;transition:.2s}
.chip:hover,.chip.on{background:#e6dbff;border-color:var(--pri2)}
.chip.on{color:var(--pri);font-weight:700}
.form{display:grid;gap:14px}
.form .row2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.field label,.lbl{display:block;font-size:.88rem;font-weight:700;margin-bottom:6px;color:var(--text)}
input,select,textarea{width:100%;padding:11px 13px;border-radius:12px;border:1px solid var(--line2);background:var(--input);color:var(--text);font-size:1rem;font-family:inherit;transition:border .2s,box-shadow .2s}
input:focus,select:focus,textarea:focus{outline:0;border-color:var(--pri2);box-shadow:0 0 0 4px rgba(167,139,250,.18)}
textarea{min-height:110px;resize:vertical}
.seg{display:inline-flex;border:1px solid var(--line2);border-radius:12px;overflow:hidden}
.seg label{margin:0;padding:9px 16px;cursor:pointer;font-weight:600;font-size:.95rem;color:var(--muted)}
.seg input{display:none}
.seg input:checked+span{color:var(--pri)}
.seg label:has(input:checked){background:var(--pri-soft);color:var(--pri)}
.check{display:flex;align-items:center;gap:8px;font-size:.92rem}
.check input{width:auto}
@media (max-width:600px){.form .row2{grid-template-columns:1fr}}
/* --- 卡片 --- */
.card-box{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:24px;box-shadow:var(--shadow)}
.grid{display:grid;gap:16px}
.g2{grid-template-columns:repeat(2,1fr)}.g3{grid-template-columns:repeat(3,1fr)}.g4{grid-template-columns:repeat(4,1fr)}
@media (max-width:900px){.g3,.g4{grid-template-columns:repeat(2,1fr)}}
@media (max-width:560px){.g2,.g3,.g4{grid-template-columns:1fr}}
.feature{display:block;background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:22px;color:var(--text);transition:.25s;position:relative;overflow:hidden}
.feature:hover{transform:translateY(-3px);box-shadow:var(--shadow);border-color:var(--line2);text-decoration:none}
.feature .ico{width:52px;height:52px;border-radius:14px;display:flex;align-items:center;justify-content:center;font-size:1.6rem;background:var(--pri-soft);margin-bottom:12px}
.feature h3{margin:0 0 4px;font-size:1.1rem}
.feature p{margin:0;color:var(--muted);font-size:.92rem}
.feature .go{position:absolute;right:18px;top:22px;color:var(--faint)}
.list-row{display:flex;align-items:center;gap:16px;padding:14px 4px;border-bottom:1px solid var(--line);color:var(--text)}
.list-row:hover{text-decoration:none;background:linear-gradient(90deg,var(--soft),transparent)}
.list-row .thumb{width:64px;height:64px;border-radius:14px;flex:none;display:flex;align-items:center;justify-content:center;font-size:2rem}
.list-row h4{margin:0;font-size:1.05rem}
.list-row p{margin:0;color:var(--muted);font-size:.9rem}
.list-row .arrow{margin-left:auto;color:var(--faint);font-size:1.2rem}
/* --- 首頁 Hero --- */
.hero{padding:64px 0 40px;text-align:center;position:relative;overflow:hidden}
.hero::before{content:"";position:absolute;inset:-40% -10% auto;height:120%;background:radial-gradient(closest-side,rgba(167,139,250,.18),transparent 70%),radial-gradient(closest-side at 80% 30%,rgba(216,178,96,.14),transparent 60%);z-index:-1}
.hero h1{font-family:var(--serif);font-size:clamp(2.2rem,6vw,3.4rem);margin:6px 0 10px;letter-spacing:.12em;font-weight:900}
.hero h1 .g{background:linear-gradient(90deg,var(--pri),#c084fc 50%,var(--gold));-webkit-background-clip:text;background-clip:text;color:transparent}
.hero p.lead{color:var(--muted);font-size:1.05rem;margin:0 auto 24px;max-width:560px}
.hero .actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}
.orbit{width:120px;height:120px;margin:0 auto;position:relative}
.orbit svg{width:100%;height:100%;animation:spin 40s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
/* --- CTA 一對一 --- */
.cta{display:flex;align-items:center;gap:18px;flex-wrap:wrap;background:linear-gradient(135deg,#f5efff,#fdf6e7);border:1px solid var(--line2);border-radius:20px;padding:22px 26px}
.cta .cta-ico{font-size:2.2rem}
.cta h3{margin:0;font-size:1.15rem}
.cta p{margin:2px 0 0;color:var(--muted);font-size:.92rem}
.cta .btn{margin-left:auto}
@media (max-width:600px){.cta .btn{margin-left:0;width:100%}}
.demo-flag{display:inline-block;background:#fff4d6;color:#8a5a00;border:1px dashed #e0b44c;border-radius:8px;padding:2px 8px;font-size:.78rem;font-weight:700}
/* --- 頁腳 --- */
.foot{border-top:1px solid var(--line);margin-top:40px;padding:30px 0 40px;color:var(--muted);font-size:.9rem;background:var(--foot)}
.foot .wrap{display:flex;flex-wrap:wrap;gap:12px 30px;justify-content:space-between;align-items:flex-start}
.foot .disc{color:var(--gold);font-weight:700}
.foot nav a{color:var(--muted);margin-right:14px}
/* --- 分頁 tabs（占卜頁） --- */
.tabs{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin-bottom:22px}
.tab{padding:10px 18px;border-radius:999px;border:1px solid var(--line2);background:var(--card);color:var(--text);font-size:.98rem;cursor:pointer;font-family:inherit;transition:.2s}
.tab:hover{background:var(--soft)}
.tab.active{background:var(--pri);color:#fff;border-color:var(--pri);font-weight:700;box-shadow:0 4px 14px rgba(124,58,237,.25)}
.panel{display:none;background:var(--card);border:1px solid var(--line);border-radius:22px;padding:30px 22px;box-shadow:var(--shadow)}
.panel.active{display:block;animation:fadeUp .45s ease}
@keyframes fadeUp{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
.panel h2{text-align:center;margin:0 0 4px;font-size:1.45rem}
.hint{text-align:center;color:var(--muted);margin:0 0 18px}
.note{font-size:.86rem;color:var(--muted);background:var(--soft2);border-left:3px solid var(--gold);padding:8px 12px;border-radius:8px}
.row{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-bottom:16px}
.row input{max-width:240px}
/* 籤筒 */
.tube-wrap{position:relative;height:260px;display:flex;justify-content:center;align-items:flex-end}
.tube{position:relative;width:120px;height:230px;background:none;border:0;cursor:pointer;transform-origin:50% 90%;padding:0}
.tube:focus-visible{outline:2px dashed var(--pri);outline-offset:6px}
.sticks{position:absolute;left:14px;right:14px;top:0;height:110px;display:flex;justify-content:space-around;align-items:flex-end}
.sticks i{display:block;width:8px;height:100px;border-radius:3px 3px 0 0;background:linear-gradient(#d94a3c 0 14px,#e9cf9c 14px);box-shadow:inset -2px 0 0 #0001}
.sticks i:nth-child(2n){height:88px}.sticks i:nth-child(3n){height:94px}
.tube-body{position:absolute;bottom:0;left:0;right:0;height:150px;border-radius:12px 12px 22px 22px;background:linear-gradient(90deg,#8e2a2a,#c4473a 40%,#e0695a 55%,#9a2f2f);border:3px solid #d8b260;display:flex;align-items:center;justify-content:center;box-shadow:0 14px 28px rgba(120,40,40,.25)}
.tube-body b{font-family:var(--serif);font-size:2.6rem;color:#f6dc9b;border:2px solid #f6dc9b;border-radius:50%;width:70px;height:70px;display:flex;align-items:center;justify-content:center}
.tube.shaking{animation:shake .18s linear 7}
@keyframes shake{0%{transform:rotate(-14deg)}50%{transform:rotate(14deg)}100%{transform:rotate(-14deg)}}
.drop-stick{position:absolute;width:12px;height:120px;left:calc(50% + 70px);top:20px;border-radius:3px;background:linear-gradient(#d94a3c 0 18px,#e9cf9c 18px);opacity:0;pointer-events:none}
.drop-stick.fall{animation:fall 1s cubic-bezier(.3,.6,.4,1) forwards}
@keyframes fall{0%{opacity:1;transform:translate(-70px,0) rotate(0)}60%{opacity:1;transform:translate(0,90px) rotate(70deg)}100%{opacity:1;transform:translate(10px,110px) rotate(90deg)}}
/* 結果卡 */
.result{margin-top:22px;background:linear-gradient(180deg,var(--card),var(--soft));border:1px solid var(--line2);border-radius:18px;padding:22px;animation:fadeUp .5s ease}
.result h3{margin:0 0 4px;font-family:var(--serif);color:var(--pri);font-size:1.45rem;text-align:center}
.poem{text-align:center;font-family:var(--serif);font-size:1.12rem;line-height:1.9;margin:10px 0 16px;color:#3b2a14}
.grade{display:inline-block;padding:3px 14px;border-radius:999px;font-weight:700}
.g-上上{background:#fbeccb;color:#8a5a00}.g-上{background:#dcf5e7;color:#1d6b46}.g-中{background:#e5e9ff;color:#334199}.g-下{background:#eeeef2;color:#555}
.aspects{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:10px}
.aspects div{background:var(--card);border-radius:12px;padding:12px;border:1px solid var(--line)}
.aspects strong{color:var(--pri);display:block;margin-bottom:4px}
.starsrate{color:var(--gold);letter-spacing:2px}
.zgrid{display:grid;grid-template-columns:repeat(6,1fr);gap:8px;margin:6px 0 14px}
.zgrid button{background:var(--card);border:1px solid var(--line2);border-radius:12px;color:var(--text);padding:8px 0;cursor:pointer;font-size:.9rem;transition:.2s;font-family:inherit}
.zgrid button span{display:block;font-size:1.6rem}
.zgrid button:hover,.zgrid button.on{background:var(--pri-soft);border-color:var(--pri2);transform:translateY(-2px)}
/* 塔羅 */
.cards{display:flex;gap:18px;justify-content:center;flex-wrap:wrap;perspective:1200px}
.card{width:200px;display:flex;flex-direction:column;align-items:center;gap:8px}
.card .pos{color:var(--pri);font-weight:700}
.flip{width:180px;height:290px;position:relative;transform-style:preserve-3d;transition:transform .9s cubic-bezier(.4,.2,.2,1);cursor:pointer}
.flip.flipped{transform:rotateY(180deg)}
.face{position:absolute;inset:0;border-radius:14px;backface-visibility:hidden;-webkit-backface-visibility:hidden;display:flex;flex-direction:column;align-items:center;justify-content:center;box-shadow:0 10px 26px rgba(76,48,140,.18)}
.back{background:radial-gradient(circle at 50% 50%,#9f7aea 0 18%,transparent 19%),repeating-linear-gradient(45deg,#6d3fd6 0 10px,#5b2fc0 10px 20px);border:3px solid #fff;outline:1px solid #d8b260}
.back::after{content:"✦";font-size:2.4rem;color:#fff6dc;border:2px solid #f6dc9b;border-radius:50%;width:84px;height:84px;display:flex;align-items:center;justify-content:center;background:#4c1fae}
.front{transform:rotateY(180deg);background:linear-gradient(170deg,#fffdf6,#f7ecd2);color:#3a2a10;padding:12px;text-align:center;border:2px solid #d8b260}
.front .num{font-family:var(--serif);font-weight:700;letter-spacing:.1em;color:var(--gold)}
.front .emo{font-size:4.2rem;margin:14px 0}
.front .nm{font-family:var(--serif);font-size:1.4rem;font-weight:700}
.front .ori{font-size:.82rem;margin-top:4px;padding:2px 10px;border-radius:999px;background:var(--pri);color:#fff}
.front.rev .emo{transform:rotate(180deg)}
.meaning{font-size:.92rem;text-align:center;opacity:0;transition:opacity .6s .6s;min-height:3em}
.card.open .meaning{opacity:1}
@media (max-width:600px){
  .panel{padding:22px 14px}
  .zgrid{grid-template-columns:repeat(4,1fr)}
  .cards[data-n="3"] .card{width:31%}
  .cards[data-n="3"] .flip{width:100%;height:170px}
  .cards[data-n="3"] .front .emo{font-size:2.2rem;margin:6px 0}
  .cards[data-n="3"] .front .nm{font-size:1rem}
  .cards[data-n="3"] .front .num,.cards[data-n="3"] .front .ori{font-size:.7rem}
  .cards[data-n="3"]{gap:8px}
  .cards[data-n="3"] .meaning{font-size:.8rem}
}
/* ===== 紫微斗數 ===== */
.zw-form{max-width:720px;margin:0 auto}
.zw-chart{display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(4,minmax(150px,auto));gap:0;border:2px solid #cbbaf3;border-radius:14px;overflow:hidden;background:var(--card);margin-top:26px;box-shadow:var(--shadow)}
.zp{border:1px solid var(--line2);padding:7px 8px 6px;position:relative;display:flex;flex-direction:column;font-size:.82rem;min-width:0;background:var(--card);cursor:pointer;transition:background .2s}
.zp:hover{background:#fbf9ff}
.zp.sel{background:#f4eeff;box-shadow:inset 0 0 0 2px var(--pri2)}
.zp.ming{background:#fdf7ea}
.zp .stars{display:flex;flex-wrap:wrap;gap:2px 8px;align-items:flex-start}
.zp .major{font-weight:800;color:#5b21b6;font-size:.98rem;white-space:nowrap}
.zp .major.bright-廟,.zp .major.bright-旺{color:#6d28d9}
.zp .major.bright-陷,.zp .major.bright-不{color:#8b7fb0}
.zp .br{font-size:.7rem;color:var(--faint);font-weight:400;margin-left:1px}
.mu{display:inline-block;font-size:.68rem;color:#fff;border-radius:4px;padding:0 3px;margin-left:2px;font-weight:700;vertical-align:2px}
.mu-祿{background:#2f9e6e}.mu-權{background:#7c3aed}.mu-科{background:#2f6fd0}.mu-忌{background:#d14343}
.zp .minor{color:#9a5b0f;white-space:nowrap}
.zp .adj{color:var(--faint);font-size:.72rem;margin-top:3px;line-height:1.35}
.zp .bottom{margin-top:auto;display:flex;justify-content:space-between;align-items:flex-end;padding-top:6px;gap:4px}
.zp .pname{font-weight:800;color:#fff;background:var(--pri);border-radius:6px;padding:1px 7px;font-size:.84rem;white-space:nowrap}
.zp.ming .pname{background:var(--gold)}
.zp .gz{font-family:var(--serif);font-weight:700;color:var(--text)}
.zp .dec{font-size:.72rem;color:var(--muted)}
.zp .tags{position:absolute;top:6px;right:6px;display:flex;gap:3px}
.zp .tag{font-size:.66rem;border-radius:4px;padding:0 4px;font-weight:700}
.tag.body{background:#fde3ec;color:#b83266}.tag.cur{background:#e2f4ea;color:#1d6b46}.tag.yr{background:#e5edff;color:#2f4fb0}
.zp .cs{font-size:.68rem;color:var(--faint)}
.zw-center{grid-column:2/4;grid-row:2/4;border:1px solid var(--line2);background:linear-gradient(160deg,#faf7ff,#fffaf0);padding:16px 18px;display:flex;flex-direction:column;justify-content:center;font-size:.9rem}
.zw-center h3{margin:0 0 6px;font-family:var(--serif);color:var(--pri);font-size:1.2rem;text-align:center}
.zw-center dl{display:grid;grid-template-columns:auto 1fr;gap:3px 12px;margin:0}
.zw-center dt{color:var(--muted)}
.zw-center dd{margin:0;font-weight:600}
.legend{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;font-size:.8rem;color:var(--muted);margin-top:10px}
.interp{margin-top:26px;display:grid;gap:14px}
.interp .card-box h3{margin:0 0 6px;font-size:1.1rem;color:var(--pri)}
.interp .card-box p{margin:.3em 0}
.interp .kw{display:flex;flex-wrap:wrap;gap:6px;margin:6px 0}
.interp .kw span{background:var(--pri-soft);color:var(--pri);border-radius:999px;padding:1px 10px;font-size:.8rem;font-weight:600}
.palace-detail{border-left:4px solid var(--pri2)}
@media (max-width:760px){
  .zw-chart{grid-template-rows:repeat(4,minmax(118px,auto));border-radius:10px}
  .zp{padding:4px 4px 4px;font-size:.66rem}
  .zp .major{font-size:.8rem}
  .zp .adj,.zp .cs{display:none}
  .zp .pname{font-size:.7rem;padding:0 4px}
  .zp .dec{font-size:.6rem}
  .zp .tags{top:2px;right:2px}
  .zp .tag{font-size:.56rem;padding:0 2px}
  .mu{font-size:.56rem;padding:0 2px}
  .zw-center{padding:8px;font-size:.7rem}
  .zw-center h3{font-size:.95rem}
  .zw-center dl{gap:1px 6px}
}
/* ===== 占卜師 ===== */
.teller-card{display:flex;flex-direction:column;background:var(--card);border:1px solid var(--line);border-radius:20px;overflow:hidden;color:var(--text);transition:.25s}
.teller-card:hover{transform:translateY(-4px);box-shadow:0 14px 34px rgba(76,48,140,.13);text-decoration:none}
.portrait{height:200px;position:relative;display:flex;align-items:flex-end;justify-content:center;overflow:hidden}
.portrait svg{height:100%;width:auto}
.portrait .badge{position:absolute;top:12px;left:12px;background:rgba(255,255,255,.9);border-radius:999px;padding:2px 10px;font-size:.78rem;font-weight:700}
.teller-card .body{padding:16px 18px 18px}
.teller-card h3{margin:0;font-size:1.15rem}
.teller-card .role{color:var(--pri);font-size:.86rem;font-weight:700}
.teller-card p{margin:8px 0 10px;color:var(--muted);font-size:.9rem}
.aff-mini{display:flex;align-items:center;gap:8px;font-size:.78rem;color:var(--muted)}
.bar{flex:1;height:8px;background:#f0ecf8;border-radius:99px;overflow:hidden}
.bar i{display:block;height:100%;background:linear-gradient(90deg,#f0a6c3,var(--pri));border-radius:99px;transition:width .8s ease}
.td-hero{display:grid;grid-template-columns:280px 1fr;gap:28px;align-items:center;padding:36px 0 10px}
.td-hero .portrait{height:300px;border-radius:24px}
.td-hero h1{margin:0;font-size:2rem}
.td-hero .quote{font-family:var(--serif);font-size:1.08rem;color:#4a3a66;border-left:3px solid var(--gold);padding-left:12px;margin:12px 0}
.meta-tags{display:flex;flex-wrap:wrap;gap:6px}
.meta-tags span{background:var(--soft);border:1px solid var(--line);border-radius:999px;padding:2px 10px;font-size:.82rem}
@media (max-width:760px){.td-hero{grid-template-columns:1fr;text-align:center}.td-hero .portrait{height:240px}.td-hero .quote{text-align:left}.meta-tags{justify-content:center}}
.aff{display:flex;align-items:center;gap:12px;margin:14px 0 6px}
.aff .bar{height:12px}
.aff .heart{font-size:1.4rem;animation:beat 1.6s ease-in-out infinite}
@keyframes beat{50%{transform:scale(1.15)}}
.aff-num{font-weight:800;color:var(--rose);white-space:nowrap}
.actions-row{display:flex;gap:10px;flex-wrap:wrap}
.dialog{display:grid;gap:12px;margin-top:10px}
.bubble{display:flex;gap:10px;align-items:flex-start;animation:fadeUp .4s ease both}
.bubble .av{width:40px;height:40px;border-radius:50%;flex:none;display:flex;align-items:center;justify-content:center;font-size:1.3rem;border:2px solid #fff;box-shadow:0 2px 8px rgba(0,0,0,.08)}
.bubble .tx{background:var(--card);border:1px solid var(--line);border-radius:4px 16px 16px 16px;padding:10px 14px;max-width:640px}
.bubble .who{font-size:.76rem;color:var(--muted);font-weight:700}
.bubble.me{flex-direction:row-reverse}
.bubble.me .tx{background:var(--pri-soft);border-color:var(--line2);border-radius:16px 4px 16px 16px}
.bubble.narr .tx{background:var(--soft2);border-style:dashed;font-style:italic;color:#6a5a3a;border-radius:12px}
.chapters{display:grid;gap:10px}
.chap{border:1px solid var(--line);border-radius:14px;background:var(--card);overflow:hidden}
.chap summary{list-style:none;cursor:pointer;padding:14px 16px;display:flex;align-items:center;gap:12px;font-weight:700}
.chap summary::-webkit-details-marker{display:none}
.chap summary .no{width:34px;height:34px;border-radius:10px;background:var(--pri-soft);color:var(--pri);display:flex;align-items:center;justify-content:center;font-size:.85rem;flex:none}
.chap summary .st{margin-left:auto;font-size:.8rem;color:var(--muted);font-weight:600}
.chap.locked summary{color:var(--faint);cursor:not-allowed}
.chap.locked summary .no{background:#f2f1f5;color:var(--faint)}
.chap .content{padding:4px 16px 18px}
.chap.new summary .st{color:var(--rose)}
.reading{background:linear-gradient(180deg,var(--card),var(--soft));border:1px solid var(--line2);border-radius:18px;padding:20px}
.toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%) translateY(20px);background:#2a1f45;color:#fff;padding:10px 18px;border-radius:999px;font-size:.92rem;opacity:0;transition:.35s;z-index:99;pointer-events:none;box-shadow:0 8px 24px rgba(0,0,0,.2)}
.toast.show{opacity:1;transform:translateX(-50%)}
/* 聯絡 */
.contact-card{display:flex;gap:14px;align-items:center;background:var(--card);border:1px solid var(--line);border-radius:16px;padding:18px;color:var(--text);transition:.2s}
.contact-card:hover{box-shadow:var(--shadow);text-decoration:none;border-color:var(--line2)}
.contact-card .ci{width:48px;height:48px;border-radius:14px;display:flex;align-items:center;justify-content:center;font-size:1.5rem;flex:none}
.contact-card b{display:block}
.contact-card span{color:var(--muted);font-size:.9rem;word-break:break-all}
.notfound{text-align:center;padding:90px 0}
.notfound .big{font-size:5rem;font-weight:900;font-family:var(--serif);background:linear-gradient(90deg,var(--pri),var(--gold));-webkit-background-clip:text;background-clip:text;color:transparent;margin:0}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
.zp .dec,.zp .gz{white-space:nowrap}
@media (max-width:760px){.zp .bottom{flex-wrap:wrap;gap:1px 3px}.zp .dec{order:3;width:100%}.zp .gz{font-size:.7rem}}
.chap summary .no{width:auto;min-width:34px;padding:0 8px;white-space:nowrap}
/* ===== 會員 / 公告 / 後台 ===== */
.announce{background:linear-gradient(90deg,#f3ecff,#fdf4e3);border-bottom:1px solid var(--line2);font-size:.92rem}
.announce .wrap{display:flex;gap:12px;justify-content:center;align-items:center;flex-wrap:wrap;padding:9px 20px;text-align:center}
.announce a{font-weight:700}
.auth-box{max-width:440px;margin:0 auto}
.auth-tabs{display:flex;border-bottom:1px solid var(--line);margin:-6px -6px 18px}
.auth-tabs button{flex:1;background:none;border:0;padding:12px;font-size:1rem;font-weight:700;color:var(--muted);cursor:pointer;border-bottom:3px solid transparent;font-family:inherit}
.auth-tabs button.on{color:var(--pri);border-color:var(--pri)}
.msg{padding:10px 12px;border-radius:10px;font-size:.92rem;margin:0}
.msg.err{background:#fdecec;color:#a12a2a}.msg.ok{background:#e6f6ee;color:#1d6b46}
.item-list{display:grid;gap:10px}
.item{display:flex;gap:12px;align-items:center;border:1px solid var(--line);border-radius:14px;padding:12px 14px;background:var(--card)}
.item .grow{flex:1;min-width:0}
.item .t{font-weight:700}
.item .s{color:var(--muted);font-size:.86rem;overflow:hidden;text-overflow:ellipsis}
.item .btn{padding:7px 14px;font-size:.88rem}
.btn.danger{background:var(--card);color:#c23a3a;border:1px solid #f0caca;box-shadow:none}
.btn.danger:hover{background:#fdecec}
.btn.sm{padding:7px 14px;font-size:.88rem}
.kind{width:38px;height:38px;border-radius:10px;background:var(--pri-soft);display:flex;align-items:center;justify-content:center;flex:none}
.save-row{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;align-items:center;margin-top:16px}
.save-row input{max-width:260px}

/* ===== 深色主題（跟系統；手動選擇會記住，見 theme.js） ===== */
html{color-scheme:light}
html[data-theme=dark]{color-scheme:dark;
  --bg:#110d1c; --card:#1b1530; --nav-bg:rgba(17,13,28,.9); --foot:#0d0a17; --input:#140f24;
  --soft:#221a3b; --soft2:#261f30; --line:#2f2747; --line2:#3d3360;
  --text:#ece8f7; --muted:#b2abc8; --faint:#8a83a3;
  --pri:#a78bfa; --pri2:#8b5cf6; --pri-soft:#2d2252; --gold:#e0b45a; --gold-soft:#3a2f1a;
  --shadow:0 6px 24px rgba(0,0,0,.35)}
html[data-theme=dark] .menu a.cta-btn,html[data-theme=dark] .tab.active,html[data-theme=dark] .front .ori,html[data-theme=dark] .zp .pname{background:#7c3aed;color:#fff}
html[data-theme=dark] .btn{color:#fff}
html[data-theme=dark] .btn.ghost{background:var(--card);color:var(--pri)}
html[data-theme=dark] .chip:hover,html[data-theme=dark] .chip.on{background:#3a2c6b}
html[data-theme=dark] .cta{background:linear-gradient(135deg,#251b45,#2c2318)}
html[data-theme=dark] .announce{background:linear-gradient(90deg,#251b45,#2c2318)}
html[data-theme=dark] .zp:hover{background:#231b3f}
html[data-theme=dark] .zp.sel{background:#2d2252}
html[data-theme=dark] .zp.ming{background:#2c2416}
html[data-theme=dark] .zw-center{background:linear-gradient(160deg,#1d1636,#241d16)}
html[data-theme=dark] .zw-chart{border-color:#4b3d80}
html[data-theme=dark] .bar{background:#2f2747}
html[data-theme=dark] .chap.locked summary .no{background:#2a2540}
html[data-theme=dark] .g-上上{background:#4a3a12;color:#f6dc9b}html[data-theme=dark] .g-上{background:#173d2b;color:#9be3bf}html[data-theme=dark] .g-中{background:#1f2853;color:#b9c4ff}html[data-theme=dark] .g-下{background:#2b2a33;color:#c9c7d1}
html[data-theme=dark] .tag.body{background:#4a1f32;color:#f5a9c6}html[data-theme=dark] .tag.cur{background:#173d2b;color:#9be3bf}html[data-theme=dark] .tag.yr{background:#1f2853;color:#b9c4ff}
html[data-theme=dark] .msg.err{background:#3d1a1a;color:#ffb4b4}html[data-theme=dark] .msg.ok{background:#14352a;color:#9be3bf}
html[data-theme=dark] .btn.danger{background:var(--card);color:#ff8f8f;border-color:#5a2a2a}html[data-theme=dark] .btn.danger:hover{background:#3d1a1a}
html[data-theme=dark] .demo-flag{background:#3a2f1a;color:#f6dc9b}
html[data-theme=dark] .portrait .badge{background:rgba(20,15,36,.85);color:var(--text)}
html[data-theme=dark] .bubble .av{border-color:var(--card)}
html[data-theme=dark] .toast{background:#ece8f7;color:#1b1530}
html[data-theme=dark] .hero .orbit circle[stroke]{opacity:.5}

/* ================= Phase 1 元件 ================= */
/* 導覽：下拉選單、語言、主題 */
.dd{position:relative}
.dd-btn{background:none;border:0;color:var(--text);font:inherit;font-size:.95rem;padding:8px 12px;border-radius:10px;cursor:pointer;white-space:nowrap}
.dd-btn:hover,.dd.open .dd-btn{background:var(--soft)}
.dd.on>.dd-btn{color:var(--pri);font-weight:700;background:var(--pri-soft)}
.dd-menu{display:none;position:absolute;top:calc(100% + 4px);left:0;min-width:200px;background:var(--card);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);padding:6px;z-index:60}
.dd-menu a{display:block}
.dd:hover .dd-menu,.dd:focus-within .dd-menu,.dd.open .dd-menu{display:block}
.dd::after{content:"";position:absolute;left:0;right:0;top:100%;height:6px}
.nav-tools{display:flex;gap:6px;align-items:center;order:3;margin-left:8px}
.lang-sel{padding:6px 8px;border-radius:10px;border:1px solid var(--line);background:var(--input);color:var(--text);font:inherit;font-size:.85rem;max-width:110px;cursor:pointer}
.theme-btn{width:36px;height:34px;border-radius:10px;border:1px solid var(--line);background:var(--input);cursor:pointer;font-size:1rem;color:var(--text)}
.theme-btn:hover,.lang-sel:hover{border-color:var(--pri2)}
@media (max-width:860px){
  .nav .wrap{gap:8px}
  .nav-tools{order:2;margin-left:auto}
  .burger{order:3;margin-left:0}
  .menu{order:4}
  .dd-btn{width:100%;text-align:left;padding:12px}
  .dd-menu{display:block;position:static;box-shadow:none;border:0;padding:0 0 0 14px;background:transparent;min-width:0}
  .dd::after{display:none}
  .brand span{font-size:.98rem}
}
@media (max-width:420px){.brand span{display:none}}
/* 廣告位 */
.ad-slot{margin:14px auto;text-align:center;max-width:100%}
.ad-slot:empty{display:none;margin:0}
.ad-header{margin-top:12px}
.ad-unit{position:relative;display:inline-block;max-width:100%}
.ad-unit img{max-width:100%;height:auto;border-radius:12px;display:block}
.ad-label{position:absolute;top:6px;left:6px;background:rgba(0,0,0,.55);color:#fff;font-size:.68rem;padding:1px 6px;border-radius:6px;letter-spacing:.05em}
.ad-code{min-height:50px}
.foot .ad-slot{margin:0 auto 18px}
/* 單選 chips、步驟 */
.chip-r{position:relative;cursor:pointer}
.chip-r input{position:absolute;opacity:0;pointer-events:none}
.chip-r>span{display:inline-block;padding:8px 16px;border-radius:999px;background:var(--pri-soft);border:1px solid var(--line2);font-size:.92rem;transition:.2s}
.chip-r:hover>span{border-color:var(--pri2)}
.chip-r input:checked+span{background:var(--pri);color:#fff;border-color:var(--pri);font-weight:700;box-shadow:0 4px 14px rgba(124,58,237,.25)}
.chip-r input:focus-visible+span{outline:2px solid var(--pri);outline-offset:2px}
h2.step{font-size:1.08rem!important;margin:18px 0 12px!important;color:var(--pri)}
/* 求籤結果 */
.qian-head{text-align:center}
.qian-head .qno{font-family:var(--serif);color:var(--gold);letter-spacing:.15em;font-weight:700}
.qian-head h3{margin:4px 0 8px;font-family:var(--serif);font-size:1.5rem}
.focus-card{margin:18px 0 12px;padding:18px 20px;border-radius:16px;background:linear-gradient(135deg,var(--pri-soft),var(--gold-soft));border:1px solid var(--line2)}
.focus-card .focus-lbl{font-weight:800;color:var(--pri);margin-bottom:6px}
.focus-card p{margin:0;font-size:1.05rem;line-height:1.85}
.more-aspects details,.report,.dict-box{border:1px solid var(--line);border-radius:12px;padding:10px 14px;margin:8px 0;background:var(--card)}
.more-aspects summary,.report summary,.dict-box summary{cursor:pointer;font-weight:700}
.more-aspects p{margin:8px 0 2px;line-height:1.8}
/* 塔羅牌陣 */
.cards.n1,.cards.n3,.cards.n5{display:flex;flex-wrap:wrap;gap:14px;justify-content:center;margin-top:20px}
.tcard{background:none;border:0;padding:0;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:6px;font:inherit;color:inherit;width:170px}
.tcard .pos-lbl{font-weight:700;color:var(--pri);font-size:.92rem}
.tcard .inner{position:relative;width:100%;aspect-ratio:5/8;transform-style:preserve-3d;transition:transform .8s cubic-bezier(.4,.2,.2,1);display:block}
.tcard.flipped .inner{transform:rotateY(180deg)}
.tcard .front .nm{font-size:1.1rem}
.tcard .front .emo{font-size:3.2rem;margin:8px 0}
.tcard .front .sub{font-size:.75rem;color:#7a6440}
.tcard .ori.rev{background:var(--rose)}
.tcard:not(.flipped):hover .inner{transform:translateY(-4px)}
.cards.n5 .tcard{width:140px}
.cards>p.center{flex-basis:100%}
@media (max-width:600px){.tcard{width:calc(33% - 10px)}.cards.n5 .tcard{width:calc(33% - 10px)}.cards.n1 .tcard{width:55%}.tcard .front .emo{font-size:2rem;margin:4px 0}.tcard .front .nm{font-size:.85rem}.tcard .front .sub{display:none}.tcard .front .ori{font-size:.65rem}}
.tarot-reading{margin-top:22px}
.tr-item{display:grid;grid-template-columns:130px 1fr;gap:14px;padding:14px 0;border-top:1px solid var(--line)}
.tr-pos{display:flex;flex-direction:column;gap:2px}
.tr-pos b{color:var(--pri)}
.tr-item h4{margin:0 0 6px}
.ori-tag{font-size:.75rem;padding:1px 8px;border-radius:999px;background:var(--pri);color:#fff;vertical-align:middle}
.ori-tag.rev{background:var(--rose)}
.synth{margin-top:14px;padding:16px 18px;border-radius:14px;background:var(--soft);border:1px solid var(--line)}
.synth h4{margin:0 0 6px}.synth p{margin:6px 0}
@media (max-width:600px){.tr-item{grid-template-columns:1fr;gap:4px}}
/* 星座 */
.sgrid{display:grid;grid-template-columns:repeat(6,1fr);gap:10px}
.sgrid button{display:flex;flex-direction:column;align-items:center;gap:2px;padding:12px 4px;border-radius:14px;border:1px solid var(--line);background:var(--card);color:var(--text);cursor:pointer;font:inherit;transition:.2s}
.sgrid button:hover{border-color:var(--pri2);transform:translateY(-2px)}
.sgrid button.on{background:var(--pri-soft);border-color:var(--pri);box-shadow:0 4px 14px rgba(124,58,237,.18)}
.sgrid .emo{font-size:1.7rem}.sgrid b{font-size:.92rem}.sgrid small{color:var(--muted);font-size:.72rem}
@media (max-width:700px){.sgrid{grid-template-columns:repeat(4,1fr)}}
@media (max-width:420px){.sgrid{grid-template-columns:repeat(3,1fr)}}
.star-head{display:flex;gap:14px;align-items:center;margin-bottom:14px}
.star-head h3{margin:0;font-size:1.4rem}.big-emo{font-size:3rem}
.star-secs{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.star-sec{padding:14px 16px;border-radius:14px;background:var(--soft);border:1px solid var(--line)}
.star-sec.wide{grid-column:1/-1}
.star-sec .sh{display:flex;justify-content:space-between;align-items:center}
.star-sec .stars{color:var(--gold);letter-spacing:.1em}
.star-sec p{margin:6px 0 0;line-height:1.8}
@media (max-width:600px){.star-secs{grid-template-columns:1fr}}
.lucky{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin-top:14px}
.lucky div{text-align:center;padding:12px 6px;border-radius:12px;background:var(--gold-soft);border:1px solid var(--line)}
.lucky span{display:block;font-size:.75rem;color:var(--muted)}.lucky b{font-size:1rem}
@media (max-width:600px){.lucky{grid-template-columns:repeat(2,1fr)}.lucky div:last-child{grid-column:1/-1}}
/* 姓名學 */
.name-res h3{font-family:var(--serif);font-size:2rem;letter-spacing:.3em;margin:0 0 10px}
.strokes{display:flex;justify-content:center;gap:12px;margin-bottom:18px;flex-wrap:wrap}
.strokes .ch{display:flex;flex-direction:column;align-items:center;padding:8px 14px;border-radius:12px;background:var(--soft);border:1px solid var(--line)}
.strokes .ch b{font-family:var(--serif);font-size:1.6rem}.strokes .ch i{font-style:normal;color:var(--pri);font-weight:700}.strokes small{color:var(--muted)}
.wuge{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin-bottom:16px}
.wg{text-align:center;padding:12px 4px;border-radius:14px;border:1px solid var(--line);background:var(--card)}
.wg-k{font-size:.85rem;color:var(--muted)}.wg-n{font-size:1.7rem;font-weight:800}.wg-n small{font-size:.7rem;color:var(--muted)}.wg-e{font-size:.85rem}.wg-l{font-weight:700;font-size:.9rem}
.wg-good{border-color:#9fdcbf;background:linear-gradient(180deg,var(--card),rgba(47,158,110,.08))}.wg-good .wg-l{color:var(--green)}
.wg-bad{border-color:#f3b4c6;background:linear-gradient(180deg,var(--card),rgba(232,97,140,.08))}.wg-bad .wg-l{color:var(--rose)}
.wg-mid .wg-l{color:var(--gold)}
@media (max-width:520px){.wuge{grid-template-columns:repeat(3,1fr)}}
.lk{font-weight:800}.lk-good{color:var(--green)}.lk-bad{color:var(--rose)}.lk-mid{color:var(--gold)}
.name-res .card-box{margin:12px 0;padding:16px 18px}.name-res h4{margin:0 0 6px}
.unk{display:inline-flex;align-items:center;gap:6px;font-family:var(--serif);font-size:1.3rem;margin:6px 12px 6px 0}
/* 清單（願望／夢日誌／命盤） */
.list-tools{gap:8px;flex-wrap:wrap;margin:16px 0 8px;align-items:center}
.list-tools input[type=search]{flex:1;min-width:180px}
.li-card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:14px 16px;margin:10px 0;box-shadow:var(--shadow)}
.li-head{display:flex;justify-content:space-between;gap:10px;align-items:baseline;flex-wrap:wrap}
.li-body{white-space:pre-wrap;margin:8px 0;line-height:1.75;max-height:12em;overflow:auto}
.li-meta{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.li-act{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}
.row-item{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap}
.row-item .li-act{margin:0}
.li-card.wish.done{border-color:#9fdcbf;background:linear-gradient(135deg,var(--card),rgba(47,158,110,.07))}
.ok-txt{color:var(--green);font-weight:700;margin:0}
.file-btn{cursor:pointer}
.hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}
.c-body p{max-width:640px;margin:8px auto}
.charts-box summary{cursor:pointer}
.save-row{display:flex;gap:8px;align-items:center;justify-content:center;flex-wrap:wrap;margin:18px 0 10px}
.save-row input{max-width:260px}
.lg-tag{font-size:.7rem;border-radius:4px;padding:0 4px}
.btn.danger.ghost,.btn.ghost.danger{color:var(--rose);border-color:var(--rose);background:transparent}
.pre{white-space:pre-wrap}
/* 解夢 */
.sym{padding:10px 0;border-top:1px dashed var(--line)}.sym:first-of-type{border-top:0}
.sym p{margin:4px 0 0;line-height:1.75}
.dict-list{max-height:420px;overflow:auto;margin-top:10px}
.dict-box input{margin-top:10px}
.price-box{display:flex;gap:18px;align-items:center;flex-wrap:wrap;padding:14px 18px;border-radius:14px;background:var(--gold-soft);border:1px solid var(--line);margin:10px 0}
.price-box div{display:flex;flex-direction:column}.price-box b{font-size:1.2rem}
.report-body h4{margin:14px 0 4px;color:var(--pri)}.report-body p{line-height:1.85}
input[type=range]{width:100%;accent-color:var(--pri)}
/* 許願噴泉 */
.fountain-stage{max-width:460px;margin:0 auto 10px;position:relative}
.fountain-svg{width:100%;height:auto;display:block}
.fountain-svg .jet{fill:none;stroke:#8ec9ff;stroke-width:4;stroke-linecap:round;stroke-dasharray:6 10;animation:jet 1.1s linear infinite;opacity:.9}
.fountain-svg .j3{stroke-width:5}
@keyframes jet{to{stroke-dashoffset:-32}}
.fountain-svg .drops circle{fill:#bfe6ff;animation:drop 1.6s ease-in infinite}
.fountain-svg .drops circle:nth-child(2){animation-delay:.5s}.fountain-svg .drops circle:nth-child(3){animation-delay:1s}
@keyframes drop{0%{opacity:0;transform:translateY(-20px)}40%{opacity:1}100%{opacity:0;transform:translateY(8px)}}
.fountain-svg .pool{animation:shimmer 3s ease-in-out infinite}
@keyframes shimmer{50%{opacity:.82}}
.fountain-svg .rp{fill:none;stroke:#fff;stroke-width:2;opacity:0;transform-origin:200px 214px}
.fountain-svg .coin{fill:#f2c94c;stroke:#b8892f;stroke-width:2;opacity:0;transform-box:fill-box;transform-origin:center}
.fountain-stage.toss .coin{animation:coin 1.1s cubic-bezier(.3,.1,.6,1) forwards}
.fountain-stage.toss .rp{animation:ripple 1.2s ease-out 1s forwards}
@keyframes coin{0%{opacity:1;transform:translate(0,0) scale(1.1) rotateY(0)}50%{transform:translate(30px,-200px) scale(.9) rotateY(720deg)}90%{opacity:1}100%{opacity:0;transform:translate(10px,-36px) scale(.6) rotateY(1080deg)}}
@keyframes ripple{0%{opacity:.9;transform:scale(1)}100%{opacity:0;transform:scale(9)}}
html[data-theme=dark] .fountain-svg .jet{stroke:#7fb6ff}
/* 私人資料庫 */
.zdb-top{display:flex;gap:14px;align-items:center;flex-wrap:wrap;justify-content:space-between;margin-bottom:14px}
.zdb-top .stat b{font-size:1.8rem;color:var(--pri);margin-right:6px}
.zdb-tags{flex:1;display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.tagbtn{cursor:pointer;border:0;font:inherit}
.zdb-grid{display:grid;grid-template-columns:280px 1fr;gap:16px;align-items:start}
.zdb-list{padding:12px;max-height:75vh;overflow:auto}
.zl-item{display:flex;flex-direction:column;gap:2px;width:100%;text-align:left;padding:10px;border-radius:10px;border:1px solid transparent;background:none;color:var(--text);cursor:pointer;font:inherit}
.zl-item:hover{background:var(--soft)}.zl-item.on{background:var(--pri-soft);border-color:var(--pri2)}
.zdb-main .card-box{margin-bottom:12px}
.feat{display:flex;flex-wrap:wrap;gap:6px;margin:8px 0}.feat .pat{background:var(--gold-soft);color:var(--gold)}
.tbl{width:100%;border-collapse:collapse;font-size:.92rem}.tbl th,.tbl td{padding:7px 8px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
.tbl.stats td:first-child{width:45%}
.bar{display:inline-block;width:120px;height:8px;border-radius:99px;background:var(--line);vertical-align:middle;overflow:hidden}.bar i{display:block;height:100%;background:var(--pri)}
.ev-row{display:grid;grid-template-columns:110px 90px 100px 1fr 40px;gap:6px;margin-bottom:6px}
@media (max-width:820px){.zdb-grid{grid-template-columns:1fr}.zdb-list{max-height:260px}.ev-row{grid-template-columns:1fr 1fr 1fr;}.ev-row .ev-t{grid-column:1/3}}
.me-quick a{display:flex;flex-direction:column;gap:4px;color:inherit;text-decoration:none}.me-quick a span{font-size:1.3rem;color:var(--pri);font-weight:700}
/* 深色補充 */
html[data-theme=dark] .front{background:linear-gradient(170deg,#2a2140,#1f1832);color:#f3e9d2;border-color:#8a6d32}
html[data-theme=dark] .tcard .front .sub{color:#c9b48a}
html[data-theme=dark] .chip-r input:checked+span{background:#7c3aed}
html[data-theme=dark] .wg-good{border-color:#2f6b52}html[data-theme=dark] .wg-bad{border-color:#7a3550}
html[data-theme=dark] .li-card.wish.done{border-color:#2f6b52}
html[data-theme=dark] .ad-unit img{opacity:.95}
.foot .ad-slot{flex-basis:100%}
/* ===== 占卜師遊戲（Phase 2） ===== */
.tellers-head{position:relative}
.hidden-key{position:absolute;top:14px;right:0;display:inline-flex;align-items:center;gap:6px;font-size:.8rem;color:var(--faint);border:1px dashed var(--line2);border-radius:999px;padding:4px 10px;opacity:.55;transition:.2s;text-decoration:none}
.hidden-key:hover,.hidden-key.on{opacity:1;color:var(--pri);text-decoration:none}
.hidden-key span{font-size:.75rem}
.gender-toggle{display:flex;justify-content:center;gap:0;margin:0 auto 22px;border:1px solid var(--line2);border-radius:999px;width:max-content;overflow:hidden;background:var(--card)}
.gender-toggle button{border:0;background:none;padding:8px 20px;font:inherit;font-weight:700;color:var(--muted);cursor:pointer}
.gender-toggle button.on{background:var(--pri);color:#fff}
.gsym{font-size:.85rem;font-weight:800}.gsym.g-f{color:#db2777}.gsym.g-m{color:#2563eb}
.portrait .gbadge{left:auto;right:12px}
.portrait .mbadge{background:#fef3c7;color:#92400e}
.portrait .pimg{width:100%;height:100%;object-fit:cover}
.portrait.sil svg,.portrait.sil .pimg{filter:brightness(0) saturate(0);opacity:.55}
.portrait.sil{background:linear-gradient(160deg,#cbd5e1,#64748b)!important}
.stage-badge{display:inline-block;background:var(--pri-soft);color:var(--pri);border:1px solid var(--line2);border-radius:999px;padding:1px 9px;font-size:.76rem;font-weight:700;white-space:nowrap}
.hidden-hall{margin-top:40px;padding-top:24px;border-top:1px dashed var(--line2)}
.hall-head{text-align:center}
.token-bar{display:inline-block;background:var(--soft2);border:1px solid var(--line2);border-radius:14px;padding:8px 14px;margin-bottom:8px}
.hall-group{margin-top:26px}
.hall-group h3{font-size:1.15rem;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.hall-group .tagm,.hall-group .tags{font-size:.72rem;border-radius:999px;padding:1px 8px;font-weight:700}
.tagm{background:#fef3c7;color:#92400e}.tags{background:#ede9fe;color:#5b21b6}
.grid.g4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
@media (max-width:900px){.grid.g4{grid-template-columns:repeat(2,minmax(0,1fr))}}
.locked-card .portrait{height:170px}
.lock-note{display:flex;flex-direction:column;gap:2px;font-size:.84rem;color:var(--muted);margin:8px 0}
.lock-note b{color:var(--text)}.lock-note .soon{color:var(--pri);letter-spacing:.06em;text-transform:uppercase}
.btn.sm{padding:6px 14px;font-size:.86rem}
.game-actions{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:14px}
.act-btn{display:flex;flex-direction:column;align-items:center;gap:2px;background:var(--card);border:1px solid var(--line2);border-radius:16px;padding:12px 6px;font:inherit;font-weight:800;color:var(--text);cursor:pointer;transition:.2s}
.act-btn span{font-size:1.5rem}.act-btn small{font-weight:500;font-size:.74rem;color:var(--muted)}
.act-btn:hover,.act-btn.on{border-color:var(--pri);box-shadow:0 6px 18px rgba(124,58,237,.15)}
.game-panel{margin-top:6px}
.inv-head{display:flex;justify-content:space-between;align-items:baseline;gap:10px;flex-wrap:wrap;margin-bottom:10px}
.inv-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(118px,1fr));gap:10px}
.inv-item{position:relative;display:flex;flex-direction:column;align-items:center;gap:2px;padding:12px 6px 10px;border:1px solid var(--line2);border-radius:14px;background:var(--card);font:inherit;color:var(--text);cursor:pointer;transition:.2s}
.inv-item:hover:not([disabled]){transform:translateY(-2px);border-color:var(--pri)}
.inv-item[disabled]{opacity:.45;cursor:not-allowed}
.inv-item .ge{font-size:1.8rem}.inv-item .gn{font-size:.84rem;font-weight:700;text-align:center}.inv-item .gq{font-size:.74rem;color:var(--muted)}
.inv-item .gp{font-size:.7rem;color:var(--rose)}
.inv-item.special{border-color:var(--gold);background:linear-gradient(180deg,var(--card),var(--soft2))}
.inv-item .gs{position:absolute;top:6px;right:6px;font-size:.62rem;background:var(--gold);color:#fff;border-radius:6px;padding:0 5px}
.opts{display:grid;gap:8px;margin-top:14px}
.opt{text-align:left;border:1px solid var(--line2);background:var(--pri-soft);color:var(--text);border-radius:14px;padding:10px 14px;font:inherit;cursor:pointer;transition:.2s}
.opt:hover:not([disabled]){border-color:var(--pri);transform:translateX(3px)}
.opt[disabled]{opacity:.6;cursor:wait}
.talk-res,.chosen{margin:10px 0 6px}
.chap.done summary .st{color:#059669}
.gmodal{position:fixed;inset:0;background:rgba(15,10,30,.55);display:flex;align-items:center;justify-content:center;z-index:120;padding:16px;animation:fadeUp .3s ease}
.gmodal-box{background:var(--card);border:1px solid var(--line2);border-radius:22px;padding:24px;max-width:480px;width:100%;max-height:86vh;overflow:auto;box-shadow:0 20px 60px rgba(0,0,0,.35);text-align:center}
.ev{border-bottom:1px dashed var(--line2);padding-bottom:14px;margin-bottom:14px}
.ev-k{font-size:.8rem;font-weight:800;color:var(--gold);letter-spacing:.08em}
.ev h3{margin:4px 0 6px;font-family:var(--serif)}
.ev-gift,.ev-unl{background:var(--soft);border-radius:12px;padding:8px 10px;margin-top:8px;font-size:.92rem}
.ev-unl .btn{margin-left:6px}
html[data-theme=dark] .portrait.sil{background:linear-gradient(160deg,#334155,#0f172a)!important}
html[data-theme=dark] .portrait.sil svg{filter:brightness(0) invert(.25);opacity:.7}
html[data-theme=dark] .gender-toggle button.on{background:#7c3aed}
html[data-theme=dark] .tagm,html[data-theme=dark] .portrait .mbadge{background:#451a03;color:#fde68a}
html[data-theme=dark] .tags{background:#2e1065;color:#ddd6fe}
html[data-theme=dark] .bar{background:#2a2440}
@media (max-width:760px){.hidden-key{position:static;margin:0 0 6px auto;display:flex;width:max-content}.game-actions{gap:6px}.act-btn{padding:10px 4px}.act-btn small{font-size:.68rem}.locked-card .portrait{height:140px}}
/* 後台：角色遊戲 */
.game-subs{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:16px}
.game-subs .chip.on{background:var(--pri);color:#fff}
.game-pick{gap:8px;flex-wrap:wrap;margin-bottom:12px}.game-pick select{max-width:280px}
.game-form h3{margin:22px 0 8px;font-size:1.05rem;border-bottom:1px solid var(--line);padding-bottom:4px}
.row3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
@media (max-width:760px){.row3{grid-template-columns:1fr 1fr}}
.game-look{display:grid;grid-template-columns:200px 1fr;gap:16px;align-items:start}
.game-prev{height:220px;border-radius:16px;margin-bottom:6px}
@media (max-width:760px){.game-look{grid-template-columns:1fr}}
.gift-prefs{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:6px}
.gpref{display:flex;align-items:center;justify-content:space-between;gap:6px;font-size:.86rem;border:1px solid var(--line);border-radius:10px;padding:4px 8px}
.gpref select{width:auto;padding:4px 6px;font-size:.82rem}
.opts-ed{display:grid;gap:10px;margin-top:10px}
.opt-wrap{border:1px dashed var(--line2);border-radius:12px;padding:10px;background:var(--soft)}
.gift-table{display:grid;gap:6px}
.gt-row{display:grid;grid-template-columns:120px 60px 140px 1fr 50px 130px 34px;gap:6px;align-items:center}
.gt-row input{padding:6px 8px;font-size:.88rem}
@media (max-width:900px){.gt-row{grid-template-columns:1fr 1fr}.gt-h{display:none}}
.acc-row{display:flex;flex-wrap:wrap;gap:10px;align-items:center;border:1px solid var(--line);border-radius:12px;padding:8px 12px;margin-bottom:6px}
.acc-row b{min-width:170px}.acc-row select,.acc-row input{width:auto;padding:5px 8px;font-size:.86rem}
.ev-table{display:grid;gap:8px}
.ev-row{display:grid;grid-template-columns:130px 1fr 1fr 1fr 1.4fr 34px;gap:8px;align-items:end;border:1px solid var(--line);border-radius:12px;padding:8px}
@media (max-width:900px){.ev-row{grid-template-columns:1fr 1fr}}
.map-table td,.map-table th{font-size:.86rem}
.map-warn li{color:#b45309;font-size:.88rem}
