/* HKFai · 主题覆盖层：浅色模式（深色为默认，令牌以 tokens.css 为准）
   <html data-theme="light|dark"> 由 assets/js/theme.js 维护；本文件只做覆盖，不改骨架 */
html[data-theme="dark"]{color-scheme:dark}
html[data-theme="light"]{color-scheme:light}
html,body{transition:background-color .3s var(--e-out),color .3s var(--e-out)}

html[data-theme="light"]{
  --ink-900:#F6F2E9; --ink-850:#FCFAF5; --ink-800:#FFFFFF;
  --ink-700:#F5F0E4; --ink-600:#E8E1CF; --ink-500:#D9CFB7;
  --text-1:#1C1A15; --text-2:#5B5548; --text-3:#8C8474;
  --gold-300:#EFD9A0; --gold-400:#9E7A2C; --gold-500:#C9A24D; --gold-600:#7E6423;
  --gold-glow:rgba(158,122,44,.20);
  --focus:#9E7A2C;
  --jade-400:#2F7C67; --jade-500:#2A6E5B;
  --iris-400:#6753D8; --iris-500:#5A48C8;
  --vermilion-400:#C2452F; --vermilion-500:#A93A26; --vermilion-600:#8E2F1E;
  --hair:1px solid rgba(28,26,21,.10);
  --hair-strong:1px solid rgba(28,26,21,.18);
  --hair-gold:1px solid rgba(158,122,44,.34);
  --shadow-1:0 1px 2px rgba(70,58,32,.08);
  --shadow-2:0 10px 28px rgba(70,58,32,.10);
  --shadow-3:0 24px 64px rgba(70,58,32,.16);
  --shadow-gold:0 10px 28px rgba(158,122,44,.24);
}

/* 氛围层 */
html[data-theme="light"] body::before{opacity:.05;mix-blend-mode:multiply}
html[data-theme="light"] body::after{opacity:.5}
html[data-theme="light"] ::-webkit-scrollbar-thumb{background:#D8CDB3;border-color:var(--ink-900)}
html[data-theme="light"] ::-webkit-scrollbar-thumb:hover{background:#C6B995}
html[data-theme="light"] ::selection{background:rgba(201,162,77,.35);color:#241C0C}

/* 框架件 */
html[data-theme="light"] .topbar{background:rgba(250,247,240,.85)}
html[data-theme="light"] .scrim{background:rgba(40,34,22,.4)}
html[data-theme="light"] .drawer{box-shadow:-24px 0 64px rgba(70,58,32,.18)}
html[data-theme="light"] .toast{background:#FFFFFF}
html[data-theme="light"] .btn-ghost{background:rgba(28,26,21,.03)}
html[data-theme="light"] .btn-ghost:hover{border-color:rgba(158,122,44,.45);background:rgba(201,162,77,.10)}
html[data-theme="light"] .btn-quiet:hover{background:rgba(28,26,21,.05)}
html[data-theme="light"] .btn-danger{background:rgba(169,58,38,.06)}
html[data-theme="light"] .field:hover{border-color:rgba(28,26,21,.24)}
html[data-theme="light"] .field:focus{box-shadow:0 0 0 3px rgba(201,162,77,.22)}
html[data-theme="light"] .chip{background:rgba(28,26,21,.03)}
html[data-theme="light"] .planchip{background:rgba(28,26,21,.03)}
html[data-theme="light"] .planchip.gold b{color:var(--gold-600)}
html[data-theme="light"] .pill{background:rgba(28,26,21,.04)}
html[data-theme="light"] .voice{background:rgba(28,26,21,.04)}
html[data-theme="light"] .avatar{color:#F3EFE4;border-color:rgba(28,26,21,.14)}
html[data-theme="light"] .sysnote{background:#ECE5D4}
html[data-theme="light"] .sk{background:#EFE9DC}
html[data-theme="light"] .sk::after{background:linear-gradient(90deg,transparent,rgba(28,26,21,.06),transparent)}
html[data-theme="light"] .empty{border-color:rgba(28,26,21,.16)}
html[data-theme="light"] .hairline{background:linear-gradient(90deg,transparent,rgba(28,26,21,.14),transparent)}
html[data-theme="light"] .ring{background:conic-gradient(var(--gold-400) calc(var(--p)*1%),rgba(28,26,21,.10) 0)}
html[data-theme="light"] .tl::before{background:linear-gradient(180deg,transparent,rgba(28,26,21,.14),transparent)}

/* 页面面材 */
html[data-theme="light"] .demo{background:linear-gradient(180deg,#FFFFFF,#F8F3E8);box-shadow:var(--shadow-3)}
html[data-theme="light"] .demo::before{background:radial-gradient(320px 160px at 30% 0,rgba(201,162,77,.20),transparent 70%)}
html[data-theme="light"] .step{background:#FFFFFF}
html[data-theme="light"] .step b{color:rgba(158,122,44,.5)}
html[data-theme="light"] .cta-band{background:radial-gradient(600px 240px at 50% 0,rgba(201,162,77,.16),transparent 70%),#FFFFFF}
html[data-theme="light"] .continue{background:linear-gradient(120deg,rgba(201,162,77,.12),transparent 42%),#FFFFFF}
html[data-theme="light"] .vcard{background:#FFFFFF}
html[data-theme="light"] .plan{background:rgba(255,255,255,.9)}
html[data-theme="light"] .plan.best{box-shadow:0 20px 50px rgba(70,58,32,.2)}
html[data-theme="light"] .role.on{box-shadow:0 16px 40px rgba(70,58,32,.18),0 0 0 1px rgba(201,162,77,.35)}
html[data-theme="light"] .matrix tr:hover td,html[data-theme="light"] .castrow:hover{background:rgba(28,26,21,.03)}
html[data-theme="light"] .entity:hover{background:rgba(28,26,21,.05)}
html[data-theme="light"] .setnav button:hover{background:rgba(28,26,21,.05)}
html[data-theme="light"] .src-line mark{color:var(--gold-600)}
html[data-theme="light"] .banner{background:rgba(201,162,77,.10)}
html[data-theme="light"] .gate-card{background:radial-gradient(520px 220px at 50% 0,rgba(201,162,77,.14),transparent 70%),#FFFFFF}
html[data-theme="light"] .gated::after{background:linear-gradient(180deg,rgba(250,247,240,.45),rgba(246,241,230,.75))}
html[data-theme="light"] .stage-top{background:rgba(250,247,240,.75)}
html[data-theme="light"] .composer{background:linear-gradient(180deg,rgba(250,247,240,.7),rgba(250,247,240,.96))}
html[data-theme="light"] .lockpill{color:#8A6A1F;background:rgba(201,162,77,.14);border-color:rgba(201,162,77,.45)}

/* 分段控件（设置 · 外观） */
.segwrap{display:inline-flex;gap:4px;padding:4px;border-radius:var(--r-pill);
  background:rgba(237,233,224,.05);border:var(--hair)}
.segwrap button{height:32px;padding:0 16px;border-radius:var(--r-pill);font-size:13px;color:var(--text-2);
  transition:all var(--t-hover) var(--e-out)}
.segwrap button:hover{color:var(--text-1)}
.segwrap button.on{color:#17130A;background:linear-gradient(180deg,var(--gold-300),var(--gold-500));font-weight:600}
html[data-theme="light"] .segwrap{background:rgba(28,26,21,.04)}
