:root{--card-bg: rgba(255, 253, 248, .94);--card-border: rgba(60, 50, 30, .08);--fg: #26251f;--muted: #736d62;--line: #e7e0d2;--accent: #d9603b;--accent-soft: #fbe6dd;--btn-border: #d6cebe;--s1: #2f9e55;--s2: #8cc152;--s3: #f0c419;--s4: #e8743b;--s5: #c9302c;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;color:var(--fg)}*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden;background:#e9e3d6}#scene{display:block;width:100vw;height:100vh}.card{background:var(--card-bg);border:1px solid var(--card-border);border-radius:12px;box-shadow:0 6px 24px #281e0a24;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}button,select,input[type=time],input[type=number]{font:inherit;color:var(--fg);border:1px solid var(--btn-border);background:#fff;border-radius:7px;padding:4px 9px}button{cursor:pointer;transition:background .12s,border-color .12s}button:hover{border-color:#b9ae98}button[aria-pressed=true],button.primary{background:var(--accent);border-color:var(--accent);color:#fff}button.icon{width:28px;height:28px;padding:0;border-radius:50%;display:inline-grid;place-items:center;font-weight:600}kbd{font:600 10px/1 ui-monospace,monospace;padding:2px 4px;border:1px solid var(--btn-border);border-bottom-width:2px;border-radius:4px;background:#fff;color:var(--muted)}.muted,.hint{color:var(--muted)}#panel{position:fixed;top:14px;left:14px;width:min(340px,calc(100vw - 28px));max-height:calc(100vh - 28px);overflow-y:auto;padding:12px 14px 10px;font-size:13px;line-height:1.4;transition:transform .2s}#panel.collapsed{width:auto}#panel.collapsed #panel-body,#panel.collapsed #area-name{display:none}#panel.collapsed #collapse{transform:rotate(180deg)}#area-select{width:100%;margin-top:6px}#panel.collapsed #area-select{display:none}#panel-mini{display:none;margin:4px 0 0;font-size:13px}#panel.collapsed #panel-mini{display:block}.panel-head{display:flex;justify-content:space-between;align-items:flex-start;gap:8px}#panel h1{margin:0;font-size:16px;letter-spacing:-.01em}#area-name{margin:2px 0 0;color:var(--muted);font-size:12px}.section{border-top:1px solid var(--line);margin-top:10px;padding-top:10px}details.section>summary{cursor:pointer;list-style:none;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--muted)}details.section>summary:before{content:"▸";display:inline-block;width:14px;transition:transform .15s}details.section[open]>summary:before{transform:rotate(90deg)}details.section>summary::-webkit-details-marker{display:none}.row{display:flex;align-items:center;flex-wrap:wrap;gap:8px;margin-top:8px}.label{min-width:56px;color:var(--muted)}.clock-row{display:flex;justify-content:space-between;align-items:center;gap:8px}#clock-big{font:600 30px/1 system-ui,sans-serif;font-variant-numeric:tabular-nums;letter-spacing:-.02em}#day-label{font-size:11px;margin-top:3px}#speeds{display:flex;gap:4px}#speeds button{padding:4px 8px;min-width:34px}#kpis{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;margin-top:10px}.kpi{background:#fff;border:1px solid var(--line);border-radius:8px;padding:5px 6px;text-align:center}.kpi span{display:block;font-weight:650;font-size:15px;font-variant-numeric:tabular-nums}.kpi small{color:var(--muted);font-size:10px}#spark{width:100%;height:56px;margin-top:8px;display:block}.mode-switch{margin:8px 0 2px;display:flex}.mode-switch button{flex:1}body.simple .expert{display:none!important}body.simple #kpis{grid-template-columns:repeat(3,1fr)}#status{margin-top:10px;padding:8px 10px;border-radius:10px;background:#fff;border:1px solid var(--line);font-size:13px}.status-row{display:flex;justify-content:space-between;align-items:baseline;gap:8px;flex-wrap:wrap}.status-row .muted{font-size:11px}.meter{height:6px;border-radius:3px;background:var(--line);margin-top:6px;overflow:hidden}.meter>div{height:100%;width:0;border-radius:3px;transition:width .6s,background .6s}#intro{max-width:520px;border:none;border-radius:14px;padding:22px 24px;box-shadow:0 20px 60px #0000004d}#intro::backdrop{background:#1e190f59}#intro h2{margin:0 0 8px}#intro .close{position:absolute;right:14px;top:14px}.intro-list{padding-left:18px;line-height:1.5}#intro .primary{width:100%;padding:8px}.small{font-size:12px}#settings{max-width:620px;width:calc(100vw - 32px);border:none;border-radius:14px;padding:20px 22px;box-shadow:0 20px 60px #0000004d}#settings::backdrop{background:#1e190f59}#settings .close{position:absolute;right:14px;top:14px}#settings h2{margin:0 0 6px}#settings h3{margin:14px 0 6px;font-size:14px}.usage-row{display:flex;gap:10px;align-items:baseline;margin-top:8px;font-size:13px}.usage-row span:first-child{flex:1}.warn{background:#fdecea;color:#8a1f17;padding:6px 10px;border-radius:8px;font-size:13px}table.history{width:100%;border-collapse:collapse;font-size:12px}table.history th,table.history td{text-align:left;padding:3px 6px;border-bottom:1px solid var(--line)}table.history th{color:var(--muted);font-weight:600}#sim-stats{margin:4px 0 0;font-size:12px;min-height:1em}.slider-label{display:flex;justify-content:space-between;margin-top:10px}#demand{width:100%;accent-color:var(--accent)}#live .dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:#b5ad9d;margin-right:6px;vertical-align:1px}#live[aria-pressed=true] .dot{background:#fff;animation:pulse 1.6s infinite}@keyframes pulse{50%{opacity:.3}}#toggles{display:flex;flex-wrap:wrap;gap:5px;margin-top:8px}#toggles button{padding:3px 8px}#toggles kbd{margin-left:5px}#toggles button[aria-pressed=true] kbd{background:transparent;color:#fff;border-color:#ffffff80}.segmented{display:inline-flex}.segmented button{border-radius:0;margin-left:-1px}.segmented button:first-child{border-radius:7px 0 0 7px;margin-left:0}.segmented button:last-child{border-radius:0 7px 7px 0}#places{max-width:230px}#counters,#validation,#calibration,#stats{margin:8px 0 0;font-size:12px}.panel-foot{display:flex;justify-content:space-between;align-items:center;margin-top:10px;font-size:11px}#hotspots{margin:8px 0 0;padding-left:0;list-style:none}#hotspots li{display:flex;align-items:center;gap:8px;padding:3px 6px;border-radius:6px;cursor:pointer;font-size:12px}#hotspots li:hover{background:var(--accent-soft)}#hotspots .name{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}#hotspots .kmh{font-variant-numeric:tabular-nums;color:var(--muted)}#hotspots .dot{width:9px;height:9px;border-radius:50%;flex:none}#hotspots:empty:before{content:"No congestion right now.";color:var(--muted);font-size:12px}#legend{position:fixed;right:14px;bottom:28px;padding:8px 12px;font-size:12px;max-width:calc(100vw - 28px)}#legend:empty{display:none}#legend .title{font-weight:650;margin-right:8px}#legend .ramp{display:flex;align-items:center;gap:10px;flex-wrap:wrap}#legend .swatch{display:inline-block;width:12px;height:12px;border-radius:3px;margin-right:4px;vertical-align:-2px}.chip{display:inline-block;padding:0 6px;border-radius:9px;color:#fff;font-size:11px}.chip.s1{background:var(--s1)}.chip.s3{background:var(--s3);color:#3a3000}.chip.s5{background:var(--s5)}#follow{position:fixed;left:50%;bottom:28px;transform:translate(-50%);width:300px;padding:12px 14px}#follow[hidden]{display:none}.follow-head{display:flex;align-items:center;gap:10px}.follow-head>div{flex:1;min-width:0}.follow-head .muted{font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.follow-icon{font-size:26px;line-height:1}.follow-speed{display:flex;align-items:baseline;gap:6px;margin:10px 0 6px}.follow-speed span{font-size:30px;font-weight:700;font-variant-numeric:tabular-nums}.follow-speed small{color:var(--muted)}.gauge{flex:1;height:8px;border-radius:4px;background:var(--line);overflow:hidden;align-self:center}.gauge>div{height:100%;width:0;border-radius:4px;background:var(--s1);transition:width .3s,background .3s}.follow-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-bottom:10px;text-align:center}.follow-stats span{display:block;font-weight:650;font-variant-numeric:tabular-nums}.follow-stats small{color:var(--muted);font-size:11px}#tooltip{position:fixed;pointer-events:none;padding:7px 10px;border-radius:8px;background:#1c1b18eb;color:#fff;font-size:12px;line-height:1.45;white-space:nowrap;box-shadow:0 4px 14px #00000040}#tooltip strong{font-size:13px}#tooltip .live{color:#ffd59a}#tooltip .bar{display:inline-block;height:6px;border-radius:3px;vertical-align:1px;margin-left:6px}#loading{position:fixed;inset:0;display:grid;place-content:center;justify-items:center;gap:12px;color:var(--muted);font-size:15px;background:#e9e3d6;z-index:10}.spinner{width:34px;height:34px;border-radius:50%;border:3px solid #d8cfbd;border-top-color:var(--accent);animation:spin .9s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}#attribution{position:fixed;right:8px;bottom:6px;font-size:11px;color:var(--muted);background:#fffcf5bf;padding:2px 6px;border-radius:4px}#north{position:fixed;right:14px;top:14px;width:38px;height:38px;border-radius:50%;color:var(--accent);font:700 14px system-ui,sans-serif;padding:0}#scenario{position:fixed;top:62px;right:14px;width:min(330px,calc(100vw - 28px));max-height:calc(100vh - 100px);overflow-y:auto;padding:10px 14px;font-size:13px}#scenario summary{cursor:pointer;list-style:none}#scenario summary::-webkit-details-marker{display:none}#scenario h2{display:inline;margin:0;font-size:15px}#scenario h2:after{content:" ▾";color:var(--muted);font-size:12px}#scenario details:not([open]) h2:after{content:" ▸"}#scenario h3{margin:10px 0 4px;font-size:13px}#scenario .muted{font-weight:400}#scenario .hint{margin:6px 0}#scenario .check{display:flex;gap:6px;align-items:center;margin:8px 0}#scenario .row{gap:6px}#scenario button,#scenario select,#scenario input[type=number]{padding:3px 8px}#scenario input[type=number]{width:64px}#edits{list-style:none;padding:0;margin:8px 0 0}#edits:empty{display:none}#edits li{display:flex;justify-content:space-between;gap:8px;padding:5px 0;border-top:1px solid var(--line)}#edits li button{padding:0 7px}#results table{width:100%;border-collapse:collapse;margin-top:8px;font-variant-numeric:tabular-nums}#results th,#results td{text-align:right;padding:3px 4px}#results th{font-size:11px;color:var(--muted);font-weight:600}#results tr+tr td{border-top:1px solid var(--line)}#results th:first-child,#results td:first-child{text-align:left}#results .better{color:#2f8f4e;font-weight:600}#results .worse{color:#c0392b;font-weight:600}#results progress{width:100%;accent-color:var(--accent)}#help{max-width:min(620px,calc(100vw - 32px));border:none;border-radius:14px;padding:18px 22px;color:var(--fg);font-size:14px;line-height:1.5;box-shadow:0 20px 60px #0000004d}#help::backdrop{background:#1e190f59}#help h2{margin:0 0 8px;font-size:18px}#help h3{margin:14px 0 4px;font-size:14px}#help ul{padding-left:18px}#help li{margin:4px 0}#help .close{position:absolute;right:14px;top:14px}#help .keys kbd{margin:0 1px}@media(max-width:760px){#scenario{top:62px;max-height:50vh;width:auto;left:auto}#legend{left:14px;right:14px;bottom:28px;font-size:11px}#follow{bottom:90px;width:calc(100vw - 28px)}#panel{max-height:calc(100vh - 140px)}}
