*{box-sizing:border-box}:root{color:#18202a;font-synthesis:none;text-rendering:optimizelegibility;letter-spacing:0;background:#f4f6f8;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}body{background:#f4f6f8;min-width:320px;min-height:100vh;margin:0}button,input{font:inherit;letter-spacing:0}button{color:inherit}button:focus-visible,input:focus-visible{outline-offset:2px;outline:3px solid #2563eb40}.app-shell{min-height:100vh}.app-header{background:#fff;border-bottom:1px solid #d9dee5;justify-content:space-between;align-items:center;height:58px;padding:0 22px;display:flex}.brand-lockup{align-items:center;gap:11px;font-size:15px;font-weight:750;display:inline-flex}.brand-signal{background:#252b32;border-radius:6px;flex-direction:column;justify-content:center;align-items:center;gap:2px;width:25px;height:30px;display:flex}.brand-signal i{border-radius:50%;width:5px;height:5px;display:block}.brand-signal i:first-child{background:#ef4444}.brand-signal i:nth-child(2){background:#facc15}.brand-signal i:nth-child(3){background:#22c55e}.language-control{color:#66717f;align-items:center;gap:3px;display:flex}.language-control svg{margin-right:5px}.language-control button{color:#66717f;cursor:pointer;background:0 0;border:0;border-radius:5px;min-height:32px;padding:0 9px;font-size:12px}.language-control button.active{color:#18202a;background:#edf2f7;font-weight:700}.workspace{grid-template-columns:minmax(0,1fr) 350px;min-height:calc(100vh - 58px);display:grid}.simulation-workspace{flex-direction:column;min-width:0;padding:18px 22px 22px;display:flex}.scene-toolbar{flex:0 0 43px;justify-content:space-between;align-items:flex-start;gap:18px;height:43px;display:flex}.topology-selector,.segmented{background:#e9edf2;border-radius:7px;grid-auto-columns:1fr;grid-auto-flow:column;padding:3px;display:grid}.topology-selector button,.segmented button{color:#596574;cursor:pointer;white-space:nowrap;background:0 0;border:0;border-radius:5px;min-width:0;min-height:31px;padding:0 13px;font-size:12px}.topology-selector button.active,.segmented button.active{color:#18202a;background:#fff;font-weight:700;box-shadow:0 1px 3px #161d2521}.run-status{color:#66717f;white-space:nowrap;justify-content:flex-end;align-items:center;gap:7px;min-height:34px;font-size:12px;display:flex}.status-dot{background:#94a3b8;border-radius:50%;width:7px;height:7px}.status-dot.running{background:#22c55e;box-shadow:0 0 0 4px #22c55e21}.cycle-status{font-variant-numeric:tabular-nums;border-left:1px solid #d9dee5;margin-left:7px;padding-left:12px}.scene-frame{flex:1;place-items:center;min-height:0;display:grid;overflow:hidden}.intersection-canvas{aspect-ratio:1;border-radius:8px;width:min(100%,100vh - 132px);max-height:calc(100vh - 132px);display:block;box-shadow:0 14px 35px #212a341f}.scene-ground{fill:#e5e9e3}.road,.intersection-core{fill:#343a42}.lane-divider{stroke:#ffffff7a;stroke-width:3px;stroke-dasharray:18 16}.stop-line{stroke:#f8fafc;stroke-width:7px}.turn-guide{fill:none;stroke:#ffffff61;stroke-width:3px;stroke-linecap:round;stroke-linejoin:round}.route-path{fill:none;stroke:#ffffff12;stroke-width:2px;stroke-dasharray:7 10}.route-path.active{stroke:#4ade8078;stroke-width:3px}.vehicle{stroke:#00000047;stroke-width:1px}.vehicle.vehicle-0{fill:#3b82f6}.vehicle.vehicle-1{fill:#f8fafc}.vehicle.vehicle-2{fill:#f97316}.vehicle.vehicle-3{fill:#14b8a6}.vehicle.vehicle-4{fill:#eab308}.signal-head>rect{fill:#20262d;stroke:#ffffff29;stroke-width:1px}.signal-arm-label{fill:#cbd5e1;text-anchor:middle;font-size:10px;font-weight:800}.movement-symbol{fill:#e2e8f0;text-anchor:middle;font-size:13px;font-weight:700}.signal-lamp{stroke:#ffffff17;stroke-width:1px}.signal-lamp.red{fill:#532b30}.signal-lamp.yellow{fill:#574f27}.signal-lamp.green{fill:#214f35}.signal-lamp.red.on{fill:#ef4444;filter:drop-shadow(0 0 4px #ef4444b3)}.signal-lamp.yellow.on{fill:#facc15;filter:drop-shadow(0 0 4px #facc15b3)}.signal-lamp.green.on{fill:#22c55e;filter:drop-shadow(0 0 4px #22c55eb3)}.signal-countdown{fill:#f8fafc;text-anchor:middle;font-variant-numeric:tabular-nums;font-size:12px;font-weight:800}.entrance-badge{fill:#fffffff2;stroke:#1d27322e}.entrance-labels text{fill:#1f2937;text-anchor:middle;font-size:14px;font-weight:850}.control-panel{background:#fff;border-left:1px solid #d9dee5;min-width:0;padding:20px 22px}.control-panel section{border-bottom:1px solid #e7ebef;padding:18px 0}.control-panel section:first-child{padding-top:0}.control-panel h2{color:#3b4654;text-transform:uppercase;margin:0 0 12px;font-size:12px;font-weight:800}.phase-summary{justify-content:space-between;align-items:center;gap:16px;min-height:88px;display:flex}.phase-summary>div:first-child{flex-direction:column;gap:4px;min-width:0;display:flex}.phase-summary strong{font-size:21px;line-height:1.2}.phase-summary span:last-child{color:#66717f;font-size:12px}.section-kicker{color:#66717f;text-transform:uppercase;font-size:11px;font-weight:700}.phase-timer{color:#166534;font-variant-numeric:tabular-nums;background:#dcfce7;border-radius:8px;flex:0 0 62px;grid-template-columns:auto auto;place-content:center;gap:2px;width:62px;height:62px;font-size:27px;font-weight:850;display:grid}.phase-timer.yellow{color:#854d0e;background:#fef9c3}.phase-timer.all-red{color:#991b1b;background:#fee2e2}.phase-timer small{align-self:end;margin-bottom:5px;font-size:10px;font-weight:700}.playback-row,.icon-actions{align-items:center;display:flex}.playback-row{justify-content:space-between;gap:12px}.icon-actions{gap:6px}.icon-actions button{cursor:pointer;background:#fff;border:1px solid #d9dee5;border-radius:6px;place-items:center;width:36px;height:36px;padding:0;display:grid}.icon-actions button:hover{background:#f3f5f7}.icon-actions button.primary-icon{color:#fff;background:#27323e;border-color:#27323e}.segmented.compact button{padding:0 9px}.countdown-options{width:100%}.section-heading-row{justify-content:space-between;align-items:center;gap:12px;display:flex}.section-heading-row h2{margin-bottom:0}.text-action{color:#2563eb;cursor:pointer;background:0 0;border:0;padding:4px 0;font-size:11px;font-weight:700}.timing-fields{gap:10px;margin-top:12px;display:grid}.timing-fields label{color:#4b5563;justify-content:space-between;align-items:center;gap:12px;min-height:36px;font-size:12px;display:flex}.number-field{background:#fafbfc;border:1px solid #d9dee5;border-radius:6px;flex:0 0 99px;align-items:center;width:99px;height:34px;display:flex;overflow:hidden}.number-field input{color:#18202a;font-variant-numeric:tabular-nums;background:0 0;border:0;outline:0;width:59px;height:100%;padding:0 5px 0 9px;font-weight:700}.number-field small{color:#66717f;font-size:10px}.educational-note{color:#66717f;margin:18px 0 0;font-size:11px;line-height:1.5}@media (width<=980px){.workspace{grid-template-columns:1fr}.simulation-workspace{min-height:auto}.scene-frame{min-height:min(720px,100vh - 138px)}.intersection-canvas{width:min(100%,720px);max-height:none}.control-panel{border-top:1px solid #d9dee5;border-left:0;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 28px;display:grid}.control-panel section:first-child{padding-top:18px}.control-panel .educational-note{grid-column:1/-1}}@media (width<=620px){.app-header{height:54px;padding:0 14px}.brand-lockup{font-size:14px}.language-control svg{display:none}.language-control button{padding:0 6px;font-size:11px}.simulation-workspace{padding:12px}.scene-toolbar{flex-direction:column;flex-basis:auto;align-items:stretch;gap:8px;height:auto;margin-bottom:10px}.topology-selector{width:100%}.run-status{justify-content:flex-start;min-height:24px}.scene-frame{min-height:0}.intersection-canvas{width:100%}.control-panel{grid-template-columns:1fr;padding:16px}.control-panel .educational-note{grid-column:auto}.playback-row{flex-wrap:wrap;align-items:flex-start}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important}}