:root{font-family:Arial,Helvetica,sans-serif;color:#f6f2e5;background:#adc6cd;font-synthesis:none;font-weight:400}*{box-sizing:border-box}body{margin:0;overflow:hidden}canvas{display:block}button{font:inherit;cursor:pointer;color:inherit;border:1px solid #ffffff30;background:#172b24bd;border-radius:8px;padding:11px 15px;transition:background .2s}button:hover{background:#314a3b}button:focus-visible{outline:3px solid #e4bb76;outline-offset:4px}button:disabled{cursor:wait;opacity:.6}.topbar{position:absolute;top:28px;left:32px;right:32px;display:flex;justify-content:space-between;align-items:center;pointer-events:none}.brand{display:flex;align-items:center;gap:12px;text-shadow:0 2px 12px #0009}.brand-mark{display:grid;place-items:center;width:43px;height:43px;border:1px solid #ead4a794;border-radius:50%;font:italic 32px Georgia,serif;color:#ecd1a2;background:#172b2440}.brand strong{font-size:14px;letter-spacing:3px}.brand div>span{display:block;font-size:9px;letter-spacing:2px;margin-top:7px;opacity:.8}.top-actions{display:flex;gap:10px;align-items:center;pointer-events:auto}.top-actions button{font-size:11px;background:#14251fcc;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.top-actions #camera{color:#e8c78c}.top-actions #camera span{margin-left:10px;color:#f5f1e7}.live-dot{width:5px;height:5px;border-radius:50%;background:#d2e4a3;box-shadow:0 0 8px #bed68e}.free-drive{font-size:9px;letter-spacing:2px;margin-right:12px;text-shadow:0 1px 8px #000}.route-card,.dashboard{position:absolute;bottom:102px;background:#14271ed9;border:1px solid #e8d4a32b;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);box-shadow:0 12px 40px #0002}.route-card{left:32px;padding:18px 18px 12px;border-radius:12px;width:230px}.eyebrow{font-size:9px;font-weight:600;letter-spacing:2.4px;color:#d5bd8e}#minimap{width:192px;height:137px;opacity:.95;margin:0 auto}.route-footer{display:flex;justify-content:space-between;border-top:1px solid #ffffff20;padding-top:10px;font-size:9px;letter-spacing:1px;color:#cfdbcc}.dashboard{right:32px;width:192px;border-radius:12px;padding:18px 22px}.speed{display:flex;align-items:baseline;gap:9px}.speed>span:first-child{font-size:66px;font-weight:300;font-variant-numeric:tabular-nums;letter-spacing:-4px;line-height:1}.unit{font-size:10px;letter-spacing:1px;color:#d5bd8e}.speed-track{height:2px;background:#ffffff24;margin:15px 0}#speed-fill{display:block;height:100%;width:0;background:#e3c087;transition:width .12s}.dashboard-bottom{display:flex;justify-content:space-between;align-items:center;color:#d1dacc;font-size:8px;letter-spacing:1.2px}#gear{font-size:12px;color:#e3c087;font-weight:700}.controls{position:absolute;bottom:28px;left:50%;transform:translate(-50%);display:flex;align-items:center;gap:22px;padding:12px 20px;border:1px solid #ffffff24;border-radius:10px;background:#12241dd9;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);white-space:nowrap;font-size:10px;color:#dce1d7}.controls>span{display:flex;align-items:center;gap:7px}kbd{font:10px Arial;color:#f2e5cb;border:1px solid #ffffff35;border-radius:4px;padding:4px 6px}.controls button{padding:0;border:0;background:none;font-size:10px;display:flex;align-items:center;gap:7px}.overlay{position:absolute;inset:0;background:linear-gradient(90deg,#13291fef,#13291fbb 35%,#10281b22 72%);display:flex;align-items:center;padding:75px 7vw}.welcome-card{max-width:580px}.welcome-card .eyebrow{font-size:10px;margin-bottom:22px}h1{font:normal clamp(54px,6.6vw,94px)/.99 Georgia,serif;letter-spacing:-3px;margin:0 0 26px;color:#f2eadb}.welcome-card p,.pause-card p{font-size:14px;line-height:1.8;color:#c5cec1;margin-bottom:27px}.intro-specs{display:flex;gap:26px;padding:22px 0;border-top:1px solid #e6d2a333;margin-bottom:14px}.intro-specs span{font-size:8px;letter-spacing:1.1px;color:#a8b7a7}.intro-specs b{font-size:14px;font-weight:400;display:block;letter-spacing:0;color:#eee1c8;margin-bottom:8px}#start,#resume{background:#e6c48b;color:#243027;border:0;font-size:13px;font-weight:700;padding:17px 28px;min-width:238px;box-shadow:0 3px 16px #0002}#start:hover,#resume:hover{background:#f3d7a7}#load-status{font-size:11px;color:#afbcaa;margin:12px 0}.intro-hint{font-size:10px;color:#aaba9f;letter-spacing:.3px;margin-top:25px}.hidden{display:none!important}#notice{position:absolute;top:92px;left:50%;transform:translate(-50%);font-size:12px;background:#172b24dc;border-radius:8px;padding:12px 18px;opacity:0;transition:opacity .3s;pointer-events:none}#notice.visible{opacity:1}#paused{background:#10261ac9;justify-content:center;-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px)}.pause-card{text-align:center}.pause-card h2{font:44px Georgia;margin:20px 0}.pause-card button{display:block;margin:12px auto}#reset{font-size:11px;border:0;background:none}.touch-controls{display:none}body:not(.started) .route-card,body:not(.started) .dashboard,body:not(.started) .controls{visibility:hidden}body:not(.started) .topbar{z-index:2}@media(max-width:760px){.topbar{top:18px;left:18px;right:18px}.brand strong{font-size:11px;letter-spacing:2px}.brand div>span{font-size:7px}.brand-mark{width:34px;height:34px;font-size:26px}.free-drive,.live-dot{display:none}.top-actions{gap:5px}.top-actions button{padding:9px;font-size:10px}.top-actions #camera span{margin-left:4px}.route-card{left:16px;bottom:87px;width:169px;padding:12px}.route-card .eyebrow{font-size:7px;letter-spacing:1px}#minimap{width:142px;height:101px}.route-footer{font-size:7px;letter-spacing:0}.dashboard{right:16px;bottom:87px;width:139px;padding:16px}.speed>span:first-child{font-size:48px}.dashboard-bottom{font-size:6px}.controls{gap:10px;bottom:18px;padding:10px}.controls span{font-size:0;gap:4px}.controls span:first-child kbd:last-child{display:none}.controls kbd{font-size:9px}.controls button{font-size:0}.overlay{padding:86px 7vw 30px}h1{font-size:62px}.welcome-card p{font-size:12px}.intro-specs{gap:17px}.intro-specs b{font-size:12px}.intro-specs span{font-size:6px}.intro-hint{font-size:9px}}@media(pointer:coarse){.started .touch-controls{display:flex;position:absolute;bottom:18px;left:18px;right:18px;gap:10px;touch-action:none}.touch-controls button{width:52px;height:52px;font-size:22px;-webkit-user-select:none;user-select:none}.touch-controls span{flex:1}.controls{bottom:80px}.route-card,.dashboard{bottom:138px}.touch-controls button.active{background:#d4b477;color:#182e21}}@media(max-height:600px){.overlay{padding-top:70px}.welcome-card .eyebrow{margin-bottom:12px}h1{font-size:50px;margin-bottom:12px}.welcome-card p{margin-bottom:8px}.intro-specs{padding:12px 0;margin-bottom:5px}.intro-hint{margin-top:10px}.route-card,.dashboard{bottom:90px}}
