:root{--bg:#fafafa;--fg:#171717;--mut:#737373;--line:#e5e5e5;--card:#fff;--acc:#171717;--accfg:#fff;--pos:#15803d;--neg:#b91c1c;--hl:#f5f5f5;--r:8px}
@media(prefers-color-scheme:dark){:root{--bg:#0a0a0a;--fg:#ededed;--mut:#a1a1a1;--line:#2a2a2a;--card:#111;--acc:#ededed;--accfg:#0a0a0a;--pos:#4ade80;--neg:#f87171;--hl:#1a1a1a}}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--fg);font:14px/1.45 -apple-system,BlinkMacSystemFont,"Segoe UI",Inter,Roboto,sans-serif}
header.top{display:flex;gap:16px;align-items:center;flex-wrap:wrap;padding:10px 16px;border-bottom:1px solid var(--line);background:var(--card)}
header.top .brand{font-weight:600;letter-spacing:-.01em}
.seg{display:inline-flex;border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.seg a{padding:5px 12px;color:var(--mut);text-decoration:none;border-right:1px solid var(--line)}
.seg a:last-child{border-right:0}
.seg a.on{background:var(--acc);color:var(--accfg)}
.seg a.off{opacity:.4;pointer-events:none}
.sp{flex:1}
button,select,input{font:inherit;color:var(--fg);background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:5px 10px}
button{cursor:pointer}
button:hover{background:var(--hl)}
kbd{font:12px ui-monospace,monospace;border:1px solid var(--line);border-radius:4px;padding:0 4px;color:var(--mut)}
nav.tabs{display:flex;gap:4px;padding:8px 16px 0;border-bottom:1px solid var(--line);background:var(--card)}
nav.tabs a{padding:7px 12px;color:var(--mut);text-decoration:none;border-bottom:2px solid transparent}
nav.tabs a.on{color:var(--fg);border-color:var(--acc)}
main{padding:12px 16px}
.bar{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-bottom:10px}
.bar .cnt{color:var(--mut)}
.note{color:var(--mut);padding:24px;border:1px dashed var(--line);border-radius:var(--r)}
.tw{overflow:auto;height:68vh;border:1px solid var(--line);border-radius:var(--r);background:var(--card);position:relative}
table.t{border-collapse:separate;border-spacing:0;font-variant-numeric:tabular-nums;width:max-content;min-width:100%}
.t th,.t td{padding:0 10px;height:28px;white-space:nowrap;border-bottom:1px solid var(--line);text-align:right}
.t th.txt,.t td.txt{text-align:left}
.t thead th{position:sticky;background:var(--card);z-index:2;font-weight:600;cursor:pointer;user-select:none}
.t thead tr.g th{top:0;cursor:default;color:var(--mut);font-weight:500;text-align:left;border-right:1px solid var(--line)}
.t thead tr.h th{top:28px}
.t tfoot td{position:sticky;bottom:0;background:var(--hl);font-weight:600;z-index:2;border-top:1px solid var(--line)}
.t .c1{position:sticky;left:0;background:var(--card);z-index:1;border-right:1px solid var(--line)}
.t thead .c1,.t tfoot .c1{z-index:3}
.t tfoot .c1{background:var(--hl)}
.pos{color:var(--pos)}.neg{color:var(--neg)}.nd{color:var(--mut)}
.t tr.loss td.c1{box-shadow:inset 3px 0 var(--neg)}
.pad td{padding:0;border:0;height:auto}
dialog{border:1px solid var(--line);border-radius:12px;background:var(--card);color:var(--fg);padding:0;width:min(480px,92vw);top:15vh}
dialog::backdrop{background:rgba(0,0,0,.4)}
dialog input{width:100%;border:0;border-bottom:1px solid var(--line);border-radius:0;padding:12px 14px;outline:0}
dialog ul{list-style:none;margin:0;padding:6px;max-height:50vh;overflow:auto}
dialog li{padding:8px 10px;border-radius:6px;cursor:pointer}
dialog li.sel{background:var(--hl)}
.login{max-width:320px;margin:15vh auto;padding:20px;border:1px solid var(--line);border-radius:12px;background:var(--card);display:grid;gap:10px}
.login h1{font-size:16px;margin:0 0 4px}
.err{color:var(--neg);min-height:1.3em}
@media(max-width:640px){main,header.top,nav.tabs{padding-left:10px;padding-right:10px}.tw{height:60vh}}
