:root{--ink:#edf4ff;--muted:#9cabc0;--panel:#0b1423;--panel-2:#101d30;--border:rgba(190,211,238,.16);--accent:#68e1c2;--shadow:0 18px 50px rgba(0,0,0,.38)}
*{box-sizing:border-box}html,body{height:100%;margin:0}body{overflow:hidden;background:#07101c;color:var(--ink);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}button,input{font:inherit}.skip-link{position:fixed;z-index:100;top:8px;left:8px;padding:10px 14px;background:#fff;color:#000;transform:translateY(-150%)}.skip-link:focus{transform:none}.app-shell{display:grid;grid-template-columns:minmax(310px,360px) minmax(260px,310px) 1fr;height:100%}.sidebar,.station-panel{z-index:3;min-width:0;overflow-y:auto;background:linear-gradient(180deg,#0b1525,#08101c);border-right:1px solid var(--border);scrollbar-color:#32445d transparent}.brand{padding:34px 28px 25px;border-bottom:1px solid var(--border)}.eyebrow,.step,.detail-kicker{margin:0 0 6px;color:var(--accent);font-size:11px;font-weight:800;letter-spacing:.16em}.brand h1{margin:0;font-size:31px;letter-spacing:-.045em}.brand-copy{margin:10px 0 0;color:var(--muted);line-height:1.5}.search-panel,.station-panel{padding:24px 22px}.search-panel{border-bottom:1px solid var(--border)}.station-panel{padding-top:34px}.section-heading{display:flex;align-items:end;justify-content:space-between;margin-bottom:16px}.section-heading h2{margin:0;font-size:21px}.count{color:var(--muted);font-size:12px}.search-label{display:block;margin-bottom:7px;color:var(--muted);font-size:12px}.search-panel input{width:100%;padding:12px 13px;border:1px solid var(--border);border-radius:9px;outline:none;background:#070f1b;color:var(--ink)}.search-panel input:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(104,225,194,.14)}.line-list,.station-list{display:grid;gap:7px;margin-top:14px}.operator-group{margin-top:15px}.operator-title{display:flex;align-items:center;gap:8px;margin:0 0 8px;color:#72839a;font-size:10px;font-weight:800;letter-spacing:.15em;text-transform:uppercase}.operator-logo{width:22px;height:22px;object-fit:contain;flex:0 0 22px}.line-button,.station-button,.connection-button{width:100%;border:1px solid transparent;color:var(--ink);cursor:pointer;text-align:left}.line-button{display:grid;grid-template-columns:32px 1fr auto;gap:10px;align-items:center;padding:11px;background:transparent;border-radius:9px}.line-button:hover,.line-button:focus-visible,.line-button.active{background:var(--panel-2);border-color:var(--border)}.line-button.active{box-shadow:inset 0 0 0 1px var(--line-color)}.line-swatch{width:6px;height:32px;margin-inline:auto;border-radius:6px;background:var(--line-color)}.line-symbol{display:block;width:32px;height:32px;object-fit:contain}.station-line-identity{display:flex;min-height:44px;align-items:center;gap:10px;margin:0 0 14px;padding:9px 10px;border:1px solid var(--border);border-radius:10px;background:var(--panel-2)}.station-line-identity:empty{display:none}.station-line-identity .line-symbol{width:36px;height:36px}.station-line-copy{min-width:0;flex:1}.station-line-copy strong,.station-line-copy span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.station-line-copy span{margin-top:2px;color:var(--muted);font-size:11px}.line-name{display:block;font-weight:700}.line-meta{display:block;color:var(--muted);font-size:11px}.line-total{color:var(--muted);font-size:11px}.station-button{display:flex;align-items:center;gap:10px;padding:9px;background:transparent;border-radius:8px}.station-button:hover,.station-button:focus-visible,.station-button.active{background:var(--panel-2);border-color:var(--border)}.station-roundel{display:flex;flex-direction:column;align-items:center;justify-content:center;flex:0 0 40px;width:40px;height:40px;border:3px solid var(--line-color);border-radius:50%;background:#fff;color:#111;line-height:1}.roundel-letter{font-size:11px;font-weight:800;letter-spacing:.02em;margin-bottom:-1px}.roundel-number{font-size:15px;font-weight:800;letter-spacing:-.02em}.station-popup{display:flex;align-items:center;gap:9px}.station-popup .station-roundel{flex:0 0 34px;width:34px;height:34px}.station-popup .roundel-number{font-size:14px}.station-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.empty{margin:12px 0;color:var(--muted);font-size:13px}.map-stage{position:relative;min-width:0;height:100%}#map{position:absolute;inset:0}.map-topbar{position:absolute;z-index:2;top:18px;left:18px;display:flex;gap:10px;align-items:center;pointer-events:none}.selection-label,.mobile-toggle,.map-legend{border:1px solid var(--border);border-radius:999px;background:rgba(8,17,31,.9);box-shadow:var(--shadow);color:var(--ink);backdrop-filter:blur(12px)}.selection-label{padding:10px 15px;font-size:12px;font-weight:700}.mobile-toggle{display:none;padding:10px 15px;cursor:pointer;pointer-events:auto}.map-legend{display:flex;gap:12px;padding:9px 13px;color:var(--muted);font-size:11px}.map-legend span{display:flex;gap:6px;align-items:center}.legend-line{display:inline-block;width:22px;height:4px;border-radius:4px;background:var(--accent)}.connected-line{opacity:.5}.status,.map-error{position:absolute;z-index:4;top:50%;left:50%;max-width:360px;padding:13px 18px;border-radius:10px;transform:translate(-50%,-50%);background:rgba(8,17,31,.94);box-shadow:var(--shadow);text-align:center}.map-error{color:#ffd7d7;border:1px solid #9e4545}.detail-card{position:absolute;z-index:3;right:20px;bottom:28px;width:min(390px,calc(100% - 40px));max-height:70%;overflow:auto;padding:23px;border:1px solid var(--border);border-radius:16px;background:rgba(8,17,31,.96);box-shadow:var(--shadow);backdrop-filter:blur(18px)}.detail-card h2{margin:0;font-size:26px;letter-spacing:-.03em}.japanese{margin:3px 0 17px;color:var(--muted);font-size:18px}.detail-head{display:flex;align-items:center;gap:13px;margin-bottom:16px;padding-right:34px}.detail-roundel{display:flex;flex:0 0 auto}.detail-head .station-roundel{flex:0 0 46px;width:46px;height:46px}.detail-head .roundel-letter{font-size:12px}.detail-head .roundel-number{font-size:17px}.detail-heading{min-width:0;flex:1}.detail-heading .japanese{margin:2px 0 0;font-size:16px}.detail-subline{display:flex;align-items:center;justify-content:space-between;gap:12px}.detail-coords{flex:0 0 auto;color:var(--muted);font-size:10px;text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}.detail-operator{flex:0 0 auto}.detail-operator .operator-logo{display:block;width:34px;height:34px;object-fit:contain}#detail-close{position:absolute;top:14px;right:16px;float:none}.icon-button{float:right;width:34px;height:34px;border:1px solid var(--border);border-radius:50%;background:transparent;color:var(--ink);cursor:pointer;font-size:22px}.detail-section{margin-top:18px}.detail-section h3{margin:0 0 8px;font-size:13px}.connections{display:grid;grid-template-columns:1fr 1fr;gap:6px}.connections-primary{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:6px}.connections-primary .connection-button{flex:1 1 0}.connection-button{display:flex;align-items:center;gap:8px;min-width:0;padding:7px 8px;border-color:var(--border);border-radius:7px;background:var(--panel-2);font-size:12px}.connection-button:hover{border-color:var(--accent)}.connection-button .station-roundel{flex:0 0 26px;width:26px;height:26px;border-width:2px}.connection-button .roundel-letter{font-size:8px;margin-bottom:0}.connection-button .roundel-number{font-size:11px}.connection-label{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}audio{display:block;width:100%;height:34px;margin-top:8px}.audio-label{margin:10px 0 0;color:var(--muted);font-size:11px}#map .mapboxgl-popup-content{padding:10px 13px;border-radius:8px;background:#0b1525;color:#fff}#map .mapboxgl-popup-tip{border-top-color:#0b1525}.mapboxgl-popup-close-button{color:#fff}.mobile-drawer,.scrim{display:none}.noscript{position:fixed;z-index:999;inset:auto 20px 20px;padding:15px;background:#711;color:#fff}
.station-steps{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:12px}.station-step[data-direction="prev"]{grid-column:1}.station-step[data-direction="next"]{grid-column:2;text-align:right}.station-step{align-items:center;gap:8px;padding:9px 10px;border:1px solid var(--border);border-radius:10px;background:linear-gradient(180deg,rgba(104,225,194,.11),rgba(104,225,194,.04))}.station-step:hover:not(:disabled){border-color:var(--accent);background:linear-gradient(180deg,rgba(104,225,194,.2),rgba(104,225,194,.07))}.station-step:disabled{opacity:.45;cursor:default}.step-copy{display:flex;flex-direction:column;min-width:0;flex:1;gap:1px}.step-direction{color:var(--accent);font-size:9px;font-weight:800;letter-spacing:.14em;text-transform:uppercase}.station-step .connection-label{font-size:12px;font-weight:600}.step-chevron{flex:0 0 auto;color:var(--accent);font-size:19px;font-weight:700;line-height:1}.station-step .station-roundel{flex:0 0 30px;width:30px;height:30px;border-width:2px}.station-step .roundel-letter{font-size:8px;margin-bottom:0}.station-step .roundel-number{font-size:12px}
@media(max-width:1050px){.app-shell{display:block}.sidebar,.app-shell>.station-panel{display:none}.map-stage{height:100%}.mobile-toggle{display:block}.selection-label{max-width:50vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mobile-drawer{display:block;position:fixed;z-index:20;top:0;left:0;bottom:0;width:min(92vw,390px);overflow:auto;padding:20px;background:var(--panel);box-shadow:var(--shadow)}.mobile-drawer[hidden],.scrim[hidden]{display:none}.mobile-drawer .sidebar,.mobile-drawer .station-panel{display:block;overflow:visible;border:0;background:transparent}.mobile-drawer .station-panel{padding-top:20px}.mobile-drawer .icon-button{position:sticky;z-index:2;top:0;float:right;background:var(--panel)}.scrim{display:block;position:fixed;z-index:19;inset:0;background:rgba(0,0,0,.6)}.detail-card{right:10px;bottom:10px;width:calc(100% - 20px);max-height:53%;padding:18px}.mapboxgl-ctrl-bottom-right{bottom:54%}.brand{padding:18px 8px}.search-panel,.station-panel{padding:20px 8px}.map-topbar{top:10px;left:10px}}
@media(max-width:560px){.map-legend{display:none}.selection-label{max-width:42vw}.connections{grid-template-columns:1fr}.station-steps{grid-template-columns:1fr}.station-step[data-direction="prev"],.station-step[data-direction="next"]{grid-column:1}}
@media(prefers-reduced-motion:reduce){html body *{scroll-behavior:auto;transition:none}}