:root { --bg:#111216; --panel:#1b1d24; --panel2:#22252e; --line:#2e323d; --text:#e8e6df; --muted:#9a9fae; --gold:#ffcf5a; --green:#4fc98a; --red:#ef6a5a; --blue:#5aa9ef; }
* { box-sizing: border-box; }
body { margin:0; background:var(--bg); color:var(--text); font-family: "Inter", "Segoe UI", system-ui, sans-serif; font-size:15px; }
.app { display:grid; grid-template-columns: 1280px 400px; grid-template-rows: 800px auto; gap:16px; padding:16px; }
#table { display:block; background:#17181c; border-radius:14px; box-shadow: 0 0 0 1px var(--line); }
.overlay { background:var(--panel); border:1px solid var(--line); border-radius:14px; padding:18px; display:flex; flex-direction:column; gap:12px; min-height:800px; }
.overlay h2 { margin:0; font-size:13px; letter-spacing:.12em; text-transform:uppercase; color:var(--muted); display:flex; justify-content:space-between; }
.headline { font-size:26px; font-weight:700; line-height:1.15; color:var(--gold); min-height:64px; }
.headline.wait { color:var(--muted); font-weight:500; font-size:18px; }
.bars { display:flex; flex-direction:column; gap:6px; }
.bar { display:grid; grid-template-columns: 120px 1fr 48px; align-items:center; gap:8px; font-size:14px; }
.bar .track { height:10px; background:var(--panel2); border-radius:5px; overflow:hidden; }
.bar .fill { height:100%; background:var(--gold); border-radius:5px; }
.bar.alt .fill { background:#6d7180; }
.bar .pct { text-align:right; color:var(--muted); font-variant-numeric: tabular-nums; }
.reason { font-size:14.5px; line-height:1.45; color:var(--text); background:var(--panel2); border-radius:10px; padding:12px; }
.chips { display:flex; flex-wrap:wrap; gap:6px; }
.chip { font-size:12px; padding:4px 8px; border-radius:999px; background:var(--panel2); color:var(--muted); border:1px solid var(--line); font-variant-numeric: tabular-nums; }
.chip.mode-solver { color:var(--green); border-color:var(--green); }
.chip.mode-chart { color:var(--blue); border-color:var(--blue); }
.chip.mode-heuristic { color:var(--gold); border-color:var(--gold); }
.chip.warn { color:var(--red); border-color:var(--red); }
.spot { font-size:13px; color:var(--muted); }
.feedback { font-size:14px; padding:10px 12px; border-radius:10px; border:1px solid var(--line); min-height:44px; }
.feedback.ok { border-color:var(--green); color:var(--green); }
.feedback.dev { border-color:var(--red); color:var(--red); }
.session { margin-top:auto; font-size:13px; color:var(--muted); display:flex; flex-direction:column; gap:6px; }
.session b { color:var(--text); }
.controls { grid-column: 1 / 2; background:var(--panel); border:1px solid var(--line); border-radius:14px; padding:14px 18px; display:flex; align-items:center; gap:12px; flex-wrap:wrap; }
button { background:var(--panel2); color:var(--text); border:1px solid var(--line); border-radius:10px; padding:12px 18px; font-size:16px; font-weight:600; cursor:pointer; }
button:hover { border-color:var(--gold); }
button:disabled { opacity:.35; cursor:default; }
button.fold { color:var(--red); } button.call { color:var(--green); } button.raise { color:var(--gold); }
button.small { padding:7px 10px; font-size:13px; font-weight:500; }
input[type=range] { width:220px; accent-color: var(--gold); }
input[type=number] { width:90px; background:var(--panel2); color:var(--text); border:1px solid var(--line); border-radius:8px; padding:8px; font-size:15px; }
.spacer { flex:1; }
.links { grid-column: 2 / 3; display:flex; gap:10px; align-items:center; font-size:13px; color:var(--muted); }
.links a { color:var(--blue); text-decoration:none; }
.vision { font-size:12px; color:var(--muted); }
.vision.on { color:var(--green); }
.vision.unsure { color:var(--red); }
kbd { background:var(--panel2); border:1px solid var(--line); border-radius:5px; padding:1px 5px; font-size:11px; color:var(--muted); }
/* report */
.report { max-width:1100px; margin:0 auto; padding:24px; }
.report table { width:100%; border-collapse:collapse; font-size:14px; }
.report th, .report td { text-align:left; padding:8px 10px; border-bottom:1px solid var(--line); font-variant-numeric: tabular-nums; }
.report th { color:var(--muted); font-weight:500; font-size:12px; text-transform:uppercase; letter-spacing:.08em; }
.kpis { display:grid; grid-template-columns: repeat(6, 1fr); gap:10px; margin:16px 0 24px; }
.kpi { background:var(--panel); border:1px solid var(--line); border-radius:12px; padding:14px; }
.kpi .v { font-size:24px; font-weight:700; color:var(--gold); }
.kpi .l { font-size:12px; color:var(--muted); }
.worst { background:var(--panel); border:1px solid var(--line); border-radius:12px; padding:12px 14px; margin-bottom:10px; font-size:14px; }
.worst .h { color:var(--gold); font-weight:600; }
.worst .r { color:var(--muted); margin-top:4px; font-size:13px; }