:root{color-scheme:dark;font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-size:16px;background:var(--bg);color:var(--text);--bg:#081521;--panel:#122a40;--soft:#18364f;--line:#ffffff26;--text:#f5f8fb;--muted:#aec3d3;--accent:#66e0b5;--accent-ink:#082018;--warning:#ffd782;--route-bg:#ffd34e;--route-ink:#152031;--header:linear-gradient(135deg,#173a57,#10263d 65%);--shadow:#0003;--status-bg:#66e0b515;--warning-bg:#ffd78214}
html[data-theme=light]{color-scheme:light;--bg:#edf3f8;--panel:#fff;--soft:#e2edf5;--line:#153a5626;--text:#10263d;--muted:#426078;--accent:#06684d;--accent-ink:#fff;--warning:#8d4700;--header:linear-gradient(135deg,#d9ebf5,#eff6fa 65%);--shadow:#163d5515;--status-bg:#08744f0e;--warning-bg:#b9690611}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:var(--bg)}body{min-width:280px}button,select{font:inherit}button,a,select,input{touch-action:manipulation}button{cursor:pointer}button:focus-visible,a:focus-visible,select:focus-visible,summary:focus-visible,input:focus-visible{outline:3px solid var(--warning);outline-offset:3px}[hidden]{display:none!important}
.topbar{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:12px;padding:18px max(16px,env(safe-area-inset-left)) 14px;background:var(--header);border-bottom:1px solid var(--line)}.eyebrow{margin:0 0 5px;color:var(--accent);font-size:.875rem;font-weight:800;letter-spacing:.08em}h1{margin:0;font-size:2.125rem;line-height:1.12;overflow-wrap:anywhere}h1>span{font-size:1rem;color:var(--muted);vertical-align:middle}.clock{text-align:right;display:grid;gap:5px}.clock strong{font-size:1.875rem;line-height:1;white-space:nowrap}.clock span{color:var(--muted);font-size:.8125rem;max-width:170px;overflow-wrap:anywhere}
.toolbar{display:flex;align-items:end;justify-content:space-between;gap:10px;padding:10px 12px;max-width:1000px;margin:auto}.language-control{display:flex;align-items:center;flex-wrap:wrap;gap:6px;font-size:.8125rem;color:var(--muted)}select{display:block;max-width:100%;min-height:44px;padding:8px 28px 8px 10px;border:1px solid var(--line);border-radius:10px;background:var(--panel);color:var(--text)}.language-control select{font-size:1rem;min-width:108px}.settings-button{display:flex;align-items:center;justify-content:center;gap:6px;min-height:44px;max-width:50%;padding:8px 10px;border:1px solid var(--line);border-radius:10px;background:var(--panel);color:var(--text);font-size:.8125rem;line-height:1.3}.settings-button>span:first-child{font-size:1.25rem}.settings-panel{max-width:976px;margin:0 auto 10px;padding:16px;border:1px solid var(--line);border-radius:12px;background:var(--panel)}.settings-panel h2{margin:0 0 12px;font-size:1.125rem}.setting-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.setting-fields label{display:grid;gap:7px;color:var(--muted);font-size:.875rem}.setting-fields select{width:100%;color:var(--text)}.optout{display:flex;align-items:center;gap:10px;min-height:44px;margin-top:12px;font-size:.875rem;line-height:1.5}.optout input{width:20px;height:20px;flex-shrink:0;accent-color:var(--accent)}.settings-note{color:var(--muted);font-size:.8125rem;margin:8px 0 0;line-height:1.5}
.tabs{position:sticky;top:0;z-index:5;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) 48px;gap:8px;padding:10px 12px;background:var(--bg);border-bottom:1px solid var(--line)}.tab,.refresh{min-height:44px;border:1px solid var(--line);border-radius:12px;background:var(--panel);color:var(--muted);font-weight:800;padding:8px 6px;overflow-wrap:anywhere}.tab.active{background:var(--accent);color:var(--accent-ink);border-color:var(--accent)}.refresh{color:var(--accent);font-size:1.5rem}.refresh[disabled]{opacity:.5;cursor:progress}
main{max-width:1000px;padding:12px;margin:auto}.connection{display:flex;align-items:center;gap:10px;margin-bottom:12px;min-height:44px;padding:10px 12px;border-radius:10px;background:var(--status-bg);color:var(--accent);font-size:.875rem;line-height:1.5}.connection.error{color:var(--warning);background:var(--warning-bg)}.live-dot{flex:0 0 9px;height:9px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 4px var(--status-bg)}.live-dot[data-state=error]{background:#d64545;box-shadow:0 0 0 4px #d645451c}.live-dot[data-state=loading]{animation:pulse 1s ease-in-out infinite}@keyframes pulse{50%{opacity:.35}}
.stop-card{overflow:hidden;border:1px solid var(--line);border-radius:16px;background:var(--panel);box-shadow:0 10px 25px var(--shadow)}.stop-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 16px;background:var(--soft)}.direction{color:var(--accent);font-size:.875rem;font-weight:800}h2{margin:3px 0 0;font-size:1.375rem}.stop-code{min-width:58px;padding:8px;border-radius:9px;background:var(--bg);text-align:center;font-weight:900;font-size:1.125rem}.route-hint{margin:0;padding:9px 14px;color:var(--muted);font-size:.8125rem;line-height:1.5}.arrival-list{display:grid}.arrival{width:100%;text-align:left;display:grid;grid-template-columns:4rem minmax(0,1fr) minmax(0,auto);align-items:center;gap:12px;min-height:78px;padding:12px 14px;border:0;border-top:1px solid var(--line);color:var(--text);background:var(--panel)}.arrival:hover{background:var(--soft)}.arrival:focus-visible{outline-offset:-3px}.route{display:grid;place-items:center;min-height:44px;padding:4px;border-radius:11px;background:var(--route-bg);color:var(--route-ink);font-size:1.1875rem;font-weight:900;white-space:nowrap}.route-name{font-size:1rem;font-weight:650;overflow-wrap:anywhere}.times{display:grid;justify-items:end;gap:4px;text-align:right;max-width:min(210px,42vw)}.times strong{color:var(--accent);font-size:1.5rem;line-height:1.16;overflow-wrap:anywhere}.times span{color:var(--muted);font-size:.875rem;line-height:1.4;overflow-wrap:anywhere}.times.stale strong{color:var(--warning);font-size:1rem}.message{margin:0;padding:14px 16px;color:var(--warning);line-height:1.5;border-bottom:1px solid var(--line)}.empty{margin:0;padding:24px 16px;color:var(--muted);line-height:1.5}.updated{padding:10px 14px;color:var(--muted);font-size:.8125rem;text-align:right;line-height:1.5}.source{margin:16px 4px;color:var(--muted);font-size:.8125rem;text-align:center;line-height:1.5}
.map-card{overflow:hidden;border:1px solid var(--line);border-radius:16px;background:var(--panel)}.map-selection{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:10px 12px;min-height:44px;font-size:.875rem;font-weight:750}.map-selection button{min-height:44px;padding:7px 10px;border:1px solid var(--line);border-radius:10px;background:var(--soft);color:var(--accent);font-size:.8125rem}#liveMap{width:100%;height:65vh;min-height:320px;max-height:800px;background:#d9e8ee}.map-status{padding:12px 14px;margin:0;font-size:.875rem;color:var(--accent);line-height:1.5}.map-status.error{color:var(--warning)}.map-legend{display:flex;flex-wrap:wrap;gap:7px;padding:0 12px 14px}.map-legend button{min-height:44px;padding:8px 10px;border:1px solid var(--line);border-radius:10px;color:var(--text);background:var(--soft);font-size:.875rem;max-width:100%;overflow-wrap:anywhere}.map-legend button[aria-pressed=true]{border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent)}.map-legend i{display:inline-block;width:16px;height:3px;margin-right:6px;vertical-align:middle}.stop-pin{display:grid;place-items:center;min-width:50px;height:32px;padding:4px 7px;border:2px solid #fff;border-radius:9px;background:#10263d;color:#fff;font-size:.875rem;font-weight:800}.bus-pin{display:grid;place-items:center;min-width:48px;height:30px;padding:4px 6px;border:2px solid #fff;border-radius:8px;background:var(--bus-color);color:#10263d;font-weight:900;font-size:.875rem;box-shadow:0 2px 6px #0005}.leaflet-popup-content,.leaflet-tooltip{color:#10263d;font-size:.875rem}.leaflet-control-attribution{font-size:12px}
.opposite-stop{display:flex;align-items:center;gap:12px;min-height:66px;padding:12px 14px;margin-top:14px;border:1px solid var(--line);border-radius:12px;background:var(--panel);color:var(--text);text-decoration:none}.opposite-icon{color:var(--accent);font-size:1.5rem}.opposite-stop>span:nth-child(2){display:grid;gap:4px;flex:1;min-width:0;font-size:.875rem;overflow-wrap:anywhere}.opposite-stop strong{font-size:.9375rem}.opposite-stop #oppositeDescription{color:var(--muted)}
.notices-panel,.privacy-panel{border:1px solid var(--line);border-radius:12px;padding:0 14px;background:var(--panel);margin-top:12px;font-size:.875rem;line-height:1.5}.notices-panel summary,.privacy-panel summary{cursor:pointer;min-height:48px;padding:13px 0;color:var(--text);font-weight:750}.notice-count{display:inline-block;padding:0 8px;margin-left:8px;border-radius:16px;background:var(--warning-bg);color:var(--warning)}.notices-status{color:var(--muted);margin:0 0 12px}.notice{padding:12px 0;border-top:1px solid var(--line)}.notice h3{font-size:.9375rem;margin:7px 0;overflow-wrap:anywhere}.notice-tag{font-size:.75rem;padding:3px 7px;background:var(--warning-bg);color:var(--warning);border-radius:7px}.notice-scope{color:var(--muted);font-size:.8125rem;margin:5px 0}.notice p{white-space:pre-line;overflow-wrap:anywhere}.notice details summary{min-height:44px;padding:10px 0;font-size:.8125rem;color:var(--accent)}.official-link{display:inline-block;min-height:44px;padding:10px 0;color:var(--accent);font-weight:650}.privacy-panel{font-size:.8125rem;background:transparent;border:0;color:var(--muted);padding:0 4px}.privacy-panel summary{color:var(--muted);font-weight:500}.privacy-panel p{margin:0 0 12px}
@media(max-width:420px){.topbar{padding:16px 12px}h1{font-size:1.75rem}.clock strong{font-size:1.5rem}.clock span{max-width:120px}.arrival{gap:9px;padding:11px 10px}.route-name{font-size:.9375rem}.times strong{font-size:1.25rem}.settings-button{max-width:47%}.language-control>span{display:none}.setting-fields{gap:8px}}
@media(max-width:350px){.arrival{grid-template-columns:3.5rem minmax(0,1fr);gap:8px}.times{grid-column:2;justify-items:start;text-align:left;max-width:none}.route{grid-row:span 2}.settings-button>span:last-child{display:none}.settings-button{min-width:44px}.setting-fields{grid-template-columns:1fr}}
@media(max-width:450px){html[data-text=large] .arrival{grid-template-columns:3.5rem minmax(0,1fr)}html[data-text=large] .times{grid-column:2;justify-items:start;text-align:left;max-width:none}html[data-text=large] .route{grid-row:span 2}}
@media(prefers-reduced-motion:reduce){.live-dot[data-state=loading]{animation:none}}