@font-face{font-family:"Press Start 2P";src:url("./assets/fonts/PressStart2P-Regular.ttf") format("truetype");font-style:normal;font-weight:400;font-display:swap}
:root{font-family:Arial,"Hiragino Kaku Gothic ProN","Noto Sans JP",sans-serif;color:#f7f5ef;font-synthesis:none;--pink:#f472aa;--glass:rgba(18,30,40,.76)}*{box-sizing:border-box}body{margin:0;overflow:hidden;background:#9ca7b6}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;border:1px solid #ffffff36;background:var(--glass);cursor:pointer;transition:background .2s,transform .2s}button:hover{background:#d96093;transform:translateY(-1px)}button:focus-visible,a:focus-visible{outline:3px solid #ffda82;outline-offset:4px}button:disabled{opacity:.5;cursor:wait}#world{position:fixed;inset:0;outline:none;touch-action:none}#world canvas{display:block;width:100%;height:100%}header{position:fixed;left:32px;right:32px;top:26px;display:flex;justify-content:flex-end;align-items:flex-start;pointer-events:none}header>*{pointer-events:auto}.top-right{display:flex;gap:8px;align-items:center}.top-right button{border-radius:50px;height:38px;min-width:38px;padding:0 13px;font-size:12px}.eyebrow{font-size:10px;letter-spacing:2.2px;font-weight:700}.mini{position:fixed;right:32px;top:88px;width:160px;border:1px solid #ffffff35;background:var(--glass);border-radius:8px;padding:12px}.map-title{font-size:8px;letter-spacing:1.5px;display:flex;justify-content:space-between;color:#ffffffab}.map-title span{color:var(--pink)}#map{display:block;width:136px;height:136px;margin-top:5px}.actions{position:fixed;right:32px;bottom:57px;display:flex;gap:7px}.actions button{display:flex;align-items:center;gap:14px;border-radius:5px;padding:13px 15px;font-size:10px;letter-spacing:1px}.actions button span{font-size:9px;color:#ffffff76}.actions button i{font-style:normal;color:#f2a5c6;font-size:19px}.actions button.active{background:#dd538b;border-color:#ffd3e6}.actions button.active i{color:white}footer{position:fixed;bottom:19px;left:32px;font-size:8px;letter-spacing:1.6px;color:#fff9}#toast{position:fixed;left:50%;bottom:90px;transform:translate(-50%,12px);background:var(--glass);padding:12px 18px;border-radius:50px;font-size:12px;opacity:0;pointer-events:none;transition:.3s;white-space:nowrap}#toast.show{opacity:1;transform:translate(-50%,0)}dialog{width:min(470px,calc(100vw - 32px));padding:38px;background:#192730;color:#f8f4ed;border:1px solid #fff4;border-radius:12px;box-shadow:0 30px 100px #0007}dialog::backdrop{background:#10202c91;backdrop-filter:blur(5px)}dialog h2{font-weight:500;font-size:25px}.close{position:absolute;right:17px;top:14px;border:0;background:none;font-size:25px}dl{display:grid;grid-template-columns:145px 1fr;gap:18px 10px;font-size:12px;line-height:1.5;margin:30px 0}dt{color:#fac0d9}dd{margin:0}dialog p{color:#c1cbd1;font-size:12px;line-height:1.9}dialog small{font-size:9px;color:#8d9ca8}#loading{color:#fff;text-align:center;position:fixed;inset:0;z-index:10;background:#182933;display:flex;align-items:center;justify-content:center;flex-direction:column;transition:opacity .7s}#loading.done{opacity:0;pointer-events:none}#loading p{font-family:Helvetica,"Helvetica Neue",Arial,sans-serif;font-size:10px;line-height:1.9;color:inherit;letter-spacing:0}#retry{padding:12px 20px;margin-top:15px}.touch-controls{display:none}.paused #world{filter:saturate(.7)}
@media(max-width:850px){header{left:20px;right:20px;top:20px}.mini{top:86px;right:20px;width:116px;padding:9px}.mini #map{width:96px;height:96px}.map-title{font-size:6px}.actions{right:20px;bottom:34px}.actions button{padding:10px;gap:9px;font-size:9px}.actions button span{display:none}.actions button i{font-size:16px}footer{left:20px;bottom:12px;font-size:6px}}
@media(pointer:coarse){.touch-controls{display:block;position:fixed;bottom:130px;left:25px;right:25px;pointer-events:none}#joystick{width:104px;height:104px;border-radius:50%;background:#182d4240;border:1px solid #ffffff4a;pointer-events:auto;touch-action:none;display:grid;place-items:center}#stick{width:42px;height:42px;border-radius:50%;background:#f4b2d090;border:1px solid #fff9}.actions{bottom:23px}.mini{opacity:.85}footer{display:none}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}



@media(max-height:600px){.mini{width:106px;padding:8px;top:75px}.mini #map{width:88px;height:88px}.map-title{font-size:6px}.actions{bottom:35px}header{top:18px}.touch-controls{bottom:90px}.touch-controls #joystick{width:78px;height:78px}}
@media(max-width:600px){.actions{gap:5px}.actions button{padding:10px 8px;gap:5px}}
@media(max-width:600px){.actions{bottom:31px}footer{bottom:12px;font-size:6px}}


.actions{display:grid;grid-template-columns:repeat(3,auto)}.actions button{justify-content:center}.actions b{font-weight:inherit}.actions button:disabled{cursor:default}
@media(max-width:1100px){.actions{bottom:34px;right:20px}.actions button{gap:8px;padding:11px 10px}.actions button span{display:none}}
@media(max-width:600px){.actions{left:20px;right:20px;bottom:24px;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.actions button{font-size:9px;letter-spacing:.4px;min-height:40px;padding:10px 4px}.actions button i{display:none}#toast{bottom:260px}}
@media(pointer:coarse) and (max-width:600px){.touch-controls{bottom:126px}}

#osmCredit{color:inherit;text-decoration:none;font-size:9px}#osmCredit:hover{text-decoration:underline}@media(max-width:600px){footer{font-size:8px}#osmCredit{font-size:8px}}

.time-select{position:relative;flex-shrink:0}.time-select>svg{position:absolute;right:12px;top:50%;transform:translateY(-50%);width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;pointer-events:none}#lightSelect{appearance:none;-webkit-appearance:none;display:block;font:inherit;font-size:12px;line-height:18px;color:inherit;background:var(--glass);border:1px solid #ffffff36;border-radius:30px;width:88px;height:38px;padding:0 32px 0 13px;cursor:pointer}#lightSelect option{color:#1c2730;background:#f4f3ef}#lightSelect:focus-visible{outline:3px solid #ffda82;outline-offset:3px}
@media(max-width:380px){header{left:12px;right:12px}.top-right{gap:4px}#lightSelect{font-size:11px;width:82px;padding-left:12px}.top-right button{min-width:38px;padding:0 9px}}

/* The YouTube surface is behind the depth-tested WebGL aperture. */
.street-screen-layer{position:absolute;inset:0;pointer-events:none;z-index:0}
#world canvas.street-screen-canvas{position:absolute;inset:0;z-index:1}
/* Fixed, faint phosphor texture avoids flicker while following the 3D screen. */
.street-screen-surface{background:#080d0c;backface-visibility:hidden;pointer-events:none;overflow:hidden}
.street-screen-surface iframe{display:block;position:relative;z-index:0;width:1280px;height:720px;border:0;border-radius:20px;pointer-events:none;filter:blur(1.15px) saturate(.82) contrast(.9) brightness(.88) sepia(.08)}
.street-screen-surface::after{
  content:"";position:absolute;inset:0;z-index:2;pointer-events:none;border-radius:18px;
  background:
    linear-gradient(135deg,rgba(218,239,224,.05),transparent 46%),
    radial-gradient(ellipse at 50% 47%,transparent 40%,rgba(3,12,9,.12) 76%,rgba(2,7,6,.42) 100%),
    repeating-linear-gradient(0deg,rgba(2,10,7,.2) 0px,rgba(2,10,7,.2) 1.2px,transparent 1.2px,transparent 5px),
    repeating-linear-gradient(90deg,rgba(255,70,54,.035) 0px,rgba(255,70,54,.035) 2px,rgba(74,255,117,.025) 2px,rgba(74,255,117,.025) 4px,rgba(66,119,255,.045) 4px,rgba(66,119,255,.045) 6px);
  box-shadow:inset 0 0 32px rgba(2,8,6,.38);
}
.street-screen-idle{position:absolute;inset:0;z-index:3;display:grid;place-items:center;background:#171d20;color:#ced4ce;font:700 46px Arial;letter-spacing:8px;text-align:center;padding:80px;pointer-events:none}
.street-screen-idle[hidden]{display:none}
#streetSound{position:fixed;right:32px;top:280px;border-radius:24px;padding:10px 15px;font-size:11px;z-index:2}
#streetSound[hidden]{display:none}
@media(max-width:850px){#streetSound{right:20px;top:235px}}

#musicCredit{color:inherit;text-decoration:none;margin-left:12px;font-size:9px;letter-spacing:.6px}#musicCredit:hover{text-decoration:underline}


/* Reset is a utility beside Help, separate from avatar actions. */
.top-right #reset{display:grid;place-items:center;width:38px;flex-shrink:0;padding:0}.top-right #reset svg{display:block;width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}

#streetSound{top:82px;right:20px;z-index:7;min-height:40px;min-width:82px}#streetSound[aria-pressed="true"]{background:#27443c;color:#f3eee0}@media(max-width:650px){#streetSound{top:72px;right:12px;padding:8px 12px;min-height:38px}}
