:root{color-scheme:dark;--ink:#f7f8ef;--muted:#c0cfcd;--panel:rgba(16,29,32,.83);--accent:#e3f4ae;--stroke:rgba(255,255,255,.18)}
*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;overscroll-behavior:none;font-family:-apple-system,BlinkMacSystemFont,"Helvetica Neue",Arial,sans-serif;background:#142324;color:var(--ink)}body{touch-action:none;-webkit-user-select:none;user-select:none}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer;touch-action:none;border:0}button:focus-visible,a:focus-visible{outline:3px solid var(--accent);outline-offset:3px}button svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}#world,#world canvas{position:absolute;inset:0;width:100%;height:100%;display:block}#world{background:#aabac6}#loading{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#142324;z-index:30;transition:opacity .7s}#loading.finished{opacity:0;pointer-events:none}.load-mark{font-weight:700;font-size:72px;letter-spacing:.16em;text-align:center;padding-left:.16em}.load-mark span{display:block;font-size:12px;letter-spacing:.24em;margin:16px 0 35px;color:var(--accent)}.load-line{width:180px;height:2px;background:#ffffff20;overflow:hidden}.load-line i{display:block;background:var(--accent);width:60%;height:2px;animation:load 1.4s infinite}#loading p{font-size:14px;color:var(--muted);margin-top:20px}@keyframes load{from{transform:translateX(-100%)}to{transform:translateX(270%)}}.hud{position:absolute;left:0;right:0;top:0;display:flex;justify-content:space-between;align-items:flex-start;padding:calc(26px + env(safe-area-inset-top)) 32px 65px;pointer-events:none;background:linear-gradient(#09171990,transparent);gap:20px}.place-brand{text-shadow:0 2px 12px #14232477}.eyebrow{display:block;font-size:12px;font-weight:600;letter-spacing:.2em;color:var(--accent)}.eyebrow b{font-weight:400;opacity:.7;margin-left:12px}h1{font-weight:650;font-size:35px;margin:10px 0 0;line-height:1;letter-spacing:.1em}h1 span{font-size:12px;letter-spacing:.18em;margin-left:16px;vertical-align:middle;font-weight:450}.compass{position:absolute;left:50%;top:calc(26px + env(safe-area-inset-top));transform:translateX(-50%);text-align:center;font-variant-numeric:tabular-nums;text-shadow:0 1px 6px #000}.compass>span{display:block;font-size:14px;letter-spacing:.2em}.compass i{display:block;border-left:3px solid transparent;border-right:3px solid transparent;border-top:5px solid var(--accent);width:0;margin:7px auto}.compass small{font-size:12px;letter-spacing:.06em;color:#e4eeec}.tools{display:flex;gap:8px;pointer-events:auto}.icon-button{display:grid;place-items:center;width:44px;height:44px;background:var(--panel);border:1px solid var(--stroke);border-radius:12px;backdrop-filter:blur(10px)}.icon-button:hover,.icon-button.active{color:var(--accent);background:#25383ae8}.reticle{position:absolute;top:50%;left:50%;width:4px;height:4px;border-radius:50%;background:#ffffff8a;box-shadow:0 0 2px #102b29;pointer-events:none}#location-card{position:absolute;left:32px;top:calc(126px + env(safe-area-inset-top));display:flex;align-items:center;gap:9px;padding:10px 12px;background:var(--panel);border:1px solid var(--stroke);border-radius:8px;font-size:13px;backdrop-filter:blur(10px);pointer-events:none}.location-dot{width:5px;height:5px;border-radius:50%;background:var(--accent)}#walk-distance{font-size:12px;border-left:1px solid #ffffff30;padding-left:9px;color:var(--muted);font-variant-numeric:tabular-nums}.controls{position:absolute;bottom:calc(50px + env(safe-area-inset-bottom));left:35px;right:35px;display:flex;align-items:flex-end;justify-content:space-between;pointer-events:none}.look-controls{display:flex;flex-direction:column;align-items:center;gap:32px;pointer-events:auto}.look-hint{display:flex;align-items:center;flex-direction:column;gap:10px;font-size:12px;color:#ffffffc9;text-shadow:0 1px 5px #000;pointer-events:none}.look-hint svg{width:34px;height:34px;fill:none;stroke:currentColor;stroke-width:1.2;stroke-linecap:round;stroke-linejoin:round}.run-button{border-radius:50%;width:72px;height:72px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:5px;background:#12252e83;border:1px solid #ffffff3d;backdrop-filter:blur(8px);font-size:12px}.run-button[aria-pressed=true]{background:var(--accent);color:#132827}.run-button svg{width:24px;height:24px}#onboarding{position:absolute;bottom:calc(75px + env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);background:var(--panel);border:1px solid var(--stroke);padding:21px 46px 21px 24px;border-radius:12px;backdrop-filter:blur(15px);transition:opacity .7s;min-width:260px}#onboarding strong{display:block;font-size:17px;font-weight:550;margin-bottom:9px}#onboarding span{font-size:13px;line-height:1.7;color:var(--muted)}#onboarding button{position:absolute;right:10px;top:8px;background:transparent;font-size:22px;color:var(--muted);width:28px;height:28px}#onboarding.done{opacity:0;pointer-events:none}footer{position:absolute;left:32px;right:32px;bottom:calc(17px + env(safe-area-inset-bottom));font-size:12px;display:flex;justify-content:space-between;color:#fff9;pointer-events:none;text-shadow:0 1px 5px #000}footer a{color:inherit;pointer-events:auto;text-decoration:none}.desktop-hint{letter-spacing:.03em}.desktop-hint i{font-style:normal;padding:0 8px}.map-panel{position:absolute;right:32px;top:calc(85px + env(safe-area-inset-top));width:min(360px,calc(100vw - 40px));padding:18px;background:#132427f5;border:1px solid #ffffff20;border-radius:16px;backdrop-filter:blur(20px);box-shadow:0 15px 80px #0005;z-index:10}.map-panel[hidden]{display:none}.panel-title{font-size:15px;display:flex;justify-content:space-between;align-items:center;font-weight:600}.panel-title button,.dialog-close{background:transparent;font-size:26px;font-weight:300;color:#c1d0d0;padding:0 5px}#map{width:100%;height:auto;margin-top:10px;border-radius:8px;background:#1b3034;max-height:52dvh;object-fit:contain}.map-legend{display:flex;justify-content:space-between;margin:14px 0;color:var(--muted);font-size:12px}.map-legend i{display:inline-block;width:6px;height:6px;background:var(--accent);border-radius:50%;margin-right:7px}.map-legend small{font-size:12px}#reset-position{padding:12px;width:100%;border:1px solid #ffffff25;background:#ffffff09;border-radius:8px;font-size:14px}dialog{background:#15282a;color:var(--ink);border:1px solid #ffffff24;border-radius:18px;padding:30px;width:min(470px,calc(100vw - 32px));max-height:85dvh;overflow:auto;touch-action:pan-y}dialog::backdrop{background:#0b171a88;backdrop-filter:blur(8px)}dialog h2{font-size:28px;margin:20px 0}dialog h3{font-size:15px;font-weight:550}dialog p{font-size:14px;line-height:1.85;color:#bccfcd}dialog a{font-size:13px;color:var(--accent)}.dialog-close{position:absolute;right:17px;top:13px}dialog hr{border:0;height:1px;background:#ffffff1b;margin:22px 0}.credit{font-size:12px}.error-action{margin-top:20px;background:var(--accent);padding:12px 24px;border-radius:8px;color:#132827}#toast{position:absolute;top:calc(180px + env(safe-area-inset-top));left:50%;transform:translateX(-50%);padding:12px 18px;white-space:nowrap;max-width:90vw;background:var(--panel);border:1px solid var(--stroke);font-size:14px;border-radius:8px}
@media(max-width:600px){.hud{padding:calc(21px + env(safe-area-inset-top)) 20px 60px}.eyebrow{font-size:12px;letter-spacing:.13em}h1{font-size:28px;margin-top:9px}h1 span{display:none}.tools{gap:6px}.icon-button{width:39px;height:39px;border-radius:10px}.icon-button svg{width:20px;height:20px}.compass{top:calc(27px + env(safe-area-inset-top));left:48%}#location-card{left:20px;top:calc(105px + env(safe-area-inset-top));font-size:12px;padding:8px 10px}.controls{left:21px;right:24px;bottom:calc(46px + env(safe-area-inset-bottom))}.look-controls{gap:38px}.run-button{width:64px;height:64px}.look-hint{font-size:12px}#onboarding{bottom:calc(225px + env(safe-area-inset-bottom));width:calc(100vw - 64px);max-width:330px;min-width:0;padding:17px 40px 17px 19px}#onboarding strong{font-size:16px;margin-bottom:5px}#onboarding span{font-size:13px}.desktop-hint{display:none}footer{justify-content:flex-end;left:20px;right:20px;bottom:calc(15px + env(safe-area-inset-bottom))}.map-panel{right:20px;top:calc(73px + env(safe-area-inset-top))}}
@media(max-height:500px) and (orientation:landscape){.hud{padding:16px 24px}.place-brand h1{font-size:24px}#location-card{top:88px;left:24px}.compass{top:18px}.controls{bottom:30px;left:28px;right:28px}.look-controls{gap:15px}#onboarding{bottom:42px;width:265px;padding:15px 40px 15px 18px}.map-panel{top:62px;width:290px;max-height:calc(100dvh - 76px);overflow:auto}#map{max-height:37dvh}.desktop-hint{display:none}footer{bottom:10px;justify-content:flex-end}.run-button{width:59px;height:59px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}
.map-panel{--map-opacity:.70;position:absolute;right:30px;top:calc(91px + env(safe-area-inset-top));width:224px;padding:10px;background:rgba(15,32,35,.18);border:1px solid #f0f6df2e;border-radius:13px;backdrop-filter:none;box-shadow:0 3px 22px #0b25251a;pointer-events:none;z-index:3;overflow:visible;max-height:none;transition:background .2s}
.map-panel #map{display:block;width:100%;height:auto;margin:5px 0 0;background:transparent;max-height:none;border-radius:4px;opacity:var(--map-opacity);pointer-events:none;object-fit:contain}
.map-panel .panel-title{font-size:12px;font-weight:500;line-height:1.2;text-shadow:0 1px 5px #102626;gap:5px;color:#f0f4e4}
.map-actions{display:flex;gap:4px;align-items:center}.map-actions button{pointer-events:auto;display:grid;place-items:center;width:26px;height:26px;border-radius:6px;background:#102d3045;border:1px solid #ffffff19;padding:0;font-size:23px}.map-actions button svg{width:15px;height:15px}.map-bottom{display:none}
.map-panel[data-mode=full]{left:50%;right:auto;top:calc(105px + env(safe-area-inset-top));transform:translateX(-50%);width:min(78vw,680px,calc((100dvh - 280px) * 1.087));min-width:255px;padding:14px 17px;background:#0f23272e;border-color:#f1f4da50;border-radius:14px}
.map-panel[data-mode=full] .panel-title{font-size:15px}.map-panel[data-mode=full] .map-actions button{width:32px;height:32px}.map-panel[data-mode=full] .map-bottom{display:flex;align-items:center;justify-content:space-between;gap:15px;margin:12px 0 0;padding-top:10px;border-top:1px solid #ffffff26}.map-opacity-label{display:flex;align-items:center;gap:8px;white-space:nowrap;font-size:12px;text-shadow:0 1px 4px #142a2c;pointer-events:auto}.map-opacity-label input{width:85px;height:26px;accent-color:var(--accent);touch-action:none;cursor:pointer}.map-panel #reset-position{pointer-events:auto;width:auto;padding:7px 9px;border-radius:6px;background:#183a3b66;font-size:12px}
.controls{z-index:5}.hud{z-index:4}#location-card{z-index:2}#onboarding{z-index:4}
@media(max-width:600px){.map-panel{top:calc(145px + env(safe-area-inset-top));right:17px;width:174px;padding:9px;border-radius:11px}.map-panel .panel-title{font-size:12px}.map-panel[data-mode=full]{top:calc(144px + env(safe-area-inset-top));width:min(calc(100vw - 36px),calc((100dvh - 360px) * 1.087));min-width:260px;padding:10px 12px}.map-panel[data-mode=full] .map-bottom{gap:8px}.map-panel .map-opacity-label input{width:65px}.map-panel[data-mode=full] .panel-title{font-size:14px}}
@media(max-height:500px) and (orientation:landscape){.map-panel{top:77px;right:25px;width:155px;padding:7px}.map-panel[data-mode=full]{top:72px;width:min(350px,calc((100dvh - 150px) * 1.087));min-width:230px;padding:7px 10px}.map-panel[data-mode=full] .map-bottom{margin-top:3px;padding-top:4px}.map-panel[data-mode=full] .panel-title{font-size:12px}.map-panel[data-mode=full] .map-actions button{width:25px;height:25px}.map-panel #reset-position{font-size:12px;padding:6px}.map-panel .map-opacity-label input{width:55px}}

@media(max-width:600px) and (max-height:720px){.map-panel[data-mode=full]{top:calc(115px + env(safe-area-inset-top));width:min(calc(100vw - 36px),270px);min-width:230px}}

:root{--accent:#f1d9a1}.load-mark{font-size:clamp(46px,8vw,72px)}
.paint-button{white-space:nowrap;display:flex;align-items:center;justify-content:center;gap:7px;border-radius:28px;background:#a33c32e8;border:1px solid #ffd8b17a;padding:13px 19px;box-shadow:0 5px 20px #34201b30;font-size:14px;font-weight:600}.paint-button[aria-pressed=true]{background:var(--accent);color:#332c24}.paint-button.unavailable{border-style:dashed}.look-controls{gap:18px}.look-hint{display:none}.paint-button svg{width:20px;height:20px}button:disabled{opacity:.5;cursor:wait}
#paint-select-hint{position:absolute;left:50%;bottom:calc(55px + env(safe-area-inset-bottom));transform:translateX(-50%);display:flex;align-items:center;gap:20px;background:#192b2ae8;border:1px solid #f1d9a188;padding:11px 15px;border-radius:10px;font-size:14px;z-index:6;white-space:nowrap}#paint-select-hint button{background:none;font-size:25px}#paint-select-hint[hidden],#paint-preview-bar[hidden]{display:none}body[data-paint-mode=select] .reticle{width:14px;height:14px;border:1px solid var(--accent);background:none;transform:translate(-5px,-5px)}body[data-paint-mode=select] #onboarding{display:none}
#paint-dialog{padding:24px;width:min(430px,calc(100vw - 24px));max-height:calc(100dvh - 24px);border-color:#ccb78355;background:#1c2b2c;overflow:auto}#paint-dialog::backdrop{background:#101c2052;backdrop-filter:blur(2px)}.paint-heading{display:flex;align-items:center;justify-content:space-between}.paint-heading .eyebrow{font-size:10px;letter-spacing:.2em}.paint-heading h2{font-size:24px;margin:9px 0 14px}.paint-place{display:flex;justify-content:space-between;align-items:center;font-size:12px;margin-bottom:10px;color:#e4e3cf;gap:8px}.paint-place>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.paint-place small{color:#c2c7b8;font-size:11px;white-space:nowrap}#paint-canvas{display:block;width:min(100%,34dvh);height:auto;aspect-ratio:1;margin:auto;background-color:#c5c0b3;background-image:linear-gradient(#847b6914 1px,transparent 1px),linear-gradient(90deg,#847b6914 1px,transparent 1px);background-size:12.5% 12.5%;border:1px solid #e8e2cc66;border-radius:3px;touch-action:none;cursor:crosshair}.paint-instruments{display:flex;justify-content:space-between;align-items:center;margin:14px 0 11px;gap:10px}#paint-palette{display:flex;gap:7px}#paint-palette button{height:25px;width:25px;border-radius:50%;border:2px solid #ffffff18;outline-offset:2px}#paint-palette button[aria-pressed=true]{outline:2px solid #eadba9}.brush-label{font-size:11px;color:#c9cbbb;display:flex;align-items:center;gap:6px}.brush-label input{width:65px;accent-color:var(--accent);height:30px;touch-action:none}.paint-utilities{display:flex;gap:12px;margin-top:11px}.paint-utilities button{font-size:11px;background:none;color:#d8dacb;padding:4px 0}.paint-utilities #paint-delete{margin-left:auto;color:#e4a396}#paint-status{font-size:11px;line-height:1.5;min-height:17px;margin:11px 0;color:#afc2b9}#paint-status.error{color:#ffb5a8}.paint-actions{display:flex;gap:9px}.paint-actions button{flex:1;border-radius:7px;background:#ffffff0c;border:1px solid #dce7cf33;padding:12px 8px;font-size:14px}.paint-actions .primary,#paint-preview-bar .primary{background:#efdbab;color:#263230;border-color:#efdbab;font-weight:600}#paint-preview-bar{position:absolute;bottom:calc(37px + env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);padding:13px 16px;background:#142526ee;border:1px solid #eddbb365;border-radius:12px;z-index:7;text-align:center;font-size:13px;width:330px;max-width:calc(100vw - 32px)}#paint-preview-bar small{display:block;margin-top:4px;color:#b8c6bd;font-size:11px}#paint-preview-bar>div{display:flex;gap:7px;margin-top:12px}#paint-preview-bar button{flex:1;font-size:12px;padding:10px 8px;border-radius:6px;background:#ffffff12;border:1px solid #ffffff20}#toast{z-index:20;white-space:normal;text-align:center;line-height:1.5;width:max-content}body[data-paint-mode=preview] #onboarding{display:none}
@media(max-width:600px){.paint-button{padding:12px 16px}.look-controls{gap:16px}#paint-select-hint{bottom:calc(215px + env(safe-area-inset-bottom));max-width:calc(100vw - 36px);font-size:13px}#paint-dialog{padding:18px}#paint-palette{gap:6px}#paint-palette button{width:24px;height:24px}.brush-label input{width:58px}.paint-heading h2{font-size:22px}}
@media(max-height:650px){#paint-dialog{padding:14px 18px}#paint-canvas{width:min(100%,31dvh)}.paint-heading h2{margin:5px 0 9px;font-size:20px}.paint-instruments{margin:7px 0}.paint-place{margin-bottom:7px}.paint-actions button{padding:10px}.paint-utilities{margin-top:6px}#paint-status{margin:6px 0}}

#move-stick{position:fixed;width:112px;height:112px;margin:-56px 0 0 -56px;border:1px solid #ffffff70;border-radius:50%;background:#10252c28;pointer-events:none;z-index:6;box-shadow:0 2px 16px #0002}
#move-stick[hidden]{display:none}#move-knob{position:absolute;left:35px;top:35px;width:40px;height:40px;border:1px solid #fff9;border-radius:50%;background:#f1d9a169;box-shadow:0 2px 8px #10252c33;will-change:transform}
.move-hint{font-size:14px;line-height:1.8;color:#fffdf0c9;text-shadow:0 1px 5px #000;pointer-events:none}.move-hint small{font-size:14px;color:#ffffff90}
.look-controls{pointer-events:none}.look-controls button{pointer-events:auto}#onboarding{pointer-events:none}#dismiss-onboarding{pointer-events:auto}
@media(pointer:fine){.move-hint{visibility:hidden}}

#move-zone{width:min(180px,42vw);height:min(180px,34dvh);display:flex;align-items:flex-end;justify-content:center;padding:12px 6px;border:1px solid #ffffff25;border-radius:24px;background:#13292c12;font-size:13px;text-align:center;pointer-events:none}

.jump-button{min-height:44px;min-width:74px;padding:10px 16px;border-radius:24px;background:#223a37d9;border:1px solid #d8e2c675;font-size:14px;font-weight:600;white-space:nowrap}.jump-button:disabled{cursor:default}.climb-hint{position:absolute;left:50%;top:calc(152px + env(safe-area-inset-top));transform:translateX(-50%);width:max-content;max-width:calc(100vw - 40px);padding:7px 12px;border-radius:6px;background:#142824b8;font-size:13px;line-height:1.5;color:#e6ecd5;pointer-events:none;text-align:center;z-index:2}body[data-paint-mode=edit] .climb-hint,body[data-paint-mode=preview] .climb-hint{display:none}@media(max-height:500px) and (orientation:landscape){.climb-hint{top:78px;max-width:36vw;left:50%}}

@media(max-width:600px){#paint-select-hint{bottom:calc(275px + env(safe-area-inset-bottom))}}

.action-row{display:flex;align-items:center;gap:8px;pointer-events:none}.view-button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;min-width:60px;min-height:44px;border-radius:12px;background:#142b2ddd;border:1px solid #d8e2c65c;line-height:1.2}.view-button span{font-size:10px;color:#c4d0c9}.view-button b{font-size:14px;letter-spacing:.06em}.view-button[aria-pressed=true]{border-color:#efdbab9c}.touch-held{filter:brightness(1.3);box-shadow:0 0 0 2px #f1d9a180}
@media(max-width:360px){.controls{left:16px;right:16px}#move-zone{width:40vw}.paint-button{padding-inline:12px}.action-row{gap:6px}.jump-button{min-width:70px;padding-inline:12px}}

/* Keep the artwork's center clear on both phone orientations. */
#paint-preview-bar{position:fixed;bottom:calc(10px + env(safe-area-inset-bottom));width:420px;padding:8px 10px;border-radius:10px;background:#142526e8}
#paint-preview-bar small{margin:0;font-size:12px;line-height:18px}
#paint-preview-bar>div{margin-top:5px;gap:7px}
#paint-preview-bar button{min-height:44px;font-size:14px;padding:9px 7px;white-space:nowrap;touch-action:manipulation}
body[data-paint-mode=preview] .controls{bottom:calc(103px + env(safe-area-inset-bottom))}
body[data-paint-mode=preview] .paint-button,body[data-paint-mode=preview] #location-card,body[data-paint-mode=preview] footer,body[data-paint-mode=preview] #toast,body[data-paint-mode=preview] .map-panel{display:none}
body[data-paint-mode=preview] .run-button{width:64px;height:64px}
.paint-color-mixer{margin:9px 0 12px;border:1px solid #dce7cf33;border-radius:8px;background:#12232666}
.paint-color-mixer summary{display:flex;align-items:center;gap:10px;min-height:44px;padding:7px 11px;font-size:14px;cursor:pointer;touch-action:manipulation;list-style:none}
.paint-color-mixer summary::-webkit-details-marker{display:none}.paint-color-mixer summary::after{content:'＋';margin-left:auto;font-size:20px;color:#b8c6bd}.paint-color-mixer[open] summary::after{content:'−'}
#paint-color-swatch{display:block;flex:none;width:28px;height:28px;border:1px solid #ffffff70;border-radius:5px;background:var(--paint-color,#f35e50)}
.color-mixer-body{padding:0 11px 11px}.color-channel{display:grid;grid-template-columns:62px minmax(0,1fr) 42px;align-items:center;gap:8px;min-height:39px;font-size:14px;color:#d5ded3}.color-channel output{text-align:right;font-size:12px;font-variant-numeric:tabular-nums}
.color-channel input{appearance:none;-webkit-appearance:none;display:block;margin:0;width:100%;min-width:0;height:18px;border:1px solid #ffffff40;border-radius:9px;touch-action:none}
#paint-hue{background:linear-gradient(to right,#f00,#ff0,#0f0,#0ff,#00f,#f0f,#f00)}#paint-saturation{background:linear-gradient(to right,var(--paint-gray),var(--paint-saturated))}#paint-value{background:linear-gradient(to right,#000,var(--paint-bright))}
.color-channel input::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:28px;height:28px;border:3px solid #fff;border-radius:50%;background:#ffffff22;box-shadow:0 1px 5px #0008}.color-channel input::-moz-range-thumb{width:22px;height:22px;border:3px solid #fff;border-radius:50%;background:#ffffff22;box-shadow:0 1px 5px #0008}
.color-hex-label{display:flex;align-items:center;justify-content:space-between;gap:6px;font-size:12px;margin-top:6px}.color-hex-label input{width:108px;flex:none;min-height:40px;padding:8px;font:16px ui-monospace,monospace;color:#edf1e2;background:#101d20;border:1px solid #bcc6b653;border-radius:5px;user-select:text;-webkit-user-select:text;touch-action:auto}.color-hex-label input[aria-invalid=true]{border-color:#f99c86}
#paint-color-error{font-size:12px;line-height:1.5;color:#ffb5a8;margin:7px 0 0}
.paint-instruments{flex-wrap:wrap}.brush-label{font-size:14px}.paint-utilities button{font-size:13px;min-height:36px}#paint-status{font-size:12px}.paint-color-mixer input:focus-visible{outline:2px solid var(--accent);outline-offset:4px}
@media(max-height:500px) and (orientation:landscape){#paint-preview-bar>span{display:none}#paint-preview-bar>div{margin:0}body[data-paint-mode=preview] .controls{bottom:calc(80px + env(safe-area-inset-bottom))}.color-channel{min-height:36px}}

/* Original title artwork: keep a compact HUD and an unobstructed view. */
.game-logo{display:block;width:100%;height:auto;object-fit:contain}
.load-mark{width:min(380px,82vw);padding:0;margin:0 0 36px;font-size:0;letter-spacing:normal}
.place-brand{width:178px;flex:0 0 auto}.place-brand h1{margin:0;font-size:0;letter-spacing:normal;line-height:1}
@media(max-width:600px){.place-brand{width:136px}.hud{gap:10px}}
@media(max-width:360px){.place-brand{width:120px}}
@media(max-height:500px) and (orientation:landscape){.place-brand{width:112px}.compass{top:calc(14px + env(safe-area-inset-top))}}

.ride-button{min-height:44px;padding:10px 17px;border-radius:24px;background:#e3c38c;color:#223532;border:1px solid #fff5ce;font-size:14px;font-weight:650;pointer-events:auto}#ride-speed{font-size:16px;font-weight:650;font-variant-numeric:tabular-nums;background:#142b2ddd;padding:7px 14px;border-radius:8px;pointer-events:none}body[data-riding=true] .look-controls{gap:12px}body[data-riding=true] .look-hint{display:none}.ride-button[hidden],#ride-speed[hidden]{display:none}

#paint-toggle[hidden],#run-toggle[hidden]{display:none}.action-row>button{pointer-events:auto}

/* Language controls and text identity remain usable without the logo image. */
.game-logo[hidden]{display:none}
.international-wordmark{display:block;font:850 23px/1.05 -apple-system,BlinkMacSystemFont,"Arial Black",Arial,sans-serif;letter-spacing:-.035em;color:#fff3d5}
.brand-location{display:block;font:600 10px/1.5 -apple-system,BlinkMacSystemFont,Arial,sans-serif;letter-spacing:.1em;margin-top:4px;color:#e6d7b7}
.place-brand .international-wordmark{font-size:13px;letter-spacing:.08em;margin-top:4px}
html[lang=en] .place-brand h1{display:none}
html[lang=en] .place-brand .international-wordmark{font-size:23px;letter-spacing:-.035em;margin-top:2px}
.load-mark .international-wordmark{font-size:clamp(30px,7vw,44px);margin-top:10px}
.load-mark .brand-location{font-size:12px;margin-top:8px}
.language-switch{background:#15282aeb;border:1px solid #ffffff40;color:#f7eed7;border-radius:8px;min-height:44px;padding:8px 12px;font-size:14px;white-space:nowrap;touch-action:manipulation}

.language-setting{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:0 0 20px;padding:12px 0;border-bottom:1px solid #ffffff20;font-size:14px}

html[lang=en] .paint-place{align-items:flex-start;flex-direction:column;gap:3px}
html[lang=en] .color-channel{grid-template-columns:80px minmax(0,1fr) 38px;font-size:13px}
#paint-select-hint{white-space:normal;text-align:center}
#help-dialog p{font-size:16px;line-height:1.65}
#onboarding{max-width:calc(100vw - 40px)}
html[lang=en] #onboarding{min-width:0;width:286px}
@media(max-width:600px){
 .place-brand{width:125px}.place-brand .game-logo{width:112px}
 .place-brand .international-wordmark{font-size:12px}.brand-location{font-size:9px}
 html[lang=en] .place-brand .international-wordmark{font-size:22px}
 .compass{left:50%;top:calc(82px + env(safe-area-inset-top))}

 #location-card{max-width:calc(100vw - 34px)}#location-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}#walk-distance{flex:none}
 .map-panel[data-mode=full] .map-bottom{flex-wrap:wrap}
 html[lang=en] #onboarding{left:17px;transform:none;bottom:calc(240px + env(safe-area-inset-bottom));width:calc(100vw - 34px);padding:14px 42px 14px 17px}
}
@media(max-height:500px) and (orientation:landscape){
 .place-brand h1{display:none}.place-brand .international-wordmark{font-size:20px;margin:0}

 .compass{top:14px}
 html[lang=en] #onboarding{left:50%;bottom:60px;transform:translateX(-50%);width:280px;padding:10px 35px 10px 15px}
 html[lang=en] #onboarding span{font-size:12px;line-height:1.4}
}
/* Keep brand, location and language in separate rows on narrow screens. */
html[lang=ja] .place-brand>.international-wordmark{display:none}
html[lang=ja] .place-brand.logo-unavailable>.international-wordmark{display:block;font-size:22px;letter-spacing:-.035em}
.place-brand .game-logo{width:140px}

@media(max-width:600px){
 .place-brand .game-logo{width:112px}
 #location-card{top:calc(110px + env(safe-area-inset-top))}
 .compass{top:calc(82px + env(safe-area-inset-top));left:auto;right:20px;transform:none;display:flex;align-items:center;gap:7px}
 .compass i{margin:0}

}
@media(max-height:500px) and (orientation:landscape){
 html[lang=ja] .place-brand>.international-wordmark{display:block}
 #location-card{top:88px}

}

.billing-help-link{display:block;padding:13px 16px;border:1px solid #b8c3a94d;border-radius:10px;margin:12px 0 18px;color:#f3da9f;text-decoration:none;font-size:14px}.paint-slot-summary{display:flex;align-items:center;justify-content:space-between;gap:10px;font-size:11px;color:#bacbbb}.paint-slot-summary a{display:inline-flex;align-items:center;text-decoration:none;background:transparent;border:0;color:#efdaa6;font-size:11px;padding:10px;min-height:40px;flex:0 0 auto}

.staging-badge{display:block;width:max-content;max-width:100%;margin-top:5px;padding:3px 6px;border-radius:4px;background:#f4cb78;color:#2b241c;font:700 9px/1.3 system-ui;letter-spacing:.035em;pointer-events:none}.load-mark .staging-badge{margin:10px auto 0}.staging-note{padding:12px;border:1px solid #a28d57;border-radius:8px;background:#f4cb7815}

.paint-slot-summary a[aria-disabled="true"]{opacity:.5;cursor:wait}

.account-link{display:inline-flex;align-items:center;justify-content:center;min-width:44px;width:auto;padding:0 10px;text-decoration:none;font-size:14px;white-space:nowrap}.account-link[hidden]{display:none}.account-link:focus-visible{outline:3px solid #ffc857;outline-offset:3px}
@media(max-width:600px){.tools{flex-wrap:wrap;max-width:166px;justify-content:flex-end}.account-link{min-height:40px}}

/* Time and torch remain in the existing exploration menu, clear of movement. */
.time-button,.flashlight-button{min-width:44px;min-height:44px;gap:0;align-content:center}
.time-button>span{font-size:20px;line-height:22px}.time-button small,.flashlight-button small{font-size:10px;line-height:12px}
.flashlight-button svg{height:22px}.flashlight-button[aria-pressed=true]{color:#15282a;background:#efdbab;border-color:#fff2c9}
@media(max-width:600px){
 .hud{padding-inline:16px;gap:8px}.place-brand{width:112px}
 .tools{display:grid;grid-template-columns:56px 44px 44px;gap:6px;max-width:none;flex-shrink:0}
 .tools .icon-button{width:100%;height:44px}.tools .account-link{padding:0;font-size:11px}
 .compass{left:auto;right:16px;top:calc(130px + env(safe-area-inset-top))}.compass #degrees{display:none}
 #location-card{left:16px;top:calc(126px + env(safe-area-inset-top));max-width:calc(100vw - 94px)}
}

#report-reason{display:block;width:100%;min-height:44px;margin:8px 0 16px;padding:10px;color:var(--ink);background:#203a3c;border:1px solid #78918a;border-radius:7px;font:inherit;touch-action:auto}#report-submit,#report-select{min-height:44px;padding:12px 16px;border-radius:7px;background:var(--accent);color:#172728}#report-submit:disabled{opacity:.6}#report-dialog label{font-size:14px}#report-dialog #report-status{min-height:3em}

/* Sound shares the exploration menu; no new row covers the phone map. */
.sound-button{align-content:center;gap:0}.sound-button svg{height:22px}.sound-button small{font-size:10px;line-height:12px}
.sound-action{min-height:48px;padding:12px 18px;border-radius:9px;color:#182b2c;background:var(--accent);font-weight:600;width:100%;touch-action:manipulation}.sound-action[aria-pressed=true]{background:#30494a;color:var(--ink);border:1px solid #8ba3a0}.sound-action[hidden]{display:none}
#sound-status{min-height:3em}#sound-dialog .dialog-close{min-width:44px;min-height:44px}.sound-volume-label{display:flex;align-items:center;justify-content:space-between;margin-top:24px;font-size:16px}#sound-volume{width:100%;margin:8px 0 0;min-height:44px;accent-color:var(--accent);touch-action:none}#sound-volume:focus-visible{outline:2px solid var(--accent);outline-offset:3px}#sound-dialog .sound-note{font-size:12px;line-height:1.7}
@media(max-width:600px){.tools{grid-template-columns:repeat(4,44px)}.place-brand{width:min(112px,calc(100vw - 234px))}}

/* Full-map text stays readable over both bright streets and the night sky. */
.map-panel[data-mode=full]{background:#10262af2;border-color:#cbd7bd80;width:min(calc(100vw - 24px),680px,calc((100dvh - 285px) * 1.087));min-width:230px}
.map-panel[data-mode=full] #map{opacity:1}
body.full-map-open .look-controls{visibility:hidden;pointer-events:none}
.map-context{display:none}.map-panel[data-mode=full] .map-context{display:grid;gap:4px;margin-top:6px;font-size:12px;line-height:1.4;color:#bdcdc6}.map-context span:last-child{color:#e2e9d8}
.map-panel[data-mode=full] .map-bottom{margin-top:8px}
@media(max-height:500px) and (orientation:landscape){.map-panel[data-mode=full]{top:68px;width:min(420px,calc((100dvh - 178px) * 1.087));min-width:230px}.map-panel[data-mode=full] .map-context{font-size:11px;gap:2px}}