:root{--bg:#14181c;--card:#1b1f24;--c2:#20252b;--bd:#2b3138;--tx:#e8ecef;
 --tx2:#98a1a9;--ac:#5eead4;--or:#f0a868;--rd:#f08a8a;--gr:#7ddba0}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--tx);
 font:14px/1.6 'IBM Plex Sans KR',-apple-system,'Noto Sans KR',sans-serif}
.shell{display:flex;min-height:100vh}
nav{width:212px;flex:none;background:#10141a;border-right:1px solid var(--bd);
 padding:16px 12px;position:sticky;top:0;height:100vh;overflow:auto}
nav .br{font-weight:700;letter-spacing:.1em;font-size:13px;margin:0 0 4px 8px}
nav .sb{font-size:11px;color:var(--tx2);margin:0 0 16px 8px}
nav a{display:block;padding:9px 11px;border-radius:8px;color:var(--tx2);
 text-decoration:none;font-size:13px;margin-bottom:3px}
nav a:hover{background:var(--c2);color:var(--tx)}
nav a.on{background:var(--ac);color:#0f1418;font-weight:600}
main{flex:1;padding:22px 26px 60px;max-width:1100px}
h1{font-size:19px;margin:0 0 3px}
.sub{color:var(--tx2);font-size:12.5px;margin:0 0 18px}
.card{background:var(--card);border:1px solid var(--bd);border-radius:12px;
 padding:16px 18px;margin-bottom:14px}
h2{font-size:14px;margin:0 0 12px;color:var(--ac)}
table{width:100%;border-collapse:collapse;font-size:13px}
th,td{padding:8px 10px;border-bottom:1px solid var(--bd);text-align:left;vertical-align:top}
th{color:var(--tx2);font-size:11.5px;font-weight:600;white-space:nowrap}
td.num{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
tr.sel{background:var(--c2)}
tbody tr{cursor:pointer}
tbody tr:hover{background:#232930}
.pill{display:inline-block;padding:3px 10px;border-radius:999px;font-size:11px;
 background:var(--c2);color:var(--tx2);white-space:nowrap}
.pill.learn{background:rgba(125,219,160,.16);color:var(--gr)}
.pill.sandbox{background:rgba(240,168,104,.16);color:var(--or)}
.pill.reject{background:rgba(240,138,138,.16);color:var(--rd)}
.pill.defer{background:rgba(152,161,169,.18);color:var(--tx2)}
.pill.mem{background:rgba(94,234,212,.16);color:var(--ac)}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:10px}
.kpi{background:var(--c2);border-radius:10px;padding:12px 14px}
.kpi .l{font-size:11.5px;color:var(--tx2)}
.kpi .v{font-size:21px;font-weight:700;color:var(--ac);font-variant-numeric:tabular-nums}
.bar{height:7px;background:var(--c2);border-radius:99px;overflow:hidden;margin-top:4px}
.bar i{display:block;height:100%;background:var(--ac);border-radius:99px}
.bar.r i{background:var(--rd)}
label{display:block;font-size:12px;color:var(--tx2);margin:12px 0 4px}
input[type=range]{width:100%}
input[type=text],input[type=number],select,textarea{width:100%;padding:8px 10px;
 border:1px solid var(--bd);border-radius:8px;background:var(--c2);color:var(--tx);
 font:inherit;font-size:13px}
textarea{min-height:190px;font-family:ui-monospace,Menlo,monospace;font-size:12px}
button{font:inherit;font-size:13px;font-weight:600;padding:9px 15px;border:0;
 border-radius:8px;background:var(--ac);color:#0f1418;cursor:pointer}
button.gh{background:var(--c2);color:var(--tx);border:1px solid var(--bd)}
button:hover{filter:brightness(1.1)}
.row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.two{display:grid;grid-template-columns:1.35fr 1fr;gap:14px}
@media(max-width:900px){.shell{flex-direction:column}nav{width:auto;height:auto;position:static}
 .two{grid-template-columns:1fr}}
.mono{font-family:ui-monospace,Menlo,monospace;font-size:11.5px;color:var(--tx2)}
.k{color:var(--tx2)}