:root{color-scheme:light;--bg:#eef3f8;--surface:#fff;--surface2:#f7f9fc;--line:#d5dee9;--text:#18324a;--muted:#62778c;--primary:#0b4f8a;--primary2:#1b6aae;--active:#dcecff;--s45:#1f9d73;--west:#1c6fb8;--warn:#b36b00;--shadow:0 1px 3px rgba(13,36,64,.08)}*{box-sizing:border-box}html,body{margin:0;background:var(--bg);color:var(--text);font-family:system-ui,-apple-system,Roboto,'Segoe UI',sans-serif}button,input{font:inherit}button{cursor:pointer}.appbar{background:linear-gradient(180deg,var(--primary),var(--primary2));color:#fff;padding:16px}.top{max-width:700px;margin:auto;display:flex;align-items:center;justify-content:space-between}.top h1{font-size:22px;margin:0}.top span{font-size:12px;opacity:.85}.shell{max-width:700px;margin:auto;padding:12px 12px 28px}.panel,.card{background:var(--surface);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);padding:13px}.route-fields{display:grid;grid-template-columns:minmax(0,1fr) 40px minmax(0,1fr);gap:8px;align-items:end}.station-wrap{position:relative;min-width:0}.station-wrap label{display:block;font-size:12px;font-weight:750;margin:0 0 5px}.station-wrap input{width:100%;padding:12px 9px;border:1px solid #b9cbdc;border-radius:10px;background:#fff;color:var(--text);font-size:14px}.station-wrap input:focus{outline:2px solid #91c4ef;outline-offset:0}.station-wrap input.invalid{border-color:#b55}.swap{height:44px;border:1px solid var(--line);border-radius:10px;background:var(--surface2);font-size:24px;color:var(--primary)}.suggestions{position:absolute;top:100%;left:0;right:0;z-index:10;max-height:260px;overflow-y:auto;background:#fff;border:1px solid #9bb6cf;box-shadow:0 5px 16px #1b35532b;border-radius:10px;margin-top:3px}.suggestions button{display:block;width:100%;text-align:left;border:0;border-bottom:1px solid #e5edf5;background:#fff;color:var(--text);padding:11px;font-size:13px}.suggestions button:hover,.suggestions button:focus{background:var(--active)}.suggestions .message{padding:12px;color:var(--muted);font-size:13px}.via-header{margin:14px 0 9px}.check{font-size:13px;font-weight:650;display:flex;gap:7px;align-items:center}.check input{accent-color:var(--primary)}.actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:14px}.primary,.secondary{border-radius:10px;padding:10px 13px;font-size:13px;font-weight:750}.primary{background:var(--primary);color:#fff;border:1px solid var(--primary)}.secondary{background:var(--surface2);color:var(--primary);border:1px solid var(--line)}button:disabled{opacity:.55;cursor:wait}.hint{font-size:11px;color:var(--muted);margin:10px 0 0}.toolbar{display:flex;justify-content:space-between;align-items:center;gap:10px;margin:14px 0 9px}.toolbar h2{font-size:18px;margin:0}.toolbar p{font-size:12px;color:var(--muted);margin:4px 0 0}.cards{display:grid;gap:9px}.notice{padding:17px 14px;background:#fff;border:1px dashed var(--line);border-radius:14px;color:var(--muted);font-size:14px}.alert{background:#fff1f1;border:1px solid #e6b4b4;color:#8b3f3f;padding:11px;border-radius:10px;margin-bottom:8px;font-size:13px}.route-meta{display:flex;flex-wrap:wrap;gap:7px;align-items:center;margin-bottom:8px}.rank{font-size:11px;font-weight:800;color:var(--primary);background:var(--active);padding:4px 8px;border-radius:999px}.total{font-size:12px;color:var(--muted);font-weight:700}.summary{font-size:23px;font-weight:800;letter-spacing:-.03em;font-variant-numeric:tabular-nums}.summary span{color:var(--muted);font-size:18px}.route-name{font-size:12px;color:var(--muted);margin-top:3px}.legs{margin-top:10px;border-top:1px solid #ebf0f5;padding-top:10px;display:grid;gap:9px}.leg{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:9px;align-items:start}.train{background:#6d7f92;color:#fff;padding:5px 7px;border-radius:8px;font-size:12px;font-weight:800;min-width:48px;text-align:center}.train.s45{background:var(--s45)}.train.westbahn{background:var(--west)}.legtext b{font-size:13px}.tsmall{display:block;font-size:12px;color:var(--muted);margin-top:3px;line-height:1.35}.delay{font-size:12px;color:var(--warn);font-weight:800;white-space:nowrap}.transfer{padding:7px 10px;background:#f7fafc;border:1px solid #dce6f0;border-radius:10px;color:var(--muted);font-size:12px}.direct{background:#eff8f4;color:#2a6f52;padding:7px 10px;border-radius:10px;font-size:12px;font-weight:700}@media(max-width:480px){.shell{padding:10px}.panel,.card{padding:11px}.route-fields{grid-template-columns:minmax(0,1fr) 34px minmax(0,1fr);gap:5px}.station-wrap input{font-size:12px;padding:11px 6px}.swap{height:40px}.summary{font-size:21px}}

/* Collapsible journey details: collapsed by default, native keyboard support. */
.travel-details{margin-top:10px;border-top:1px solid #ebf0f5}
.travel-details>summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:10px;cursor:pointer;padding:11px 2px 2px;color:var(--primary);font-size:13px;font-weight:750}
.travel-details>summary::-webkit-details-marker{display:none}
.travel-details>summary::after{content:"";flex:0 0 auto;width:8px;height:8px;margin:0 5px 4px 0;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg);transition:transform .15s ease,margin .15s ease}
.travel-details[open]>summary::after{margin-top:5px;margin-bottom:0;transform:rotate(225deg)}
.travel-details[open]>summary{padding-bottom:8px}
.travel-details .legs{margin-top:0}
.travel-details>summary:focus-visible{outline:2px solid var(--primary);outline-offset:3px;border-radius:4px}
.route-meta{justify-content:space-between}
.departure-status{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:6px;margin-left:auto;font-size:11px;font-weight:700}
.platform-info,.realtime-status{display:inline-flex;align-items:center;min-height:25px;padding:4px 8px;border-radius:7px}
.platform-info{color:#24577e;background:#edf6fc;border:1px solid #d5e7f3}
.platform-info b{margin-left:3px;color:#123f63}
.platform-open,.realtime-open{color:#718497;background:#f5f7f9;border:1px solid #e3e9ee}
.realtime-ok{color:#21684d;background:#edf8f3;border:1px solid #cee9dc}
.realtime-delay{color:#9a5700;background:#fff5e5;border:1px solid #f0d8ad}
@media(max-width:520px){.departure-status{flex-basis:100%;justify-content:flex-start;margin-left:0}}

/* Modern header and route search */
:root{--primary:#075a9c;--primary2:#1579bd;--ink:#102a43;--soft-blue:#e9f4fd}
body{min-height:100vh;background:
 radial-gradient(circle at 8% 6%,rgba(48,153,220,.12),transparent 26rem),
 linear-gradient(180deg,#edf5fb 0,#f5f8fb 22rem,#eef3f8 100%)}
.appbar{position:relative;overflow:hidden;background:linear-gradient(118deg,#123d67 0%,#0868aa 58%,#1384c5 100%);padding:22px 20px 50px}
.appbar::before,.appbar::after{content:"";position:absolute;border-radius:50%;pointer-events:none}
.appbar::before{width:260px;height:260px;right:8%;top:-190px;background:rgba(255,255,255,.1)}
.appbar::after{width:180px;height:180px;right:-45px;bottom:-135px;border:34px solid rgba(255,255,255,.06)}
.top{position:relative;z-index:1;max-width:860px}
.brand{display:flex;align-items:center;gap:12px}
.top .brand-mark{display:grid;place-items:center;width:42px;height:42px;border:1px solid rgba(255,255,255,.38);border-radius:13px;background:rgba(255,255,255,.14);box-shadow:inset 0 1px 0 rgba(255,255,255,.24),0 8px 24px rgba(0,34,69,.18);font-size:21px;font-weight:850;letter-spacing:-.06em;opacity:1;backdrop-filter:blur(8px)}
.top h1{font-size:22px;letter-spacing:-.025em}
.brand p{margin:2px 0 0;font-size:11px;color:rgba(255,255,255,.72);letter-spacing:.02em}
.schedule-badge{display:flex;align-items:center;gap:8px;padding:8px 12px;border:1px solid rgba(255,255,255,.2);border-radius:999px;background:rgba(0,35,68,.2);box-shadow:inset 0 1px 0 rgba(255,255,255,.1);font-size:12px;font-weight:650;backdrop-filter:blur(8px)}
.status-dot{width:7px;height:7px;border-radius:50%;background:#78e4b5;box-shadow:0 0 0 4px rgba(120,228,181,.14)}
.shell{position:relative;max-width:860px;margin:0 auto;padding:10px 14px 28px}
.search-panel{position:relative;padding:10px 12px;border-color:rgba(151,177,201,.5);border-radius:13px;box-shadow:0 8px 22px rgba(31,65,96,.09),0 1px 4px rgba(31,65,96,.05)}
.search-panel::before{content:"";position:absolute;inset:0 22px auto;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.9),transparent)}
.search-intro{margin-bottom:18px}
.search-intro .eyebrow{display:block;margin-bottom:3px;color:var(--primary);font-size:10px;font-weight:850;letter-spacing:.13em;text-transform:uppercase}
.search-intro h2{margin:0;color:var(--ink);font-size:19px;letter-spacing:-.025em}
.route-fields{grid-template-columns:minmax(0,1fr) 34px minmax(0,1fr) 34px 34px;gap:5px}
.station-wrap label{margin-bottom:3px;color:#294860;font-size:9px;font-weight:800;letter-spacing:.035em;text-transform:uppercase}
.station-wrap input{height:35px;padding:0 9px;border-color:#c9d8e5;border-radius:8px;background:#f8fbfd;color:var(--ink);font-size:12px;box-shadow:inset 0 1px 2px rgba(19,54,84,.03);transition:border-color .15s,box-shadow .15s,background .15s}
.station-wrap input:hover{border-color:#a9c1d5;background:#fff}
.station-wrap input:focus{border-color:#4598d1;background:#fff;outline:0;box-shadow:0 0 0 4px rgba(41,139,204,.13)}
.station-wrap input::placeholder{color:#8ba0b2}
.swap{width:34px;height:35px;margin-bottom:0;border-color:#c8d9e7;border-radius:8px;background:linear-gradient(180deg,#fff,#eef6fb);box-shadow:0 2px 7px rgba(30,82,123,.08);font-size:16px;transition:transform .15s,box-shadow .15s,border-color .15s}
.swap:hover{border-color:#86b7d8;box-shadow:0 7px 16px rgba(30,82,123,.13);transform:translateY(-1px)}
.swap:active{transform:translateY(0)}
.route-action{display:grid;place-items:center;align-self:end;width:34px;height:35px;padding:0;border:1px solid transparent;border-radius:8px;transition:transform .15s,box-shadow .15s,background .15s,border-color .15s}
.route-action svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.search-action{color:#fff;background:linear-gradient(135deg,#07558f,#0875b8);box-shadow:0 4px 10px rgba(7,90,156,.2)}
.search-action:hover{transform:translateY(-1px);box-shadow:0 6px 14px rgba(7,90,156,.27)}
.clear-action{color:#557086;background:#f5f9fc;border-color:#d3e0ea}
.clear-action:hover{color:#8b3f3f;background:#fff5f5;border-color:#e2bcbc;transform:translateY(-1px)}
.route-action:focus-visible{outline:3px solid rgba(41,139,204,.2);outline-offset:2px}
.actions{gap:6px;margin-top:7px;padding-top:7px;border-top:1px solid #e8eff5}
.primary,.secondary{min-height:34px;padding:6px 11px;border-radius:8px;font-size:11px;transition:transform .15s,box-shadow .15s,border-color .15s,background .15s}
.primary{display:flex;align-items:center;gap:12px;background:linear-gradient(135deg,#07558f,#0875b8);border:0;box-shadow:0 8px 18px rgba(7,90,156,.2)}
.primary span{font-size:18px;line-height:1;transition:transform .15s}
.primary:hover{box-shadow:0 10px 22px rgba(7,90,156,.27);transform:translateY(-1px)}
.primary:hover span{transform:translateX(2px)}
.secondary{background:#f5f9fc;border-color:#d3e0ea;color:#23567f}
.secondary:hover{background:#fff;border-color:#aac5da;transform:translateY(-1px)}
.hint{display:flex;align-items:center;gap:6px;margin-top:9px;color:#73889a;font-size:10px}
.hint span{color:#62ad90;font-size:7px}
.suggestions{margin-top:5px;border-color:#b7ccdc;border-radius:12px;box-shadow:0 14px 32px rgba(22,56,86,.16)}
.toolbar{margin-top:20px}
.route-tools{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:7px;padding-top:7px;border-top:1px solid #e8eff5}
.favorite-tools{display:flex;align-items:center;gap:5px;min-width:0}
.favorite-tools select{width:min(230px,42vw);height:30px;padding:0 25px 0 8px;border:1px solid #d2dfe9;border-radius:7px;background:#f8fbfd;color:#35536b;font-size:10px}
.tool-icon{display:grid;place-items:center;width:30px;height:30px;padding:0;border:1px solid #d2dfe9;border-radius:7px;background:#f8fbfd;color:#597187}
.tool-icon svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linejoin:round}
.tool-icon.active{color:#a66500;background:#fff7df;border-color:#e9cd83}
.tool-icon.active svg{fill:#f5bd3e}
.planner-options{position:relative}
.planner-options>summary{list-style:none;cursor:pointer;padding:7px 9px;border:1px solid #d2dfe9;border-radius:7px;background:#f8fbfd;color:#315d7f;font-size:10px;font-weight:800}
.planner-options>summary::-webkit-details-marker{display:none}
.planner-options>summary{display:flex;align-items:center;gap:8px}
.planner-options>summary::after{content:"";flex:0 0 auto;width:6px;height:6px;margin:0 2px 3px 0;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg);transition:transform .15s,margin .15s}
.planner-options[open]>summary::after{margin-top:4px;margin-bottom:0;transform:rotate(225deg)}
.planner-grid{position:absolute;z-index:15;right:0;top:36px;width:min(700px,calc(100vw - 28px));display:grid;grid-template-columns:repeat(4,minmax(105px,1fr));gap:8px;padding:11px;border:1px solid #c7d8e5;border-radius:11px;background:#fff;box-shadow:0 14px 34px rgba(24,59,88,.18)}
.planner-grid>label{display:grid;gap:4px;color:#577084;font-size:9px;font-weight:800;text-transform:uppercase}
.planner-grid select,.planner-grid input[type=date],.planner-grid input[type=time]{width:100%;height:34px;padding:0 7px;border:1px solid #cbd9e4;border-radius:7px;background:#f8fbfd;color:#18324a;font-size:11px;text-transform:none}
.compact-button{align-self:end;height:34px;padding:0 12px;border:1px solid #b9d2e4;border-radius:7px;background:#edf6fc;color:#175985;font-size:11px;font-weight:800}
.product-filter{grid-column:1/-1;display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px;margin:0;padding:8px 9px;border:1px solid #e0e8ef;border-radius:8px}
.product-filter legend{padding:0 4px;color:#577084;font-size:9px;font-weight:800;text-transform:uppercase}
.product-filter label{display:flex;align-items:center;gap:5px;color:#294860;font-size:10px;font-weight:700}
.product-filter input{margin:0;accent-color:var(--primary)}
.connection-meta{display:flex;flex-wrap:wrap;align-items:center;gap:5px}
.journey-date{color:#365b77;font-size:10px;font-weight:850;text-transform:uppercase}
.best-badge{display:inline-flex;align-items:center;min-height:23px;padding:3px 7px;border-radius:999px;background:#e9f4fd;color:#075a9c;font-size:10px;font-weight:800}
.disruption{display:grid;grid-template-columns:auto minmax(0,1fr);gap:8px;margin-top:9px;padding:8px 9px;border:1px solid #efc3c3;border-radius:8px;background:#fff3f3;color:#843737;font-size:11px;line-height:1.35}
.disruption strong{font-size:10px;text-transform:uppercase;letter-spacing:.04em}
.disruption div{display:grid;gap:3px}
.card.unavailable{border-color:#e4b8b8;background:linear-gradient(90deg,#fffafa,#fff 30%)}
.card.unavailable .summary{text-decoration:line-through;text-decoration-thickness:1px;text-decoration-color:#ba7777}
.leg-block{display:grid;gap:5px}
.stopovers{display:grid;gap:5px;margin:2px 0 2px 23px;padding:7px 0 2px 14px;border-left:1px solid #cddde9}
.stopovers-title{margin-bottom:1px;color:#6a8092;font-size:9px;font-weight:850;letter-spacing:.05em;text-transform:uppercase}
.stopover{display:grid;grid-template-columns:8px minmax(0,1fr) auto;align-items:center;gap:6px;color:#3b566b;font-size:11px}
.stopover-dot{width:6px;height:6px;margin-left:-18px;border:1.5px solid #6b9cbd;border-radius:50%;background:#fff;box-shadow:0 0 0 3px #fff}
.stopover-time{color:#718596;font-size:10px;font-variant-numeric:tabular-nums;white-space:nowrap}
.changed-time{display:inline-flex;align-items:baseline;gap:5px;white-space:nowrap}
.changed-time del{color:#8595a3;font-size:.72em;font-weight:650;text-decoration-thickness:1.5px}
.changed-time strong{color:#a95b00;font:inherit;font-weight:850}
.time-arrow{font-weight:500}

@media(max-width:640px){
 .appbar{padding:17px 12px 42px}
 .brand-mark{width:38px;height:38px;border-radius:11px}
 .brand p{display:none}
 .schedule-badge{padding:7px 9px}
 .shell{margin-top:0;padding:8px 8px 24px}
 .search-panel{padding:9px;border-radius:12px}
 .search-intro{margin-bottom:15px}
 .route-fields{grid-template-columns:minmax(0,1fr) 32px minmax(0,1fr) 32px 32px;gap:4px}
 .station-wrap input{height:34px;padding-inline:7px;font-size:11px}
 .swap,.route-action{width:32px;height:34px;border-radius:8px}
 .swap{font-size:15px}
 .actions{align-items:stretch}
 .primary,.secondary{justify-content:center;flex:1 1 130px}
 .planner-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .compact-button{align-self:end}
}
@media(max-width:400px){
 .schedule-badge>span:last-child{display:none}
 .schedule-badge{width:31px;height:31px;justify-content:center;padding:0}
 .route-fields{grid-template-columns:minmax(0,1fr) 30px minmax(0,1fr) 30px 30px;gap:3px}
 .station-wrap input{font-size:10px;padding-inline:6px}
 .swap,.route-action{width:30px}
 .favorite-tools select{width:46vw}
 .planner-grid{right:-1px;width:calc(100vw - 18px);gap:6px;padding:8px}
}

/* Simple password gate */
.login-page{display:grid;min-height:100vh;place-items:center;padding:20px;background:
 radial-gradient(circle at 15% 10%,rgba(48,153,220,.16),transparent 28rem),
 linear-gradient(145deg,#e8f2f9,#f7f9fb 55%,#e9f1f7)}
.login-shell{width:min(100%,360px)}
.login-card{display:grid;gap:12px;padding:30px;border:1px solid rgba(151,177,201,.55);border-radius:18px;background:rgba(255,255,255,.94);box-shadow:0 22px 55px rgba(31,65,96,.16),0 2px 7px rgba(31,65,96,.08);backdrop-filter:blur(12px)}
.login-mark{display:grid;width:48px;height:48px;place-items:center;border-radius:14px;background:linear-gradient(135deg,#07558f,#0875b8);color:#fff;font-size:23px;font-weight:850;box-shadow:0 9px 20px rgba(7,90,156,.24)}
.login-card h1{margin:3px 0 -6px;color:var(--ink);font-size:25px;letter-spacing:-.035em}
.login-card p{margin:0 0 6px;color:var(--muted);font-size:13px;line-height:1.45}
.login-card label{margin-bottom:-6px;color:#294860;font-size:10px;font-weight:850;letter-spacing:.06em;text-transform:uppercase}
.login-card input{width:100%;height:44px;padding:0 12px;border:1px solid #bdd0df;border-radius:10px;background:#f8fbfd;color:var(--ink);font-size:15px}
.login-card input:focus{border-color:#4598d1;background:#fff;outline:0;box-shadow:0 0 0 4px rgba(41,139,204,.13)}
.login-card button{height:43px;margin-top:3px;border:0;border-radius:10px;background:linear-gradient(135deg,#07558f,#0875b8);color:#fff;font-size:13px;font-weight:800;box-shadow:0 8px 18px rgba(7,90,156,.2)}
.login-card button:hover{background:linear-gradient(135deg,#064d82,#076aa7)}
.login-card button:focus-visible{outline:3px solid rgba(41,139,204,.25);outline-offset:3px}
.login-error{margin:-2px 0 0;padding:8px 10px;border:1px solid #efc3c3;border-radius:8px;background:#fff3f3;color:#843737;font-size:12px}