:root{
    --ink-0:#080a0e; --ink-1:#0d1016; --ink-2:#131821; --ink-3:#1b212b;
    --line:rgba(201,168,106,.18); --line-soft:rgba(201,168,106,.09);
    --gold:#c9a86a; --gold-hi:#ecd39c; --gold-dim:#907b46; --gold-deep:#5f5029;
    --cinnabar:#b23b2e; --cinnabar-hi:#db6150;
    --jade:#7a9f92;
    --paper:#ece4d2; --paper-dim:#a09a88; --paper-faint:rgba(236,228,210,.42);
    --serif-kai:"STKaiti","KaiTi","Kaiti SC","楷体","BiauKai",serif;
    --serif-song:"Songti SC","STSong","SimSun","宋体","Noto Serif CJK SC",serif;
    --sans:"PingFang SC","Microsoft YaHei","Segoe UI",system-ui,sans-serif;
    --maxw:700px;
  }
  *{ box-sizing:border-box }
  html,body{ margin:0; padding:0 }
  body{
    background:
      radial-gradient(1100px 640px at 50% -12%, rgba(201,168,106,.13), transparent 56%),
      radial-gradient(820px 820px at 50% 116%, rgba(122,159,146,.06), transparent 55%),
      linear-gradient(180deg, #0a0c11, #070809 62%, #050607);
    background-attachment:fixed;
    color:var(--paper); font-family:var(--serif-song); line-height:1.78;
    min-height:100dvh; -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
    overflow-x:hidden;
  }

  /* ——— 背景八卦罗盘 ——— */
  .bagua{ position:fixed; inset:0; z-index:0; display:grid; place-items:center; pointer-events:none; overflow:hidden; }
  .bagua svg{ width:min(122vw,900px); height:min(122vw,900px); opacity:.4; animation:spin 160s linear infinite; }
  @keyframes spin{ to{ transform:rotate(360deg) } }
  .bagua .taiji{ font-size:60px; }

  /* ——— 版心 · 卷轴气度 ——— */
  .wrap{ position:relative; z-index:1; max-width:var(--maxw); margin:0 auto;
    padding:clamp(30px,5vw,56px) clamp(22px,5vw,48px) 52px; }
  .wrap::before{ content:""; position:absolute; inset:12px 4px; pointer-events:none;
    border-left:1px solid var(--line-soft); border-right:1px solid var(--line-soft); }

  /* ——— 匾额 ——— */
  header{ text-align:center; position:relative; padding-top:6px; }
  .crest{ font-family:var(--sans); font-size:26px; color:var(--gold-dim); line-height:1; margin-bottom:16px; }
  .eyebrow{ font-family:var(--sans); font-size:12px; letter-spacing:.5em; text-indent:.5em;
    color:var(--gold-dim); text-transform:uppercase; margin-bottom:16px; }
  h1{ font-family:var(--serif-kai); font-weight:400; margin:0;
    font-size:clamp(48px,13vw,78px); letter-spacing:.2em; text-indent:.2em;
    background:linear-gradient(180deg,#f4e6c2,#cbab6e 52%,#9c8149);
    -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; color:transparent;
    text-shadow:0 2px 30px rgba(201,168,106,.14); text-wrap:balance; }
  .subtitle{ font-family:var(--serif-song); color:var(--paper-dim); font-size:15px;
    letter-spacing:.14em; margin-top:16px; }
  .seal{ position:absolute; top:2px; right:2px; width:46px; height:46px;
    display:grid; place-items:center; border-radius:5px; transform:rotate(-4deg);
    background:linear-gradient(145deg,#b23b2e,#8e2c22); color:#f3e2c0;
    font-family:var(--serif-kai); font-size:26px;
    box-shadow:0 3px 12px rgba(0,0,0,.5), inset 0 0 0 1px rgba(243,226,192,.35);
    text-shadow:0 1px 1px rgba(0,0,0,.35); }
  .rule{ width:112px; height:0; margin:24px auto 0; position:relative;
    border-top:1px solid transparent;
    background:linear-gradient(90deg,transparent,var(--gold-dim),transparent) center/100% 1px no-repeat; }
  .rule::after{ content:"◈"; position:absolute; top:-11px; left:50%; transform:translateX(-50%);
    color:var(--gold); font-size:13px; background:transparent; padding:0 8px; }

  /* ——— 今日黄历 · 无框长带 ——— */
  .almanac{ margin:30px auto 0; padding:18px 4px; display:grid;
    grid-template-columns:auto 1fr; gap:8px 22px; align-items:center;
    border-top:1px solid var(--line-soft); border-bottom:1px solid var(--line-soft); }
  .almanac .date{ grid-row:span 2; align-self:center; font-family:var(--serif-kai);
    font-size:30px; color:var(--gold-hi); letter-spacing:.03em; white-space:nowrap; }
  .almanac .ganzhi{ font-family:var(--sans); font-size:12.5px; color:var(--paper-dim); letter-spacing:.12em; }
  .almanac .yiji{ display:flex; gap:20px; flex-wrap:wrap; font-size:14px; }
  .almanac .yiji b{ display:inline-flex; align-items:center; justify-content:center;
    width:1.55em; height:1.55em; border-radius:50%; font-family:var(--sans); font-weight:600;
    font-size:12px; margin-right:9px; vertical-align:1px; }
  .almanac .yi b{ background:rgba(122,159,146,.15); color:var(--jade); border:1px solid rgba(122,159,146,.4); }
  .almanac .ji b{ background:rgba(178,59,46,.15); color:var(--cinnabar-hi); border:1px solid rgba(178,59,46,.42); }
  .almanac .yiji span{ color:var(--paper); letter-spacing:.18em; }

  /* ——— 切术标签 ——— */
  .tabs{ display:flex; justify-content:center; gap:0; margin-top:32px;
    border-bottom:1px solid var(--line); flex-wrap:wrap; }
  .tab{ font-family:var(--serif-kai); font-size:17px; letter-spacing:.14em; text-indent:.14em;
    color:var(--paper-dim); background:transparent; border:0; border-radius:0;
    padding:13px 20px; cursor:pointer; position:relative; transition:color .25s; }
  .tab:hover{ color:var(--paper); }
  .tab.active{ color:var(--gold-hi); }
  .tab.active::after{ content:""; position:absolute; left:14px; right:14px; bottom:-1px; height:2px;
    background:linear-gradient(90deg,transparent,var(--gold),transparent); }
  .tab.active::before{ content:"◆"; position:absolute; top:2px; left:50%; transform:translateX(-50%);
    font-size:6px; color:var(--gold-dim); }
  .tab:focus-visible{ outline:2px solid var(--gold-hi); outline-offset:2px; }

  .panel{ animation:fade .45s ease both; }
  @keyframes fade{ from{ opacity:0; transform:translateY(8px) } to{ opacity:1; transform:none } }

  /* ——— 法坛（各术共用舞台） ——— */
  .altar{ margin-top:30px; position:relative; padding:34px clamp(18px,4vw,32px) 34px;
    background:radial-gradient(130% 90% at 50% 0%, rgba(201,168,106,.07), transparent 62%), var(--ink-1);
    border-top:1px solid var(--line); border-bottom:1px solid var(--line-soft); }
  .altar::before,.altar::after{ content:""; position:absolute; width:16px; height:16px; pointer-events:none;
    border:1px solid var(--gold-dim); opacity:.7; }
  .altar::before{ top:9px; left:9px; border-right:0; border-bottom:0; }
  .altar::after{ bottom:9px; right:9px; border-left:0; border-top:0; }
  .altar .hint{ text-align:center; color:var(--paper-dim); font-size:14.5px; letter-spacing:.05em; }
  .ming-loaded{ text-align:center; font-family:var(--sans); font-size:12px; color:var(--gold);
    letter-spacing:.06em; margin:12px 0 0; }

  /* ——— 表单通用 ——— */
  .field{ display:flex; flex-direction:column; gap:8px; align-items:center; }
  .flabel{ font-family:var(--sans); font-size:11.5px; letter-spacing:.2em; color:var(--paper-dim); }
  .date-row{ display:inline-flex; align-items:center; gap:6px; flex-wrap:wrap; justify-content:center; }
  input.num{ width:82px; text-align:center; }
  input.num.d3{ width:64px; }
  .date-row .sep{ font-family:var(--serif-song); font-size:14px; color:var(--paper-dim); margin-right:4px; }
  .in{ background:var(--ink-0); border:1px solid var(--line); border-radius:2px; color:var(--paper);
    font-family:var(--serif-song); font-size:15px; padding:10px 12px; color-scheme:dark;
    transition:border-color .2s, box-shadow .2s; }
  .in::placeholder{ color:var(--paper-faint); }
  .in:focus{ outline:none; border-color:var(--gold-dim); box-shadow:0 0 0 3px rgba(201,168,106,.1); }
  input[type=number].in{ -moz-appearance:textfield; }
  input[type=number].in::-webkit-outer-spin-button,
  input[type=number].in::-webkit-inner-spin-button{ -webkit-appearance:none; margin:0; }
  select.in{ padding-right:28px; }

  .ask{ display:flex; gap:10px; margin:22px auto 4px; max-width:440px; }
  .ask input{ flex:1; min-width:0; }

  /* ——— 铜钱 ——— */
  .coins{ display:flex; justify-content:center; gap:24px; margin:30px auto 8px;
    min-height:82px; align-items:center; flex-wrap:wrap; }
  .coin{ width:72px; height:72px; border-radius:50%; display:grid; place-items:center; position:relative;
    background:radial-gradient(circle at 34% 30%, rgba(255,255,255,.12), transparent 42%),
      radial-gradient(circle at 50% 50%, #2c2c2e, #161617);
    border:1px solid rgba(201,168,106,.3);
    box-shadow:inset 0 0 0 4px rgba(0,0,0,.4), 0 7px 16px rgba(0,0,0,.45);
    font-family:var(--serif-kai); color:var(--paper-faint); font-size:23px;
    transition:color .25s, box-shadow .35s, border-color .35s, background .35s; }
  .coin::after{ content:""; position:absolute; width:21px; height:21px; background:var(--ink-0);
    box-shadow:inset 0 0 0 1px rgba(201,168,106,.24); border-radius:2px; }
  .coin span{ position:relative; z-index:1; }
  .coin.yang{ color:#241a08;
    background:radial-gradient(circle at 34% 28%, #f7e8bd, transparent 46%), linear-gradient(155deg,#e6cb88,#b18e44);
    border-color:var(--gold-hi);
    box-shadow:inset 0 0 0 4px rgba(120,90,30,.4), 0 0 22px rgba(201,168,106,.38);
    text-shadow:0 1px 0 rgba(255,255,255,.25); }
  .coin.yin{ color:var(--jade); border-color:rgba(122,159,146,.5);
    box-shadow:inset 0 0 0 4px rgba(0,0,0,.42), 0 0 16px rgba(122,159,146,.15); }
  .coin.tossing{ animation:toss .72s cubic-bezier(.3,.1,.3,1); }
  @keyframes toss{ 0%{transform:translateY(0) rotate(0) scaleX(1)}
    22%{transform:translateY(-48px) rotate(220deg) scaleX(.2)}
    44%{transform:translateY(-14px) rotate(430deg) scaleX(1)}
    66%{transform:translateY(-32px) rotate(650deg) scaleX(.2)}
    100%{transform:translateY(0) rotate(1080deg) scaleX(1)} }
  .cast-label{ font-family:var(--sans); font-size:12.5px; letter-spacing:.2em; color:var(--gold);
    min-height:1.4em; margin-top:4px; text-align:center; }

  /* ——— 卦象柱 ——— */
  .hexagram{ display:flex; flex-direction:column-reverse; gap:10px; width:196px; margin:22px auto 4px; }
  .yao{ display:flex; gap:14px; height:17px; position:relative; justify-content:center; }
  .yao .bar{ height:100%; border-radius:1px;
    background:linear-gradient(180deg,var(--gold-hi),var(--gold-dim)); box-shadow:0 1px 3px rgba(0,0,0,.5); }
  .yao .bar.solid{ width:100%; }
  .yao .bar.broken{ width:calc(50% - 7px); }
  .yao.changing .bar{ background:linear-gradient(180deg,var(--cinnabar-hi),var(--cinnabar));
    box-shadow:0 0 12px rgba(219,97,80,.5); }
  .yao .mark{ position:absolute; right:-26px; top:50%; transform:translateY(-50%);
    font-family:var(--sans); font-size:13px; color:var(--cinnabar-hi); width:16px; text-align:center; }
  .yao.enter{ animation:yaoIn .5s ease both; }
  @keyframes yaoIn{ from{opacity:0; transform:translateY(10px) scaleX(.5)} to{opacity:1; transform:none} }
  .progress{ font-family:var(--sans); font-size:12px; letter-spacing:.26em; color:var(--paper-faint);
    margin-top:8px; min-height:1.2em; text-align:center; }

  /* ——— 按钮 ——— */
  .actions{ margin-top:26px; display:flex; gap:14px; justify-content:center; flex-wrap:wrap; }
  button{ font-family:var(--serif-kai); font-size:18px; letter-spacing:.26em; text-indent:.26em;
    color:var(--paper); background:linear-gradient(180deg,var(--ink-3),var(--ink-2));
    border:1px solid var(--gold-dim); border-radius:3px; padding:13px 34px; cursor:pointer; transition:.22s; }
  button:hover:not(:disabled){ color:var(--ink-0);
    background:linear-gradient(180deg,var(--gold-hi),var(--gold));
    box-shadow:0 0 26px rgba(201,168,106,.35); border-color:var(--gold-hi); }
  button.ghost{ font-size:15px; padding:12px 24px; border-color:var(--line); }
  button.ghost:hover:not(:disabled){ background:var(--ink-3); color:var(--paper);
    box-shadow:none; border-color:var(--gold-dim); }
  button.bazi-go{ font-size:16px; padding:11px 28px; }
  button:disabled{ opacity:.38; cursor:default; }
  button:focus-visible{ outline:2px solid var(--gold-hi); outline-offset:3px; }

  /* ——— 卦解结果 ——— */
  .result{ margin-top:28px; display:none; }
  .result.show{ display:block; animation:rise .7s ease both; }
  @keyframes rise{ from{opacity:0; transform:translateY(18px)} to{opacity:1; transform:none} }
  .asked{ text-align:center; font-family:var(--serif-song); color:var(--paper-dim);
    font-size:14px; letter-spacing:.05em; margin-bottom:18px; }
  .asked b{ color:var(--gold-hi); font-weight:400; }
  .gua-card{ position:relative; padding:32px clamp(20px,5vw,34px);
    background:linear-gradient(180deg,var(--ink-2),var(--ink-1)); text-align:center;
    border-top:2px solid var(--gold-dim); box-shadow:0 -1px 0 rgba(201,168,106,.15); }
  .gua-no{ font-family:var(--sans); font-size:12px; letter-spacing:.34em; color:var(--gold-dim); }
  .gua-name{ font-family:var(--serif-kai); font-size:clamp(34px,9vw,50px); letter-spacing:.14em; text-indent:.14em;
    margin:8px 0 4px;
    background:linear-gradient(100deg,var(--gold-dim) 8%,var(--gold-hi) 40%,#fff8e6 50%,var(--gold-hi) 60%,var(--gold-dim) 92%);
    background-size:200% auto; -webkit-background-clip:text; background-clip:text;
    -webkit-text-fill-color:transparent; color:transparent; animation:shimmer 4.5s linear infinite; }
  @keyframes shimmer{ to{ background-position:200% center } }
  .gua-trigrams{ font-family:var(--sans); font-size:13px; letter-spacing:.16em; color:var(--paper-dim); margin-top:10px; }
  .gua-trigrams .sym{ color:var(--gold); font-size:16px; }
  .luck{ display:inline-block; margin-top:16px; font-family:var(--serif-kai); font-size:17px;
    letter-spacing:.3em; text-indent:.3em; padding:4px 18px; border-radius:2px; }
  .luck.good{ color:#ffe9b0; background:rgba(201,168,106,.14); border:1px solid var(--gold-dim); text-shadow:0 0 12px rgba(201,168,106,.5); }
  .luck.flat{ color:var(--paper-dim); background:rgba(236,228,210,.05); border:1px solid var(--line); }
  .luck.warn{ color:var(--cinnabar-hi); background:rgba(178,59,46,.12); border:1px solid rgba(178,59,46,.4); }
  .divider{ height:1px; background:var(--line); margin:24px -4px; }
  .gua-ci{ font-family:var(--serif-song); font-size:17px; color:var(--gold-hi); letter-spacing:.06em; line-height:1.9; }
  .gua-ci::before{ content:"「"; color:var(--gold-dim); }
  .gua-ci::after{ content:"」"; color:var(--gold-dim); }
  .gua-read{ font-family:var(--serif-song); font-size:16px; color:var(--paper); line-height:2.05; margin-top:16px; text-align:justify; }

  .fusion{ margin-top:20px; border:1px solid var(--gold-dim); border-radius:2px; padding:17px 19px;
    background:rgba(201,168,106,.06); text-align:left; }
  .fusion .tag{ font-family:var(--sans); font-size:11px; letter-spacing:.24em; color:var(--gold-hi); }
  .fusion .ftext{ font-family:var(--serif-song); font-size:15px; color:var(--paper); line-height:2; margin-top:10px; }
  .fusion .ftext b{ color:var(--gold-hi); font-weight:400; }
  .bianbox{ margin-top:20px; border:1px dashed var(--line); border-radius:2px; padding:17px 19px;
    background:rgba(178,59,46,.05); text-align:left; }
  .bianbox .tag{ font-family:var(--sans); font-size:11px; letter-spacing:.24em; color:var(--cinnabar-hi); text-transform:uppercase; }
  .bianbox .bn{ font-family:var(--serif-kai); font-size:22px; color:var(--gold-hi); letter-spacing:.1em; margin:7px 0; }
  .bianbox .bn small{ font-family:var(--sans); font-size:12px; color:var(--paper-faint); letter-spacing:.1em; margin-left:8px; }
  .bianbox .note{ font-family:var(--serif-song); font-size:14px; color:var(--paper-dim); line-height:1.9; }

  /* ——— 事类解析 ——— */
  .matter{ margin-top:18px; border:1px solid var(--line); border-left:2px solid var(--gold-dim);
    border-radius:2px; padding:13px 16px; background:rgba(201,168,106,.04); text-align:left; }
  .matter .tag{ font-family:var(--sans); font-size:11px; letter-spacing:.2em; color:var(--gold-hi); }
  .matter .mtext{ font-family:var(--serif-song); font-size:15px; color:var(--paper); line-height:1.95; margin-top:7px; }

  /* ——— 小六壬 三宫 ——— */
  .slr-title{ text-align:center; font-family:var(--serif-kai); font-size:22px; color:var(--gold-hi);
    letter-spacing:.06em; margin:14px 0 4px; }
  .slr-title small{ font-family:var(--sans); font-size:12px; color:var(--paper-dim); letter-spacing:.1em; margin-left:8px; }
  .slr-three{ display:flex; gap:12px; justify-content:center; margin-top:18px; flex-wrap:wrap; }
  .slr-cell{ flex:1 1 26%; min-width:98px; text-align:center; border:1px solid var(--line);
    border-radius:2px; padding:18px 8px; background:var(--ink-1); }
  .slr-cell.primary{ border-color:var(--gold); box-shadow:inset 0 0 0 1px rgba(201,168,106,.3); }
  .slr-cell .role{ font-family:var(--sans); font-size:11px; letter-spacing:.2em; color:var(--paper-faint); }
  .slr-cell .shen{ font-family:var(--serif-kai); font-size:30px; margin:14px 0 10px; letter-spacing:.06em; }
  .slr-cell .lk{ display:inline-block; font-family:var(--sans); font-size:11px; padding:2px 10px; border-radius:2px; letter-spacing:.06em; }
  .slr-read{ margin-top:24px; max-width:560px; margin-left:auto; margin-right:auto;
    font-family:var(--serif-song); font-size:15px; color:var(--paper); line-height:2.1; text-align:justify; }
  .slr-read b{ color:var(--gold-hi); font-weight:400; }

  /* ——— 金口诀 四位 ——— */
  .jkj-head{ text-align:center; font-family:var(--serif-kai); font-size:21px; color:var(--gold-hi);
    letter-spacing:.06em; margin:10px 0 2px; }
  .jkj-head small{ display:block; font-family:var(--sans); font-size:12px; color:var(--paper-dim);
    letter-spacing:.12em; margin-top:7px; }
  .jkj-court{ max-width:300px; margin:22px auto 0; border:1px solid var(--gold-dim); border-radius:2px; overflow:hidden; }
  .jkj-row{ display:grid; grid-template-columns:4.6em 1fr; align-items:center; border-bottom:1px solid var(--line-soft); }
  .jkj-row:last-child{ border-bottom:0; }
  .jkj-row .rl{ font-family:var(--sans); font-size:12px; letter-spacing:.16em; color:var(--paper-dim);
    text-align:center; padding:14px 6px; background:var(--ink-2); border-right:1px solid var(--line-soft); }
  .jkj-row .rv{ font-family:var(--serif-kai); font-size:25px; color:var(--paper); padding:11px 16px; letter-spacing:.08em; }
  .jkj-row .rv small{ font-family:var(--sans); font-size:12px; color:var(--paper-dim); letter-spacing:.06em; margin-left:8px; }
  .jkj-row.hl{ background:linear-gradient(90deg,rgba(201,168,106,.1),transparent); }
  .jkj-row.hl .rv{ color:var(--gold-hi); }
  .jkj-read{ margin-top:24px; max-width:560px; margin-left:auto; margin-right:auto;
    font-family:var(--serif-song); font-size:14.5px; color:var(--paper); line-height:2.1; text-align:justify; }
  .jkj-read b{ color:var(--gold-hi); font-weight:400; }
  .jkj-read .note{ display:block; margin-top:12px; font-size:12.5px; color:var(--paper-faint); line-height:1.85; }

  /* ——— 八字排盘 ——— */
  .bazi{ margin-top:0; }
  .bazi-toggle{ width:100%; display:flex; align-items:center; justify-content:center; gap:12px;
    font-family:var(--serif-kai); font-size:18px; letter-spacing:.18em; text-indent:.18em;
    color:var(--gold-hi); background:transparent; border:0; padding:6px 0 18px; cursor:pointer; }
  .bazi-toggle .chev{ font-family:var(--sans); color:var(--gold); font-size:20px; line-height:1; transition:transform .3s; }
  .bazi-toggle[aria-expanded="true"] .chev{ transform:rotate(135deg); }
  .bazi-body{ padding-top:6px; }
  .bazi-hint{ text-align:center; color:var(--paper-dim); font-size:13.5px; line-height:1.85; margin:0 0 20px; }
  .bazi-form{ display:flex; flex-wrap:wrap; gap:18px; align-items:flex-end; justify-content:center; }
  .bazi-form .field{ gap:8px; }
  .bazi-go{ align-self:flex-end; }

  .bazi-result{ margin-top:26px; }
  .pillars{ display:grid; grid-template-columns:repeat(4,1fr); gap:8px; text-align:center; max-width:420px; margin:0 auto; }
  .pillar{ border:1px solid var(--line); border-radius:2px; padding:13px 4px; background:var(--ink-1); }
  .pillar .pl{ font-family:var(--sans); font-size:11px; letter-spacing:.2em; color:var(--paper-faint); margin-bottom:10px; }
  .pillar .gan,.pillar .zhi{ font-family:var(--serif-kai); font-size:28px; line-height:1.24; }
  .pillar .wx{ font-family:var(--sans); font-size:10.5px; color:var(--paper-dim); margin-top:8px; letter-spacing:.04em; }
  .wuxing{ margin-top:22px; display:flex; flex-direction:column; gap:9px; max-width:440px; margin-left:auto; margin-right:auto; }
  .wx-row{ display:grid; grid-template-columns:2.2em 1fr 4em; align-items:center; gap:12px; }
  .wx-row .wl{ text-align:center; border-radius:2px; padding:2px 0; font-family:var(--serif-kai); font-size:16px; }
  .wx-row .track{ height:8px; background:rgba(236,228,210,.06); border-radius:4px; overflow:hidden; }
  .wx-row .fill{ height:100%; border-radius:4px; transition:width .6s ease; }
  .wx-row .wn{ font-family:var(--sans); font-size:11.5px; color:var(--paper-dim); text-align:right;
    font-variant-numeric:tabular-nums; letter-spacing:.04em; white-space:nowrap; }
  .mingping{ margin-top:24px; border-top:1px solid var(--line-soft); padding-top:20px;
    font-family:var(--serif-song); max-width:520px; margin-left:auto; margin-right:auto; }
  .mingping .line1{ text-align:center; font-size:17px; color:var(--gold-hi); letter-spacing:.05em; }
  .mingping .line1 .tag{ font-family:var(--sans); font-size:11px; padding:2px 10px; border-radius:2px;
    letter-spacing:.12em; margin-left:8px; vertical-align:2px; }
  .mingping p{ font-size:14.5px; color:var(--paper); line-height:2; margin:12px 0 0; text-align:justify; }
  .mingping .kaiyun{ color:var(--jade); font-size:13.5px; line-height:1.9; margin-top:14px;
    border-left:2px solid rgba(122,159,146,.5); padding-left:13px; }

  /* ——— 梅花三象 ——— */
  .mh-form{ display:flex; flex-wrap:wrap; gap:16px; align-items:flex-end; justify-content:center; margin:20px 0 4px; }
  .mh-form .field{ gap:8px; }
  .hexagram.mini{ width:114px; gap:6px; margin:0 auto; }
  .hexagram.mini .yao{ height:12px; gap:10px; }
  .hexagram.mini .yao .bar.broken{ width:calc(50% - 5px); }
  .hexagram.mini .yao .mark{ right:-19px; font-size:11px; }
  .mh-result{ margin-top:4px; }
  .mh-title{ text-align:center; font-family:var(--serif-kai); font-size:22px; color:var(--gold-hi);
    letter-spacing:.06em; margin:14px 0 2px; }
  .mh-title small{ font-family:var(--sans); font-size:12px; color:var(--paper-dim); letter-spacing:.12em; margin-left:8px; }
  .mh-three{ display:flex; justify-content:center; gap:12px; flex-wrap:wrap; margin-top:20px; }
  .mh-col{ flex:1 1 28%; min-width:112px; text-align:center; border:1px solid var(--line); border-radius:2px;
    padding:16px 8px; background:var(--ink-1); }
  .mh-col .cap{ font-family:var(--sans); font-size:11px; letter-spacing:.2em; color:var(--paper-faint); margin-bottom:14px; }
  .mh-col .gname{ font-family:var(--serif-kai); font-size:16px; color:var(--gold-hi); margin-top:14px; letter-spacing:.04em; }
  .mh-tiyong{ margin-top:24px; border-top:1px solid var(--line-soft); padding-top:18px;
    font-family:var(--serif-song); font-size:15px; color:var(--paper); line-height:2.05; text-align:justify;
    max-width:560px; margin-left:auto; margin-right:auto; }
  .mh-tiyong b{ color:var(--gold-hi); font-weight:400; }
  .mh-tiyong .verdict{ display:inline-block; margin-top:12px; font-family:var(--serif-kai); font-size:16px;
    letter-spacing:.24em; text-indent:.24em; padding:4px 16px; border-radius:2px; }

  /* ——— 奇门九宫 ——— */
  .qm-form{ display:flex; flex-wrap:wrap; gap:16px; align-items:flex-end; justify-content:center; margin:20px 0 4px; }
  .qm-head{ text-align:center; font-family:var(--serif-kai); font-size:23px; color:var(--gold-hi);
    letter-spacing:.08em; margin:10px 0 2px; }
  .qm-head small{ display:block; font-family:var(--sans); font-size:12px; color:var(--paper-dim);
    letter-spacing:.12em; margin-top:8px; }
  .jiugong{ display:grid; grid-template-columns:repeat(3,1fr); gap:0; max-width:378px; margin:22px auto 0;
    border:1px solid var(--gold-dim); background:var(--gold-dim); }
  .gong{ background:var(--ink-1); padding:10px 4px; text-align:center; position:relative; min-height:98px;
    display:flex; flex-direction:column; justify-content:space-between; gap:5px;
    outline:.5px solid var(--line); }
  .gong .pos{ font-family:var(--sans); font-size:10px; color:var(--paper-faint); letter-spacing:.02em; }
  .gong .gan{ font-family:var(--serif-kai); font-size:27px; line-height:1; color:var(--paper); }
  .gong .gan.qi{ color:var(--gold-hi); text-shadow:0 0 10px rgba(201,168,106,.5); }
  .gong .sm{ font-family:var(--sans); font-size:10.5px; color:var(--paper-dim); letter-spacing:.01em; }
  .gong.center{ background:var(--ink-3); }
  .gong.zhifu{ background:linear-gradient(180deg,rgba(201,168,106,.14),var(--ink-1));
    box-shadow:inset 0 0 0 1px rgba(201,168,106,.45); z-index:1; }
  .gong.zhifu::after{ content:"符"; position:absolute; top:3px; left:5px; font-family:var(--sans); font-size:9px; color:var(--gold); }
  .gong.zhishi::before{ content:"使"; position:absolute; top:3px; right:5px; font-family:var(--sans); font-size:9px; color:var(--cinnabar-hi); }
  .gong.jialin .gan::after{ content:"·临"; font-family:var(--sans); font-size:9px; color:var(--jade); vertical-align:middle; }
  .qm-read{ margin-top:24px; font-family:var(--serif-song); font-size:14.5px; color:var(--paper);
    line-height:2.05; text-align:justify; max-width:560px; margin-left:auto; margin-right:auto; }
  .qm-read b{ color:var(--gold-hi); font-weight:400; }
  .qm-read .fang{ color:var(--jade); }
  .qm-read .note{ display:block; margin-top:12px; font-size:12.5px; color:var(--paper-faint); line-height:1.85; }

  /* ——— AI 解卦 ——— */
  .gear{ position:fixed; top:14px; left:14px; z-index:40; width:40px; height:40px; border-radius:50%;
    font-family:var(--sans); font-size:18px; color:var(--gold); background:rgba(13,16,22,.8);
    border:1px solid var(--line); cursor:pointer; padding:0; transition:.2s; }
  .gear:hover{ color:var(--gold-hi); border-color:var(--gold-dim); box-shadow:0 0 16px rgba(201,168,106,.25); background:rgba(13,16,22,.96); }
  .gear:focus-visible{ outline:2px solid var(--gold-hi); outline-offset:2px; }

  .ai-bar{ display:flex; gap:10px; justify-content:center; margin-top:22px; flex-wrap:wrap; }
  .ai-btn{ font-family:var(--serif-kai); font-size:15px; letter-spacing:.14em; text-indent:.14em;
    color:var(--gold-hi); background:linear-gradient(180deg,var(--ink-3),var(--ink-2));
    border:1px solid var(--gold-dim); border-radius:3px; padding:9px 20px; cursor:pointer; transition:.2s; }
  .ai-btn:hover{ color:var(--ink-0); background:linear-gradient(180deg,var(--gold-hi),var(--gold)); box-shadow:0 0 18px rgba(201,168,106,.3); }
  .ai-btn.ai-copy{ color:var(--paper-dim); border-color:var(--line); font-size:14px; }
  .ai-btn.ai-copy:hover{ color:var(--paper); background:var(--ink-3); box-shadow:none; }

  .modal{ position:fixed; inset:0; z-index:50; display:flex; align-items:center; justify-content:center; padding:18px; }
  .modal[hidden]{ display:none; }
  .modal-bd{ position:absolute; inset:0; background:rgba(4,5,7,.72); }
  .modal-box{ position:relative; width:100%; max-width:560px; max-height:86vh; overflow-y:auto;
    background:linear-gradient(180deg,var(--ink-2),var(--ink-1)); border:1px solid var(--gold-dim);
    border-radius:4px; box-shadow:0 20px 60px rgba(0,0,0,.6); padding:22px; animation:rise .35s ease both; }
  .modal-hd{ display:flex; align-items:center; justify-content:space-between; margin-bottom:16px;
    font-family:var(--serif-kai); font-size:19px; color:var(--gold-hi); letter-spacing:.06em; }
  .modal-x{ font-family:var(--sans); font-size:22px; line-height:1; color:var(--paper-dim);
    background:transparent; border:0; padding:2px 8px; cursor:pointer; border-radius:2px; }
  .modal-x:hover{ color:var(--paper); }
  .set-hint{ font-family:var(--serif-song); font-size:13px; color:var(--paper-dim); line-height:1.85; margin:0 0 18px; }
  .set-f{ display:flex; flex-direction:column; gap:7px; margin-bottom:14px; }
  .set-f span{ font-family:var(--sans); font-size:11.5px; letter-spacing:.14em; color:var(--paper-dim); }
  .set-act{ display:flex; gap:12px; margin-top:6px; }
  .set-status{ margin-top:12px; font-family:var(--sans); font-size:13px; color:var(--jade); min-height:1.2em; line-height:1.6; }
  .set-status.err{ color:var(--cinnabar-hi); }
  .set-hint code{ font-family:var(--sans); color:var(--gold-hi); font-size:12px; background:rgba(201,168,106,.08); padding:1px 5px; border-radius:2px; }
  .set-check{ display:flex; align-items:center; gap:9px; margin:2px 0 16px; cursor:pointer;
    font-family:var(--sans); font-size:12.5px; color:var(--paper-dim); }
  .set-check input{ width:15px; height:15px; accent-color:var(--gold); flex:none; }
  .set-f input[readonly]{ opacity:.7; cursor:not-allowed; }
  .model-row{ display:flex; gap:8px; align-items:stretch; }
  .model-row select{ flex:1; min-width:0; }
  button.ghost.mini{ font-size:13px; padding:0 14px; letter-spacing:.08em; text-indent:.08em; white-space:nowrap; }
  #setModelInput{ margin-top:8px; }
  .ai-ctx{ font-family:var(--serif-song); font-size:13px; color:var(--paper-dim); line-height:1.8;
    border-left:2px solid var(--gold-dim); padding-left:12px; margin-bottom:16px; }
  .ai-out{ font-family:var(--serif-song); font-size:15px; color:var(--paper); line-height:2;
    min-height:56px; max-height:48vh; overflow-y:auto; }
  .ai-msg{ margin-bottom:14px; }
  .ai-msg.user{ color:var(--gold-hi); font-size:14px; }
  .ai-out b,.ai-out strong{ color:var(--gold-hi); font-weight:400; }
  .ai-warn{ color:var(--paper-dim); font-size:14px; line-height:1.9; }
  .ai-warn .ai-btn{ margin-top:12px; }
  .ai-err{ color:var(--cinnabar-hi); font-size:13.5px; line-height:1.85; }
  .ai-cursor{ color:var(--gold); }
  .ai-ta{ width:100%; min-height:220px; background:var(--ink-0); border:1px solid var(--line);
    border-radius:2px; color:var(--paper); font-family:var(--serif-song); font-size:13px; padding:12px; line-height:1.7; }
  .ai-follow{ display:flex; gap:10px; margin-top:16px; padding-top:16px; border-top:1px solid var(--line-soft); }
  .ai-follow input{ flex:1; min-width:0; }
  .ai-btn:disabled{ opacity:.5; cursor:not-allowed; box-shadow:none; }
  .ai-follow input:disabled{ opacity:.55; cursor:not-allowed; }

  /* 弹窗内滚动条：细、暗金半透明、无箭头 —— 替掉又粗又灰的系统默认条 */
  .ai-out, .ai-side .hist-list, .modal-box{ scrollbar-width:thin; scrollbar-color:rgba(201,168,106,.32) transparent; }
  .ai-out::-webkit-scrollbar,
  .ai-side .hist-list::-webkit-scrollbar,
  .modal-box::-webkit-scrollbar{ width:9px; height:9px; }
  .ai-out::-webkit-scrollbar-track,
  .ai-side .hist-list::-webkit-scrollbar-track,
  .modal-box::-webkit-scrollbar-track{ background:transparent; }
  .ai-out::-webkit-scrollbar-thumb,
  .ai-side .hist-list::-webkit-scrollbar-thumb,
  .modal-box::-webkit-scrollbar-thumb{
    background:rgba(201,168,106,.30); border-radius:6px;
    border:2px solid transparent; background-clip:padding-box; }
  .ai-out::-webkit-scrollbar-thumb:hover,
  .ai-side .hist-list::-webkit-scrollbar-thumb:hover,
  .modal-box::-webkit-scrollbar-thumb:hover{
    background:rgba(201,168,106,.55); background-clip:padding-box; }
  .ai-out::-webkit-scrollbar-button,
  .ai-side .hist-list::-webkit-scrollbar-button,
  .modal-box::-webkit-scrollbar-button{ display:none; }
  .toast{ position:fixed; bottom:26px; left:50%; transform:translateX(-50%); z-index:60;
    background:rgba(13,16,22,.96); border:1px solid var(--gold-dim); border-radius:3px;
    color:var(--gold-hi); font-family:var(--serif-song); font-size:14px; padding:11px 22px;
    box-shadow:0 8px 24px rgba(0,0,0,.5); }

  /* —— AI 会话：双栏弹窗（左会话列表 + 右对话） —— */
  .hist-btn{ left:62px; font-size:17px; }
  .modal-box.ai-box{ max-width:880px; height:86vh; max-height:86vh; padding:0;
    overflow:hidden; display:flex; flex-direction:column; }
  .ai-box .modal-hd{ flex:none; margin:0; padding:16px 20px; border-bottom:1px solid var(--line-soft); }
  .ai-wrap{ flex:1; min-height:0; display:flex; }
  .ai-side{ width:216px; flex:none; display:flex; flex-direction:column;
    border-right:1px solid var(--line-soft); background:rgba(0,0,0,.18); }
  .ai-side-hd{ flex:none; padding:13px 14px 7px; font-family:var(--sans); font-size:11px;
    letter-spacing:.18em; color:var(--paper-dim); }
  .ai-side .hist-list{ flex:1; min-height:0; overflow-y:auto; padding:0 10px 10px; }
  .ai-side-ft{ flex:none; padding:10px 12px; border-top:1px solid var(--line-soft); }
  .ai-side-ft .ai-btn{ width:100%; padding:8px 0; font-size:13px; }
  .ai-main{ flex:1; min-width:0; display:flex; flex-direction:column; padding:16px 20px; }
  .ai-main .ai-ctx{ flex:none; }
  .ai-main .ai-out{ flex:1; min-height:0; max-height:none; }
  .ai-main .ai-follow{ flex:none; }
  .ai-ctx:empty{ display:none; }

  .hist-list{ display:flex; flex-direction:column; gap:8px; }
  .hist-item{ position:relative; padding:9px 11px; border:1px solid var(--line);
    border-radius:3px; background:linear-gradient(180deg,var(--ink-3),var(--ink-2));
    cursor:pointer; transition:.16s; }
  .hist-item:hover{ border-color:var(--gold-dim); box-shadow:0 0 12px rgba(201,168,106,.14); }
  .hist-item.active{ border-color:var(--gold-dim);
    background:linear-gradient(180deg,rgba(201,168,106,.16),rgba(201,168,106,.05)); }
  .hist-row{ display:flex; align-items:baseline; gap:8px; }
  .hist-title{ flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
    font-family:var(--serif-kai); font-size:14.5px; color:var(--gold-hi); letter-spacing:.03em; }
  .hist-time{ flex:none; font-family:var(--sans); font-size:11px; color:var(--paper-dim); }
  .hist-prev{ font-family:var(--serif-song); font-size:12px; color:var(--paper-dim); line-height:1.6;
    margin-top:3px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  /* 悬停才浮现的操作簇（重命名 ✎ / 删除 ×），盖在时间那一角上 */
  .hist-acts{ position:absolute; top:5px; right:5px; display:flex; gap:3px;
    opacity:0; transition:opacity .15s; }
  .hist-item:hover .hist-acts, .hist-item.active .hist-acts{ opacity:1; }
  .hist-acts button{ width:22px; height:22px; line-height:1; padding:0; cursor:pointer;
    font-family:var(--sans); color:var(--paper-dim); background:rgba(16,20,28,.94);
    border:1px solid var(--line); border-radius:3px; transition:.12s; }
  .hist-edit{ font-size:12px; }
  .hist-del{ font-size:16px; }
  .hist-edit:hover{ color:var(--gold-hi); border-color:var(--gold-dim); }
  .hist-del:hover{ color:var(--cinnabar-hi); border-color:var(--cinnabar-hi); }
  .hist-rename{ flex:1; min-width:0; font-family:var(--serif-kai); font-size:14.5px;
    color:var(--gold-hi); background:var(--ink-0); border:1px solid var(--gold-dim);
    border-radius:3px; padding:1px 6px; outline:none; }
  .hist-empty{ font-family:var(--serif-song); font-size:12.5px; color:var(--paper-dim);
    line-height:1.85; text-align:center; padding:22px 10px; }
  .hist-empty.err{ color:var(--cinnabar-hi); }

  @media (max-width:640px){
    .modal-box.ai-box{ height:92vh; max-height:92vh; }
    .ai-wrap{ flex-direction:column; }
    .ai-side{ width:auto; max-height:32vh; border-right:0; border-bottom:1px solid var(--line-soft); }
  }
  .toast[hidden]{ display:none; }

  /* ——— 页脚 ——— */
  footer{ text-align:center; margin-top:40px; font-family:var(--serif-song); font-size:13px;
    color:var(--paper-faint); letter-spacing:.1em; line-height:2.1; }
  footer .taiji{ color:var(--gold-dim); }

  @media (max-width:440px){
    .almanac{ grid-template-columns:1fr; text-align:center; }
    .almanac .date{ grid-row:auto; }
    .almanac .yiji{ justify-content:center; }
    .coins{ gap:16px; }
    .coin{ width:62px; height:62px; }
    .tab{ padding:12px 14px; font-size:16px; }
    .seal{ width:40px; height:40px; font-size:22px; }
  }
  @media (prefers-reduced-motion:reduce){
    .bagua svg{ animation:none; }
    .coin.tossing{ animation:none; }
    .gua-name{ animation:none; -webkit-text-fill-color:var(--gold-hi); color:var(--gold-hi); }
    .yao.enter,.result.show,.panel{ animation:none; }
    .gate-card{ animation:none; }
  }

  /* ═══════════ 门禁 · 入阁验身 ═══════════ */
  /* 半透明压暗而非纯黑：背后旋转的八卦罗盘要隐约透出来，才像同一个场子 */
  .gate{ position:fixed; inset:0; z-index:100; display:grid; place-items:center;
    padding:20px; overflow-y:auto;
    background:radial-gradient(760px 460px at 50% 8%, rgba(201,168,106,.10), transparent 60%),
               rgba(5,6,9,.86);
    backdrop-filter:blur(2.5px); -webkit-backdrop-filter:blur(2.5px); }
  .gate[hidden]{ display:none; }

  .gate-card{ position:relative; width:100%; max-width:392px; text-align:center;
    padding:32px clamp(24px,6vw,40px) 26px;
    background:linear-gradient(180deg, rgba(19,24,33,.97), rgba(11,14,19,.99));
    border:1px solid var(--line); border-radius:4px;
    box-shadow:0 26px 74px rgba(0,0,0,.68), inset 0 1px 0 rgba(236,228,210,.05);
    animation:rise .5s ease both; }
  /* 与版心同款的卷轴侧栏 */
  .gate-card::before{ content:""; position:absolute; inset:11px 6px; pointer-events:none;
    border-left:1px solid var(--line-soft); border-right:1px solid var(--line-soft); }
  .gate-seal{ top:-13px; right:-11px; }

  /* line-height:1 —— 否则会继承 body 的 1.78，一个 46px 的字撑出 82px 的盒子 */
  .gate-title{ font-family:var(--serif-kai); font-weight:400; margin:0; line-height:1;
    font-size:clamp(38px,11vw,46px); letter-spacing:.2em; text-indent:.2em;
    background:linear-gradient(180deg,#f4e6c2,#cbab6e 52%,#9c8149);
    -webkit-background-clip:text; background-clip:text;
    -webkit-text-fill-color:transparent; color:transparent;
    text-shadow:0 2px 26px rgba(201,168,106,.14); }
  .gate-sub{ font-family:var(--serif-song); color:var(--paper-dim); font-size:13.5px;
    letter-spacing:.16em; margin:13px 0 18px; }
  .gate-card .crest{ margin-bottom:9px; }
  .gate-card .eyebrow{ margin-bottom:12px; }
  .gate-card .rule{ margin-top:17px; }

  .gate-tabs{ display:flex; justify-content:center; margin-bottom:16px;
    border-bottom:1px solid var(--line-soft); }
  .gate-tab{ font-family:var(--serif-kai); font-size:15.5px; letter-spacing:.16em; text-indent:.16em;
    color:var(--paper-dim); background:transparent; border:0; padding:9px 20px;
    cursor:pointer; position:relative; transition:color .25s; }
  .gate-tab:hover{ color:var(--paper); }
  .gate-tab.active{ color:var(--gold-hi); }
  .gate-tab.active::after{ content:""; position:absolute; left:10px; right:10px; bottom:-1px; height:2px;
    background:linear-gradient(90deg,transparent,var(--gold),transparent); }
  .gate-tab:focus-visible{ outline:2px solid var(--gold-hi); outline-offset:2px; }

  .gate-modes{ display:flex; align-items:center; justify-content:center; gap:9px; margin-bottom:4px; }
  .gate-modes i{ color:var(--gold-deep); font-style:normal; font-size:11px; }
  .gate-mode{ font-family:var(--sans); font-size:12px; letter-spacing:.1em;
    color:var(--paper-faint); background:transparent; border:0; padding:2px 3px;
    cursor:pointer; transition:color .2s; }
  .gate-mode:hover{ color:var(--paper-dim); }
  .gate-mode.active{ color:var(--gold); }

  .gate-form{ display:flex; flex-direction:column; gap:13px; text-align:left; }
  .gate-f{ display:flex; flex-direction:column; gap:6px; }
  /* display:flex 的优先级高于浏览器默认的 [hidden]{display:none}，必须显式盖掉，
     否则「注册」表单和未选中的输入框会一起显示出来 */
  .gate-form[hidden], .gate-f[hidden]{ display:none; }
  .gate-f > span{ font-family:var(--sans); font-size:11px; letter-spacing:.18em; color:var(--paper-dim); }
  .gate-f .in{ width:100%; }

  .gate-go{ margin-top:9px; font-family:var(--serif-kai); font-size:17px;
    letter-spacing:.34em; text-indent:.34em; color:#1d160b;
    background:linear-gradient(180deg,var(--gold-hi),var(--gold) 55%,#b2914f);
    border:0; border-radius:3px; padding:12px 0; cursor:pointer;
    box-shadow:0 6px 18px rgba(201,168,106,.18); transition:filter .2s, box-shadow .2s, transform .1s; }
  .gate-go:hover{ filter:brightness(1.07); box-shadow:0 9px 26px rgba(201,168,106,.3); }
  .gate-go:active{ transform:translateY(1px); }
  .gate-go:disabled{ opacity:.5; cursor:not-allowed; filter:none; box-shadow:none; }
  .gate-go:focus-visible{ outline:2px solid var(--gold-hi); outline-offset:3px; }

  .gate-msg{ min-height:1.5em; margin-top:15px; font-family:var(--serif-song);
    font-size:13px; letter-spacing:.04em; color:var(--cinnabar-hi); }
  .gate-msg.ok{ color:var(--jade); }
  .gate-foot{ margin-top:16px; font-family:var(--serif-song); font-size:11.5px;
    color:var(--paper-faint); letter-spacing:.08em; }

  .user-btn{ left:110px; font-size:15px; }