*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden;background:#151b23;color:#fff;font-family:Arial,Helvetica,sans-serif;-webkit-user-select:none;user-select:none}button{font:inherit;cursor:pointer}a{color:inherit;text-decoration:none}#stage,#rider{position:fixed;inset:0;width:100%;height:100%;display:block}#stage{background:radial-gradient(at 50% 30%,#486a8b,#151e39)}#rider{pointer-events:none}.screen-vignette{position:fixed;inset:0;pointer-events:none;background:radial-gradient(ellipse at 50% 40%,transparent 47%,#0b16294b);z-index:1}.topbar{position:fixed;top:0;left:0;right:0;display:flex;align-items:center;justify-content:space-between;padding:23px 30px;z-index:6;background:linear-gradient(#0008,transparent);font-size:11px;letter-spacing:.1em}.back{display:flex;gap:12px;align-items:center;text-transform:uppercase;font-size:10px;color:#f1eadc}.back span{font-size:21px}.back:hover{color:#ffda9a}.world-name{position:absolute;left:50%;transform:translateX(-50%);font-family:Georgia,serif;font-size:19px;letter-spacing:0;white-space:nowrap;text-shadow:0 2px 20px #000a}.top-actions{display:flex;gap:8px}.top-actions button{border:1px solid #ffffff66;border-radius:50%;width:37px;height:37px;background:#071c3995;color:white;font-size:17px}.top-actions button:hover{background:#d5b17c44}.hud{position:fixed;z-index:5;left:26px;top:102px;max-width:245px;pointer-events:none;text-shadow:0 2px 8px #000b}.hud-eyebrow{font-size:9px;letter-spacing:.28em;color:#eddbaf}.hud h2{font-family:Georgia,serif;font-size:32px;font-weight:400;letter-spacing:-.03em;line-height:1.05;margin:11px 0}.hud p{font-size:11px;color:#e5e0d3;line-height:1.65;margin:0}.scorebox{display:flex;align-items:center;gap:12px;margin-top:24px}.score-glyph{font-size:28px;color:#ffda85;text-shadow:0 0 15px #ffd26a}.score-number{font-family:Georgia,serif;font-size:30px}.score-label{font-size:9px;letter-spacing:.17em;text-transform:uppercase;color:#d8d1c7}.progress{background:#fff4;height:4px;width:195px;margin:13px 0 0;overflow:hidden}.progress-fill{height:100%;background:#f3d59b;width:0;transition:width .3s}.destination{background:#14213895;border:1px solid #e1cf9f65;padding:13px 16px;margin-top:27px;backdrop-filter:blur(8px)}.destination small{display:block;color:#e2c895;font-size:9px;letter-spacing:.18em;margin-bottom:6px}.destination strong{font-family:Georgia,serif;font-size:18px;font-weight:400}.destination-distance{float:right;font-size:11px;color:#fff9}.minimap-wrap{position:fixed;bottom:35px;left:26px;z-index:5;width:162px;height:162px;border:2px solid #dbbd7f;border-radius:50%;background:#091e2c9e;box-shadow:0 6px 40px #0007;overflow:hidden;pointer-events:none}.minimap{width:100%;height:100%}.map-n{position:absolute;left:50%;top:5px;transform:translateX(-50%);font-size:9px;color:#ffde9a}.bottom-hud{position:fixed;z-index:5;bottom:30px;left:50%;transform:translateX(-50%);background:#0b1a32ba;backdrop-filter:blur(10px);border:1px solid #ffffff35;border-radius:50px;padding:13px 23px;display:flex;gap:20px;align-items:center;white-space:nowrap;font-size:11px;color:#e2e7ed}.key{background:#ebd399;border-radius:5px;padding:5px 7px;color:#182437;font-weight:800;font-size:10px;margin:0 3px}.mode-text{color:#f2d8a0}.velocity{position:fixed;right:28px;bottom:43px;text-align:right;z-index:5;font-size:11px;color:#ddd}.velocity strong{font-family:Georgia,serif;font-size:47px;color:#fff;font-weight:400}.velocity small{display:block;font-size:9px;letter-spacing:.18em}.message{position:fixed;z-index:7;left:50%;top:33%;transform:translate(-50%,-50%);font-family:Georgia,serif;text-align:center;pointer-events:none;opacity:0;transition:opacity .25s}.message.show{opacity:1}.message span{font-size:clamp(36px,6vw,70px);text-shadow:0 0 30px #0008}.message small{display:block;font:11px Arial,sans-serif;letter-spacing:.25em;color:#ffd68e;margin-top:13px}.intro{position:fixed;z-index:20;inset:0;background:#08101de1;display:grid;place-items:center;backdrop-filter:blur(20px);padding:25px}.intro.hidden{display:none}.intro-panel{width:min(660px,100%);text-align:center;position:relative;padding:50px 40px 45px;border:1px solid #d3b57a77;background:linear-gradient(145deg,#192332e8,#0a1220f5);box-shadow:0 30px 100px #000b}.intro-image{height:125px;max-width:210px;object-fit:cover;margin:0 auto 26px;display:block;border:6px solid #977a55;box-shadow:0 8px 25px #0008}.intro-eyebrow{font-size:10px;letter-spacing:.27em;color:#e7c998}.intro-panel h1{font-family:Georgia,serif;font-size:clamp(43px,6vw,68px);line-height:1.02;font-weight:400;margin:20px 0}.intro-panel p{line-height:1.85;color:#c2c2bb;font-size:14px;max-width:445px;margin:0 auto 27px}.control-guide{display:flex;gap:15px;justify-content:center;flex-wrap:wrap;color:#d1cfc5;font-size:11px;margin-bottom:30px}.control-guide span{white-space:nowrap}.begin{color:#121a22;border:0;background:#e9c991;letter-spacing:.17em;font-size:11px;font-weight:700;padding:19px 45px}.begin:hover{background:#fff0c5}.intro-footer{color:#8c99a8;font-size:9px;letter-spacing:.12em;margin-top:25px}.mobile-controls{position:fixed;bottom:35px;left:0;right:0;padding:0 17px;display:none;justify-content:space-between;align-items:end;pointer-events:none;z-index:8}.touch-stack{display:flex;gap:12px}.touch-right{display:grid;grid-template-columns:repeat(2,60px);gap:8px}.touch-btn{pointer-events:auto;touch-action:none;border-radius:50%;border:1px solid #ffe8b580;background:#102340a9;color:#fff;height:66px;min-width:66px;font-size:21px;backdrop-filter:blur(9px);box-shadow:0 5px 20px #0005}.touch-btn:active,.touch-btn.pressed{background:#ceaf70bd}.touch-btn small{display:block;font-size:9px;letter-spacing:.05em}.disabled-webgl{position:fixed;inset:0;background:#11202c;display:grid;place-items:center;z-index:30;text-align:center;padding:50px}.disabled-webgl[hidden]{display:none}
@media(max-width:850px){.bottom-hud{display:none}.mobile-controls{display:flex}.hud{top:85px;left:17px;max-width:215px}.hud h2{font-size:25px}.hud p{display:none}.topbar{padding:15px 18px}.world-name{font-size:14px;max-width:45vw;overflow:hidden;text-overflow:ellipsis}.top-actions button{width:30px;height:30px;font-size:13px}.minimap-wrap{bottom:165px;left:15px;width:105px;height:105px}.velocity{right:17px;bottom:173px}.velocity strong{font-size:32px}.destination{margin-top:14px;padding:9px 11px}.destination strong{font-size:14px}.intro-panel{padding:25px 16px}.intro-image{height:85px;max-width:140px}.intro-panel h1{font-size:38px}.intro-panel p{font-size:12px}.control-guide{font-size:10px;gap:8px}.begin{padding:15px 30px}}
@media(max-width:420px){.hud{max-width:165px}.hud h2{font-size:22px}.destination{max-width:167px}.destination strong{font-size:12px}.destination-distance{font-size:9px}.scorebox{margin-top:12px}.score-number{font-size:25px}.progress{width:146px}.world-name{display:none}.touch-btn{height:59px;min-width:59px}.touch-right{grid-template-columns:repeat(2,55px)}}

@media(max-height:650px) and (max-width:900px){.minimap-wrap{display:none}.velocity{bottom:150px}.hud p{display:none}}

/* V0.2: world atlas, visitor progression, camera controls and photo capture */
.top-actions .atlas-btn{width:auto;border-radius:25px;padding:0 13px;font-size:17px;letter-spacing:.12em}.atlas-btn span{font:700 10px Arial,sans-serif;vertical-align:middle;margin-left:4px}.atlas[hidden],.completion[hidden]{display:none}.atlas,.completion{position:fixed;inset:0;display:grid;place-items:center;padding:22px;z-index:40;background:#08101de8;backdrop-filter:blur(16px)}.atlas-panel{width:min(1000px,100%);max-height:90svh;overflow:auto;padding:33px;background:#121b25;border:1px solid #cdb5827a;box-shadow:0 35px 140px #000d}.atlas-panel header{display:flex;justify-content:space-between;align-items:start;gap:20px;margin-bottom:25px}.atlas-panel h2,.completion h2{font:400 clamp(29px,4vw,47px) Georgia,serif;line-height:1.1;margin:9px 0;color:#f0e5cf}.atlas-panel header button{background:transparent;border:1px solid #9e8b6a;border-radius:50%;width:37px;height:37px;color:#f9eaca;font-size:25px}.atlas-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.atlas-card{border:1px solid #a695776b;display:flex;align-items:center;gap:12px;padding:9px;color:#eee2cc;text-decoration:none;background:#1e2832;transition:background .2s}.atlas-card:hover,.atlas-card:focus-visible{background:#3c4151}.atlas-card.current{border-color:#ecc77c;background:#283648}.atlas-card img{height:80px;width:65px;object-fit:cover}.atlas-card strong{display:block;font:400 17px Georgia,serif}.atlas-card span{display:block;font-size:9px;letter-spacing:.08em;color:#c0b198;margin-top:6px}.atlas-panel p{color:#b5ac9d;font-size:11px;line-height:1.5;margin:24px 0 0}.completion-panel{width:min(530px,100%);text-align:center;border:1px solid #cdb58289;background:linear-gradient(140deg,#243249,#0a121c);padding:48px 27px;box-shadow:0 20px 90px #000b}.completion-star{font-size:82px;color:#f3d492;margin:14px 0;text-shadow:0 0 45px #dfbb71aa}.completion-panel p{max-width:340px;margin:15px auto 28px;color:#cdc5b6;font-size:13px;line-height:1.8}.completion-actions{display:flex;justify-content:center;gap:12px;flex-wrap:wrap}.completion-actions a,.completion-actions button{border:1px solid #d9c397;background:transparent;color:#f5e5c8;font-size:10px;letter-spacing:.12em;padding:15px 20px}.completion-actions a{background:#e7ca94;color:#101923}.photo-ui .hud,.photo-ui .topbar,.photo-ui .minimap-wrap,.photo-ui .bottom-hud,.photo-ui .velocity,.photo-ui .mobile-controls,.photo-ui .message{visibility:hidden}.photo-ui .screen-vignette{opacity:.4}
@media(max-width:850px){.atlas-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.top-actions .atlas-btn{padding:0 7px}.top-actions .atlas-btn span{display:none}.top-actions{gap:5px}.top-actions button{width:31px;height:31px}}
@media(max-width:500px){.atlas{padding:10px}.atlas-panel{padding:19px;max-height:96svh}.atlas-grid{gap:8px}.atlas-card{display:block;text-align:center;padding:5px}.atlas-card img{width:100%;height:95px}.atlas-card strong{font-size:13px;margin-top:5px}.atlas-card span{font-size:8px}.completion-panel{padding:25px 15px}.completion-star{font-size:55px}.completion h2{font-size:30px}}

/* Painting-to-world entrance animation; works without motion on accessibility settings. */
.intro{transition:opacity .55s ease,transform .7s cubic-bezier(.22,.8,.2,1)}
.intro.is-entering{opacity:0;transform:scale(1.12);pointer-events:none}
@media(prefers-reduced-motion:reduce){.intro{transition:none}.intro.is-entering{transform:none}}