@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Noto+Sans+KR:wght@400;500;600;700;800;900&display=swap');
:root{--ink:#183f35;--green:#205540;--muted:#7b8781;--line:#e4e9e3;--paper:#f7f8f3;--coral:#e68169}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font:14px 'DM Sans','Noto Sans KR',sans-serif}button,a,input,select{font:inherit}button{cursor:pointer;border:0;background:none;color:inherit;transition:.18s}button:hover{filter:brightness(.94);background-color:#edf1e9}button:disabled{opacity:.45;cursor:default}button:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible{outline:3px solid #e68169;outline-offset:3px}header{height:90px;max-width:1440px;margin:auto;padding:0 48px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{display:flex;gap:12px;color:var(--ink);text-decoration:none;font-size:20px;font-weight:800;align-items:center}.brand-icon{background:var(--green);color:#f0edba;font-size:35px;border-radius:13px;width:46px;height:46px;display:grid;place-items:center}.brand small{display:block;font-size:9px;letter-spacing:2.3px;margin-top:3px}nav{display:flex;gap:25px;align-items:center}nav button{font-size:12px;font-weight:600;padding:10px}.icon-button{font-size:23px}main{max-width:1440px;margin:auto;padding:34px 48px 0}.intro{display:flex;align-items:center;justify-content:space-between;margin-bottom:30px}.eyebrow{font-size:10px;font-weight:700;letter-spacing:1.8px;display:flex;gap:8px;align-items:center}.live-dot{width:6px;height:6px;background:#87ab5d;border-radius:50%;display:inline-block}h1{font-size:38px;letter-spacing:-1.8px;margin:12px 0 9px;font-weight:800}h1 span{color:#718573}.intro p{margin:0;color:#748077;font-size:13px}.edition{text-align:right;font-size:10px;letter-spacing:1.8px}.edition b{display:inline-block;margin-left:12px;padding:5px 7px;border:1px solid #c5cfbd;border-radius:5px}.edition span{display:block;letter-spacing:0;margin-top:12px;color:#899184}.mission{background:white;display:flex;align-items:center;gap:35px;border:1px solid var(--line);border-radius:14px;padding:23px 26px;margin-bottom:20px}.mission-label{padding-right:30px;border-right:1px solid var(--line);display:flex;flex-direction:column;gap:5px}.mission-label span{font-weight:700;font-size:12px}.mission-label b{font-size:8px;letter-spacing:1.4px;color:var(--muted)}.endpoints{display:flex;gap:30px;align-items:center;flex:1}.endpoints small{display:flex;gap:6px;align-items:center;font-size:10px;color:var(--muted);margin-bottom:5px}.endpoints strong{font-size:21px;letter-spacing:-.7px}.point{width:7px;height:7px;border-radius:50%;display:inline-block}.start{background:var(--green)}.end{background:var(--coral)}.journey-arrow{color:#a2ada2}.mission-meta{display:flex;flex-direction:column;gap:6px;font-size:12px}.mission-meta small{font-size:9px;color:var(--muted)}.outline{border:1px solid #d9e2d7;border-radius:8px;padding:10px 14px;font-size:11px;font-weight:600}.play-layout{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:20px}.map-panel{background:white;border:1px solid var(--line);border-radius:15px;overflow:hidden;display:flex;flex-direction:column}.map-heading{padding:18px 21px;display:flex;justify-content:space-between;align-items:center}.map-heading>div{display:flex;align-items:center;gap:9px}.map-heading b{font-size:12px}.map-heading button{font-size:10px}.pill{font-size:9px;background:#f1f3e8;color:#84915a;border-radius:4px;padding:4px 6px}#mapArea{position:relative;flex:1;min-height:545px;background:#eef0e8;overflow:hidden}#seoulMap{width:100%;height:100%;position:absolute;inset:0;object-fit:contain}#kakaoMap{position:absolute;inset:0;display:none}.map-note{position:absolute;top:19px;left:19px;display:flex;gap:10px;align-items:center;background:#ffffffed;border:1px solid white;border-radius:9px;box-shadow:0 4px 15px #26372906;padding:12px 15px;pointer-events:none}.map-note>span{font-size:24px}.map-note b{display:block;font-size:11px}.map-note small{font-size:9px;color:var(--muted);display:block;margin-top:4px}.compass{position:absolute;right:22px;top:23px;font-size:9px;text-align:center;color:#7e9085;pointer-events:none}.compass span{display:block;font-size:24px}.map-zoom{position:absolute;right:18px;bottom:36px;background:white;border:1px solid #dfe4d9;border-radius:8px;overflow:hidden;display:flex;flex-direction:column}.map-zoom button{font-size:22px;width:32px;height:33px}.map-credit{position:absolute;bottom:8px;right:10px;font-size:8px;color:#758476;background:#f8faf3c9;padding:3px}.map-legend{display:flex;justify-content:center;gap:25px;padding:15px;font-size:9px;color:#738174}.map-legend span{display:flex;align-items:center;gap:5px}.map-legend i{width:16px;height:3px;display:inline-block}.timer-card{padding:20px 23px;background:var(--green);color:white;border-radius:14px}.timer-card>div:first-child{display:flex;align-items:center;justify-content:space-between;font-size:11px;color:#e0e9d9}.timer-status{font-size:9px;border:1px solid #65836b;border-radius:4px;padding:3px 6px;letter-spacing:1px}.timer-card>strong{font-size:52px;display:block;font-weight:500;letter-spacing:1px;line-height:1.5;font-variant-numeric:tabular-nums}.time-track{height:4px;background:#4b7259;border-radius:4px;overflow:hidden}.time-track i{height:100%;display:block;background:#d5e4b7;transition:width 1s linear}.timer-card>small{display:block;font-size:9px;color:#b2c5af;margin-top:12px}.status-card{background:white;border:1px solid var(--line);border-radius:12px;margin:12px 0;padding:18px}.stats{display:grid;grid-template-columns:1fr 1fr;gap:20px}.stats>div+div{border-left:1px solid var(--line);padding-left:20px}.stats small{font-size:10px;color:var(--muted)}.stats strong{display:block;font-size:24px;margin-top:5px}.stats strong span{font-size:11px;font-weight:500;margin-left:4px}.position{margin-top:14px;padding-top:12px;border-top:1px solid var(--line);display:flex;justify-content:space-between;font-size:10px}.position span{color:var(--muted)}.choices-card{border:1px solid var(--line);border-radius:12px;padding:18px;background:white}.section-label{display:flex;justify-content:space-between;align-items:center}.section-label>b{font-size:12px}.section-label>span{font-size:10px;color:#809080}.mode-tabs{display:flex;gap:3px;margin:15px 0 13px;border-bottom:1px solid var(--line);padding-bottom:10px}.mode-tabs button{font-size:10px;flex:1;padding:6px 0;border-radius:5px;white-space:nowrap;color:#7d897b}.mode-tabs .active{background:#e9eee3;color:#2c5b45;font-weight:700}#choices{max-height:223px;overflow:auto}.choice{border:1px solid #e4e9df;border-radius:9px;padding:10px;margin-bottom:7px}.choice-top{display:flex;gap:8px;align-items:center}.transport-icon{width:30px;height:30px;border-radius:8px;display:grid;place-items:center;background:#eaf1e8;font-size:15px;flex-shrink:0}.transport-icon.bus{background:#e8edf7}.transport-icon.walk{background:#f2eee4}.transport-icon.bike{background:#edf2cf}.choice b{font-size:10px}.choice small{font-size:9px;color:#84917f;display:block;margin-top:3px}.choice-top>span:last-child{margin-left:auto;font-size:9px;color:#588362;white-space:nowrap}.choice-bottom{margin-top:8px;display:flex;gap:6px}.choice select{min-width:0;flex:1;font-size:10px;border:1px solid #dde5d7;border-radius:5px;padding:6px;color:#405e4c;background:#fff}.ride-button{font-size:10px;padding:6px 10px;background:#eef2e8;border-radius:5px;font-weight:700}.primary{display:flex;justify-content:space-between;width:100%;background:var(--green);color:white;padding:14px 16px;border-radius:8px;font-size:12px;font-weight:600;margin-top:12px}.primary:hover{background:#32684f}.demo-caption{text-align:center;margin:11px 0 0;font-size:9px;color:#91998d}.ready-copy{padding:13px 4px 18px;color:#8b9586;font-size:11px;line-height:1.9}.ready-copy b{display:block;color:#49624f;font-size:13px;margin-bottom:5px}.bottom-layout{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:20px;margin-top:20px}.route-card{background:#fff;border:1px solid var(--line);border-radius:13px;padding:23px}.route-card .eyebrow{font-size:8px;color:#92a080}.route-card h2{font-size:16px;margin:5px 0 0}.route-card .section-label button{font-size:10px;color:#7d8c7b}.empty-route{padding:35px 10px;display:flex;gap:14px;align-items:center;color:#96a08e;font-size:11px}.empty-route>span{font-size:28px}.log-item{display:flex;gap:12px;padding:13px 0;border-bottom:1px solid #f0f2eb;align-items:center}.log-item:last-child{border:0}.log-item b{display:block;font-size:11px}.log-item small{font-size:9px;color:#899282}.log-item>div:last-child{margin-left:auto;text-align:right}.tip-card{background:#e7eddb;border-radius:13px;padding:23px;position:relative;overflow:hidden}.tip-card>span{font-size:8px;letter-spacing:1.4px;color:#78865e}.tip-card h2{font-size:21px;line-height:1.6;letter-spacing:-.7px;margin:10px 0 8px}.tip-card p{font-size:10px;line-height:1.9;color:#7b856a}.tip-card>div{position:absolute;right:18px;bottom:20px;font-size:21px;color:#587046}.tip-card>div span{font-size:12px;margin:0 6px;color:#9bac83}footer{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:26px 0;color:#93a08d;font-size:8px}footer>span{letter-spacing:1px}footer b{font-weight:400;margin-left:12px}footer button{font-size:9px}dialog{border:1px solid #dde4d6;border-radius:18px;padding:32px;max-width:530px;width:calc(100% - 30px);color:var(--ink);box-shadow:0 20px 100px #173c3320}dialog::backdrop{background:#132e266b;backdrop-filter:blur(4px)}dialog h2{font-size:25px;margin:4px 0 15px}dialog p,dialog li{font-size:12px;line-height:1.9;color:#6f806e}dialog a{color:#3b7257}.close{position:absolute;right:12px;top:10px;font-size:25px}.form-row{margin:16px 0}.form-row label{font-size:11px;display:block;margin-bottom:7px}.form-row input,.form-row select{padding:10px;border:1px solid #d8e0d1;width:100%;border-radius:7px;background:white;color:var(--ink)}.form-row small{font-size:10px;display:block;color:#899682;line-height:1.6;margin-top:6px}.result-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:20px 0}.result-grid div{padding:20px;background:#f0f3e9;border-radius:10px;font-size:12px}.result-grid strong{display:block;font-size:28px;margin-top:6px}.records{width:100%;border-collapse:collapse;font-size:11px}.records th,.records td{text-align:left;padding:10px 5px;border-bottom:1px solid var(--line)}.records th{font-size:9px;color:var(--muted)}#toast{position:fixed;bottom:28px;left:50%;transform:translateX(-50%) translateY(20px);background:#173f35;color:white;border-radius:9px;padding:14px 22px;opacity:0;pointer-events:none;z-index:100;font-size:12px;transition:.2s;max-width:90vw}#toast.show{opacity:1;transform:translateX(-50%) translateY(0)}.station{cursor:pointer}.station:hover .station-dot,.station:focus .station-dot{stroke:#e68169;stroke-width:4}.station text{font-size:12px;font-weight:600;fill:#5e7565;paint-order:stroke;stroke:#eef0e8;stroke-width:4;stroke-linejoin:round}.map-marker{background:white;border:2px solid #205540;border-radius:8px;padding:6px;font-size:10px;white-space:nowrap}.map-marker.current{background:#205540;color:white}.map-marker.goal{border-color:#e68169}.data-banner{padding:12px;background:#f6f0df;border-radius:7px;font-size:11px;line-height:1.8;color:#8a7954}.selected-place{padding:8px 10px;background:#f3f5ed;font-size:10px;border-radius:6px;margin-bottom:8px;display:flex;justify-content:space-between;align-items:center}.selected-place button{font-size:13px}.urgent{color:#ffd4ac!important}
@media(min-width:1500px){main{padding-top:45px}#mapArea{min-height:585px}}@media(max-width:1100px){header{padding:0 25px}main{padding:26px 25px 0}.mission{gap:18px}.mission-label{display:none}.play-layout,.bottom-layout{grid-template-columns:minmax(0,1fr) 305px}.endpoints{gap:15px}h1{font-size:33px}.map-legend{gap:13px}.edition{display:none}#mapArea{min-height:550px}}@media(max-width:760px){header{height:75px;padding:0 18px}.brand{font-size:17px}.brand-icon{width:38px;height:38px;font-size:30px}nav{gap:0}nav button{font-size:10px;padding:8px}nav .icon-button{font-size:20px}.brand small{font-size:7px}main{padding:23px 15px 0}h1{font-size:29px}.intro p{font-size:11px}.eyebrow{font-size:8px}.intro{margin-bottom:22px}.mission{padding:17px;gap:12px;flex-wrap:wrap}.endpoints{width:100%;flex:auto;justify-content:space-between}.endpoints strong{font-size:19px}.mission-meta{flex:1;font-size:10px}.mission-meta small{display:none}.outline{font-size:10px;padding:7px 12px}.play-layout,.bottom-layout{grid-template-columns:1fr}#mapArea{min-height:400px}.map-heading{padding:14px}.map-note{top:12px;left:12px;padding:9px}.map-note small{font-size:8px}.map-legend{font-size:8px;gap:15px}.timer-card{padding:16px 20px}.timer-card>strong{font-size:42px}.timer-card>small{font-size:9px}aside{display:grid;grid-template-columns:1fr 1fr;gap:10px}.status-card{margin:0;padding:15px}.stats{gap:10px}.stats>div+div{padding-left:10px}.stats strong{font-size:21px}.position{display:block}.position b{display:block;margin-top:8px}.choices-card{grid-column:1/-1}#choices{max-height:300px}.choice b{font-size:12px}.choice small,.choice select,.ride-button{font-size:11px}.mode-tabs button{font-size:11px}.bottom-layout{margin-top:16px}.tip-card{display:none}footer{flex-wrap:wrap;padding:20px 0}footer p{order:3;margin:0;width:100%;line-height:1.8}.route-card{padding:19px}dialog{padding:28px 22px}}
#realMap{position:absolute;inset:0;z-index:1}.map-note{z-index:500;top:auto;bottom:28px;max-width:calc(100% - 60px)}.map-note small{line-height:1.5}.leaflet-container{font-family:inherit}.leaflet-tooltip{font-family:inherit;font-size:11px}.stop-icon{border:2px solid white;box-shadow:0 1px 5px #153d3466;color:white;border-radius:7px;text-align:center;font:bold 12px/22px sans-serif;background:#3477b9}.stop-icon.metro{background:#205540;border-radius:50%;font-size:10px}.place-label{background:#205540;border:2px solid white;border-radius:8px;color:white;padding:5px 9px;white-space:nowrap;font-size:11px;font-weight:700;width:max-content!important;box-shadow:0 2px 8px #2343}.place-label.goal{background:#cc644b}.stop-tools{display:flex;gap:5px;margin:12px 0}.stop-tools input{width:65%;min-width:0;border:1px solid var(--line);border-radius:6px;padding:9px;font-size:11px}.stop-tools button{font-size:10px;background:#eef2e8;border-radius:6px;padding:5px}#choices{max-height:450px;min-height:80px}.stop-title{font-size:15px;margin:8px 0}.helper{font-size:11px;line-height:1.7;color:#758273}.route-option{display:block;width:100%;text-align:left;border:1px solid #e0e7db;border-radius:8px;padding:12px;margin:7px 0}.route-option b{display:block;font-size:12px}.route-option small{font-size:10px;color:#748475;display:block;line-height:1.6;margin-top:4px}.route-option:hover{border-color:#205540}.route-select{width:100%;padding:12px;border:1px solid #c9d6c7;border-radius:8px;margin:10px 0;background:white;font-size:12px}.back-button{font-size:11px;padding:8px 0;text-decoration:underline}.preview-info{padding:12px;background:#f0f4e9;border-radius:8px;font-size:12px;line-height:1.8}.error{background:#fff0e9;padding:12px;border-radius:7px;color:#94563c;font-size:11px;line-height:1.8}.map-legend button{font-size:10px}#searchResults button{display:block;width:100%;text-align:left;padding:8px;font-size:11px;border-bottom:1px solid var(--line)}#routeLog{max-height:300px;overflow:auto}.leaflet-control-attribution{font-size:9px!important}.map-panel{max-height:900px}#toast{z-index:2000}.choices-card .primary:disabled{background:#708b7a}@media(max-width:760px){#mapArea{min-height:440px}.map-panel{max-height:none}.map-legend{gap:10px}#choices{max-height:400px}.map-note{max-width:calc(100% - 40px)}}
[hidden]{display:none!important}.place-label{height:auto!important;min-height:28px;line-height:16px!important}.stop-icon.metro{z-index:500!important}#searchResults{max-height:210px;overflow:auto}
.mode-picker{display:flex;align-items:center;flex-wrap:wrap;gap:18px;margin:0 0 16px;font-size:12px}.mode-picker>span{font-weight:700}.mode-picker label{background:#fff;border:1px solid var(--line);padding:10px 14px;border-radius:9px;cursor:pointer}.mode-picker label:has(input:checked){border-color:var(--green);background:#e9efdf}.mode-picker input{accent-color:var(--green)}.mode-picker small{color:var(--muted);font-size:10px}.player-entry{margin:14px 0}.player-entry label{display:block;font-size:11px;font-weight:600;margin-bottom:6px}.player-entry input{width:100%;border:1px solid #cbd8c6;border-radius:7px;padding:10px;color:var(--ink)}.player-entry small{display:block;font-size:10px;color:var(--muted);line-height:1.7;margin-top:6px}dialog{max-width:760px}.board-filters{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:18px 0}.board-filters label{font-size:11px}.board-filters select{display:block;width:100%;padding:10px;margin-top:5px;border:1px solid var(--line);border-radius:7px;background:white;color:var(--ink)}.rank-summary{display:flex;flex-wrap:wrap;gap:10px;justify-content:space-between;padding:16px;background:#eaf0df;border-radius:10px;margin:16px 0}.rank-summary span{font-size:11px;color:#6b805f}.table-scroll{overflow:auto}.records td,.records th{white-space:nowrap;padding:12px 8px}.my-row{background:#eff4e6}.me-tag{font-size:9px;background:var(--green);color:white;padding:2px 5px;border-radius:4px}.empty-board{padding:24px;text-align:center;background:#f5f6ef;border-radius:9px}.result-grid.three{grid-template-columns:repeat(3,1fr)}.result-grid.three div{padding:15px 10px;font-size:10px}.result-grid.three strong{font-size:20px}@media(max-width:760px){.mode-picker{gap:8px}.mode-picker small{width:100%}.result-grid.three strong{font-size:16px}.records{font-size:10px}}
/* Keep route, alighting and walking choices on the map. */
.map-menu{position:absolute;z-index:650;top:16px;right:16px;width:300px;max-width:calc(100% - 72px);max-height:calc(100% - 32px);display:flex;flex-direction:column;background:#fff;border:1px solid #d6e0d2;border-radius:14px;box-shadow:0 12px 36px #173f3530;overflow:hidden}
.map-menu-heading{display:flex;align-items:center;justify-content:space-between;padding:10px 12px 10px 16px;background:#205540;color:#fff;flex-shrink:0;font-size:11px;font-weight:600}
.map-menu-heading button{width:32px;height:32px;border-radius:7px;font-size:24px;line-height:1;color:white}.map-menu-heading button:hover{background:#ffffff24}
.map-menu #choices{padding:8px 16px 16px;overflow:auto;overscroll-behavior:contain;min-height:0;max-height:none;scrollbar-width:thin}.map-menu h3{font-size:15px;line-height:1.6}.map-menu .route-option{background:#fafbf6}.map-menu .walk-action{background:#f7f1e6;border-color:#e4d9c2}.map-menu .route-option[aria-expanded=true]{border-color:#205540;background:#edf3e8}.map-menu .primary:disabled{background:#708b7a}.destination-tag{display:inline-block;font-size:10px;color:#a94e3a;background:#fff0e9;padding:5px 8px;border-radius:5px;margin-bottom:5px}.map-menu label{font-size:12px}.map-menu .helper{margin:9px 0}.map-menu #routeList{border-top:1px solid var(--line);margin-top:12px;padding-top:3px}#mapArea:has(.map-menu:not([hidden])) .map-note{display:none}
@media(max-width:760px){.map-menu{top:auto;bottom:24px;right:10px;left:10px;width:auto;max-width:none;max-height:55%}.map-menu-heading{padding:4px 8px 4px 14px}.map-menu #choices{padding:5px 14px 12px}.map-menu .stop-title{margin:5px 0}.map-menu .route-option{padding:10px;margin:6px 0}.map-menu .route-select{padding:10px}#mapArea{min-height:540px;height:65vh;max-height:740px}.map-menu .primary{padding:12px}.map-menu .helper{font-size:10px}}
#menuHistory{padding:10px 14px;background:#f6f8f0;border-bottom:1px solid var(--line);flex-shrink:0}.history-heading{display:flex;justify-content:space-between;align-items:center;font-size:11px;gap:8px}.history-heading button,.pending-move button{font-size:10px;color:#aa4d36;border:1px solid #e8cdbf;border-radius:5px;padding:5px;background:white}.menu-journey{list-style:none;margin:7px 0 0;padding:0;max-height:100px;overflow:auto;overscroll-behavior:contain;font-size:10px}.menu-journey li{padding:5px 0;border-bottom:1px solid #e4e9de}.menu-journey li:last-child{border:0}.menu-journey small{display:block;margin-top:3px;color:#76816d}.origin-row{color:#76816d}.pending-move{display:flex;gap:5px;align-items:center;justify-content:space-between;margin-top:6px;font-size:10px;color:#8b693c}.pending-move button{flex-shrink:0}#tutorialCoach{padding:12px 14px;background:#fff0cd;border-bottom:1px solid #decda7;flex-shrink:0}#tutorialCoach b{font-size:11px}#tutorialCoach p{font-size:12px;margin:6px 0;font-weight:700}#tutorialCoach small{font-size:9px;color:#807250}#tutorialCoach button{font-size:10px;float:right;text-decoration:underline}.tutorial-target{outline:3px solid #e3a044!important;outline-offset:2px}.map-menu:has(#tutorialCoach:not([hidden])) #menuHistory{display:none}@media(max-width:760px){header{flex-wrap:wrap;height:auto;min-height:85px;padding:12px 15px;gap:8px}nav{gap:2px}nav button{padding:6px;font-size:10px}#menuHistory{padding:7px 12px}.menu-journey{max-height:68px}.map-menu:has(#tutorialCoach:not([hidden])){max-height:65%}.map-menu:has(#tutorialCoach:not([hidden])) #choices{min-height:95px}}

.map-shortcuts{display:flex;gap:5px;padding:8px 10px;border-bottom:1px solid var(--line);flex-shrink:0;background:#fff}.map-shortcuts button{flex:1;padding:8px 3px;border-radius:6px;background:#eef3e7;font-size:11px;white-space:nowrap}.place-label.origin{background:#40618b}.map-legend{flex-wrap:wrap}

.place-label{max-width:160px;white-space:normal}.map-shortcuts button:hover{background:#dce8d2}
.map-start{position:absolute;z-index:620;bottom:28px;left:18px;width:285px;max-width:calc(100% - 36px);padding:17px;background:#fff;border:1px solid #d6e0d2;border-radius:13px;box-shadow:0 8px 25px #173f3526}.map-start>b{font-size:14px}.map-start .player-entry{margin:12px 0}.map-start .player-entry small{font-size:9px}.map-start .primary{margin-top:9px}#mapArea:has(.map-start:not([hidden])) .map-note{display:none}.bus-direction-arrow span{display:block;color:#174f87;text-shadow:0 0 2px white,0 0 3px white;font-size:20px;line-height:20px}.bus-terminal{background:#174f87;color:white;border:2px solid white;border-radius:6px;padding:5px 8px;width:max-content!important;max-width:170px;height:auto!important;font-size:10px;font-weight:700}.bus-route-key{font-size:10px;color:#657965;line-height:1.7}.bus-route-key span{color:#3477b9}@media(max-width:760px){.map-start{left:10px;right:10px;bottom:25px;width:auto;max-width:none;padding:12px}.map-start .player-entry{margin:9px 0}.map-start .player-entry small{display:none}}
.bus-boarding{background:#205540}

.hover-stop-label{font-weight:800;color:#682387;border:2px solid #9a3dc6;background:#fff}.hover-stops{margin:10px 0}.hover-stops summary{cursor:pointer;font-size:13px;font-weight:700;padding:10px;border-radius:10px;background:#f1eef5}.hover-stop-list{max-height:160px;overflow:auto;display:grid;gap:4px;margin-top:6px}.hover-stop-option{padding:10px;text-align:left;border:1px solid #e4dce9;border-radius:8px;background:#fff;color:#293b37;font:inherit;font-size:13px;cursor:pointer}.hover-stop-option:hover,.hover-stop-option:focus-visible{background:#f2e8fa;border-color:#9a3dc6;outline:2px solid #9a3dc6;outline-offset:-2px}

/* Compact stop markers only appear at neighborhood zoom (16+). */
.stop-icon{font-size:10px;line-height:16px;border-radius:5px;box-shadow:0 1px 3px #153d3455}.stop-icon.metro{font-size:8px;line-height:16px}

/* A sunny city adventure: keep map colours and route data intact. */
:root{--ink:#30365c;--green:#6557cd;--muted:#717691;--line:#dce4f3;--paper:#f1f8ff;--coral:#f38b77}
body{background:radial-gradient(circle at 4% 8%,#fff2cc 0,transparent 30%),radial-gradient(circle at 95% 12%,#e9e0ff 0,transparent 32%),#f1f8ff;color:var(--ink)}
header{height:84px;border-bottom:0;background:#ffffffc4;border-radius:0 0 24px 24px;box-shadow:0 3px 0 #dce9f5;padding:0 38px}.brand{font-size:21px}.brand-icon{background:#fff0a8;border:2px solid #fff;border-radius:16px;box-shadow:0 4px 0 #efd475;font-size:27px}.brand small{color:#7c71b8}nav{gap:8px}nav button{border-radius:12px;color:#5b5684}nav button:hover{background:#ece9ff}#tutorialBtn{background:#fff0b6;color:#725417}#recordsBtn{background:#eee8ff;color:#6557cd}
main{padding:28px 38px 0}.intro{position:relative;min-height:268px;margin-bottom:22px;padding:25px 35px;border:2px solid #fff;border-radius:28px;background:linear-gradient(110deg,#fffdf1,#e9f7ff 70%,#efe8ff);box-shadow:0 7px 0 #dce8f4;overflow:hidden;gap:12px}.intro-copy{position:relative;z-index:1;flex:1;min-width:0}.intro .eyebrow{color:#78619d;letter-spacing:.4px;font-size:11px}.live-dot{background:#27b9b0;width:8px;height:8px;box-shadow:0 0 0 4px #27b9b018}.intro h1{font-size:40px;line-height:1.27;letter-spacing:-1.6px;margin:15px 0 12px;color:#30365c}.intro h1 span{color:#6c5bd1}.intro p{color:#626d89;line-height:1.8;font-size:13px}.hero-badges{display:flex;gap:8px;margin-top:16px;flex-wrap:wrap}.hero-badges span{padding:7px 10px;border:1px solid #fff;border-radius:20px;font-size:10px;font-weight:700;background:#ffffffbd;color:#59617e}.hero-art{position:relative;flex:0 1 49%;align-self:center;max-width:530px;min-width:0}.hero-art img{display:block;width:100%;height:auto}.ride-sticker{position:absolute;top:4%;right:4%;background:#ffe36a;border:3px solid white;border-radius:14px;padding:8px 12px;font-size:12px;font-weight:900;transform:rotate(9deg);box-shadow:0 3px 0 #e5bd55;color:#7c5428}.ride-sticker b{font-size:18px;margin-left:3px}
.mode-picker{gap:12px;padding:8px 2px;margin-bottom:15px}.mode-picker label{border:2px solid #e2e4f4;border-radius:14px;font-weight:700;box-shadow:0 3px 0 #e1e7f2}.mode-picker label:has(input:checked){background:#ece7ff;border-color:#8f81e2;color:#5444ab}.mode-picker small{color:#6e7794}.mission{border:2px solid #ffe3a0;background:#fffdf4;border-radius:20px;box-shadow:0 5px 0 #f0e6c9;padding:20px 24px;gap:25px}.mission-label{border-right:2px dashed #e7d9ad;padding-right:23px}.mission-label span{font-size:13px;color:#93702a}.mission-label b{color:#ac8c49}.endpoints strong{font-size:20px;color:#354367}.journey-arrow{color:#9e92cf;font-size:20px}.outline{border:1px solid #d8dbee;background:#fafaff;border-radius:11px;color:#626087}.mission .outline{background:#fff1b8;border-color:#f1d276;color:#806229}.point{width:9px;height:9px}.start{background:#27b9b0}.end{background:#f2877a}
.map-panel{border:2px solid white;border-radius:22px;box-shadow:0 6px 0 #dce8f4}.map-heading{background:#fff;padding:16px 20px}.map-heading b{font-size:13px;color:#404a73}.pill{background:#e2f8f0;color:#228774;border-radius:20px;padding:5px 8px}.map-heading button{background:#f0ecff;padding:8px 10px;border-radius:10px;color:#6557cd}.map-legend{color:#61718a;background:#fff}.map-legend button{background:#edf3ff;padding:6px 8px;border-radius:8px;color:#486284}
.timer-card{background:linear-gradient(135deg,#8270e7,#6254c4);border:2px solid #fff;border-radius:20px;box-shadow:0 5px 0 #d7d1ef;position:relative}.timer-card:after{content:'⏱';position:absolute;right:22px;top:52px;font-size:39px;opacity:.25;pointer-events:none}.timer-card>div:first-child{color:#f5f2ff}.timer-card>strong{font-weight:800;font-size:51px}.timer-status{border-color:#c3b9f0;background:#ffffff14}.time-track{height:6px;background:#5042a5}.time-track i{background:#ffe16a}.timer-card>small{color:#efebff;line-height:1.7}
.status-card,.choices-card,.route-card{border:2px solid white;border-radius:18px;box-shadow:0 4px 0 #dfe9f4}.stats strong{color:#4b4b89}.stats small,.position span{color:#747b97}.choices-card .helper{color:#737c94}.stop-tools input,.player-entry input{border:2px solid #dce2f1;border-radius:10px;background:#fbfdff}.stop-tools button{background:#e6f7f3;color:#257f78;border-radius:10px;padding:7px}.section-label>span{color:#7c7199}
.primary{background:#6b5bd2;border:2px solid #fff;border-radius:12px;box-shadow:0 4px 0 #493ca5;font-weight:800;font-size:13px;padding:14px 16px}.primary:hover{background:#7e6ee1;filter:none}.primary:active{transform:translateY(2px);box-shadow:0 2px 0 #493ca5}.map-start{border:2px solid #fff;border-radius:20px;background:#fffef7;box-shadow:0 6px 24px #435e8b25}.map-start>b{color:#56518d;font-size:15px}.map-start .player-entry small{color:#747b97}.map-menu{border:2px solid #fff;border-radius:19px;box-shadow:0 10px 32px #3c508c35}.map-menu-heading{background:#7463d7}.map-shortcuts{background:#fffdf4}.map-shortcuts button{background:#f0edff;color:#6657b5;border-radius:9px}.map-shortcuts button:hover{background:#e3ddff}#menuHistory{background:#f4f6ff}.menu-journey small,.origin-row{color:#75809e}.map-menu .route-option{background:#fafaff;border-color:#e2e0f3;border-radius:12px}.map-menu .walk-action{background:#fff7db;border-color:#efd98b}.map-menu .route-option[aria-expanded=true]{background:#ece8ff;border-color:#a494e4}.route-option:hover{background:#f0ecff;border-color:#9d8ddb}.route-option small,.helper{color:#6a7690}.preview-info{background:#eaf8f3;border-radius:12px;color:#386969}.route-select{border:2px solid #d9dded;border-radius:12px}.destination-tag{background:#ffe8e2;color:#b95c53}.rank-summary,.my-row{background:#f0ecff}.empty-board,.result-grid div{background:#f3f3ff}.position b{color:#595b8f}.tip-card{border:2px solid #fff;border-radius:20px;background:linear-gradient(130deg,#fff0b5,#ffe5ce);box-shadow:0 5px 0 #ecdfc6}.tip-card>span{color:#aa743e}.tip-card h2{color:#845d56;font-size:21px}.tip-card p{color:#927662}.tip-card>div{color:#ac8587}.tip-card>div span{color:#c5a18b}footer{color:#7a88a3}.log-item small{color:#7a88a0}dialog{border:3px solid #fff;border-radius:24px;background:#fcfdff}dialog::backdrop{background:#34407070}dialog p,dialog li{color:#66738e}button:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible{outline-color:#a28af0}
@media(max-width:1100px){header{padding:0 25px}main{padding:25px 25px 0}.intro{padding:24px;min-height:255px}.intro h1{font-size:35px}.hero-art{flex-basis:46%}.mission{gap:15px}.mission-label{display:none}.endpoints{gap:12px}}
@media(max-width:760px){header{height:auto;min-height:88px;padding:12px 16px;gap:12px}.brand{font-size:18px}.brand-icon{font-size:23px}nav{gap:3px;flex-wrap:wrap}nav button{font-size:10px;padding:8px}.intro{padding:22px 20px 10px;display:block;border-radius:23px;min-height:0}.intro h1{font-size:34px}.intro p{font-size:12px}.intro .eyebrow{font-size:10px}.hero-art{width:100%;max-width:370px;margin:4px auto 0}.hero-badges{gap:5px;margin-top:12px}.hero-badges span{font-size:9px;padding:6px 8px}.ride-sticker{font-size:10px;padding:5px 9px;top:1%}main{padding:21px 14px 0}.mode-picker{gap:8px}.mode-picker label{padding:9px 11px;font-size:11px}.mode-picker small{font-size:9px}.mission{padding:16px;gap:12px}.endpoints strong{font-size:17px}.journey-arrow{font-size:15px}.timer-card>strong{font-size:40px}.timer-card:after{font-size:28px;top:50px;right:15px}.timer-card,.status-card{border-radius:17px}.map-start{border-radius:17px}.tip-card{display:block;min-height:180px}.tip-card h2{font-size:23px}.tip-card>div{font-size:25px}.map-legend{gap:10px}.map-panel{border-radius:19px}.map-menu{border-radius:17px}}
@media(prefers-reduced-motion:reduce){button,.primary{transition:none}}
.daily-countdown{color:#78659d;font-size:11px;font-weight:700;white-space:nowrap}.mission-label #dailyDate{letter-spacing:.3px;white-space:nowrap}@media(max-width:760px){.daily-countdown{width:100%;font-size:10px}}
@media(max-width:1100px){.mission{flex-wrap:wrap}.mission-label{display:flex;flex-direction:row;align-items:center;gap:12px;border-right:0;padding-right:0;width:100%}.endpoints{min-width:0}}
.visitor-strip{display:flex;align-items:center;justify-content:flex-end;gap:18px;margin:0 3px 15px;color:#78819c;font-size:11px}.visitor-strip>span{margin-right:auto}.visitor-strip>div{display:flex;gap:18px}.visitor-strip b{font-size:15px;color:#6b5bd2;margin-left:5px;font-variant-numeric:tabular-nums}.visitor-strip small{font-size:9px;color:#8b93a8}.ad-panel{margin:150px auto 40px;max-width:100%;padding:18px;background:#fff;border-radius:16px;min-height:150px}.ad-label{display:block;font-size:10px;color:#80899b;text-align:center;margin-bottom:12px}@media(max-width:760px){.visitor-strip{gap:10px;flex-wrap:wrap;justify-content:space-between;font-size:10px}.visitor-strip>span{width:100%;margin:0}.visitor-strip>div{gap:20px}.visitor-strip small{font-size:8px}}
.map-menu:has(#tutorialCoach:not([hidden])) #menuHistory{display:block}.map-menu:has(#tutorialCoach:not([hidden])) .menu-journey{max-height:55px}#tutorialCoach small{display:block;line-height:1.5}#tutorialCoach button{float:none;margin-top:5px}@media(max-width:760px){.map-menu:has(#tutorialCoach:not([hidden])){max-height:75%}.map-menu:has(#tutorialCoach:not([hidden])) .menu-journey{max-height:35px}#tutorialCoach{padding:9px 12px}#tutorialCoach p{font-size:11px;line-height:1.6;margin:4px 0}}