/* Alkemi: tokens + shared components (from the approved mockups). */
/* Alkemi site tokens. Same values as .preview/alkemi-v2.html (appendix A section 5). */
:root{
  --ground:#0a0a0f;--panel:#0d1020;--rule:#1c2136;--rule-lit:#2a3148;
  --muted:#8892a0;--soft:#b9c0ca;--text:#e5e7eb;--white:#fff;
  --signal:#0eb7f7;--signal-dim:rgba(14,183,247,.12);--warn:#e2b34d;
  --bull:#22c98a;--bear:#f0525a;--bear-text:#ff8a90;
  --bull-dim:rgba(34,201,138,.24);--bear-dim:rgba(240,82,90,.22);--neut-dim:rgba(136,146,160,.20);
  --bull-line:rgba(34,201,138,.5);--bear-line:rgba(240,82,90,.5);--neut-line:rgba(136,146,160,.4);
  --chip:#151a26;--hbg:rgba(255,255,255,.022);
  --sans:'Hanken Grotesk',system-ui,sans-serif;--serif:'EB Garamond',Georgia,serif;--mono:'DM Mono',ui-monospace,monospace;
  color-scheme:dark;
}
html.light{
  --ground:#e8ebf0;--panel:#f5f6f9;--rule:#d5dae2;--rule-lit:#bac2ce;
  --muted:#4f5a6b;--soft:#262e3d;--text:#0e1422;--white:#060910;
  --signal:#0467a3;--signal-dim:rgba(14,183,247,.14);--warn:#865c05;
  --bull:#08744c;--bear:#c42a35;--bear-text:#bd2832;
  --bull-dim:rgba(34,201,138,.16);--bear-dim:rgba(240,82,90,.14);--neut-dim:rgba(79,90,107,.12);
  --bull-line:rgba(21,162,111,.5);--bear-line:rgba(228,70,78,.5);--neut-line:rgba(79,90,107,.35);
  --chip:#e2e6ed;--hbg:rgba(14,20,34,.045);
  color-scheme:light;
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{background:var(--ground);color:var(--text)}
body{font:400 13.5px/1.5 var(--sans);-webkit-font-smoothing:antialiased;font-variant-numeric:tabular-nums;min-height:100vh}
a{color:inherit;text-decoration:none}
button,input{font:inherit;color:inherit;background:none;border:0}
button{cursor:pointer;text-align:left}
:focus-visible{outline:1px solid var(--signal);outline-offset:2px}
.lab{font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:var(--muted);font-weight:500}
.mono{font-family:var(--mono)}
.bull{color:var(--bull)}.bear{color:var(--bear-text)}.neut{color:var(--muted)}
.chip{display:inline-block;font-size:11.5px;padding:4px 10px;border:1px solid var(--rule);border-radius:0;color:var(--soft)}
.chip.on{color:var(--white);border-color:var(--signal)}
.cta{color:var(--signal);border-bottom:1px solid var(--signal);padding-bottom:1px}
.cta:hover{color:var(--white);border-color:var(--white)}
.btn{display:inline-flex;align-items:center;gap:8px;padding:10px 16px;border:1px solid var(--signal);color:var(--white);font-weight:500;border-radius:0}
.btn:hover{background:var(--signal-dim)}
.btn.ghost{border-color:var(--rule-lit);color:var(--soft)}
/* confidence ticks: ten cells, filled to conf/10. A count, not a chart. */
.tk{display:inline-flex;gap:2px;align-items:center}
.tk i{display:block;width:4px;height:9px;background:var(--rule-lit)}
.tk i.f{background:currentColor}
.tk b{font:500 13px var(--mono);margin-left:8px;color:var(--white)}
.hair{border-top:1px solid var(--rule)}

.lg{display:inline-flex;width:22px;height:22px;border-radius:50%;background:var(--chip);border:1px solid var(--rule-lit);font:500 8.5px var(--mono);align-items:center;justify-content:center;color:var(--soft);flex:none;letter-spacing:.04em}
.wm{font:500 19px var(--serif);color:var(--white);letter-spacing:.01em}
.wm small{display:block;font:500 9px var(--sans);letter-spacing:.22em;text-transform:uppercase;color:var(--muted);margin-top:1px}
.disc{font-size:11.5px;color:var(--muted);line-height:1.5}
.foot{border-top:1px solid var(--rule);padding:22px 0;display:flex;gap:28px;flex-wrap:wrap;justify-content:space-between;align-items:flex-start;color:var(--muted);font-size:11.5px}
.foot nav a{margin-right:18px}
/* waitlist form */
.wl{display:grid;gap:10px}
.wl .row{display:flex;gap:8px;flex-wrap:wrap}
.wl input[type=email]{flex:1 1 220px;min-width:0;padding:10px 12px;border:1px solid var(--rule-lit);background:var(--panel);color:var(--text);font:400 13.5px var(--sans)}
.wl input[type=email]:focus{border-color:var(--signal);outline:none}
.wl label.ck{display:flex;gap:8px;align-items:flex-start;font-size:12px;color:var(--soft);line-height:1.4}
.wl label.ck input{margin-top:3px;accent-color:var(--signal)}
.wl .ts{height:62px;width:300px;max-width:100%;border:1px dashed var(--rule-lit);display:flex;align-items:center;justify-content:center;font:400 10px var(--mono);color:var(--muted);letter-spacing:.14em;text-transform:uppercase}
.wl .btn{justify-content:center}
.wl .msg{font-size:12px;color:var(--soft)}
.wl .msg.ok{color:var(--bull)}.wl .msg.bad{color:var(--bear-text)}
/* read card (shared by landing heroes and hub desk) */
.rc{border:1px solid var(--rule);border-left:2px solid var(--rule);background:var(--panel);padding:14px 16px 12px;display:grid;gap:9px;min-width:0}
.rc.bull{border-left-color:var(--bull)}.rc.bear{border-left-color:var(--bear)}
.rc .hd{display:flex;align-items:center;gap:9px}
.rc .hd .nm{font:400 17px var(--serif);color:var(--white);flex:1}
.rc .hd .cf{font:500 15px var(--mono)}
.rc .bar{height:2px;background:var(--rule);position:relative}.rc .bar i{position:absolute;left:0;top:0;height:2px;background:currentColor}
.rc p{font-size:13px;color:var(--soft);line-height:1.5}
.rc .ft{display:flex;justify-content:space-between;font:400 10.5px var(--mono);color:var(--muted);letter-spacing:.06em}
.rc .ft .st{font:500 10px var(--sans);letter-spacing:.16em;text-transform:uppercase}
.old{color:var(--warn)}
.gl{border-bottom:1px dotted var(--signal);position:relative;cursor:help}
.gp{display:none;position:absolute;left:0;top:calc(100% + 6px);z-index:20;width:300px;max-width:80vw;background:var(--panel);border:1px solid var(--rule-lit);padding:10px 12px;font:400 12.5px/1.45 var(--sans);color:var(--soft);text-align:left;white-space:normal}
.gp b{display:block;font:400 15px var(--serif);color:var(--white);margin-bottom:2px}.gp em{display:block;font-style:normal;color:var(--text);margin-top:6px}
.gl:focus .gp{display:block}
@media (hover:hover){.gl:hover .gp{display:block}}
.tc{border-top:1px solid var(--rule-lit);padding-top:12px;display:grid;gap:6px;align-content:start}
.tc b{font:400 21px var(--serif);color:var(--white)}.tc p{font-size:13px;color:var(--soft);line-height:1.5}
.tc .oc{color:var(--text)}.tc .oc .lab{display:block;margin-bottom:2px;color:var(--signal)}
/* tone strip: the note's four scores */
.tone4{display:flex;flex-wrap:wrap;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)}
.tone4>div{padding:12px 22px 12px 0;margin-right:22px;border-right:1px solid var(--rule)}.tone4>div:last-child{border-right:0}
.tone4 dt{font:500 10px var(--sans);letter-spacing:.22em;text-transform:uppercase;color:var(--muted)}.tone4 dd{font:400 20px var(--serif);color:var(--white)}
.tone4 dd small{display:block;font:400 10.5px var(--sans);color:var(--muted)}
@media(max-width:600px){.tone4{display:grid;grid-template-columns:1fr 1fr}.tone4>div{margin:0;padding:12px 0 12px 14px;border-right:0;border-bottom:1px solid var(--rule)}.tone4>div:nth-child(odd){padding-left:0;border-right:1px solid var(--rule)}.tone4>div:nth-last-child(-n+2){border-bottom:0}}
/* desk rows with confidence ticks */
.rr{display:grid;grid-template-columns:22px 1fr auto auto;gap:10px;align-items:center;padding:10px 0;border-bottom:1px solid var(--rule)}
.rr .nm{font:400 16px var(--serif);color:var(--white)}.rr .st{font:500 10px var(--sans);letter-spacing:.16em;text-transform:uppercase}
@media(max-width:420px){.rr{grid-template-columns:22px 1fr auto}.rr .st{display:none}}


/* ---- site-wide additions (beyond the mockups) ---- */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-padding-top:72px}
body{overflow-x:hidden}
img,svg{max-width:100%}
.skip{position:absolute;left:-9999px;top:8px;z-index:100;background:var(--panel);border:1px solid var(--signal);padding:8px 12px;color:var(--white)}
.skip:focus{left:8px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.gp.fix{position:fixed;left:8px;top:8px}
.wl input[type=email]{font-size:16px}               /* below 16px iOS zooms the page on focus */
.wl .ts:empty{display:none}
.wl .ts{height:auto;width:auto;border:0;display:block}
.wl .btn[disabled]{opacity:.55;cursor:default}
.msg{min-height:1.4em}
button.chip{cursor:pointer}
.loading{padding:60px 0;color:var(--muted);font:400 12px var(--mono)}
.err-box{border:1px solid var(--rule-lit);padding:18px;max-width:520px}
.err-box b{font:400 20px var(--serif);color:var(--white);display:block;margin-bottom:6px}
dialog{border:1px solid var(--rule-lit);background:var(--panel);color:var(--text);padding:0;max-width:min(560px,calc(100vw - 24px));width:100%}
dialog::backdrop{background:rgba(0,0,0,.6)}
.dlg{padding:22px 22px 18px;display:grid;gap:12px}
.dlg-x{position:absolute;right:10px;top:8px;width:36px;height:36px;display:grid;place-items:center;color:var(--muted);font-size:20px}
.dlg-x:hover{color:var(--white)}
@media (prefers-reduced-motion: reduce){*{scroll-behavior:auto!important;transition:none!important;animation:none!important}}
@media (hover:none){.gl{border-bottom-style:solid}}
.gl:focus:not(:hover) .gp,.q:focus:not(:hover) .gp{cursor:pointer}