/* Kavren Lab dashboard. Tokens and component classes come from the Claude Design canvas
   (Kavren Lab, artboards Main..LP); keep names in sync with it. */
html,body{margin:0;background:#0c0e10}
.kv{--sans:'IBM Plex Sans KR',system-ui,-apple-system,'Apple SD Gothic Neo','Malgun Gothic',sans-serif;--mono:'IBM Plex Mono',ui-monospace,SFMono-Regular,Menlo,monospace;font-family:var(--sans);font-size:13px;line-height:1.5;background:var(--bg);color:var(--ink);min-height:100vh;-webkit-font-smoothing:antialiased}
.kv[data-theme=dark]{color-scheme:dark;--bg:#0c0e10;--panel:#14171a;--panel2:#1b1f23;--line:#252a30;--line2:#384049;--ink:#e8ebee;--ink2:#b4bcc4;--muted:#8f98a1;--dim:#7d868f;--live:#33c7b8;--ok:#52c98e;--warn:#f2b544;--warn-bg:#2a2010;--warn-ink:#ffd690;--crit:#ff9b52;--crit-bg:#331a0b;--crit-ink:#ffcaa3;--s1:#f0a030;--s2:#a78bfa;--s3:#52c98e;--hold:#98a1aa;--up:#ff5b66;--down:#5c9dff}
.kv[data-theme=light]{color-scheme:light;--bg:#f3f4f6;--panel:#ffffff;--panel2:#f2f4f6;--line:#e1e4e8;--line2:#c3c9d0;--ink:#111417;--ink2:#3b434b;--muted:#59616a;--dim:#69717a;--live:#0b8a7e;--ok:#1d8a52;--warn:#a96d00;--warn-bg:#fff5e0;--warn-ink:#6b4400;--crit:#c2530f;--crit-bg:#fff0e6;--crit-ink:#7a3005;--s1:#c27a0e;--s2:#7c5cdb;--s3:#1d8a52;--hold:#7b848d;--up:#d4252f;--down:#1d5fd6}
.kv[data-pnl=global][data-theme=dark]{--up:#52c98e;--down:#ff5b66}
.kv[data-pnl=global][data-theme=light]{--up:#1d8a52;--down:#d4252f}
.kv{--env:var(--live)}.kv[data-env=LIVE]{--env:#ff7a1a}
body:has(.kv[data-theme=light]){background:#f3f4f6}

.num{font-family:var(--mono);font-variant-numeric:tabular-nums}
.up{color:var(--up)}.down{color:var(--down)}.zero{color:var(--ink2)}.e4{color:var(--dim)}
.ev{display:inline-flex;align-items:center;gap:4px;height:18px;padding:0 6px;border-radius:3px;font:500 10.5px/1 var(--mono);letter-spacing:.02em;white-space:nowrap;box-sizing:border-box;vertical-align:middle}
.ev1{background:var(--ink);color:var(--bg);border:1px solid var(--ink)}.ev2{border:1px solid var(--ink2);color:var(--ink)}.ev3{border:1px dashed var(--muted);color:var(--ink2)}.ev4{border:1px dotted var(--line2);color:var(--dim)}
.src{display:inline-flex;align-items:center;height:18px;padding:0 7px;border-radius:999px;border:1px solid var(--line2);font:500 10.5px/1 var(--mono);color:var(--muted);white-space:nowrap;vertical-align:middle}
.rs{display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 10px;border-radius:4px;border:1px dashed var(--s2);color:var(--s2);font-size:12px;font-weight:600;white-space:nowrap}
.card{background:var(--panel);border:1px solid var(--line);border-radius:6px}
.lbl{font-size:11.5px;color:var(--muted)}
.cn{font:500 11px var(--mono);color:var(--muted)}
.pb{display:inline-flex;align-items:center;gap:6px;height:24px;padding:0 9px;border:1px solid var(--line2);border-radius:999px;font-size:12px;color:var(--ink2);white-space:nowrap}
.pb i{width:7px;height:7px;border-radius:50%;display:block}
.seg{display:inline-flex;border:1px solid var(--line2);border-radius:5px;overflow:hidden}
.seg button{font:500 12px var(--sans);color:var(--ink2);background:transparent;border:0;border-right:1px solid var(--line2);padding:0 11px;height:28px;cursor:pointer}
.seg button:last-child{border-right:0}.seg button[aria-pressed=true]{background:var(--ink);color:var(--bg)}
.nv{display:flex;align-items:center;gap:10px;padding:0 10px;height:36px;border-radius:5px;color:var(--ink2);text-decoration:none;font-size:13px}
.nv:hover{background:var(--panel2);color:var(--ink)}.nv[aria-current=page]{background:var(--panel2);color:var(--ink);font-weight:600}
.nv svg{flex:none}
.tbl{width:100%;border-collapse:collapse;font-size:12.5px}
.tbl th{font-weight:500;color:var(--muted);text-align:left;padding:8px 10px;border-bottom:1px solid var(--line);white-space:nowrap;font-size:11.5px}
.tbl td{padding:9px 10px;border-bottom:1px solid var(--line);white-space:nowrap}
.r{text-align:right}
.gr{display:grid;grid-template-columns:var(--cols);align-items:center;border-bottom:1px solid var(--line);font-size:12.5px}
.gr>div{padding:9px 10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.gh{color:var(--muted);font-size:11.5px;font-weight:500}.gh>div{white-space:normal;line-height:1.3}
.gg{display:flex;align-items:center;gap:8px;padding:8px 10px;background:var(--panel2);border-bottom:1px solid var(--line);font-size:12px}
.sig{display:inline-flex;align-items:center;gap:4px;height:20px;padding:0 7px;border-radius:3px;font:600 11px/1 var(--mono)}
.sig-flat{border:1px solid var(--line2);color:var(--muted)}.sig-long{background:var(--live);color:var(--bg)}
.side{display:inline-flex;align-items:center;gap:4px;height:20px;padding:0 7px;border-radius:3px;font-size:11.5px;font-weight:600}
.side-buy{background:var(--ink);color:var(--bg)}.side-sell{border:1px solid var(--ink2);color:var(--ink)}
.st{font:500 11px var(--mono);padding:2px 6px;border-radius:3px;border:1px solid var(--line2)}
.mk{width:22px;height:22px;border-radius:4px;display:flex;align-items:center;justify-content:center;font:600 11px/1 var(--mono);flex:none;box-sizing:border-box}
.wc{width:16px;height:16px;border-radius:2px;border:1px solid var(--line2);box-sizing:border-box;display:block}
.kpi{padding:12px 16px;border-right:1px solid var(--line);display:flex;flex-direction:column;gap:2px}
.lg{display:inline-flex;align-items:center;gap:6px}
.hatch{background:repeating-linear-gradient(135deg,var(--panel2) 0 6px,var(--panel) 6px 12px)}
.sk{background:linear-gradient(90deg,var(--panel2),var(--line),var(--panel2));border-radius:3px}
input.srch{font:13px var(--sans);color:var(--ink);background:var(--panel2);border:1px solid var(--line2);border-radius:5px;height:30px;padding:0 10px 0 30px;width:200px;box-sizing:border-box}
input.f{font:13px var(--sans);color:var(--ink);background:var(--panel2);border:1px solid var(--line2);border-radius:5px;height:30px;padding:0 10px;box-sizing:border-box}
.chip{display:inline-flex;align-items:center;gap:6px;font:500 12px var(--sans);height:28px;padding:0 10px;border-radius:999px;border:1px solid var(--line2);background:transparent;color:var(--ink2);cursor:pointer;white-space:nowrap}
.chip[aria-pressed=true]{background:var(--panel2);color:var(--ink);border-color:var(--ink2)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
details summary{cursor:pointer;color:var(--muted);font-size:12px}
a{color:var(--live)}a:hover{color:var(--ink)}
a.rowlink{color:var(--ink);text-decoration:none;font-weight:600}a.rowlink:hover{text-decoration:underline}
h1{margin:0;font-size:20px;font-weight:600;letter-spacing:-.01em}
h2{margin:0;font-size:14px;font-weight:600}
.stale{opacity:.55}

/* shell */
.shell{display:flex;flex-wrap:wrap;align-items:stretch}
.shell{flex-wrap:nowrap}
.side-nav{flex:0 0 220px;width:220px;padding:16px 12px;box-sizing:border-box;border-right:1px solid var(--line);display:flex;flex-direction:column;gap:2px}
.main{flex:1 1 auto;min-width:0;padding:20px 24px 40px;box-sizing:border-box;display:flex;flex-direction:column;gap:16px;max-width:1440px}
.bottom-nav{display:none}
.only-mob{display:none}
@media (max-width:720px){
  .only-desk{display:none!important}.only-mob{display:block}
  .side-nav{display:none}
  .main{padding:12px 12px 90px;gap:12px}
  header.top{padding:8px 12px!important}
  .bottom-nav{display:grid;position:fixed;left:0;right:0;bottom:0;height:64px;background:var(--panel);border-top:1px solid var(--line);grid-template-columns:repeat(6,minmax(0,1fr));z-index:10}
  .bottom-nav a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;font-size:10.5px;color:var(--muted);text-decoration:none}
  .bottom-nav a[aria-current=page]{color:var(--ink);font-weight:600}
  input.srch{width:100%}
}