/* 键共振 Destiny · 问真框架新站 · 日夜自动色 */
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+SC:wght@500;700&family=ZCOOL+XiaoWei&display=swap');

/* —— 夜色（默认，日落后） —— */
:root,
html[data-theme="night"]{
  color-scheme: dark;
  --ink:#0b0f0c;
  --panel:#141a16;
  --jade:#6f9b7a;
  --bronze:#c4a574;
  --mist:#9aa89c;
  --paper:#e8efe6;
  --line:rgba(111,155,122,.32);
  --hot:#c97868;
  --ok:#7eb889;
  --surface:rgba(0,0,0,.28);
  --surface-2:rgba(0,0,0,.22);
  --surface-3:rgba(0,0,0,.18);
  --surface-4:rgba(0,0,0,.16);
  --topbar-bg:rgba(11,15,12,.92);
  --side-bg:rgba(0,0,0,.25);
  --bottom-bg:rgba(11,15,12,.96);
  --board-bg:linear-gradient(180deg,rgba(111,155,122,.08),rgba(0,0,0,.28));
  --banner-bg:rgba(196,165,116,.08);
  --verdict-bg:rgba(111,155,122,.08);
  --bar-track:rgba(255,255,255,.06);
  --block-rule:rgba(111,155,122,.14);
  --table-head:rgba(111,155,122,.1);
  --primary-ink:#0e120f;
  --yang:#e8b4a0;
  --yin:#a8c4e8;
  --err:#ff8a80;
  --body-bg:
    radial-gradient(900px 420px at 0% 0%,#1e2a22,transparent 55%),
    linear-gradient(180deg,#0b0f0c 0%,#121814 40%,#0e120f 100%);
  --theme-fade:color .35s ease, background .45s ease, border-color .35s ease, box-shadow .35s ease;
}

/* —— 昼色（日出后） —— */
html[data-theme="day"]{
  color-scheme: light;
  --ink:#1a2420;
  --panel:#f3f6f1;
  --jade:#3f6b4f;
  --bronze:#8a6a3a;
  --mist:#5c6b60;
  --paper:#152019;
  --line:rgba(63,107,79,.28);
  --hot:#b54e3c;
  --ok:#2f6b45;
  --surface:rgba(255,255,255,.72);
  --surface-2:rgba(255,255,255,.85);
  --surface-3:rgba(255,255,255,.65);
  --surface-4:rgba(255,255,255,.55);
  --topbar-bg:rgba(243,246,241,.94);
  --side-bg:rgba(226,234,227,.72);
  --bottom-bg:rgba(243,246,241,.96);
  --board-bg:linear-gradient(180deg,rgba(63,107,79,.08),rgba(255,255,255,.7));
  --banner-bg:rgba(138,106,58,.08);
  --verdict-bg:rgba(63,107,79,.08);
  --bar-track:rgba(26,36,32,.08);
  --block-rule:rgba(63,107,79,.14);
  --table-head:rgba(63,107,79,.1);
  --primary-ink:#f5f8f4;
  --yang:#9a4e38;
  --yin:#2f5f8a;
  --err:#c62828;
  --body-bg:
    radial-gradient(1000px 520px at 85% -10%,#d8e6cf,transparent 55%),
    radial-gradient(800px 400px at 0% 100%,#cfe0d6,transparent 50%),
    linear-gradient(180deg,#eef3eb 0%,#e2ebe3 45%,#d7e3da 100%);
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;min-height:100vh;color:var(--paper);font:14px/1.45 "Noto Serif SC",serif;
  background:var(--body-bg);
  transition:var(--theme-fade);
}
a{color:var(--bronze);text-decoration:none}
button,input,select,textarea{font:inherit;transition:var(--theme-fade)}

.app{max-width:1100px;margin:0 auto;min-height:100vh;display:flex;flex-direction:column}
.topbar{
  display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 14px;
  border-bottom:1px solid var(--line);background:var(--topbar-bg);position:sticky;top:0;z-index:20;
  backdrop-filter:blur(8px);transition:var(--theme-fade);
}
.brand{font-family:"ZCOOL XiaoWei",serif;font-size:1.25rem;color:var(--bronze);letter-spacing:.04em}
.brand small{display:block;font:12px/1.2 "Noto Serif SC",serif;color:var(--mist);margin-top:2px}
.topbar-actions{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.topbar-actions a,.ghost{
  border:1px solid var(--line);color:var(--mist);background:transparent;
  border-radius:8px;padding:6px 10px;font-size:12px;cursor:pointer
}
.topbar-actions a:hover,.ghost:hover{border-color:var(--jade);color:var(--bronze)}

.theme-switch{
  display:inline-flex;border:1px solid var(--line);border-radius:8px;overflow:hidden;padding:0;
  background:var(--surface);
}
.theme-switch button{
  border:0;background:transparent;color:var(--mist);padding:6px 8px;font-size:11px;cursor:pointer;line-height:1.2
}
.theme-switch button.on{background:rgba(111,155,122,.22);color:var(--bronze);font-weight:700}
html[data-theme="day"] .theme-switch button.on{background:rgba(63,107,79,.18)}

.layout{display:grid;grid-template-columns:320px 1fr;gap:0;flex:1}
@media(max-width:860px){.layout{grid-template-columns:1fr}}
.side{border-right:1px solid var(--line);background:var(--side-bg);padding:12px 12px 80px;transition:var(--theme-fade)}
@media(max-width:860px){.side{border-right:0;border-bottom:1px solid var(--line)}}
.main{padding:12px 14px 90px;min-width:0}
.sec-title{font-family:"ZCOOL XiaoWei",serif;color:var(--bronze);font-size:1rem;margin:0 0 8px}
.mode{display:grid;grid-template-columns:1fr 1fr 1fr;gap:6px;margin:0 0 10px}
.mode button,.tabs button{
  border:1px solid var(--line);background:var(--surface);color:var(--mist);
  border-radius:8px;padding:.55rem .3rem;cursor:pointer;font-weight:600
}
.mode button.on,.tabs button.active{border-color:var(--jade);color:var(--bronze);background:rgba(111,155,122,.16)}
html[data-theme="day"] .mode button.on,
html[data-theme="day"] .tabs button.active{background:rgba(63,107,79,.14)}
label{display:block;color:var(--mist);font-size:11.5px;margin:0 0 3px}
input,select,textarea{
  width:100%;background:var(--surface-2);color:var(--paper);border:1px solid var(--line);
  border-radius:8px;padding:8px;margin:0 0 8px
}
.row{display:flex;gap:8px}.row>*{flex:1;min-width:0}
.primary{
  width:100%;border:0;border-radius:9px;padding:.75rem;background:var(--jade);color:var(--primary-ink);
  font-weight:700;cursor:pointer;margin-top:4px
}
.primary:active{transform:scale(.98)}
.chk{display:flex;align-items:center;gap:8px;color:var(--mist);font-size:12.5px;margin:0 0 8px}
.chk input{width:auto;margin:0}
.msg{font-size:12px;color:var(--mist);min-height:1.2em}.msg .ok{color:var(--ok)}.msg .err{color:var(--err)}
.board{
  border:1px solid var(--line);border-radius:12px;background:var(--board-bg);
  padding:12px;margin:0 0 12px;transition:var(--theme-fade)
}
.meta-line{display:flex;flex-wrap:wrap;gap:8px 14px;font-size:12.5px;color:var(--mist);margin:0 0 10px}
.meta-line b{color:var(--bronze);font-weight:600}
.pillars{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.pillar{
  text-align:center;padding:8px 4px 10px;border:1px solid var(--line);border-radius:10px;
  background:var(--surface-2);transition:var(--theme-fade)
}
.pillar .lab{font-size:11px;color:var(--mist)}
.pillar .stem{font-family:"ZCOOL XiaoWei",serif;font-size:1.65rem;line-height:1.1;margin-top:4px}
.pillar .branch{font-family:"ZCOOL XiaoWei",serif;font-size:1.65rem;line-height:1.1}
.pillar .god{font-size:11px;color:var(--jade);margin-top:4px}
.pillar .hide{font-size:11px;color:var(--mist);margin-top:3px;line-height:1.35;min-height:2.6em}
.yang{color:var(--yang)}.yin{color:var(--yin)}
.luck{display:flex;gap:6px;overflow-x:auto;padding:2px 0 8px;scrollbar-width:none}
.luck button{
  flex:0 0 auto;min-width:68px;border:1px solid var(--line);background:var(--surface);
  color:var(--paper);border-radius:8px;padding:7px 8px;cursor:pointer
}
.luck button.on{border-color:var(--jade);background:rgba(111,155,122,.2);color:var(--bronze)}
html[data-theme="day"] .luck button.on{background:rgba(63,107,79,.16)}
.luck .y{display:block;font-size:10px;color:var(--mist)}
.tabs{display:grid;grid-template-columns:repeat(6,1fr);gap:5px;margin:0 0 10px}
@media(max-width:860px){.tabs{grid-template-columns:repeat(3,1fr)}}
.tabs button{font-size:12px;padding:.55rem .2rem}
.tabs button strong{display:block;font-family:"ZCOOL XiaoWei",serif;font-size:14px;color:var(--paper)}
.tabs button.active strong{color:var(--bronze)}
.panel{display:none}.panel.active{display:block;animation:in .22s ease}
@keyframes in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.banner{font-size:12px;color:var(--mist);margin:0 0 10px;padding:8px 10px;border-left:3px solid var(--bronze);background:var(--banner-bg)}
.block{border:1px solid var(--line);border-radius:10px;margin:0 0 8px;overflow:hidden;background:var(--surface-3);transition:var(--theme-fade)}
.block>summary{list-style:none;cursor:pointer;padding:11px 12px;color:var(--bronze);font-weight:600;
display:flex;justify-content:space-between;user-select:none}
.block>summary::-webkit-details-marker{display:none}
.block>summary::after{content:"＋";color:var(--mist);font-weight:500}
.block[open]>summary::after{content:"−"}
.block .body{padding:0 12px 12px;border-top:1px solid var(--block-rule)}
.kv{display:grid;grid-template-columns:88px 1fr;gap:5px 10px;margin:8px 0;font-size:13px}
.kv .k{color:var(--mist)}
.h-line{display:flex;justify-content:space-between;margin:8px 0 3px;font-size:13px}
.h-line .n{color:var(--mist)}
.bar{height:9px;border-radius:999px;background:var(--bar-track);overflow:hidden}
.bar>i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--jade),var(--bronze));
transform-origin:left;animation:grow .55s ease both}
@keyframes grow{from{transform:scaleX(.08)}to{transform:scaleX(1)}}
.chiprow{display:flex;flex-wrap:wrap;gap:6px;margin:8px 0}
.chip{font-size:12px;padding:3px 8px;border:1px solid var(--line);border-radius:7px;color:var(--paper)}
.chip.hot{border-color:rgba(201,120,104,.5);color:var(--hot)}
.chip.ok{border-color:rgba(111,155,122,.5);color:var(--jade)}
.verdict{margin:8px 0 0;padding:10px;background:var(--verdict-bg);border-radius:8px;font-size:13px;color:var(--paper)}
.verdict b{color:var(--bronze)}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.mini{padding:10px;border:1px solid var(--line);border-radius:8px;background:var(--surface-4)}
.mini .t{font-size:11px;color:var(--mist)}.mini .n{font-family:"ZCOOL XiaoWei",serif;font-size:1.15rem;color:var(--bronze);margin-top:2px}
table.pt{width:100%;border-collapse:collapse;font-size:12.5px;margin:6px 0;color:var(--paper)}
table.pt th,table.pt td{border:1px solid var(--line);padding:5px 7px;text-align:left}
table.pt th{background:var(--table-head);color:var(--bronze)}
.footnote{font-size:12px;color:var(--mist);margin-top:10px}
.gate{padding:3rem 1.2rem;text-align:center}
.gate a{display:inline-block;margin-top:1rem;padding:.75rem 1.2rem;border-radius:9px;background:var(--jade);color:var(--primary-ink);font-weight:700}
#shell{display:none}#shell.show{display:flex;flex-direction:column;min-height:100vh}
.bottom{
  position:fixed;left:0;right:0;bottom:0;max-width:1100px;margin:0 auto;display:grid;
  grid-template-columns:repeat(5,1fr);background:var(--bottom-bg);border-top:1px solid var(--line);
  padding:6px 4px calc(6px + env(safe-area-inset-bottom));z-index:15;backdrop-filter:blur(8px);
  transition:var(--theme-fade)
}
.bottom a{text-align:center;color:var(--mist);font-size:11px;padding:6px 2px}
.bottom a strong{display:block;font-family:"ZCOOL XiaoWei",serif;font-size:13px;color:var(--paper)}
.bottom a.on strong{color:var(--bronze)}.bottom a.on{color:var(--jade)}
.param-pill{display:inline-block;font-size:11px;padding:3px 8px;border-radius:6px;border:1px solid var(--line);color:var(--jade)}

/* —— 问真八字排盘模板壳 —— */
.wz-shell{max-width:980px}
.wz-nav{
  display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;
  padding:10px 14px;border-bottom:1px solid var(--line);background:var(--topbar-bg);
  position:sticky;top:0;z-index:22;backdrop-filter:blur(8px)
}
.wz-logo{display:flex;align-items:center;gap:10px}
.wz-mark{
  width:36px;height:36px;border-radius:9px;display:grid;place-items:center;
  font-family:"ZCOOL XiaoWei",serif;font-size:1.2rem;color:var(--primary-ink);
  background:linear-gradient(145deg,var(--jade),var(--bronze));font-weight:700
}
.wz-logo strong{display:block;font-family:"ZCOOL XiaoWei",serif;color:var(--bronze);font-size:1.1rem}
.wz-logo small{display:block;color:var(--mist);font-size:11px;margin-top:2px}
.wz-links{display:flex;flex-wrap:wrap;gap:6px 12px}
.wz-links a{color:var(--mist);font-size:13px;padding:4px 2px;border-bottom:2px solid transparent}
.wz-links a.on,.wz-links a:hover{color:var(--bronze);border-bottom-color:var(--jade)}
.wz-nav-right{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.wz-input{
  margin:12px 14px;padding:12px;border:1px solid var(--line);border-radius:12px;
  background:var(--side-bg)
}
.wz-form-row{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}
@media(max-width:860px){.wz-form-row{grid-template-columns:repeat(2,1fr)}}
.wz-actions{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:4px}
.wz-actions .primary{width:auto;min-width:96px;margin-top:0;padding:.65rem 1.1rem}
.wz-board{
  margin:0 14px 12px;padding:12px;border:1px solid var(--line);border-radius:12px;
  background:var(--board-bg)
}
.wz-table-wrap{overflow-x:auto}
.wz-chart{
  width:100%;border-collapse:collapse;min-width:420px;background:var(--surface-3);
  border:1px solid var(--line);border-radius:10px;overflow:hidden
}
.wz-chart th,.wz-chart td{
  border:1px solid var(--line);padding:8px 6px;text-align:center;font-size:13px;color:var(--paper)
}
.wz-chart thead th{background:var(--table-head);color:var(--bronze);font-weight:700}
.wz-chart tbody th{
  width:58px;background:var(--surface);color:var(--mist);font-weight:600;font-size:12px
}
.wz-chart .gz-row td{
  font-family:"ZCOOL XiaoWei",serif;font-size:1.55rem;line-height:1.1;padding:10px 6px
}
.wz-main-tabs{
  display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin:0 14px 10px
}
@media(max-width:860px){.wz-main-tabs{grid-template-columns:repeat(2,1fr)}}
.wz-main-tabs button{
  border:1px solid var(--line);background:var(--surface);color:var(--mist);
  border-radius:10px;padding:.7rem .4rem;cursor:pointer;font:inherit
}
.wz-main-tabs button strong{
  display:block;font-family:"ZCOOL XiaoWei",serif;font-size:1.05rem;color:var(--paper)
}
.wz-main-tabs button span{display:block;font-size:11px;margin-top:3px}
.wz-main-tabs button.active{
  border-color:var(--jade);background:rgba(111,155,122,.16);color:var(--jade)
}
.wz-main-tabs button.active strong{color:var(--bronze)}
html[data-theme="day"] .wz-main-tabs button.active{background:rgba(63,107,79,.14)}
.wz-subtabs{display:flex;gap:6px;margin:0 0 10px;flex-wrap:wrap}
.wz-subtabs button{
  border:1px solid var(--line);background:var(--surface);color:var(--mist);
  border-radius:8px;padding:6px 12px;cursor:pointer;font-size:12.5px
}
.wz-subtabs button.on{border-color:var(--jade);color:var(--bronze);background:rgba(111,155,122,.16)}
.wz-panels{padding:0 14px 96px}
/* 旧 topbar 在问真壳下隐藏（若残留） */
.wz-shell > .topbar{display:none}
.wz-shell > .layout{display:block}

/* 流层条 · 现地同步 */
.flow-bar{
  margin-top:10px;padding:10px;border:1px dashed var(--line);border-radius:10px;
  background:var(--surface-4);font-size:12.5px;color:var(--mist)
}
.flow-bar b{color:var(--bronze)}
.flow-bar .flow-pillars{
  display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-top:8px
}
.flow-bar .fp{
  text-align:center;padding:6px 4px;border:1px solid var(--line);border-radius:8px;
  background:var(--surface-2)
}
.flow-bar .fp .lab{font-size:10px;color:var(--mist)}
.flow-bar .fp .gz{font-family:"ZCOOL XiaoWei",serif;font-size:1.15rem;color:var(--paper);margin-top:2px}

/* 教程三部 */
.teach-shell{margin-top:4px}
.teach-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin:0 0 12px}
@media(max-width:720px){.teach-tabs{grid-template-columns:1fr}}
.teach-tab{
  text-align:left;padding:10px 12px;border:1px solid var(--line);border-radius:10px;
  background:var(--surface-3);color:var(--paper);cursor:pointer
}
.teach-tab strong{display:block;font-family:"ZCOOL XiaoWei",serif;font-size:1.05rem;color:var(--bronze)}
.teach-tab span{display:block;margin-top:4px;font-size:11.5px;color:var(--mist);line-height:1.35}
.teach-tab.on{border-color:var(--jade);background:rgba(111,155,122,.14)}
.teach-eye{font-size:11px;color:var(--mist);margin:8px 0 4px}
.teach-body{font-size:13.5px;line-height:1.65;color:var(--paper);white-space:normal}
.teach-foot{font-size:12px;color:var(--mist);margin:12px 0 0}
.teach-page>summary{font-size:13.5px}