:root{--purple: #7b388c;--purple-dark: #5a1b6e;--purple-mid: #6b2c7c;--purple-light: #a064b8;--purple-xlight: #ead6f5;--purple-bg: #f7f0fb;--surface: #ffffff;--surface-raised: #fdfbfe;--border: #dcc7ec;--border-light: #eee0f7;--text: #1a0b26;--text-mid: #4a2e5c;--text-muted: #856694;--track-color: #d84315;--track-bg: #fbe9e7;--track-border: #ffccbc;--gold: #f59e0b;--green: #16a34a;--red: #dc2626;--blue: #1d4ed8;--predicted-color: #1d4ed8;--badge-success-bg: #dcfce7;--badge-success-color: var(--green);--badge-danger-bg: #fee2e2;--badge-danger-color: var(--red);--badge-warning-bg: #fef3c7;--badge-warning-color: #92400e;--sev-info: #60a5fa;--sev-warning: #f59e0b;--sev-severe: #ef4444;--sev-info-bg: #eff6ff;--sev-info-color: #1d4ed8;--sev-warning-bg: #fffbeb;--sev-warning-color: #92400e;--sev-severe-bg: #fef2f2;--sev-severe-color: #991b1b;--error-bg: #fef2f2;--error-border: #fecaca;--tab-bar-shadow: 0 -2px 10px rgba(80, 20, 100, .09);--fav-card-shadow: 0 2px 8px rgba(123, 56, 140, .12);--radius-sm: 8px;--radius-md: 12px;--radius-lg: 16px;--shadow-sm: 0 1px 3px rgba(80, 20, 100, .1);--shadow-md: 0 4px 12px rgba(80, 20, 100, .14)}@media (prefers-color-scheme: dark){:root{--purple: #9b58ac;--purple-mid: #864b97;--purple-light: #b478c8;--purple-xlight: #3d2150;--purple-bg: #0e0814;--surface: #1a1024;--surface-raised: #251635;--border: #3a2447;--border-light: #2a1837;--text: #f0e5fa;--text-mid: #c0aad4;--text-muted: #8c759f;--green: #4ade80;--red: #f87171;--gold: #fbbf24;--blue: #60a5fa;--predicted-color: #60a5fa;--track-color: #fb7c4d;--track-bg: #2a1408;--track-border: #4a2614;--badge-success-bg: #143020;--badge-success-color: #4ade80;--badge-danger-bg: #3a1212;--badge-danger-color: #f87171;--badge-warning-bg: #2a1f08;--badge-warning-color: #fbbf24;--sev-info: #60a5fa;--sev-warning: #fbbf24;--sev-severe: #f87171;--sev-info-bg: #122638;--sev-info-color: #93c5fd;--sev-warning-bg: #2a1f08;--sev-warning-color: #fbbf24;--sev-severe-bg: #3a1212;--sev-severe-color: #fca5a5;--error-bg: #2a0d0d;--error-border: #4a1818;--tab-bar-shadow: 0 -2px 10px rgba(0, 0, 0, .4);--fav-card-shadow: 0 2px 8px rgba(0, 0, 0, .5);--shadow-sm: 0 1px 3px rgba(0, 0, 0, .5);--shadow-md: 0 4px 12px rgba(0, 0, 0, .5)}}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{height:100%}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:var(--purple-bg);color:var(--text);min-height:100%;-webkit-font-smoothing:antialiased}button{font:inherit;cursor:pointer;border:none;background:none;padding:0}.app-header{position:sticky;top:0;z-index:100;background:var(--purple);color:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 16px;padding-top:env(safe-area-inset-top);height:calc(56px + env(safe-area-inset-top));box-shadow:0 2px 8px #00000040}.header-left{display:flex;align-items:center;gap:10px}.header-icon{width:28px;height:28px;color:#fff;flex-shrink:0}.app-header h1{font-size:1.05rem;font-weight:700;letter-spacing:-.01em;white-space:nowrap}.icon-btn{width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;color:#fff;transition:background .15s;flex-shrink:0;text-decoration:none}.icon-btn:hover{background:#ffffff26}.icon-btn:active{background:#ffffff40}.icon-btn svg{width:20px;height:20px}.schedules-btn{width:auto;padding:0 12px;border-radius:20px;gap:6px;font-size:.82rem;font-weight:600;border:1px solid rgba(255,255,255,.35)}#status-bar{background:var(--purple-dark);color:#ffffffd9;font-size:.75rem;padding:6px 16px;display:flex;align-items:center;justify-content:space-between;gap:8px}.status-text{flex:1}.refresh-btn{display:flex;align-items:center;gap:5px;color:#ffffffe6;font-size:.75rem;font-weight:500;padding:4px 10px;border-radius:12px;border:1px solid rgba(255,255,255,.25);transition:background .15s}.refresh-btn:hover{background:#ffffff1a}.refresh-btn svg{width:13px;height:13px}.refresh-btn.spinning svg{animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}#direction-filter:not(:empty){background:var(--purple-dark);padding:0 12px 8px}.dir-filter-bar{display:flex;gap:6px;max-width:700px;margin:0 auto}.dir-btn{flex:1;padding:5px 4px;border-radius:20px;border:1.5px solid rgba(255,255,255,.25);font-size:.8rem;font-weight:600;color:#ffffffbf;background:transparent;transition:border-color .15s,background .15s,color .15s}.dir-btn:hover{border-color:#ffffff80;color:#fff}.dir-btn.active{border-color:#fff;background:#fff3;color:#fff}.settings-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:200;background:#0a00148c;display:flex;align-items:flex-end;animation:fadeIn .2s ease}@keyframes fadeIn{0%{opacity:0}}.settings-sheet{background:var(--surface);border-radius:var(--radius-lg) var(--radius-lg) 0 0;padding:24px 20px calc(24px + env(safe-area-inset-bottom));width:100%;max-width:600px;margin:0 auto;animation:slideUp .25s ease;box-shadow:var(--shadow-md)}@keyframes slideUp{0%{transform:translateY(100%)}}.settings-sheet h2{font-size:1.1rem;font-weight:700;color:var(--purple);margin-bottom:20px;display:flex;align-items:center;gap:8px}.settings-sheet h2 svg{width:20px;height:20px}.settings-handle{width:40px;height:4px;background:var(--border);border-radius:2px;margin:0 auto 20px}.field-label{display:block;font-size:.8rem;font-weight:600;color:var(--text-mid);margin-bottom:6px;text-transform:uppercase;letter-spacing:.05em}.field-hint{font-size:.78rem;color:var(--text-muted);margin-top:6px;line-height:1.4}.field-hint a{color:var(--purple)}.text-input{width:100%;padding:12px 14px;border:1.5px solid var(--border);border-radius:var(--radius-sm);font-size:.9rem;font-family:SF Mono,Fira Code,monospace;background:var(--surface-raised);color:var(--text);transition:border-color .15s;outline:none}.text-input:focus{border-color:var(--purple)}.text-input-group{position:relative;display:flex;align-items:stretch}.text-input-group .text-input{padding-right:84px}.text-input-group .input-icon-btn{position:absolute;top:0;bottom:0;width:38px;display:flex;align-items:center;justify-content:center;color:var(--text-muted);border-radius:6px;transition:color .15s,background .15s}.text-input-group .input-icon-btn:hover:not(:disabled){color:var(--purple);background:var(--purple-xlight)}.text-input-group .input-icon-btn:disabled{opacity:.4;cursor:not-allowed}.text-input-group .input-icon-btn svg{width:18px;height:18px}.text-input-group .input-icon-btn:nth-of-type(1){right:42px}.text-input-group .input-icon-btn:nth-of-type(2){right:4px}.settings-actions{display:flex;gap:10px;margin-top:20px}.btn-primary{flex:1;background:var(--purple);color:#fff;font-weight:600;font-size:.95rem;padding:12px;border-radius:var(--radius-sm);transition:background .15s}.btn-primary:hover{background:var(--purple-mid)}.btn-primary:active{background:var(--purple-dark)}.btn-secondary{background:var(--purple-xlight);color:var(--purple-dark);font-weight:600;font-size:.875rem;padding:9px 16px;border-radius:var(--radius-sm);transition:background .15s}.btn-secondary:disabled{opacity:.6;cursor:not-allowed}.interval-btns{display:flex;gap:8px;margin-top:8px}.interval-btn{flex:1;padding:8px 4px;border-radius:var(--radius-sm);border:1.5px solid var(--border);font-size:.85rem;font-weight:600;color:var(--text-mid);background:var(--surface-raised);transition:border-color .15s,background .15s,color .15s}.interval-btn:hover{border-color:var(--purple-light);color:var(--purple)}.interval-btn.active{border-color:var(--purple);background:var(--purple-xlight);color:var(--purple)}.github-link{display:flex;align-items:center;justify-content:center;gap:7px;margin-top:20px;color:var(--text-muted);font-size:.8rem;text-decoration:none;transition:color .15s}.github-link:hover{color:var(--text)}.github-link svg{width:18px;height:18px;flex-shrink:0}.btn-secondary{background:var(--purple-xlight);color:var(--purple);font-weight:600;font-size:.95rem;padding:12px 20px;border-radius:var(--radius-sm);transition:background .15s}.btn-secondary:hover{background:var(--border)}.routes-list{padding:12px 12px calc(24px + env(safe-area-inset-bottom));max-width:700px;margin:0 auto;display:flex;flex-direction:column;gap:10px}.loading-routes{display:flex;flex-direction:column;align-items:center;gap:16px;padding:60px 20px;color:var(--text-muted)}.route-card{background:var(--surface);border-radius:var(--radius-md);box-shadow:var(--shadow-sm);overflow:hidden;border:1.5px solid var(--border-light);transition:box-shadow .2s}.route-card.is-favorite{border-color:var(--purple-xlight);box-shadow:var(--fav-card-shadow)}.route-header{display:flex;align-items:center;padding:14px 14px 14px 16px;gap:10px;cursor:pointer;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;transition:background .15s}.route-header:hover{background:var(--purple-bg)}.route-header:active{background:var(--purple-xlight)}.route-swatch{width:5px;height:28px;border-radius:3px;flex-shrink:0}.route-name{flex:1;font-size:.97rem;font-weight:600;color:var(--text);line-height:1.2}.route-dest{font-size:.75rem;color:var(--text-muted);font-weight:400}.fav-btn{width:36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.1rem;color:var(--text-muted);transition:color .15s,background .15s;flex-shrink:0}.fav-btn:hover{background:var(--purple-xlight);color:var(--gold)}.fav-btn.active{color:var(--gold)}.chevron-icon{width:18px;height:18px;color:var(--text-muted);transition:transform .2s;flex-shrink:0}.route-card.is-expanded .chevron-icon{transform:rotate(180deg)}.trip-list{border-top:1px solid var(--border-light)}.route-loading,.route-empty{padding:20px 16px;text-align:center;color:var(--text-muted);font-size:.85rem;border-top:1px solid var(--border-light)}.route-error{padding:14px 16px;background:var(--error-bg);color:var(--red);font-size:.82rem;border-top:1px solid var(--error-border)}.trip-card{border-bottom:1px solid var(--border-light)}.trip-card:last-child{border-bottom:none}.trip-card.is-favorite{border-left:3px solid var(--purple-light);background:var(--purple-bg)}.trip-header{display:flex;align-items:center;padding:12px 14px;gap:10px;cursor:pointer;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;transition:background .12s;min-height:56px}.trip-header:hover{background:var(--purple-bg)}.trip-header:active{background:var(--purple-xlight)}.trip-time-col{min-width:72px;text-align:right}.trip-time{font-size:1.05rem;font-weight:700;color:var(--text);line-height:1.1}.trip-countdown{font-size:.7rem;color:var(--text-muted);margin-top:1px}.trip-countdown.soon{color:var(--green);font-weight:600}.trip-info{flex:1;min-width:0}.trip-headsign{font-size:.9rem;font-weight:600;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.trip-name{font-size:.72rem;color:var(--text-muted);margin-top:2px}.trip-badges{display:flex;align-items:center;gap:6px;flex-shrink:0}.track-badge{background:var(--track-bg);color:var(--track-color);font-size:.72rem;font-weight:700;padding:3px 8px;border-radius:20px;border:1px solid var(--track-border);white-space:nowrap}.status-badge{font-size:.68rem;font-weight:600;padding:2px 7px;border-radius:20px;white-space:nowrap}.status-badge.on-time{background:var(--badge-success-bg);color:var(--badge-success-color)}.status-badge.delayed{background:var(--badge-danger-bg);color:var(--badge-danger-color)}.status-badge.boarding{background:var(--badge-warning-bg);color:var(--badge-warning-color)}.status-badge.other{background:var(--purple-xlight);color:var(--purple)}.live-dot{width:7px;height:7px;border-radius:50%;background:var(--green);flex-shrink:0;animation:pulse 2s ease-in-out infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.4}}.trip-chevron{width:16px;height:16px;color:var(--text-muted);transition:transform .2s;flex-shrink:0}.trip-card.is-expanded .trip-chevron{transform:rotate(180deg)}.stop-list{background:var(--purple-bg);border-top:1px solid var(--border-light);padding:4px 0}.stop-list-loading{padding:14px 16px;text-align:center;color:var(--text-muted);font-size:.82rem}.stop-row{display:flex;align-items:center;padding:9px 14px 9px 20px;gap:10px;cursor:pointer;transition:background .12s;-webkit-tap-highlight-color:transparent;position:relative}.stop-row:hover{background:var(--purple-xlight)}.stop-row.is-past{opacity:.45}.stop-row.is-favorite{background:linear-gradient(to right,rgba(245,158,11,.07),transparent)}.stop-row.is-favorite:before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--gold);border-radius:0 2px 2px 0}.stop-row.is-favorite:hover{background:#f59e0b1f}.stop-fav-icon{font-size:.85rem;color:var(--gold);flex-shrink:0;width:16px}.stop-name{flex:1;font-size:.88rem;color:var(--text);font-weight:400}.stop-row.is-favorite .stop-name{font-weight:600}.stop-track{font-size:.68rem;font-weight:700;color:var(--track-color);background:var(--track-bg);padding:2px 6px;border-radius:12px;border:1px solid var(--track-border)}.stop-time-col{text-align:right;min-width:68px;flex-shrink:0}.stop-time-pred{font-size:.88rem;font-weight:700;color:var(--predicted-color);display:block}.stop-time-sched{font-size:.88rem;color:var(--text-mid);display:block}.stop-time-pred+.stop-time-sched{font-size:.72rem;color:var(--text-muted);text-decoration:line-through}.stop-countdown{font-size:.68rem;color:var(--text-muted);display:block}.stop-countdown.soon{color:var(--green);font-weight:600}.stop-hint{padding:8px 16px 12px;font-size:.72rem;color:var(--text-muted);text-align:center}.spinner{width:28px;height:28px;border:2.5px solid var(--border);border-top-color:var(--purple);border-radius:50%;animation:spin .8s linear infinite}.tab-bar{position:fixed;bottom:0;left:0;right:0;background:var(--surface);border-top:1px solid var(--border-light);display:flex;padding-bottom:env(safe-area-inset-bottom);z-index:100;box-shadow:var(--tab-bar-shadow)}.tab-btn{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;padding:8px 4px 6px;color:var(--text-muted);font-size:.7rem;font-weight:600;transition:color .15s;position:relative;-webkit-tap-highlight-color:transparent}.tab-btn svg{width:23px;height:23px;transition:transform .15s}.tab-btn:active svg{transform:scale(.9)}.tab-btn.active{color:var(--purple)}.tab-btn.active svg{stroke:var(--purple)}.tab-badge{position:absolute;top:5px;left:calc(50% + 6px);background:var(--red);color:#fff;font-size:.6rem;font-weight:800;min-width:16px;height:16px;border-radius:8px;padding:0 4px;display:flex;align-items:center;justify-content:center;line-height:1}.routes-list,.alerts-list{padding-bottom:calc(64px + env(safe-area-inset-bottom))}.alerts-list{padding-top:12px;padding-left:12px;padding-right:12px;max-width:700px;margin:0 auto;display:flex;flex-direction:column;gap:10px}.alerts-list[hidden],.routes-list[hidden]{display:none}.alerts-empty{text-align:center;color:var(--text-muted);padding:60px 24px;font-size:.9rem;line-height:1.6}.alerts-empty svg{width:40px;height:40px;color:var(--border);margin-bottom:12px;display:block;margin-left:auto;margin-right:auto}.alert-card{background:var(--surface);border-radius:var(--radius-md);padding:14px 16px;box-shadow:var(--shadow-sm);border-left:4px solid var(--border);border-top:1px solid var(--border-light);border-right:1px solid var(--border-light);border-bottom:1px solid var(--border-light)}.alert-card.sev-info{border-left-color:var(--sev-info)}.alert-card.sev-warning{border-left-color:var(--sev-warning)}.alert-card.sev-severe{border-left-color:var(--sev-severe)}.alert-top-row{display:flex;align-items:center;gap:8px;margin-bottom:8px;flex-wrap:wrap}.alert-route-chip{display:flex;align-items:center;gap:5px;background:var(--purple-bg);padding:2px 8px 2px 4px;border-radius:20px;border:1px solid var(--border-light)}.alert-route-swatch{width:8px;height:8px;border-radius:50%;flex-shrink:0}.alert-route-name{font-size:.72rem;font-weight:600;color:var(--text-mid)}.alert-effect-badge{font-size:.67rem;font-weight:700;padding:2px 8px;border-radius:12px;text-transform:uppercase;letter-spacing:.04em;margin-left:auto;flex-shrink:0}.alert-effect-badge.sev-info{background:var(--sev-info-bg);color:var(--sev-info-color)}.alert-effect-badge.sev-warning{background:var(--sev-warning-bg);color:var(--sev-warning-color)}.alert-effect-badge.sev-severe{background:var(--sev-severe-bg);color:var(--sev-severe-color)}.alert-header{font-size:.9rem;color:var(--text);line-height:1.45;margin-bottom:6px}.alert-details{margin-top:4px}.alert-details summary{font-size:.78rem;color:var(--purple);font-weight:600;cursor:pointer;-webkit-user-select:none;user-select:none;list-style:none;display:flex;align-items:center;gap:4px}.alert-details summary:before{content:"▸";display:inline-block;transition:transform .15s}.alert-details[open] summary:before{transform:rotate(90deg)}.alert-details summary::-webkit-details-marker{display:none}.alert-desc{font-size:.82rem;color:var(--text-mid);line-height:1.55;margin-top:8px;white-space:pre-wrap}.alert-footer{margin-top:8px;font-size:.72rem;color:var(--text-muted);text-align:right}@media (min-width: 600px){.routes-list,.alerts-list{padding:16px;gap:12px}.route-header{padding:16px 16px 16px 18px}.trip-header{padding:14px 16px}.stop-row{padding:10px 16px 10px 24px}}