.header{display:flex;justify-content:space-between;align-items:flex-start;padding:8px 16px;padding-top:calc(8px + env(safe-area-inset-top))}.header__title{display:flex;align-items:center}.header__time{font-size:28px;font-weight:700;color:var(--text);margin:0;font-family:var(--font-mono);letter-spacing:-.02em}.header__meta{display:flex;align-items:center;gap:8px}.header__updated{display:flex;flex-direction:column;align-items:flex-end}.header__updated-label{font-size:8px;color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em}.header__updated-time{font-size:10px;color:var(--text-muted);font-family:var(--font-mono)}.header__error{font-size:14px;color:var(--status-late);cursor:help}.header__refresh{width:36px;height:36px;border:none;background:var(--card-bg);border-radius:10px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background .15s ease,transform .15s ease;color:var(--text)}.header__refresh:hover{background:var(--card-bg-highlight)}.header__refresh:active{transform:scale(.95)}.header__refresh:disabled{opacity:.5;cursor:not-allowed}.header__refresh-icon{width:20px;height:20px}.header__refresh--loading .header__refresh-icon{animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.departure-card{background:var(--card-bg);border-radius:10px;padding:6px 12px;margin-bottom:5px;border-left:3px solid var(--accent);transition:transform .15s ease}.departure-card:active{transform:scale(.98)}.departure-card--last{border-left-color:#ff69b4;background:#ff69b41a}.departure-card--last .departure-card__route,.departure-card--last .departure-card__kind{color:#ff69b4}.departure-card--next{border-left-color:var(--accent);background:var(--card-bg-highlight)}.departure-card--next2{border-left-color:var(--secondary)}.departure-card__header{display:flex;justify-content:space-between;align-items:center;margin-bottom:3px}.departure-card__kind{font-size:8px;font-weight:700;letter-spacing:.1em;color:var(--text-muted);text-transform:uppercase}.departure-card__route{font-size:16px;font-weight:800;color:var(--accent);font-family:var(--font-mono)}.departure-card__times{display:flex;gap:12px;align-items:flex-end;margin-bottom:2px}.departure-card__scheduled,.departure-card__realtime{display:flex;flex-direction:column}.departure-card__time-label{font-size:8px;color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em;margin-bottom:0}.departure-card__time-value{font-size:18px;font-weight:700;font-family:var(--font-mono);color:var(--text);letter-spacing:-.02em}.departure-card__realtime .departure-card__time-value{color:var(--accent)}.departure-card__countdown{display:flex;align-items:center;margin-left:auto;margin-right:8px}.departure-card__countdown-value{font-size:16px;font-weight:800;color:var(--accent);font-family:var(--font-mono);background:#00ff8826;padding:2px 8px;border-radius:8px}.departure-card--last .departure-card__countdown{display:none}.departure-card__status{font-size:10px;font-weight:600;padding:2px 6px;border-radius:10px}.departure-card__status--on-time{background:var(--status-ontime-bg);color:var(--status-ontime)}.departure-card__status--early{background:var(--status-early-bg);color:var(--status-early)}.departure-card__status--late{background:var(--status-late-bg);color:var(--status-late)}.departure-card__headsign{font-size:10px;color:var(--text-muted)}.spinner{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:60px 20px;gap:20px}.spinner__tram{width:64px;height:64px;animation:bounce .8s ease-in-out infinite}.spinner__tram svg{width:100%;height:100%}.spinner__text{font-size:14px;color:var(--text-muted)}@keyframes bounce{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}.tram-map{flex:1 1 auto;min-height:200px;border-radius:16px 16px 0 0;overflow:hidden;margin-top:8px;display:flex;flex-direction:column}.tram-map__container{width:100%;flex:1 1 auto;min-height:200px;background:var(--bg)}.leaflet-container{width:100%!important;height:100%!important;min-height:200px}.tram-map--error{display:flex;align-items:center;justify-content:center;background:var(--card-bg);color:var(--text-muted);font-size:14px}.tram-marker{background:none;border:none}.tram-marker__inner{width:40px;height:40px;filter:drop-shadow(0 2px 4px rgba(0,0,0,.4));transition:transform .3s ease}.tram-marker__inner svg{width:100%;height:100%}.tram-marker__label{position:absolute;bottom:-4px;left:50%;transform:translate(-50%);background:var(--bg);color:var(--text);font-size:10px;font-weight:700;font-family:var(--font-mono);padding:1px 4px;border-radius:4px;white-space:nowrap}.tram-marker--other .tram-marker__inner{opacity:.5}.tram-marker--other .tram-marker__label{opacity:.7}.tram-marker--tracked .tram-marker__inner{filter:drop-shadow(0 2px 6px rgba(0,0,0,.5))}.tram-marker--away .tram-marker__inner{opacity:.3;width:24px;height:24px}.tram-marker--away .tram-marker__label{opacity:.3;font-size:8px}.leaflet-popup-content-wrapper{background:var(--card-bg);color:var(--text);border-radius:12px;box-shadow:0 4px 20px #0000004d}.leaflet-popup-tip{background:var(--card-bg)}.leaflet-popup-content{margin:12px 16px;font-size:13px;line-height:1.5}.leaflet-popup-close-button{color:var(--text-muted)!important}.leaflet-control-attribution{background:#0a0a0fb3!important;color:var(--text-muted)!important;font-size:10px;padding:2px 6px!important}.leaflet-control-attribution a{color:var(--accent)!important}.app{display:flex;flex-direction:column;min-height:100vh;min-height:100dvh;background:var(--bg)}.app__content{flex:1 1 auto;display:flex;flex-direction:column;padding:0 12px;padding-bottom:env(safe-area-inset-bottom);min-height:0}.app__departures{flex:0 0 auto;max-height:45vh;overflow-y:auto}.app__empty{text-align:center;padding:40px 20px;color:var(--text-muted);font-size:14px}.app__error{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:60px 20px;gap:16px;text-align:center}.app__error p{color:var(--text-muted);margin:0}.app__error button{background:var(--accent);color:#fff;border:none;padding:12px 24px;border-radius:8px;font-size:14px;font-weight:600;cursor:pointer;transition:opacity .15s ease}.app__error button:hover{opacity:.9}.app__error button:active{transform:scale(.98)}:root{--font-sans: "SF Pro Display", -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;--font-mono: "SF Mono", "Menlo", "Monaco", "Consolas", monospace;--bg: #0a0a0f;--card-bg: #14141c;--card-bg-highlight: #1a1a26;--text: #f0f0f5;--text-muted: #6b6b80;--accent: #00d4aa;--secondary: #7c8aff;--muted: #4a4a5a;--status-ontime: #00d4aa;--status-ontime-bg: rgba(0, 212, 170, .15);--status-early: #7c8aff;--status-early-bg: rgba(124, 138, 255, .15);--status-late: #ff6b8a;--status-late-bg: rgba(255, 107, 138, .15)}@media(prefers-color-scheme:light){:root{--bg: #f8f9fa;--card-bg: #ffffff;--card-bg-highlight: #f0f2f5;--text: #1a1a2e;--text-muted: #6b7280;--accent: #00a884;--secondary: #5b67e8;--muted: #9ca3af;--status-ontime: #00a884;--status-ontime-bg: rgba(0, 168, 132, .1);--status-early: #5b67e8;--status-early-bg: rgba(91, 103, 232, .1);--status-late: #e8445a;--status-late-bg: rgba(232, 68, 90, .1)}}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{-webkit-text-size-adjust:100%;-webkit-tap-highlight-color:transparent}body{font-family:var(--font-sans);font-size:16px;line-height:1.5;color:var(--text);background:var(--bg);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden}@supports (padding: max(0px)){body{padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right)}}html{overscroll-behavior-y:contain}button{font-family:inherit}a{color:var(--accent);text-decoration:none}@media(prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}