.environment-toggle{position:absolute;top:65px;left:18px;z-index:6;padding:8px 12px;border:1px solid #cbd3c3;border-radius:18px;background:#f6f3e9e8;color:#41553f;font:11px system-ui;touch-action:manipulation}
body:not(.has-entered) .environment-toggle{visibility:hidden}
#light-marker{position:absolute;z-index:6;transform:translate(-50%,-100%);padding:8px 12px;border:1px solid #cbd3c3;border-radius:18px;background:#f6f3e9ed;color:#41553f;font:11px system-ui;white-space:nowrap;touch-action:manipulation}
#p4-action[data-target^="light-"]:before{content:'E · '}
#p4-action[data-target^="light-"]:after{display:none}
@media(max-width:760px),(pointer:coarse){.environment-toggle{top:53px;left:12px;font-size:10px;min-height:36px}#light-marker{min-height:38px}#p4-action[data-target^="light-"]:before{display:none}}

#curtain-marker{position:absolute;z-index:6;transform:translate(-50%,-100%);padding:8px 12px;border:1px solid #cbd3c3;border-radius:18px;background:#f6f3e9ed;color:#41553f;font:11px system-ui;white-space:nowrap;touch-action:manipulation}
#bed-rest{position:absolute;z-index:6;bottom:86px;left:50%;transform:translateX(-50%);padding:12px 23px;border:1px solid #cbd3c3;border-radius:22px;background:#f6f3e9ed;color:#41553f;font:13px system-ui;touch-action:manipulation}
#bed-rest:after{content:' · L';font-size:10px;opacity:.6}
@media(max-width:760px),(pointer:coarse){#curtain-marker{min-height:38px}#bed-rest{left:auto;right:24px;transform:none;bottom:94px;min-height:44px;font-size:12px}#bed-rest:after{display:none}}

#computer-marker{position:absolute;z-index:6;transform:translate(-50%,-100%);padding:8px 12px;border:1px solid #cbd3c3;border-radius:18px;background:#f6f3e9ed;color:#41553f;font:11px system-ui;white-space:nowrap;touch-action:manipulation}
#chair-rise{position:absolute;z-index:6;left:50%;bottom:30px;transform:translateX(-50%);padding:12px 23px;border:1px solid #cbd3c3;border-radius:22px;background:#f6f3e9ed;color:#41553f;font:13px system-ui;touch-action:manipulation}
#chair-rise small{font-size:10px;opacity:.65;margin-left:5px}
#p4-action[data-target="macbook"]:before{content:'E · '}#p4-action[data-target="macbook"]:after{display:none}
@media(max-width:760px),(pointer:coarse){#computer-marker{min-height:42px}#chair-rise{left:auto;right:24px;transform:none;bottom:35px;min-height:44px;font-size:12px}#chair-rise small{display:none}#p4-action[data-target="macbook"]:before{display:none}}

#welcome-progress{height:2px;max-width:260px;margin:14px auto 0;background:#e3e8dc22;overflow:hidden;border-radius:2px}#welcome-progress span{display:block;width:38%;height:100%;background:#d6ddc5;animation:home-loading 1.8s ease-in-out infinite}@keyframes home-loading{from{transform:translateX(-110%)}to{transform:translateX(370%)}}
#p4-action::before{content:'E · '!important;display:inline!important}#p4-action::after{display:none!important}
@media(max-width:760px),(pointer:coarse){#p4-action::before{content:'点按 · '!important}}
@media(prefers-reduced-motion:reduce){#welcome-progress span{animation:none;width:100%;opacity:.6}}
/* R2: dynamic Safari viewport and safe-area positioning, only compact/touch presentation changes. */
#welcome-elapsed{display:block;min-height:1em;margin-top:10px;font:10px system-ui;color:#d2d3c6}
@media(max-width:760px),(pointer:coarse){
 :root{--safe-top:env(safe-area-inset-top,0px);--safe-right:env(safe-area-inset-right,0px);--safe-bottom:env(safe-area-inset-bottom,0px);--safe-left:env(safe-area-inset-left,0px)}
 html,body{height:100%;overflow:hidden;overscroll-behavior:none}
 #app{height:var(--view-h,100dvh);min-height:0}
 #welcome{height:var(--view-h,100dvh);bottom:auto;padding:calc(var(--safe-top) + 8px) calc(var(--safe-right) + 12px) calc(var(--safe-bottom) + 8px) calc(var(--safe-left) + 12px);overflow:auto}
 .welcome-copy{padding:10px;max-width:600px;margin:auto}
 .welcome-brand{font-size:10px;margin-bottom:12px}.welcome-copy h1{font-size:24px;line-height:1.4}.welcome-copy p{font-size:13px;margin:10px 0 16px}
 .welcome-actions button{min-height:44px;padding:10px 18px}.welcome-note{margin-top:12px;font-size:10px}#welcome-loading{display:block;min-height:1.4em;font:11px system-ui;margin-top:6px}#welcome-progress{margin-top:8px}#welcome-elapsed{margin-top:6px}
 .home-menu{top:calc(var(--safe-top) + 8px);left:calc(var(--safe-left) + 10px);width:44px;height:44px;padding:0;font-size:0;border-radius:9px}
 .home-menu::after{content:'☰';font:19px system-ui}
 .environment-toggle{top:calc(var(--safe-top) + 8px);left:calc(var(--safe-left) + 62px);height:44px;min-height:44px;max-width:90px;padding:6px 12px;font-size:11px}
 .view-toolbar{top:calc(var(--safe-top) + 8px);right:calc(var(--safe-right) + 10px);left:auto;transform:none;gap:6px;height:44px}
 .mode-tabs{padding:2px;border-radius:8px}.mode-tabs button{min-height:38px;min-width:54px;padding:6px 8px;font-size:10px}.mode-tabs button span{display:none}.icon-button{width:44px;min-height:44px;font-size:22px}
 .sidebar{top:calc(var(--safe-top) + 60px);left:calc(var(--safe-left) + 10px);right:auto;bottom:auto!important;max-width:calc(100vw - var(--safe-left) - var(--safe-right) - 20px);width:230px;max-height:calc(var(--view-h,100dvh) - var(--safe-top) - var(--safe-bottom) - 72px);padding:10px;overscroll-behavior:contain;overflow:auto}
 .sidebar .room-button{min-height:44px;padding:8px}.sidebar .text-button{min-height:44px;padding:10px 0}
 .character-tools{top:calc(var(--safe-top) + 60px);left:calc(var(--safe-left) + 10px);padding:8px;min-height:44px;font-size:10px;max-width:230px}.character-tools small{display:none}.character-tools input{width:18px;height:18px}
 .minimap,.walking .minimap{top:calc(var(--safe-top) + 60px);bottom:auto;right:calc(var(--safe-right) + 10px);width:76px;padding:5px;opacity:.72}.minimap>div{font-size:8px;margin-bottom:3px}.minimap>div b{display:none}
 #joystick{left:calc(var(--safe-left) + 12px);bottom:calc(var(--safe-bottom) + 12px);width:76px;height:76px}#stick{width:30px;height:30px}#joystick i{display:none}
 .music-shortcut{left:calc(var(--safe-left) + 100px);bottom:calc(var(--safe-bottom) + 12px);min-height:44px;max-width:145px;font-size:10px;padding:8px 12px}
 #p4-action{left:auto;right:calc(var(--safe-right) + 12px);bottom:calc(var(--safe-bottom) + 12px);transform:none;min-height:44px;max-width:190px;padding:10px 16px;font-size:12px}
 #chair-rise,#bed-rest{left:auto;right:calc(var(--safe-right) + 12px);bottom:calc(var(--safe-bottom) + 64px);transform:none;min-height:44px;padding:10px 16px;font-size:12px;max-width:190px}
 #p4-notice{bottom:calc(var(--safe-bottom) + 112px);max-width:calc(100vw - var(--safe-left) - var(--safe-right) - 24px);font-size:11px}
 #speaker-marker,#light-marker,#curtain-marker,#computer-marker{max-width:calc(100vw - var(--safe-left) - var(--safe-right) - 24px);min-height:44px}
 #music-panel{right:calc(var(--safe-right) + 10px);bottom:calc(var(--safe-bottom) + 10px);max-height:calc(var(--view-h,100dvh) - var(--safe-top) - var(--safe-bottom) - 20px);max-width:calc(100vw - var(--safe-left) - var(--safe-right) - 20px);overscroll-behavior:contain;touch-action:pan-y}
 .music-close{min-width:44px;min-height:44px;top:0;right:0;line-height:1}
 #music-panel button,#music-panel select{min-height:44px}#music-panel input{height:32px;touch-action:pan-x}
 #info-dialog{max-height:calc(var(--view-h,100dvh) - var(--safe-top) - var(--safe-bottom) - 24px);overflow:auto;overscroll-behavior:contain}
 #info-dialog .close{min-width:44px;min-height:44px;right:2px;top:0}
 .orientation-note{bottom:calc(var(--safe-bottom) + 4px);font-size:9px}
}
@media(orientation:landscape) and (pointer:coarse),(orientation:landscape) and (max-width:760px){
 #music-panel{width:540px;padding:12px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:6px 12px}
 #music-panel h2{grid-column:1/-1;margin:0;padding-right:36px;font-size:16px;line-height:22px}#music-title{grid-column:1/-1;margin:0;font-size:11px;line-height:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}#music-status{grid-column:1/-1;font-size:10px;min-height:12px;line-height:12px}
 #music-panel>label{margin:0;font-size:10px;min-width:0}#music-panel select{margin-top:3px;padding:6px;font-size:11px}.music-transport{align-self:end;margin:0;gap:6px}.music-transport button{padding:5px;font-size:11px}.audio-note{grid-column:1/-1;font-size:9px;margin:0;line-height:13px}
}
@media(orientation:portrait) and (max-width:760px){
 .view-toolbar{top:calc(var(--safe-top) + 60px)}.minimap,.walking .minimap{top:calc(var(--safe-top) + 112px)}.character-tools{top:calc(var(--safe-top) + 112px);max-width:220px}
 .welcome-copy h1{font-size:27px}.welcome-brand{margin-bottom:24px}.welcome-copy p{margin:16px 0 26px}.welcome-actions{gap:12px}
 .music-shortcut{max-width:110px;bottom:calc(var(--safe-bottom) + 98px);left:calc(var(--safe-left) + 12px)}
}

/* Native iOS selectors keep a 16px font to avoid focus zoom changing the usable viewport. */
@media(max-width:760px),(pointer:coarse){#music-panel select{font-size:16px}}