@layer base, layout, components, screens, responsive;
@layer base {
  :root { color-scheme:light; --paper:#f5f6fb; --white:#fff; --ink:#252347; --muted:#676780; --violet:#5146bc; --violet-deep:#4235a6; --lavender:#eae8fa; --line:#dfe2ee; --green:#4d7422; --green-light:#eef6e7; --j:#b6cf30; --amber:#865513; --amber-light:#fff4df; --red:#ad3344; --red-light:#fff0f1; --radius:22px; font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; font-synthesis:none; }
  * { box-sizing:border-box; }
  html { min-height:100%; background:var(--paper); -webkit-text-size-adjust:100%; }
  body { margin:0; color:var(--ink); font-size:16px; line-height:1.5; -webkit-font-smoothing:antialiased; }
  button,input { font:inherit; }
  button,a,input,summary { -webkit-tap-highlight-color:transparent; }
  button { cursor:pointer; }
  button:disabled { cursor:default; opacity:.65; }
  a { color:var(--violet); text-underline-offset:3px; }
  button:focus-visible,a:focus-visible,input:focus-visible,summary:focus-visible { outline:3px solid #897bdc; outline-offset:4px; }
  h1,h2,h3,p { margin-top:0; }
  h1 { font-size:clamp(28px,6.8vw,37px); line-height:1.15; letter-spacing:-1.15px; font-weight:730; margin-bottom:0; }
  h2 { font-size:17px;line-height:1.3;letter-spacing:-.3px;margin-bottom:0; }
  h3 { font-size:18px;line-height:1.3;letter-spacing:-.3px; }
  p { max-width:66ch; }
  [hidden] { display:none!important; }
  .sr-only { position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0; }
  .skip-link { position:fixed;left:16px;top:-80px;padding:12px;background:var(--white);z-index:20; }.skip-link:focus {top:12px;}
  .icon { width:22px;height:22px;flex:none;vertical-align:middle; }
  .boot { min-height:85dvh;display:flex;align-items:center;justify-content:center;flex-direction:column;padding:32px;gap:20px;text-align:center; }.boot p {color:var(--muted);}.boot .notice {text-align:left;}
}
@layer layout {
  .app-shell,.auth-shell { max-width:720px;margin:0 auto; }
  .app-header { height:95px;display:flex;align-items:center;justify-content:space-between;padding:env(safe-area-inset-top) 26px 0;gap:20px; }
  .brand { display:flex;align-items:center;gap:9px;text-decoration:none;color:var(--ink);font-weight:800;font-size:27px;letter-spacing:-1.4px; }.brand img {border-radius:10px;}.brand-period {color:var(--violet);}
  .today { font-size:13px;font-weight:600;color:var(--muted);white-space:nowrap; }
  .main-content { padding:22px 26px calc(114px + env(safe-area-inset-bottom));outline:none; }
  .page-heading { display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:28px; }
  .page-kicker { font-size:14px;color:var(--muted);margin-bottom:8px; }
  .bottom-nav { position:fixed;bottom:0;left:50%;transform:translateX(-50%);width:min(100%,720px);padding:10px 28px calc(10px + env(safe-area-inset-bottom));min-height:80px;display:flex;gap:12px;z-index:10;background:rgba(255,255,255,.96);border-top:1px solid var(--line); }
  .bottom-nav button { display:flex;flex:1;flex-direction:column;gap:4px;align-items:center;justify-content:center;min-height:54px;border:0;border-radius:14px;background:transparent;color:var(--muted);font-size:12px;font-weight:600; }
  .bottom-nav button[aria-current] { background:var(--lavender);color:var(--violet-deep); }.bottom-nav .icon {width:23px;height:23px;}
  .network-banner { display:flex;gap:10px;align-items:center;background:var(--amber-light);color:var(--amber);font-size:14px;padding:12px 26px; }
}
@layer components {
  .button { min-height:48px;padding:12px 18px;display:inline-flex;align-items:center;justify-content:center;gap:10px;border:0;border-radius:13px;line-height:1.35;font-size:15px;font-weight:650;text-decoration:none; }
  .primary { color:var(--white);background:var(--violet); }.primary:hover:not(:disabled) {background:var(--violet-deep);}
  .secondary { background:var(--lavender);color:var(--violet-deep); }.secondary:hover {background:#dfdcf5;}
  .quiet { background:transparent;color:var(--muted); }.quiet:hover {background:var(--lavender);}
  .full {width:100%;}
  .icon-button { width:44px;height:44px;border:0;background:transparent;border-radius:12px;display:inline-flex;align-items:center;justify-content:center;color:var(--violet);flex:none; }.icon-button:hover:not(:disabled) {background:var(--lavender);}
  .heading-symbol {width:48px;height:48px;border-radius:16px;background:var(--lavender);color:var(--violet);display:grid;place-items:center;flex:none;}.heading-symbol .icon {width:26px;height:26px;}
  .section-top {display:flex;justify-content:space-between;align-items:center;gap:12px;min-height:40px;margin-bottom:10px;}.section-top>.icon {color:var(--muted);}
  .empty-state {text-align:center;padding:28px 16px 32px;}.empty-state h3 {margin:0 auto 10px;max-width:250px;}.empty-state p {font-size:14px;color:var(--muted);margin:0 auto 22px;max-width:310px;line-height:1.6;}.empty-symbol {width:62px;height:62px;display:grid;place-items:center;color:var(--violet);background:var(--paper);border-radius:20px;margin:0 auto 20px;}.empty-symbol .icon {width:28px;height:28px;}
  .notice {display:flex;align-items:flex-start;gap:10px;padding:14px;border-radius:12px;background:var(--lavender);color:var(--violet-deep);font-size:14px;line-height:1.5;margin-bottom:16px;}.notice .icon {width:19px;height:19px;margin-top:1px;}.notice.error {background:var(--red-light);color:var(--red);}.notice.success {background:var(--green-light);color:var(--green);}
  .data-status {display:flex;align-items:center;gap:6px;font-size:12px;line-height:1.4;color:var(--muted);margin-bottom:12px;}.data-status.fresh {color:var(--green);}.data-status.pending {color:var(--amber);}.status-dot {width:6px;height:6px;border-radius:50%;background:currentColor;flex:none;}.data-time {margin-left:auto;color:var(--muted);font-variant-numeric:tabular-nums;}.section-top .data-status {margin:0;}
  .source-note,.footnote {font-size:12px;line-height:1.6;color:var(--muted);margin:18px 4px 0;}.footnote {color:var(--amber);}.traffic-panel {margin-top:24px;padding:0 4px;}.traffic-empty {font-size:14px;line-height:1.6;color:var(--muted);margin:0;}
  .alert-item {border-bottom:1px solid var(--line);}.alert-item summary {display:flex;gap:10px;align-items:center;list-style:none;cursor:pointer;font-size:14px;font-weight:600;padding:15px 0;}.alert-item summary::-webkit-details-marker {display:none;}.alert-item summary .icon {margin-left:auto;width:17px;}.alert-item[open] summary .icon {transform:rotate(90deg);}.alert-item p {font-size:14px;color:var(--muted);margin:0 0 12px 17px;white-space:pre-line;}.alert-item small {display:block;margin:0 0 14px 17px;color:var(--muted);}.alert-mark {width:7px;height:7px;background:#cb8c2e;border-radius:50%;flex:none;}
  .loading-state {display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:240px;gap:18px;color:var(--muted);font-size:14px;}.spinner {width:20px;height:20px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:spin .8s linear infinite;display:inline-block;flex:none;}.is-loading .icon {animation:spin 1s linear infinite;}@keyframes spin {to {transform:rotate(360deg);}}
  input {display:block;width:100%;min-height:50px;border:1px solid #cdd0e1;border-radius:11px;background:var(--white);color:var(--ink);padding:12px 14px;font-size:16px;line-height:1.4;}.field-help {font-size:12px;color:var(--muted);line-height:1.6;margin:12px 0 18px;}
  .text-link {display:flex;align-items:center;justify-content:space-between;font-size:14px;font-weight:650;text-decoration:none;padding:14px 4px;}.text-link .icon {width:18px;}
}
@layer screens {
  .line-badge {width:48px;height:48px;display:grid;place-items:center;border-radius:13px;background:var(--j);color:#24380b;font-size:32px;font-weight:750;line-height:1;flex:none;}
  .segmented {display:flex;background:#e8eaf3;padding:4px;border-radius:13px;gap:4px;margin-bottom:20px;}.segmented button {flex:1;border:0;border-radius:10px;min-height:42px;background:transparent;font-size:14px;font-weight:650;color:var(--muted);}.segmented button.selected {background:var(--white);color:var(--ink);box-shadow:0 1px 3px #2523470f;}
  .journey-panel {display:flex;align-items:center;gap:10px;background:var(--lavender);border-radius:var(--radius);padding:22px 18px 22px 23px;margin-bottom:24px;}.journey-stations {flex:1;min-width:0;}.station {display:flex;align-items:center;gap:14px;font-size:15px;line-height:1.4;}.station strong {font-weight:700;}.station-dot {width:10px;height:10px;border:2px solid var(--violet);border-radius:50%;flex:none;}.station.destination .station-dot {background:var(--violet);}.journey-link {display:flex;align-items:center;gap:18px;margin:4px 0 4px 4px;}.journey-link>span {width:2px;height:27px;background:#b3abdd;}.journey-link small {font-size:12px;color:#655d91;}.swap {background:rgba(255,255,255,.65);width:42px;height:42px;}
  .departures-panel {background:var(--white);border:1px solid #e7e8f0;border-radius:var(--radius);padding:14px 20px 4px;}.departures-panel .section-top {margin-bottom:6px;}
  .departure-labels {display:grid;grid-template-columns:1.05fr 1.7fr 42px;gap:10px;color:var(--muted);font-size:11px;padding:14px 0 9px;border-bottom:1px solid var(--line);}.departure-labels span:last-child {text-align:center;}
  .departures {padding:0;margin:0;list-style:none;}.departure {display:grid;grid-template-columns:1.05fr 1.7fr 42px;gap:10px;align-items:center;padding:19px 0;border-bottom:1px solid #eceef5;}.departure:last-child {border-bottom:0;}.departure-time {display:flex;flex-direction:column;gap:3px;}.departure-time time {font-size:29px;font-weight:740;letter-spacing:-.8px;line-height:1.2;font-variant-numeric:tabular-nums;}.scheduled {font-size:11px;color:var(--muted);}.departure-info {display:flex;flex-direction:column;align-items:flex-start;gap:2px;}.departure-info strong {font-size:14px;letter-spacing:.1px;}.train-number {font-size:11px;color:var(--muted);}.departure-status {font-size:11px;color:var(--green);margin-top:3px;}.status-red {color:var(--red);}.status-amber {color:var(--amber);}.status-muted {color:var(--muted);}.platform {display:flex;justify-content:center;}.platform>span:first-child {min-width:31px;min-height:31px;padding:5px;border:1px solid var(--line);border-radius:8px;text-align:center;font-size:14px;font-weight:650;}.cancelled .departure-time time {text-decoration:line-through;color:var(--muted);text-decoration-thickness:1px;}.cancelled .platform {opacity:.5;}
  .road-destination {background:var(--lavender);padding:24px;border-radius:var(--radius);margin-bottom:24px;}.road-route {display:grid;grid-template-columns:26px 1fr;gap:5px 15px;align-items:start;}.road-route>div:not(.route-dashes) {display:flex;flex-direction:column;gap:3px;}.road-route>div>span {font-size:12px;color:#655d91;}.road-route strong {font-size:16px;font-weight:650;}.road-route small {font-size:13px;color:#655d91;}.origin-pin,.destination-pin {color:var(--violet);margin-top:4px;}.route-dashes {height:21px;width:1px;border-left:2px dotted #a49bcc;margin-left:10px;grid-column:1/-1;}
  .road-result {background:var(--white);border:1px solid #e7e8f0;border-radius:var(--radius);padding:22px;}.road-intro {text-align:center;padding:12px 0 18px;}.road-intro h2 {font-size:20px;line-height:1.3;max-width:260px;margin:0 auto 12px;}.road-intro p {font-size:14px;color:var(--muted);max-width:290px;margin:0 auto;line-height:1.65;}.location-orbit {width:65px;height:65px;display:grid;place-items:center;margin:0 auto 22px;color:var(--violet);border:1px solid #d7d2f3;border-radius:50%;box-shadow:0 0 0 8px #f6f5fd;}.location-orbit .icon {width:28px;height:28px;}.privacy-note {font-size:11px;color:var(--muted);text-align:center;line-height:1.6;margin:14px 4px 0;}.drive-time {font-size:clamp(46px,12vw,66px);font-weight:740;line-height:1.2;letter-spacing:-2.7px;margin:22px 0 4px;font-variant-numeric:tabular-nums;}.drive-time.stale {color:var(--muted);}.arrival {font-size:15px;color:var(--muted);margin-bottom:24px;}.arrival strong {color:var(--ink);font-weight:650;}.road-facts {display:grid;grid-template-columns:1fr 1fr;gap:16px;padding:18px 0;border-block:1px solid var(--line);}.road-facts>div {display:flex;flex-direction:column;gap:5px;}.road-facts span {font-size:12px;color:var(--muted);}.road-facts strong {font-size:18px;font-weight:650;}.calculated {font-size:11px;color:var(--muted);margin:12px 0 22px;}.road-incident {display:flex;gap:12px;align-items:baseline;padding:13px 0;border-bottom:1px solid var(--line);}.road-incident strong {font-size:14px;font-weight:600;}.road-incident p {font-size:12px;color:var(--muted);margin:4px 0 0;}.road-links {margin-top:16px;}
  .settings-section {background:var(--white);border:1px solid #e7e8f0;border-radius:var(--radius);padding:23px;margin-bottom:20px;}.settings-section h2 {margin-bottom:10px;}.section-intro,.install-section>p {font-size:14px;color:var(--muted);line-height:1.65;}.key-field {padding:20px 0;border-top:1px solid var(--line);}.key-field label {display:flex;align-items:center;gap:9px;font-size:14px;font-weight:650;}.key-field p {font-size:12px;color:var(--muted);margin:9px 0 14px;}.key-field label>.icon {width:20px;height:20px;color:var(--violet);}.saved-status {font-size:10px;margin-left:auto;color:var(--muted);font-weight:500;white-space:nowrap;}.mini-line {width:23px;height:23px;border-radius:6px;display:grid;place-items:center;background:var(--j);color:#24380b;font-size:17px;font-weight:750;}.key-field a {display:inline-flex;align-items:center;gap:8px;font-size:12px;margin-top:12px;}.key-field a .icon {width:14px;height:14px;}.install-section .field-help {font-size:12px;margin-bottom:0;}.module-entry {display:flex;align-items:center;gap:12px;padding:14px 0;border-bottom:1px solid var(--line);}.module-symbol {width:38px;height:38px;border-radius:12px;background:var(--paper);display:grid;place-items:center;color:var(--violet);}.module-entry>div {display:flex;flex-direction:column;gap:2px;}.module-entry strong {font-size:14px;font-weight:600;}.module-entry>div>span {font-size:11px;color:var(--muted);}.module-enabled {margin-left:auto;color:var(--green);font-size:11px;}.version-note {text-align:center;color:var(--muted);font-size:12px;margin-top:20px;}
  .private-badge {display:flex;align-items:center;gap:5px;color:var(--muted);font-size:11px;}.private-badge .icon {width:14px;height:14px;}.auth-main {padding:24px 30px 40px;max-width:450px;margin:auto;}.auth-main h1 {font-size:39px;letter-spacing:-1.4px;line-height:1.12;}.auth-intro {font-size:15px;color:var(--muted);line-height:1.8;margin:19px 0 30px;}.auth-main form>label {display:block;font-size:13px;font-weight:650;margin:18px 0 8px;}.auth-main form>button {margin-top:20px;}.auth-main #auth-feedback:empty {display:none;}.auth-main #auth-feedback {margin-top:16px;}.auth-footer {color:var(--muted);font-size:12px;text-align:center;margin:28px 0 0;}.auth-illustration {height:125px;width:220px;position:relative;margin:0 0 23px;}.auth-track {position:absolute;left:24px;top:20px;width:145px;height:75px;border:3px solid #d2cdeb;border-left-color:transparent;border-radius:45px;}.auth-line {position:absolute;left:0;top:0;width:53px;height:53px;display:grid;place-items:center;background:var(--j);border-radius:14px;color:#24380b;font-size:34px;font-weight:750;}.auth-car {position:absolute;left:144px;top:50px;width:58px;height:58px;display:grid;place-items:center;background:var(--violet);color:white;border-radius:18px;}.auth-car .icon {width:29px;height:29px;}.auth-point {position:absolute;left:25px;top:87px;width:13px;height:13px;background:var(--paper);border:3px solid var(--violet);border-radius:50%;}
}
@layer responsive {
  @media(min-width:680px) {.app-header {height:110px;padding-inline:38px;}.main-content {padding:25px 38px 120px;}.journey-panel {padding:26px 28px;}.station {font-size:17px;}.departures-panel {padding-inline:27px;}.departure-time time {font-size:34px;}.departure-info strong {font-size:16px;}.departure {padding:23px 0;}.auth-main {padding-top:40px;}.auth-main h1 {font-size:46px;}}
  @media(max-width:360px) {.app-header {padding-inline:18px;}.main-content {padding-inline:17px;}.page-heading {gap:10px;}h1 {font-size:27px;}.journey-panel {padding-left:16px;padding-right:12px;}.station {font-size:13px;gap:10px;}.journey-link {gap:14px;}.journey-link small {font-size:11px;}.departures-panel {padding-inline:15px;}.departure {grid-template-columns:1fr 1.5fr 32px;gap:7px;}.departure-labels {grid-template-columns:1fr 1.5fr 32px;gap:7px;}.departure-time time {font-size:26px;}.settings-section {padding:18px;}.saved-status {font-size:9px;}.key-field label {font-size:12px;}.auth-main {padding-inline:24px;}.auth-main h1 {font-size:35px;}}
  @media(prefers-reduced-motion:reduce) {*,*::before,*::after {animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;}}
}
