:root{color-scheme:dark;font-family:-apple-system,"PingFang SC","Hiragino Sans GB",sans-serif;color:#f6f8f5;background:#6c919b;font-synthesis:none;--edge:clamp(24px,3vw,48px)}*{box-sizing:border-box}body{margin:0;overflow:hidden;height:100dvh}button,a{-webkit-tap-highlight-color:transparent;color:inherit;font:inherit}button{border:0;background:none;cursor:pointer;min-height:44px;padding:10px 12px;touch-action:manipulation}a{text-decoration:none}button:active{transform:translateY(1px)}button:focus-visible,a:focus-visible,canvas:focus-visible{outline:2px solid #f7f8ef;outline-offset:3px}canvas:focus-visible{outline:none}button:disabled{opacity:.5;cursor:wait}[hidden]{display:none!important}#space{position:fixed;inset:0;width:100%;height:100%;touch-action:none;cursor:grab}#space:active{cursor:grabbing}.veil{position:fixed;inset:0;pointer-events:none;background:linear-gradient(180deg,#102f3940,transparent 22%,transparent 70%,#092c4052);transition:opacity .5s}header{position:fixed;left:var(--edge);right:var(--edge);top:max(20px,env(safe-area-inset-top));display:flex;align-items:center;justify-content:space-between;gap:20px;font-size:12px;text-shadow:0 1px 14px #244e66}.brand{font-size:17px;letter-spacing:.08em}.head-actions{display:flex;gap:24px;align-items:center}.head-actions button{padding:10px 0}.head-actions a{padding:14px 0}#arrival{position:fixed;inset:0;display:flex;justify-content:center;align-items:center;flex-direction:column;text-align:center;pointer-events:none;padding:24px;text-shadow:0 2px 35px #13374455;transition:opacity .8s}.eyebrow{font-size:12px;letter-spacing:.16em;margin:0 0 24px}h1{font-size:clamp(38px,4.8vw,70px);font-weight:200;letter-spacing:.04em;line-height:1.3;margin:0}.invitation{font-size:13px;margin:25px 0 28px;letter-spacing:.08em}#begin{pointer-events:auto;font-size:15px;padding:12px 24px}#loading-note{font-size:11px;min-height:16px;color:#e9f2ebc9;margin:8px 0 0}body.entered #arrival{opacity:0;pointer-events:none}body.entered #begin{pointer-events:none}#place{position:fixed;left:var(--edge);bottom:110px;display:flex;gap:14px;align-items:center;font-size:13px;text-shadow:0 1px 20px #204755}.place-rule{height:1px;width:24px;background:#e7f4ef77}#place span:last-child{font-size:11px;color:#e5f0ea}#walk-ui{position:fixed;left:var(--edge);right:var(--edge);bottom:max(24px,env(safe-area-inset-bottom));display:flex;align-items:center;justify-content:space-between;font-size:12px;gap:20px}.walk-hint{display:flex;align-items:center;gap:28px;font-size:11px;color:#eff6f0}#bearing{min-width:50px;color:#f3efe6}.walk-actions{display:flex;align-items:center;gap:15px}.walk-actions button{padding:10px 4px}#notice{position:fixed;bottom:110px;left:50%;transform:translateX(-50%);opacity:0;pointer-events:none;background:#18333ce8;padding:13px 20px;font-size:12px;max-width:90vw;text-align:center;transition:opacity .25s;z-index:5}#notice.show{opacity:1}#restore{position:fixed;right:var(--edge);top:20px;font-size:12px;text-shadow:0 1px 12px #163c46}body.quiet header,body.quiet #walk-ui,body.quiet #place,body.quiet .veil{opacity:0;pointer-events:none}#joystick{position:fixed;left:30px;bottom:120px;width:116px;height:116px;touch-action:none;user-select:none;-webkit-user-select:none}.stick-ring{position:absolute;inset:0;border:1px solid #e5f4ee77;border-radius:50%;background:#ffffff0a}.stick-ring::before,.stick-ring::after{content:"";position:absolute;left:50%;top:50%;height:1px;width:70px;background:#e6f1e622;transform:translate(-50%,-50%)}.stick-ring::after{transform:translate(-50%,-50%) rotate(90deg)}#stick-knob{position:absolute;width:34px;height:34px;border-radius:50%;left:40px;top:40px;background:#f2f4e8b3;box-shadow:0 2px 15px #35566333}.stick-label{position:absolute;top:124px;left:0;right:0;text-align:center;font-size:10px;color:#f0f5e6a8}.accessible-moves{position:absolute;inset:0}.accessible-moves button{position:absolute;opacity:0;width:40px;height:40px;padding:0}.accessible-moves button:focus-visible{opacity:1;background:#31575c}.accessible-moves button:nth-child(1){top:0;left:38px}.accessible-moves button:nth-child(2){left:0;top:38px}.accessible-moves button:nth-child(3){bottom:0;left:38px}.accessible-moves button:nth-child(4){right:0;top:38px}.mobile-instruction{display:none}dialog{color:#ecf2eb;background:#173039;border:0;width:540px;max-width:calc(100vw - 32px);max-height:calc(100dvh - 40px);overflow:auto;padding:32px;line-height:1.8}dialog::backdrop{background:#102d35b8}.dialog-head{display:flex;align-items:center;justify-content:space-between;gap:14px}.dialog-head h2{font-size:24px;font-weight:300;margin:0}.dialog-head button{font-size:12px;white-space:nowrap}dialog p,dialog dl{font-size:14px}dialog dt{color:#fbfff5;margin-top:14px}dialog dd{margin:2px 0;color:#b9cec6}.note{font-size:12px;color:#adc5bd}dialog a{display:inline-block;padding:15px 0;font-size:13px}.fallback{position:fixed;top:40%;left:10%;right:10%;text-align:center}body.failed #arrival{background:#173039d9}
@media(pointer:coarse),(max-width:700px){.mobile-instruction{display:inline}.desktop-instruction{display:none}.head-actions{gap:16px}header{top:max(12px,env(safe-area-inset-top));font-size:11px}.brand{font-size:15px}#place{bottom:auto;top:85px;font-size:12px}#walk-ui{align-items:flex-end}.walk-hint{display:block;max-width:150px;line-height:1.8}#bearing{display:block;margin-top:5px}.walk-actions{gap:12px;flex-wrap:wrap;justify-content:flex-end;max-width:150px;font-size:11px}#motion{display:none}#joystick{bottom:140px}#notice{bottom:100px;width:max-content;max-width:85vw}.dialog-head h2{font-size:20px}dialog{padding:24px}}
@media(max-width:380px){:root{--edge:20px}.head-actions{gap:12px}.walk-hint{max-width:125px}.walk-actions{gap:10px;max-width:130px}h1{font-size:38px}}
@media(max-height:500px){#arrival .eyebrow{margin-bottom:10px}h1{font-size:34px}.invitation{margin:14px 0 8px}#place{top:78px;bottom:auto}#joystick{width:90px;height:90px;bottom:90px}#stick-knob{left:27px;top:27px}.stick-label{top:94px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}
#world-picker{width:1080px;background:#e8eee8;color:#24413f}#world-picker button:focus-visible{outline-color:#234f58}#panorama-list{display:grid;grid-template-columns:repeat(4,1fr);gap:26px 18px;margin-top:24px}#panorama-list button{padding:0;text-align:left}#panorama-list img{width:100%;aspect-ratio:1.65;object-fit:cover;display:block}#panorama-list span{display:block;padding-top:10px;font-size:13px}#panorama-list [aria-current=true] span::after{content:' · 当前';color:#6b8073;font-size:10px}#world-picker .note{color:#5a756d}#previous-world,#next-world{font-size:26px;min-width:40px;padding:0}.skip{position:fixed;top:10px;left:10px;z-index:10;transform:translateY(-200%);background:#15383b;padding:10px}.skip:focus{transform:none}#scene-veil{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;opacity:1}#scene-veil.dissolving{opacity:0;transition:opacity 1.2s cubic-bezier(.25,.1,.25,1)}
@media(max-width:700px){.head-actions{gap:13px}#walk-ui{align-items:flex-end}.walk-actions{max-width:172px;gap:4px}#previous-world,#next-world{min-width:40px}.walk-hint{max-width:125px}#panorama-list{grid-template-columns:repeat(2,1fr);gap:20px 12px}#panorama-list span{font-size:11px}}
@media(max-width:380px){.head-actions{gap:10px}.head-actions a{font-size:10px}.walk-actions{max-width:148px}.walk-hint{max-width:110px;font-size:10px}#quiet{padding-left:6px}}

@media(max-width:700px){#walk-ui{display:block}.walk-hint{position:absolute;left:0;bottom:58px;max-width:none;display:flex;gap:18px;align-items:center;font-size:10px;white-space:nowrap}#bearing{margin:0}.walk-actions{width:100%;max-width:none;flex-wrap:nowrap;justify-content:space-between;gap:8px}#joystick{bottom:154px}.head-actions{gap:12px}}

body.quiet #notice{opacity:0}#help-motion{padding-left:0;font-size:13px}

/* Quiet direction cues belong to the joystick, without a separate game panel. */
.stick-directions{position:absolute;inset:0;pointer-events:none;font-size:9px;color:#f3f5ebc4;text-shadow:0 1px 8px #28485066}
.stick-directions span{position:absolute;line-height:1;transform:translate(-50%,-50%)}
.stick-directions span:nth-child(1){left:50%;top:-11px}.stick-directions span:nth-child(2){left:-10px;top:50%}.stick-directions span:nth-child(3){left:50%;top:calc(100% + 11px)}.stick-directions span:nth-child(4){left:calc(100% + 10px);top:50%}
#joystick .stick-label{top:calc(100% + 28px);font-size:9px;letter-spacing:.08em}.moving .stick-ring{border-color:#eef5e9aa}.moving .stick-directions{color:#f6f8f0}
.accessible-moves button:nth-child(1){left:calc(50% - 20px)}.accessible-moves button:nth-child(2){top:calc(50% - 20px)}.accessible-moves button:nth-child(3){left:calc(50% - 20px)}.accessible-moves button:nth-child(4){top:calc(50% - 20px)}
/* The scene remains the focal point before entry; the title rests at its edge. */
#arrival{inset:auto var(--edge) 13vh;align-items:flex-start;justify-content:flex-start;text-align:left;padding:0;max-width:600px}
#arrival h1{font-size:clamp(34px,4vw,54px);font-weight:300;letter-spacing:.04em;line-height:1.2}
#arrival .eyebrow{font-size:11px;margin:0 0 16px;letter-spacing:.2em}
#arrival .invitation{margin:18px 0 20px;line-height:1.7;letter-spacing:.04em}
#arrival #begin{padding:10px 0;min-height:44px;font-size:14px}
#arrival #loading-note{font-size:10px}
@media(max-width:700px){#arrival{bottom:14vh;right:30px}#arrival h1{font-size:34px;max-width:290px}}
header,#walk-ui,#place,#arrival{text-shadow:0 1px 3px #18333c70,0 2px 18px #18333c45}

#flight-controls{display:none} @media(max-width:700px){.entered #flight-controls{display:flex;position:fixed;right:22px;bottom:165px;flex-direction:column;gap:12px;z-index:7}#flight-controls button{display:grid;place-items:center;width:40px;height:48px;border:1px solid #ffffff50;border-radius:24px;background:#ffffff09;color:#fff;font-size:19px;touch-action:none}#flight-controls span{font-size:10px}#flight-controls button:active{transform:scale(.94)}.quiet #flight-controls{display:none}}

/* Keep entry and help compact after removing decorative copy. */
#arrival #begin{margin-top:18px}#place #place-title{font-size:13px;color:inherit}.save-actions{display:grid;gap:4px;margin-top:24px}.save-actions button,.save-actions a{text-align:left;padding:8px 0;font-size:13px;min-height:44px}
