@import "https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;450;500;550;600;650&family=Manrope:wght@200;300;400;500;600&family=Noto+Sans+Thai:wght@300;400;500;600&display=swap";
:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:#090f1d;--text:#ecedf8;--muted:#a5b0c9;--border:#303c53;--accent:#e9bd87;background:var(--bg);color:var(--text);font-family:DM Sans,Noto Sans Thai,system-ui,sans-serif}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button,a,input,select,summary{-webkit-tap-highlight-color:transparent}button{color:inherit;cursor:pointer;background:0 0;border:0}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline-offset:5px;outline:2px solid #8adaed}button:disabled{opacity:.35;cursor:wait}button:hover{color:#fff}a:hover{text-decoration:underline}button{transition:opacity .2s,color .2s,background .2s}button svg{flex-shrink:0}.experience{flex-direction:column;max-width:1920px;min-height:100svh;margin:auto;padding:0 48px;display:flex}.map-stage{isolation:isolate;flex:1;height:calc(100svh - 230px);min-height:570px;position:relative}.rail-canvas{touch-action:none;cursor:grab;width:100%;height:100%;display:block;position:absolute;inset:0}.rail-canvas:active{cursor:grabbing}.stage-vignette{pointer-events:none;box-shadow:inset 0 25px 35px -20px var(--bg), inset 0 -30px 30px -20px var(--bg);z-index:1;position:absolute;inset:0}.day-panel{pointer-events:none;z-index:2;position:absolute;top:40px;left:0}.eyebrow{letter-spacing:2.3px;color:#9babb9;margin:0 0 12px;font-size:11px;font-weight:500}.clock{letter-spacing:-5px;font-variant-numeric:tabular-nums;align-items:baseline;gap:14px;font-family:Manrope,Noto Sans Thai,system-ui,sans-serif;font-size:88px;font-weight:200;line-height:1.15;display:flex}.clock>span{letter-spacing:2px;color:#8493a1;font-family:DM Sans,Noto Sans Thai,sans-serif;font-size:11px;font-weight:400}.live-count{color:#a2b0bb;align-items:center;gap:9px;margin:15px 0 0;font-size:15px;display:flex}.live-count strong{color:#eef4f7;font-variant-numeric:tabular-nums;font-weight:500}.pulse-dot{background:#8fdab4;border-radius:50%;width:5px;height:5px;margin-right:1px;animation:2s infinite pulse;box-shadow:0 0 9px #8fdab459}.pulse-dot.paused{background:#7d8992;animation:none}.map-caption{color:#617488;pointer-events:none;align-items:flex-start;gap:12px;font-size:12px;line-height:1.75;display:flex;position:absolute;top:46px;right:0}.map-caption p{margin:0}.small-line{background:#465869;width:22px;height:1px;margin-top:10px}.map-tools{border:1px solid var(--border);z-index:3;background:#0c141de0;border-radius:7px;flex-direction:column;align-items:center;padding:5px;display:flex;position:absolute;top:50%;right:0}.map-tools button{color:#a2b2bf;place-items:center;width:31px;height:34px;display:grid}.map-tools button:hover{background:#1c2a36;border-radius:4px}.map-tools>span{background:var(--border);width:20px;height:1px;margin:4px 0}.legend{z-index:2;background:linear-gradient(90deg,#080e16ec,#080e16a3 80%,#0000);width:242px;position:absolute;bottom:35px;left:0}.section-label{letter-spacing:1.8px;color:#687e91;justify-content:space-between;margin-bottom:17px;padding-right:3px;font-size:10px;display:flex}.section-label>span{font-size:9px}.legend-row{text-align:left;--cat:#fff;width:100%;padding:0 0 12px;display:block}.legend-top{color:#b7c5d0;align-items:center;gap:9px;font-size:13px;display:flex}.legend-dot{background:var(--cat);width:6px;height:6px;box-shadow:0 0 7px color-mix(in srgb, var(--cat), transparent 65%);border-radius:50%}.legend-top strong{color:#e5edf2;font-variant-numeric:tabular-nums;margin-left:auto;font-size:13px;font-weight:500}.legend-track{background:#22303c;height:2px;margin-top:9px;display:block}.legend-track>span{background:var(--cat);height:2px;transition:width .3s;display:block}.legend-row.disabled{opacity:.3}.legend-row:hover{opacity:.75}.legend-row.disabled .legend-track>span{width:0!important}.legend-hint{color:#65788b;margin:3px 0 0;font-size:10px}.map-scale{color:#5d7387;flex-direction:column;align-items:flex-end;gap:8px;font-size:10px;display:flex;position:absolute;bottom:32px;right:0}.map-scale i{border-bottom:1px solid #3c5062;border-left:1px solid #3c5062;border-right:1px solid #3c5062;height:5px}.playback{z-index:4;border-top:1px solid var(--border);flex-shrink:0;padding-top:19px;position:relative}.timeline-heading{letter-spacing:1.6px;color:#90a0ae;justify-content:space-between;align-items:center;font-size:10px;display:flex}.timeline-heading>span:last-child{letter-spacing:.4px;color:#6b8092;font-size:11px}.timeline{border-bottom:1px solid #354351;height:63px;margin-top:12px;position:relative}.timeline svg{width:100%;height:100%;display:block}.timeline input{opacity:0;cursor:ew-resize;width:100%;height:100%;margin:0;position:absolute;inset:0}.timeline:focus-within{outline-offset:5px;outline:1px solid #8adaed}.scrub-dot{pointer-events:none;background:#f3f5f7;border-radius:50%;width:7px;height:7px;position:absolute;bottom:-4px;transform:translate(-50%);box-shadow:0 0 10px #ffffff4a}.time-labels{color:#738596;justify-content:space-between;margin:10px -3px 0;display:flex}.time-labels button{font-variant-numeric:tabular-nums;padding:0 3px;font-size:10px}.control-bar{justify-content:space-between;align-items:center;height:63px;display:flex}.transport{align-items:center;gap:20px;display:flex}.play-button{color:#e3ebf1;background:#17232e;border:1px solid #384653;border-radius:50%;place-items:center;width:35px;height:35px;display:grid}.play-button:hover{background:#263749}.reset-button{color:#8b9dab;place-items:center;padding:0;display:grid}.speed-label{color:#728798;border-left:1px solid var(--border);align-items:center;gap:10px;padding-left:18px;font-size:12px;display:flex}.speed-label select{color:#d3dde5;cursor:pointer;background:0 0;border:0;padding:5px;font-size:12px}.speed-label option{background:#111c27}.keyboard-hint{color:#65798a;align-items:center;gap:5px;font-size:10px;display:flex}.keyboard-hint>span{margin:0 7px}kbd{color:#91a0ad;border:1px solid #293746;border-radius:3px;padding:2px 5px;font-family:inherit;font-size:9px}.train-picker{color:#b6c6d2;font-size:12px;position:relative}.train-picker summary{cursor:pointer;align-items:center;gap:8px;list-style:none;display:flex}.train-picker summary::-webkit-details-marker{display:none}.train-list{z-index:10;background:#101b27;border:1px solid #344452;border-radius:8px;width:320px;max-height:440px;padding:17px;position:absolute;bottom:35px;right:0;box-shadow:0 10px 50px #0008}.train-list label{font-size:12px;display:block}.train-list input{color:#eee;background:#0b141e;border:1px solid #364757;border-radius:4px;width:100%;margin:9px 0 12px;padding:10px;font-size:13px}.train-list>div{max-height:280px;overflow:auto}.train-list>div>button{text-align:left;border-bottom:1px solid #24323f;align-items:center;gap:8px;width:100%;padding:9px 0;font-size:12px;display:flex}.train-list>div>button>span{flex:1}.train-list i{border-radius:50%;flex-shrink:0;width:5px;height:5px}.train-list small{color:#7e91a0;margin-top:10px;font-size:10px;line-height:1.7;display:block}.footer{border-top:1px solid var(--border);color:#5f7385;flex-shrink:0;justify-content:space-between;align-items:center;gap:15px;min-height:39px;font-size:10px;display:flex}.footer a{color:#7c90a1}.footer-divider{padding:0 9px}.footer button{color:#7f92a3;align-items:center;gap:7px;padding:0;font-size:10px;display:flex}.trip-card{z-index:5;-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);background:#0d1723f5;border:1px solid #36495a;border-radius:8px;width:290px;padding:24px;position:absolute;top:130px;right:62px;box-shadow:0 15px 60px #0006}.close-button{color:#8498aa;place-items:center;padding:4px;display:grid;position:absolute;top:14px;right:14px}.trip-card .eyebrow{letter-spacing:1.6px;max-width:210px;font-size:9px}.trip-card h2{align-items:center;gap:10px;margin:13px 0 5px;font-family:Manrope,Noto Sans Thai,sans-serif;font-size:28px;font-weight:500;display:flex}.operator{color:#8195a7;margin:0 0 24px;font-size:12px}.journey{position:relative}.journey>div{align-items:flex-start;gap:12px;margin-bottom:17px;font-size:12px;line-height:1.5;display:flex}.journey>div>span{color:#b5c2cc;font-variant-numeric:tabular-nums}.journey strong{font-weight:500}.journey-line{display:none}.trip-current{color:#8a9faf;border-top:1px solid #263847;flex-direction:column;gap:5px;padding:15px 0 0;font-size:11px;display:flex}.trip-current strong{color:#e0e9ef;font-size:13px;font-weight:500}.trip-foot{color:#6d8395;margin:17px 0 0;font-size:10px}.data-dialog{color:#c4d1dd;background:#101b28;border:1px solid #3a4c5d;border-radius:12px;width:calc(100% - 32px);max-width:650px;max-height:85svh;padding:40px;box-shadow:0 30px 100px #000b}.data-dialog::backdrop{-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px);background:#03080dba}.data-dialog h2{color:#edf2f5;max-width:440px;margin:15px 0 24px;font-family:Georgia,serif;font-size:32px;font-weight:400;line-height:1.2}.data-dialog p,.data-dialog li{color:#9cafbe;font-size:14px;line-height:1.85}.data-dialog .eyebrow{font-size:10px;line-height:1.5}.data-dialog h3{color:#dce5ed;margin-top:27px;font-size:15px;font-weight:500}.data-dialog a{color:#a9d6e8;text-underline-offset:3px;text-decoration:underline}.data-dialog ul{padding-left:18px}.data-facts{border-block:1px solid #30414e;grid-template-columns:1fr 1fr;gap:24px;margin:24px 0;padding:22px 0;display:grid}.data-facts strong{color:#f3f6f8;font-family:Manrope,Noto Sans Thai,sans-serif;font-size:30px;font-weight:300;display:block}.data-facts span{color:#879cab;margin-top:6px;font-size:11px;line-height:1.5;display:block}.download-link{align-items:center;gap:8px;margin-top:12px;font-size:12px;display:inline-flex}.loading-state{color:#aabac8;z-index:1;background:radial-gradient(#1422345a,#0000 60%);flex-direction:column;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.loading-state p{font-size:16px}.loading-state small{color:#718799;font-size:12px}.loading-state button{border:1px solid var(--border);border-radius:6px;padding:12px}.loader{border:1px solid #304355;border-top-color:#e6c379;border-radius:50%;width:30px;height:30px;animation:1s linear infinite spin;display:block}@keyframes spin{to{transform:rotate(360deg)}}@keyframes pulse{50%{opacity:.4}}@media (min-width:1600px){.experience{padding:0 70px}.map-stage{min-height:650px}.clock{font-size:100px}.legend{width:260px}}@media (max-width:1100px){.experience{padding:0 28px}.day-panel{top:28px}.clock{font-size:70px}.legend{width:205px;bottom:25px}.map-caption{display:none}.map-stage{min-height:570px}.trip-card{top:100px;right:48px}.eyebrow{font-size:10px}.keyboard-hint,.map-scale{display:none}}@media (max-width:700px){.experience{padding:0 20px}.map-stage{flex:none;height:640px;min-height:0}.rail-canvas{height:calc(100% - 80px);top:80px}.day-panel{top:22px}.eyebrow{letter-spacing:1.4px;font-size:9px}.clock{letter-spacing:-3px;gap:10px;font-size:62px}.clock>span{font-size:9px}.live-count{margin-top:8px;font-size:12px}.legend{background:linear-gradient(90deg,#080e16f5,#080e16b8 85%,#0000);width:155px;padding:8px 8px 0 0;bottom:8px}.section-label{letter-spacing:1px;margin-bottom:10px;font-size:8px}.section-label>span{font-size:8px}.legend-row{padding-bottom:9px}.legend-top,.legend-top strong{font-size:10px}.legend-dot{width:5px;height:5px}.legend-track{margin-top:7px}.legend-hint{max-width:140px;font-size:8px;line-height:1.5}.map-tools{padding:3px;top:125px;right:0}.map-tools button{width:27px;height:30px}.timeline-heading{letter-spacing:1px;font-size:8px}.timeline-heading>span:last-child{letter-spacing:0;font-size:9px}.playback{padding-top:16px}.timeline{height:48px}.control-bar{height:61px}.time-labels button{font-size:9px}.transport{gap:14px}.speed-label{gap:5px;padding-left:10px}.speed-label>span{display:none}.train-picker{font-size:11px}.footer{flex-direction:column;align-items:flex-start;gap:8px;padding:12px 0 18px;font-size:9px;line-height:1.6}.footer button{font-size:9px}.footer-divider{padding:0 5px}.trip-card{width:245px;max-height:380px;padding:22px;top:205px;right:0;overflow:auto}.trip-card h2{font-size:25px}.train-list{width:min(320px,100vw - 40px)}.data-dialog{padding:30px 24px}.data-dialog h2{font-size:29px}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none!important;animation:none!important}}.eyebrow,.section-label,.section-label>span,.legend-hint,.timeline-heading,.timeline-heading>span:last-child,.time-labels button,.footer,.footer button,.keyboard-hint,kbd,.map-caption,.trip-card .eyebrow,.trip-foot,.train-list small{font-size:12px}.legend-top,.legend-top strong{font-size:14px}.legend{width:255px}.legend-hint{line-height:1.6}.timeline-heading{letter-spacing:1px}.train-list label,.train-list>div>button{font-size:14px}.train-list{width:350px}.data-dialog p,.data-dialog li{font-size:16px}.data-dialog .eyebrow,.data-facts span,.download-link{font-size:12px}.footer{padding-block:10px;line-height:1.6}.map-stage{height:calc(100svh - 247px)}@media (max-width:1100px){.legend{width:220px}.eyebrow,.footer,.footer button{font-size:11px}}@media (max-width:700px){.day-panel .eyebrow{font-size:10px}.map-stage{height:650px}.rail-canvas{height:calc(100% - 170px);top:65px}.legend{background:0 0;grid-template-columns:1fr 1fr;column-gap:20px;width:100%;padding:0;display:grid;bottom:13px}.legend .section-label{grid-column:1/-1;margin-bottom:12px;font-size:10px}.legend .section-label>span{display:none}.legend-top,.legend-top strong{font-size:12px}.legend-row{padding-bottom:12px}.legend-hint{display:none}.timeline-heading{font-size:10px}.timeline-heading>span:last-child{text-align:right;max-width:145px;font-size:10px}.time-labels button{font-size:10px}.footer,.footer button{font-size:11px}.train-list{width:min(350px,100vw - 40px)}.trip-card{top:190px}.trip-card .eyebrow{font-size:10px}}.service-card{scrollbar-width:thin;scrollbar-color:#405669 transparent;width:355px;max-height:min(740px,100svh - 150px);padding:22px;top:85px;overflow:auto}.service-card .operator{margin-bottom:13px}.route-caption{color:#a5b8c8;margin:0 0 15px;font-size:12px;line-height:1.6}.route-caption span{color:#6b8295;padding:0 3px}.progress-status{color:#a4bfd0;border-top:1px solid #2b3e4e;padding:13px 0;font-size:12px;line-height:1.5}.progress-status b{color:#e4edf3;font-weight:500}.progress-status>span{color:#93e1bb;margin-top:3px;display:block}.progress-pair{border-top:1px solid #253948;border-bottom:1px solid #253948;grid-template-columns:1fr 1fr;gap:13px;padding:14px 0;display:grid}.progress-stop{min-width:0}.progress-stop>span{text-transform:uppercase;letter-spacing:1px;color:#8ba2b5;margin-bottom:8px;font-size:9px;display:block}.progress-stop button{text-align:left;color:#e2ebf2;padding:0;font-size:13px;line-height:1.5;display:block}.progress-stop button:hover{color:#93e1bb}.progress-stop strong{color:#a2b4c3;font-size:12px;font-weight:400}.progress-stop time{color:#bbccd9;font-variant-numeric:tabular-nums;margin-top:6px;font-size:12px;display:block}.stop-details summary{cursor:pointer;color:#c6d8e4;justify-content:space-between;align-items:center;padding:16px 0 8px;font-size:12px;list-style:none;display:flex}.stop-details summary::-webkit-details-marker{display:none}.stop-details[open] summary svg{transform:rotate(90deg)}.stop-list{scrollbar-width:thin;max-height:230px;margin-top:12px;overflow:auto}.stop-list-heading{letter-spacing:1px;color:#8da7ba;justify-content:space-between;padding:0 8px 9px;font-size:9px;display:flex}.stop-list button{text-align:left;border-top:1px solid #253746;justify-content:space-between;align-items:center;gap:12px;width:100%;padding:10px 8px;font-size:12px;line-height:1.5;display:flex}.stop-list button:hover{background:#203345}.stop-list button>span:first-child{padding-left:13px;position:relative}.stop-list i{border:1px solid #8fa6b8;border-radius:50%;width:5px;height:5px;position:absolute;top:6px;left:0}.stop-list button.current{color:#a5edc9;background:#18372f}.stop-list button.passed{color:#8da3b5}.stop-list small{color:#93e1bb;display:block}.stop-times{text-align:right;font-variant-numeric:tabular-nums;flex-shrink:0;font-size:11px}.stop-times time{display:block}.station-card h2{padding-right:10px;font-size:21px;line-height:1.35}.station-card h2 svg{flex-shrink:0}.board-date{color:#9ab1c4;margin:10px 0 18px;font-size:12px}.board-tabs{background:#08131d;border:1px solid #2b4052;border-radius:6px;gap:5px;padding:4px;display:flex}.board-tabs button{color:#a3b8c8;border-radius:4px;flex:1;padding:8px 12px;font-size:12px}.board-tabs button[aria-pressed=true]{color:#eff6fa;background:#294459}.board-rows>button{text-align:left;border-bottom:1px solid #293c4b;align-items:center;gap:14px;width:100%;padding:13px 0;display:flex}.board-rows>button:hover{background:#213346}.board-rows time{color:#e5eff4;font-variant-numeric:tabular-nums;font-size:15px}.board-rows>button>span{flex:1;min-width:0}.board-rows b{font-size:11px;font-weight:500}.board-rows strong{color:#dbe7ef;font-size:12px;font-weight:500;line-height:1.5;display:block}.board-rows small{color:#91a7b9;margin-top:2px;font-size:10px;display:block}.expand-board{color:#e4f0f7;background:#244158;border:1px solid #41617a;border-radius:5px;justify-content:space-between;align-items:center;width:100%;margin-top:16px;padding:13px 12px;font-size:12px;display:flex}.expand-board:hover{background:#30516a}.back-to-trip{text-align:center;color:#9bb6c9;width:100%;padding:12px 0 0;font-size:11px;display:block}.station-dialog{max-width:740px}.station-dialog .board-help{font-size:13px}.board-controls{justify-content:space-between;align-items:center;gap:18px;margin:22px 0 12px;display:flex}.board-controls label{align-items:center;gap:8px;font-size:12px;display:flex}.board-controls input{accent-color:#93e1bb}.station-dialog .board-count{color:#9bb1c1;font-size:11px}.empty-board{color:#a1b5c4;padding:15px 0;font-size:12px;line-height:1.6}.station-picker .train-list{right:0}.control-bar{gap:22px;height:auto;min-height:96px;padding:14px 0}.speed-control{background:#152432;border:1px solid #3b5367;border-radius:8px;width:224px;padding:10px 14px 7px}.speed-control label{color:#b6cbda;justify-content:space-between;align-items:center;font-size:12px;display:flex}.speed-control label strong{color:#a0e8c4;font-variant-numeric:tabular-nums;font-size:14px;font-weight:500}.speed-control input{accent-color:#93e1bb;cursor:pointer;width:100%;height:22px;margin:8px 0 0;display:block}.speed-stops{justify-content:space-between;margin:0 -4px;display:flex}.speed-stops button{color:#a0b7c8;padding:3px 4px;font-size:10px}.speed-stops button.active{color:#b2f4d2}@media (max-width:1100px){.control-bar .keyboard-hint{display:none}}@media (max-width:700px){.control-bar{flex-wrap:wrap;gap:20px 12px;padding:17px 0}.transport{gap:16px;width:100%}.speed-control{flex:1;width:auto}.train-picker{flex:1}.train-picker>summary{justify-content:flex-end}.station-picker>summary{justify-content:flex-start}.station-picker .train-list{left:0;right:auto}.service-card{z-index:20;width:auto;max-height:calc(100svh - 36px);padding:20px;position:fixed;inset:auto 12px 14px}.service-card .stop-list{max-height:25svh}.service-card h2{font-size:22px}.service-card .route-caption{margin-bottom:9px}.service-card .progress-status{padding:10px 0}.station-dialog{padding:30px 18px}.station-dialog h2{font-size:24px}.board-controls{flex-wrap:wrap;gap:12px}}.map-stage:has(.service-card){z-index:6}.follow-button{color:#d7eaf7;background:#213a4d;border:1px solid #41627a;border-radius:6px;justify-content:center;align-items:center;gap:9px;width:100%;margin:0 0 15px;padding:10px;font-size:12px;display:flex}.follow-button[aria-pressed=true]{color:#a4edc9;background:#1d4038;border-color:#6db795}.follow-button:hover{filter:brightness(1.2)}.follow-button:disabled{opacity:.5;cursor:default}.follow-note{color:#9bb1c2;margin:-6px 0 12px;font-size:10px;line-height:1.5}.station-hint{z-index:7;color:#e2ecf3;background:#101e2bf5;border:1px solid #496072;border-radius:7px;width:max-content;max-width:min(260px,100% - 16px);padding:10px 13px;font-size:12px;line-height:1.45;position:absolute;transform:translate(-50%,-100%);box-shadow:0 5px 20px #0006}.station-hint strong{overflow-wrap:anywhere;font-weight:500;display:block}.station-traffic{color:#a5b0c9;margin:5px 0 0;font-size:10px;line-height:1.5;display:block}.station-card .station-traffic{margin:-6px 0 16px}.station-hint.hover{pointer-events:none}.station-hint.touch{width:260px;padding:12px}.station-hint.touch strong{padding-right:22px}.hint-close{color:#a8bfce;padding:7px;position:absolute;top:5px;right:5px}.hint-open{color:#e5f1f8;background:#29485e;border-radius:4px;justify-content:space-between;align-items:center;gap:12px;width:100%;margin-top:10px;padding:8px 10px;font-size:12px;display:flex}.hint-open:hover{background:#365b74}.night-experience{max-width:none;height:100svh;min-height:720px;padding:0;overflow:hidden}.night-experience .map-stage{z-index:auto;flex:auto;height:auto;min-height:0}.night-experience .rail-canvas{width:100%;height:100%;inset:0}.night-experience .day-panel{top:32px;left:36px}.night-experience .day-panel .eyebrow{letter-spacing:2px;color:#a5b0c9;font-size:10px}.night-experience .clock{letter-spacing:-3px;font-size:64px;font-weight:300}.night-experience .clock>span{color:#a5b0c9}.night-experience .live-count{color:#a5b0c9;margin-top:12px;font-size:13px}.night-experience .map-tools{background:#172033;border-radius:12px;inset:auto auto 24px 28px}.discovery-tools{z-index:9;flex-direction:column;gap:8px;width:192px;display:flex;position:absolute;top:32px;right:28px}.discovery-tools .train-picker{flex:none;width:100%}.discovery-tools summary{border:1px solid var(--border);color:#d5dcee;background:#172033;border-radius:12px;justify-content:space-between;min-height:44px;padding:12px 16px}.discovery-tools summary:hover,.discovery-tools details[open] summary{border-color:#827261}.discovery-tools details[open] summary svg{transform:rotate(90deg)}.discovery-tools .train-list{background:#172033;border-color:#3b4963;border-radius:14px;width:340px;max-height:calc(100svh - 370px);inset:calc(100% + 8px) 0 auto auto;overflow:auto}.discovery-tools .train-list>div{max-height:230px}.discovery-tools .train-list input{background:#0e1728;border-color:#3b4963}.night-experience .service-card{-webkit-backdrop-filter:none;backdrop-filter:none;scrollbar-width:thin;scrollbar-color:#465573 transparent;background:#172033;border-color:#3b4963;border-radius:16px;width:336px;max-height:calc(100% - 162px);padding:22px;top:146px;right:28px}.night-experience .service-card h2{font-size:25px}.night-experience .service-card .operator{margin-bottom:14px}.night-experience .service-card .follow-button,.night-experience .board-expand{color:#f1d2ac;background:#2c3546;border-color:#62574c;border-radius:8px}.night-experience .service-card .follow-button[aria-pressed=true]{color:#f5d4a9;background:#3f352c;border-color:#b59776}.night-dock{z-index:4;flex:none;margin:0 28px;position:relative}.dock-panel{background:#141e30;border:1px solid #303c53;border-radius:18px;padding:12px 22px 14px;box-shadow:0 12px 50px #03061055}.night-dock .legend{background:0 0;border-bottom:1px solid #2b374e;justify-content:center;align-items:center;gap:8px;width:auto;margin:0 0 12px;padding:0 0 12px;display:flex;position:static}.night-dock .section-label{letter-spacing:1.4px;color:#a5b0c9;white-space:nowrap;margin:0 12px 0 0;font-size:9px}.night-dock .legend-row{background:#1c293e;border:1px solid #344057;border-radius:9px;width:auto;min-width:145px;padding:9px 12px}.night-dock .legend-row:hover{border-color:var(--cat)}.night-dock .legend-row.disabled{opacity:1;background:#111b2b;border-style:dashed}.night-dock .legend-row.disabled .legend-dot{border:1px solid var(--cat);box-shadow:none;background:0 0}.night-dock .legend-row.disabled .legend-top{opacity:.5}.night-dock .legend-top{color:#d3dbea;gap:8px;font-size:11px}.night-dock .legend-top strong{color:var(--cat);text-align:right;min-width:34px;font-size:12px}.night-dock .legend-dot{flex-shrink:0}.night-dock .playback{border:0;grid-template-columns:minmax(0,1fr) 312px;column-gap:28px;padding:0;display:grid}.night-dock .timeline-heading{color:#a5b0c9;letter-spacing:1.2px;grid-column:1;font-size:9px}.night-dock .timeline-heading>span:last-child{letter-spacing:0;font-size:10px}.night-dock .timeline{grid-column:1;height:38px;margin-top:5px}.night-dock .time-labels{color:#a5b0c9;grid-column:1;margin-top:6px}.night-dock .time-labels button{padding:3px 0;font-size:9px}.night-dock .scrub-dot{background:#e9bd87;box-shadow:0 0 12px #e9bd8755}.night-dock .control-bar{border-left:1px solid #303c53;flex-direction:column;grid-area:1/2/4;justify-content:center;gap:10px;min-height:0;padding:0 0 0 22px;display:flex}.night-dock .transport{gap:12px;width:100%}.night-dock .play-button{color:#162032;background:#e9bd87;border-color:#e9bd87;flex-shrink:0;width:40px;height:40px}.night-dock .play-button:hover{background:#f4d2a8}.night-dock .reset-button{min-width:28px;height:36px}.night-dock .speed-control{background:0 0;border:0;flex:1;width:auto;padding:0}.night-dock .speed-control label{color:#a5b0c9;font-size:10px}.night-dock .speed-control label strong{color:#e9bd87;font-size:12px}.night-dock .speed-control input{accent-color:#e9bd87;height:16px;margin-top:4px}.night-dock .speed-stops button{color:#a5b0c9;font-size:9px}.night-dock .speed-stops button.active{color:#e9bd87}.night-dock .keyboard-hint{display:none}.night-dock .footer{color:#8795af;border:0;min-height:36px;padding:5px 4px;font-size:9px}.night-dock .footer a,.night-dock .footer button{color:#a5b0c9;font-size:9px}@media (min-width:1600px){.night-experience .day-panel{top:40px;left:48px}.night-experience .clock{font-size:76px}.night-dock{width:min(1400px,100% - 80px);margin:0 auto}.discovery-tools{top:40px;right:40px}.night-experience .service-card{max-height:calc(100% - 170px);top:154px;right:40px}}@media (max-width:900px){.night-dock{margin:0 16px}.dock-panel{padding:10px 14px}.night-dock .section-label{display:none}.night-dock .legend-row{flex:1;min-width:0}.night-dock .playback{grid-template-columns:minmax(0,1fr) 245px;column-gap:16px}.night-dock .control-bar{padding-left:16px}.night-experience .day-panel{top:24px;left:24px}.night-experience .clock{font-size:56px}.discovery-tools{width:175px;top:24px;right:20px}.night-experience .service-card{right:20px}}@media (max-width:600px){.night-experience{min-height:760px;overflow:visible}.night-experience .map-stage{min-height:460px}.night-experience .rail-canvas{height:calc(100% - 84px);top:84px}.night-experience .day-panel{top:18px;left:18px}.night-experience .day-panel .eyebrow{letter-spacing:1px;max-width:180px;font-size:8px}.night-experience .clock{font-size:46px}.night-experience .clock>span{font-size:8px}.night-experience .live-count{gap:6px;margin-top:5px;font-size:10px}.discovery-tools{gap:6px;width:145px;top:40px;right:14px}.discovery-tools summary{border-radius:10px;min-height:38px;padding:10px;font-size:10px}.discovery-tools .train-list{width:min(340px,100vw - 28px);max-height:340px}.discovery-tools .train-list>div{max-height:200px}.night-experience .map-tools{bottom:16px;left:14px;right:auto}.night-dock{margin:0 10px}.dock-panel{border-radius:16px;padding:10px 12px}.night-dock .legend{grid-template-columns:1fr 1fr;gap:6px;margin-bottom:10px;padding-bottom:10px;display:grid}.night-dock .legend-row{padding:8px 10px}.night-dock .legend-top{font-size:10px}.night-dock .playback{grid-template-columns:1fr}.night-dock .timeline{height:32px}.night-dock .control-bar{border-left:0;grid-area:4/1;padding:10px 0 0}.night-dock .transport{gap:12px}.night-dock .speed-control{grid-template-columns:auto 1fr;column-gap:12px;display:grid}.night-dock .speed-control label{flex-direction:column;grid-row:1/3;justify-content:center;gap:4px}.night-dock .speed-stops{grid-column:2}.night-dock .speed-control input{min-width:0}.night-dock .footer{text-align:center;flex-direction:column;align-items:center;gap:5px;padding:10px 0;line-height:1.4}.night-dock .footer-divider{padding:0 4px}.night-experience .service-card{z-index:20;width:auto;max-height:min(62svh,510px);padding:18px;position:fixed;inset:auto 10px 12px}.night-experience .map-stage:has(.service-card){z-index:6}}@media (prefers-reduced-motion:reduce){.night-experience .pulse-dot{animation:none}}.rail-static{pointer-events:none}.mobile-overlay-toggle,.immersive-credits{display:none}.day-load-status{z-index:4;color:#b8c4d9;background:#172033;border:1px solid #3b4963;border-radius:9px;flex-wrap:wrap;align-items:center;gap:8px;max-width:calc(100% - 72px);padding:9px 12px;font-size:11px;display:flex;position:absolute;top:200px;left:36px}.day-load-status.waiting{border-color:#827261}.day-load-status button{color:#f5d4a9;padding:4px 0;text-decoration:underline}@media (max-width:600px){.day-load-status{max-width:calc(100% - 28px);font-size:10px;top:132px;left:14px}.map-immersive .day-load-status:not(.waiting){display:none}.map-immersive .day-load-status.waiting{top:auto;bottom:94px}.mobile-overlay-toggle{z-index:25;color:#f5d4a9;background:#172033;border:1px solid #59657a;border-radius:12px;justify-content:center;align-items:center;gap:8px;min-width:44px;min-height:44px;padding:10px;font-size:12px;display:flex;position:absolute;bottom:16px;right:14px}.satellite-active .mobile-overlay-toggle{bottom:44px}.night-experience:not(.map-immersive) .map-stage:has(.service-card) .mobile-overlay-toggle{top:132px;bottom:auto}.night-experience.map-immersive{height:100dvh;min-height:0;overflow:hidden}.night-experience.map-immersive .map-stage{height:100%;min-height:0}.night-experience.map-immersive .rail-canvas{height:100%;inset:0}.map-immersive .day-panel,.map-immersive .discovery-tools,.map-immersive .night-dock,.map-immersive .map-tools,.map-immersive .basemap-controls,.map-immersive .service-card,.map-immersive .stage-vignette,.map-immersive .basemap-status{display:none}.map-immersive .mobile-overlay-toggle{bottom:max(36px, calc(env(safe-area-inset-bottom) + 16px));right:max(14px, env(safe-area-inset-right));padding:10px 14px}.map-immersive .immersive-credits{left:14px;bottom:max(7px, env(safe-area-inset-bottom));z-index:3;color:#c6cfe0;background:#101a2bdd;border-radius:3px;padding:2px 4px;font-size:8px;display:block;position:absolute}.map-immersive.satellite-active .immersive-credits{bottom:max(33px, calc(env(safe-area-inset-bottom) + 26px))}.map-immersive .satellite-attribution,.map-immersive .maptiler-logo{bottom:max(6px, env(safe-area-inset-bottom))}}.basemap-controls{z-index:3;background:#172033;border:1px solid #3b4963;border-radius:12px;gap:3px;padding:4px;display:flex;position:absolute;bottom:24px;left:84px}.basemap-controls button{color:#a5b0c9;border-radius:8px;justify-content:center;align-items:center;gap:7px;min-height:36px;padding:0 12px;font-size:11px;display:flex}.basemap-controls button[aria-pressed=true]{color:#f5d4a9;background:#3f352c}.basemap-controls button:hover{color:#fff}.basemap-controls button:focus-visible{outline-offset:2px;outline:2px solid #e9bd87}.basemap-status{z-index:3;color:#c6cfe0;background:#172033;border:1px solid #3b4963;border-radius:10px;max-width:calc(100% - 100px);margin:0;padding:9px 12px;font-size:11px;position:absolute;bottom:99px;left:84px}.basemap-error{flex-direction:column;gap:8px;display:flex}.basemap-error button{color:#f5d4a9;text-align:left;text-decoration:underline}.satellite-active .basemap-controls,.night-experience.satellite-active .map-tools{bottom:44px}.satellite-active .stage-vignette{box-shadow:inset 0 160px 90px -90px #080f20,inset 0 -35px 30px -20px #080f20}.maptiler-logo{z-index:3;line-height:0;position:absolute;bottom:7px;left:28px}.maptiler-logo img{display:block}.satellite-attribution{z-index:3;color:#d3dbea;background:#101a2bdd;border-radius:3px;gap:7px;padding:3px 5px;font-size:9px;display:flex;position:absolute;bottom:5px;right:12px}.satellite-attribution a:hover{text-decoration:underline}@media (max-width:600px){.basemap-controls{bottom:16px;left:68px}.basemap-controls button{min-height:36px;padding:0 10px}.basemap-status{max-width:calc(100% - 82px);left:68px}.maptiler-logo{bottom:6px;left:14px}.maptiler-logo img{width:74px;height:20px}.satellite-attribution{gap:4px;font-size:8px;bottom:6px;right:9px}}.frame-diagnostics{z-index:40;background:#172033;border:1px solid #7989a3;border-radius:14px;width:min(315px,100vw - 28px);padding:16px;font-size:12px;position:fixed;top:145px;left:14px;box-shadow:0 8px 30px #0008}.diagnostics-heading{justify-content:space-between;align-items:center;gap:10px;display:flex}.diagnostics-heading button{padding:6px}.frame-diagnostics p{color:#a5b0c9;margin:8px 0 12px;font-size:11px}.diagnostics-modes{gap:6px;display:flex}.diagnostics-modes button{border:1px solid #59657a;border-radius:6px;flex:1;padding:9px 4px;font-size:11px}.diagnostics-modes button[aria-pressed=true]{color:#172033;background:#e9bd87;border-color:#e9bd87}.frame-diagnostics output{font-variant-numeric:tabular-nums;flex-direction:column;gap:6px;padding:14px 0;display:flex}.frame-diagnostics output strong{color:#e9bd87;font-size:24px}.frame-diagnostics small{color:#bac5d9;font-size:10px;line-height:1.6;display:block}.thai{color:#8ea3b6;letter-spacing:0;margin-top:2px;font-size:.82em;font-weight:400;line-height:1.45;display:block}.thai-inline{color:#8ea3b6;font-weight:400}.station-hint .thai{font-size:11px}.trip-card h2>span{min-width:0}.trip-card h2 .thai{margin-top:4px;font-family:DM Sans,Noto Sans Thai,sans-serif;font-size:13px}.data-dialog h2 .thai{color:#9cafbe;margin-top:8px;font-family:DM Sans,Noto Sans Thai,sans-serif;font-size:15px}.operator .thai,.route-caption .thai,.progress-stop button .thai,.stop-list .thai{font-size:11px}.stop-list small.current-label{color:#93e1bb;display:block}.board-rows b{align-items:center;gap:5px;display:inline-flex}.board-rows strong .thai{margin-top:1px;font-size:10px}.data-dialog code{color:#c4d1dd;font-size:.9em}.line-eyebrow{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.line-badge{background:var(--line);color:#0b1220;letter-spacing:1px;border-radius:4px;padding:2px 6px;font-size:9px;font-weight:650;line-height:1.4;display:inline-block}.transfers{color:#9ab1c4;flex-wrap:wrap;align-items:center;gap:6px 10px;margin:-6px 0 16px;font-size:11px;display:flex}.transfers>span{align-items:center;gap:5px;display:inline-flex}.transfers button{color:#dbe7ef;border:1px solid #3b4963;border-radius:999px;align-items:center;gap:3px;padding:3px 8px;font-size:11px;display:inline-flex}.transfers button:hover{border-color:#827261}.train-list>div>button>svg:first-child{color:#9fb2c2}.train-list>div>button .thai{font-size:11px}.legend-item{position:relative}.legend-cluster{flex-shrink:0;display:inline-flex}.legend-cluster i{border-radius:50%;width:6px;height:6px;margin-right:-1px;box-shadow:0 0 0 1px #1c293e}.line-key{z-index:30;color:#d3dbea;white-space:nowrap;background:#172033;border:1px solid #3b4963;border-radius:10px;flex-direction:column;gap:6px;min-width:190px;padding:10px 12px;font-size:11px;display:none;position:absolute;bottom:calc(100% + 8px);left:0;box-shadow:0 8px 30px #0008}.line-key span{align-items:center;gap:8px;display:flex}.line-key i{border-radius:2px;flex-shrink:0;width:14px;height:4px}.legend-item:hover .line-key,.legend-item:focus-within .line-key,.legend-item.key-open .line-key{display:flex}@media (hover:none){.legend-item:hover:not(.key-open) .line-key,.legend-item:focus-within:not(.key-open) .line-key{display:none}}.night-dock .legend-item{min-width:138px}.night-dock .legend-item .legend-row{width:100%;min-width:0}.night-dock .legend-row.multi .legend-top strong{color:#e5edf2}.night-dock .legend-row.disabled .legend-cluster{opacity:.45}@media (max-width:1180px){.night-dock .legend-item{flex:1;min-width:0}.night-dock .legend-row{padding:9px 10px}}@media (max-width:900px){.night-dock .legend-top{gap:6px}}@media (max-width:600px){.night-dock .legend{grid-template-columns:1fr 1fr}.night-dock .legend-item:last-child{grid-column:1/-1}.line-key{min-width:0;max-width:calc(100vw - 40px)}.legend-item:nth-child(3) .line-key{left:auto;right:0}}.board-rows time{flex:0 0 3.7em}.legend-name{white-space:nowrap;align-items:baseline;gap:5px;display:inline-flex}.legend-name small{letter-spacing:.3px;color:#a5b0c9;font-size:9px}.night-dock .legend-row[aria-pressed=mixed]{border-style:solid}