:root { --bg:#11141a; --panel:#1a1f29; --border:#2a3142; --fg:#e6e9f0; --muted:#8b93a7; --accent:#e05c8a; --green:#3fb96f; --yellow:#e0b13f; --red:#e0533f; --off:#555c6e; }
* { box-sizing: border-box; }
body { margin:0; font-family: 'Segoe UI', system-ui, sans-serif; background:var(--bg); color:var(--fg); }
header { padding:14px 22px; border-bottom:1px solid var(--border); display:flex; align-items:center; gap:24px; flex-wrap:wrap; position:sticky; top:0; background:var(--bg); z-index:5; }
h1 { font-size:19px; margin:0; }
h2 { font-size:16px; border-bottom:1px solid var(--border); padding-bottom:6px; margin-top:26px; }
nav { display:flex; gap:6px; }
nav button { background:none; border:1px solid var(--border); color:var(--muted); padding:7px 15px; border-radius:8px; cursor:pointer; font-size:13px; font-weight:600; }
nav button.active { color:var(--fg); border-color:var(--accent); background:rgba(224,92,138,.1); }
.badge { background:var(--accent); color:#fff; border-radius:10px; padding:0 7px; font-size:11px; margin-left:4px; }
.badge:empty { display:none; }
main { max-width:1080px; margin:0 auto; padding:18px 22px 60px; }
.tab { display:none; }
.tab.active { display:block; }
.muted { color:var(--muted); font-size:12.5px; }
.semafor { display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:10px; margin:14px 0 20px; }
.zone { background:var(--panel); border:1px solid var(--border); border-left:5px solid var(--off); border-radius:10px; padding:10px 12px; }
.zone .zname { font-weight:700; font-size:13px; text-transform:uppercase; letter-spacing:.4px; }
.zone .zfig { font-size:15px; margin-top:3px; }
.zone .zreason { color:var(--muted); font-size:12px; margin-top:3px; }
.zone.green { border-left-color:var(--green); } .zone.yellow { border-left-color:var(--yellow); }
.zone.red { border-left-color:var(--red); background:rgba(224,83,63,.08); } .zone.off { opacity:.6; }
.report { background:var(--panel); border:1px solid var(--border); border-radius:12px; padding:20px 26px; line-height:1.55; overflow-x:auto; }
.report h1 { font-size:20px; } .report h2 { font-size:15.5px; margin-top:20px; }
.report table { border-collapse:collapse; } .report td,.report th { border:1px solid var(--border); padding:4px 9px; font-size:13px; }
.report code { background:#252b38; padding:1px 5px; border-radius:4px; font-size:12.5px; }
.card { background:var(--panel); border:1px solid var(--border); border-radius:10px; padding:13px 16px; margin:10px 0; }
.card h3 { margin:0 0 6px; font-size:14.5px; }
.card .meta { color:var(--muted); font-size:12px; }
.card button, form button, #runNowBtn { background:var(--accent); border:none; color:#fff; padding:7px 14px; border-radius:7px; cursor:pointer; font-weight:600; font-size:13px; margin-right:8px; margin-top:8px; }
.card button.secondary { background:#39415a; }
.card button:disabled { opacity:.4; cursor:default; }
.exec-output { background:#0c0e13; border:1px solid var(--border); border-radius:8px; padding:12px; font-size:12px; white-space:pre-wrap; max-height:340px; overflow:auto; }
.cols { display:flex; gap:22px; } .cols ul { list-style:none; padding:0; }
.cols li { padding:6px 10px; cursor:pointer; border-radius:6px; color:var(--muted); }
.cols li:hover,.cols li.sel { background:var(--panel); color:var(--fg); }
.grow { flex:1; min-width:0; }
form label { display:block; margin:10px 0; font-size:14px; }
form input[type=time], form select { background:var(--panel); border:1px solid var(--border); color:var(--fg); padding:6px 10px; border-radius:6px; margin-left:8px; }
label.check { font-size:13.5px; }
.rem { background:rgba(224,177,63,.12); border:1px solid rgba(224,177,63,.4); border-radius:8px; padding:8px 13px; margin:6px 0; font-size:13px; }
.mod { display:flex; align-items:center; gap:10px; padding:7px 4px; border-bottom:1px solid var(--border); font-size:13.5px; }
.mod .note { color:var(--muted); font-size:12px; }
.stale { color:var(--yellow); }
.sf-frame { width:100%; height:calc(100vh - 150px); border:1px solid var(--border); border-radius:12px; background:#fff; }
main.wide { max-width:none; }
#sfStartBtn { background:var(--accent); border:none; color:#fff; padding:8px 16px; border-radius:7px; cursor:pointer; font-weight:600; }
