/* Loaded last so phone layouts also cover the specialized activity panels. */
#mobile-menu-button,#mobile-context-actions:empty{display:none}
#vehicle-look-mode{display:none}
.mobile-ui #vehicle-look-mode{display:block}
.touch-options{display:contents}
.room-guest-note{white-space:pre-wrap;overflow-wrap:anywhere;padding:clamp(18px,4vw,36px);margin:18px 0;background:#e9dfc8;color:#302b22;border:1px solid #bca781;box-shadow:0 5px 18px #0003;font:clamp(16px,2.6vw,20px)/1.8 Georgia,serif;max-height:50dvh;overflow-y:auto;user-select:text;-webkit-user-select:text}
.mobile-walking-help{display:none}
.mobile-ui .mobile-walking-help{display:block}
.mobile-ui .desktop-walking-help{display:none}
#arrival-reminder{position:absolute;top:112px;left:26px;display:flex;align-items:flex-start;gap:12px;width:310px;max-width:calc(100vw - 40px);padding:14px 16px;background:#1b2a23f2;border:1px solid #cbb47788;border-radius:6px;color:#eadfc9;font-size:13px;line-height:1.5;pointer-events:auto;z-index:14}
body:has(#arrival-reminder:not([hidden])) .objective{visibility:hidden}
#arrival-reminder strong{display:block;color:#f3dca4;margin-bottom:4px}
#arrival-reminder button{flex-shrink:0;min-width:44px;min-height:44px;background:transparent;border:1px solid #cbb47755;border-radius:4px;color:#eadfc9;font-size:20px;cursor:pointer}
.mobile-ui #arrival-reminder{top:76px;left:var(--phone-pad);right:var(--phone-pad);width:auto;max-width:none;padding:10px 12px;font-size:12px}
.mobile-ui.mobile-overlay-open #arrival-reminder,.mobile-ui:has(#mobile-menu:not([hidden])) #arrival-reminder{display:none}
body:has(#modal:not([hidden])) #arrival-reminder,body:has(#pause:not([hidden])) #arrival-reminder{display:none}
/* Keep this preference separate from .hidden: the game updates contextual
   availability every frame, and must not reopen menus the guest put away. */
.extra-menus-hidden :is(#snow-controls,#pastime-controls,.carried-prop-controls){display:none!important}
.extra-menus-hidden #kitchen-hud :is([data-food="tray"],.cart-hint){display:none!important}
.extra-menus-hidden #kitchen-hud:not(:has([data-food="park"]:not([hidden]))){display:none!important}
#extra-menu-toggle{position:fixed;top:92px;right:34px;pointer-events:auto;min-height:44px;padding:10px 14px;background:#19271fe8;border:1px solid #b29c6b77;border-radius:5px;color:#e6d7b9;font-size:11px;letter-spacing:.04em}
.mobile-ui #mobile-menu #extra-menu-toggle{position:static}
.mobile-ui{--phone-pad:max(10px,env(safe-area-inset-left));--phone-bottom:max(10px,env(safe-area-inset-bottom))}
.mobile-ui .intro{overflow-y:auto;overscroll-behavior:contain;justify-content:flex-start;gap:20px;padding:20px var(--phone-pad);height:var(--phone-height,100dvh);top:var(--phone-top,0);bottom:auto}
.mobile-ui .arrival-layout{display:flex;flex-direction:column;align-items:stretch;margin:0;gap:20px}
.mobile-ui .intro-copy,.mobile-ui .guest-setup{width:100%;max-width:620px;margin-inline:auto}
.mobile-ui .intro-header,.mobile-ui .intro-footer{flex-shrink:0}
.mobile-ui .scene-caption,.mobile-ui .edition{display:none}
.mobile-ui .guest-customize{grid-template-columns:100px minmax(0,1fr);gap:10px}
.mobile-ui #guest-form{grid-template-columns:minmax(0,1fr)}
.mobile-ui #guest-portrait{width:100px;height:220px}
.mobile-ui :is(input,select,textarea){font-size:16px!important;max-width:100%}
.mobile-ui button{touch-action:manipulation}
/* iOS callouts and selection are separate from touch-action. Cover nested
   labels/icons too, including controls created after the game has started. */
:is(button,[role="button"],[data-game-controls],#touch-controls,#world),
:is(button,[role="button"],[data-game-controls],#touch-controls) *{
 -webkit-touch-callout:none;
 -webkit-user-select:none;
 user-select:none;
 -webkit-user-drag:none;
}
:is(input,textarea,[contenteditable]:not([contenteditable="false"])),[contenteditable]:not([contenteditable="false"]) *{
 -webkit-touch-callout:default!important;
 -webkit-user-select:text!important;
 user-select:text!important;
}
.mobile-ui .hud-top{padding:max(8px,env(safe-area-inset-top)) var(--phone-pad) 8px;gap:0}
.mobile-ui .brand,.mobile-ui #guest-name-display,.mobile-ui #room-number{display:none}
.mobile-ui .hud-actions{display:grid;grid-template-columns:80px minmax(0,1fr) 68px;width:100%;gap:8px}
.mobile-ui .hud-actions button{min-height:48px;margin:0;padding:8px;font-size:10px;letter-spacing:.8px;background:#171b16e6}
.mobile-ui #clock-button{min-width:0}
.mobile-ui #clock-time{font-size:19px}
.mobile-ui #mobile-menu-button{display:block}
.mobile-ui #mobile-menu{position:absolute;top:calc(max(8px,env(safe-area-inset-top)) + 58px);right:var(--phone-pad);left:var(--phone-pad);max-height:55dvh;overflow-y:auto;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;background:#17251ef5;border:1px solid #b29c6b;padding:12px;pointer-events:auto;z-index:46;box-shadow:0 8px 30px #0008}
.mobile-ui #mobile-menu button{position:static;min-width:0;min-height:48px;margin:0;padding:12px;background:#ffffff09;border:1px solid #b29c6b66;border-radius:4px;font-size:11px;letter-spacing:.04em;justify-content:center;flex-wrap:wrap}
.mobile-ui #mobile-menu #social-launch{grid-column:1/-1}
.mobile-ui .objective,.mobile-ui #weather-status,.mobile-ui .hud-bottom,.mobile-ui #interact{display:none}
.mobile-ui #touch-controls{position:absolute;display:grid;grid-template-columns:142px minmax(0,180px);gap:12px;justify-content:space-between;align-items:end;left:var(--phone-pad);right:max(10px,env(safe-area-inset-right));bottom:var(--phone-bottom);pointer-events:none}
.mobile-ui .touch-pad{display:grid;grid-template-columns:repeat(3,44px);gap:5px}
.mobile-ui .touch-pad button,.mobile-ui .touch-options button{pointer-events:auto;min-height:48px;touch-action:none;border:1px solid #b19c6b88;background:#171e17df;border-radius:7px;color:#eedec0;margin:0;padding:8px;font-size:11px}
.mobile-ui .touch-pad button:first-child{grid-column:2}
.mobile-ui .touch-pad button:nth-child(2){grid-column:1;grid-row:2}
.mobile-ui .touch-pad button:nth-child(3){grid-column:2;grid-row:2}
.mobile-ui .touch-pad button:nth-child(4){grid-column:3;grid-row:2}
.mobile-ui .touch-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:5px}
.mobile-ui #touch-action{grid-column:1/-1;width:100%;height:auto;min-height:48px;font-size:12px;line-height:1.25;overflow-wrap:anywhere;white-space:normal;background:#394530e8}
.mobile-ui #touch-action:disabled{opacity:.55}
.mobile-ui #touch-controls kbd{display:none}
.mobile-ui .touch-options :is(#vehicle-brake,#touch-ski-brake){grid-column:1/-1;min-height:48px;background:#543a2aed;border-color:#dfb27b;font-size:13px;letter-spacing:.04em}
.mobile-ui .touch-options #vehicle-brake[data-held],.mobile-ui #touch-ski-brake:active{background:#c09861;color:#17231b}
.mobile-ui #mobile-context-actions #vehicle-look-mode{grid-column:1/-1}
.mobile-ui #vehicle-look-mode[aria-pressed="true"]{background:#c8ad75;color:#17231b}
.mobile-ui #touch-controls #flashlight-button{grid-column:1/-1;grid-row:1;min-height:48px;font-size:12px;letter-spacing:.04em;background:#283a30f5;border-color:#d5bc7b;color:#fff0cd;touch-action:manipulation}
.mobile-ui #flashlight-button[aria-pressed="true"]{background:#d0b476!important;color:#17231b!important;box-shadow:0 0 12px #e5c98744}
.mobile-ui #flashlight-button.blackout-hint[aria-pressed="false"]{border:2px solid #f4d892;box-shadow:0 0 0 3px #e5c98733,0 0 18px #e5c98755}
.mobile-ui #mobile-context-actions{position:absolute;bottom:calc(var(--phone-bottom) + var(--touch-controls-height,159px) + 15px);left:var(--phone-pad);right:max(10px,env(safe-area-inset-right));display:flex;flex-direction:column;align-items:flex-start;gap:7px;max-height:35dvh;overflow-y:auto;pointer-events:none;z-index:12}
.mobile-ui #mobile-context-actions>*{position:static;transform:none;max-width:100%;width:auto;margin:0;flex-shrink:0;pointer-events:auto;white-space:normal}
.mobile-ui #mobile-context-actions #pastime-controls{position:static!important;transform:none!important;white-space:normal!important;display:flex;flex-wrap:wrap;gap:6px}
.mobile-ui #mobile-context-actions #pastime-controls button{margin:0!important}
.mobile-ui #mobile-context-actions :is(button,.survival-actions){flex-wrap:wrap}
.mobile-ui #mobile-context-actions button{min-height:44px;min-width:44px;font-size:11px}
 .mobile-ui #mobile-context-actions :is(#seat-actions,.carried-prop-controls,#vehicle-hud,#kitchen-hud,#snow-controls){flex-wrap:wrap;gap:6px;padding:8px}
.mobile-ui #mobile-context-actions kbd,.mobile-ui #vehicle-hud small{display:none}
#player-radio{position:fixed;right:20px;bottom:90px;z-index:12;display:flex;flex-wrap:wrap;gap:8px;align-items:center;max-width:min(420px,calc(100vw - 30px));padding:12px;background:#19271ff2;color:#e6d7b9;border:1px solid #b29c6b88;border-radius:6px;pointer-events:auto}
#player-radio[hidden]{display:none}
#player-radio .radio-status{flex-basis:100%;font-size:13px}
#player-radio button{min-height:48px;padding:10px;border:1px solid #b29c6b88;border-radius:4px;background:#293c30;color:#efe0bf}
#player-radio [data-radio-talk]{touch-action:none;background:#bea36b;color:#1a281e}
#player-radio [data-radio-talk][aria-pressed="true"]{background:#95513d;color:#fff5df}
#player-radio kbd{font:inherit}
#room-knock{position:fixed;left:50%;bottom:134px;transform:translateX(-50%);z-index:12;pointer-events:auto}
#room-knock[hidden]{display:none}
#room-knock button{min-height:48px;padding:12px 18px;background:#1d3027f5;color:#ecdbb5;border:1px solid #baa16c;border-radius:5px;cursor:pointer;touch-action:manipulation;-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}
#room-knock button:disabled{opacity:.65;cursor:default}
#room-knock button:focus-visible{outline:2px solid #f0d49c;outline-offset:3px}
#room-knock>kbd{margin-left:9px;padding:3px 6px;border:1px solid #baa16c88;color:#ecdbb5;background:#1d3027f5;font:11px sans-serif}
body:has(#modal:not([hidden])) #room-knock,body:has(#pause:not([hidden])) #room-knock{display:none}
.visit-choice select,.visit-choice button{min-height:48px}
.mobile-ui #mobile-context-actions #player-radio{flex-wrap:wrap;max-width:100%;gap:6px}
.mobile-ui #mobile-context-actions #player-radio button,.mobile-ui #mobile-context-actions #room-call button{min-height:48px;min-width:48px}
.mobile-ui .subtitle{bottom:calc(var(--phone-bottom) + var(--touch-controls-height,159px) + 15px);font-size:14px;line-height:1.5;width:92%;max-height:25dvh;overflow-y:auto}
.mobile-ui:has(#mobile-context-actions>:not([hidden])) .subtitle{bottom:auto;top:70px}
.mobile-ui #visit-memory-notice,.mobile-ui #social-notice{left:var(--phone-pad);top:72px;bottom:auto;max-width:calc(100% - 24px)}
.mobile-ui.mobile-overlay-open #touch-controls,.mobile-ui.mobile-overlay-open #mobile-context-actions{display:none}
.mobile-ui .modal-backdrop{top:var(--phone-top,0);height:var(--phone-height,100dvh);bottom:auto;padding:max(8px,env(safe-area-inset-top)) var(--phone-pad) var(--phone-bottom);backdrop-filter:none}
.mobile-ui .modal-backdrop .modal-card{width:100%;max-width:850px;max-height:100%;padding:22px 16px;overscroll-behavior:contain;scroll-padding-top:50px}
.mobile-ui .modal-card>.close{position:sticky;display:block;float:right;top:0;right:0;z-index:5;min-width:48px;min-height:48px;margin:-10px -6px 0 8px;background:#20271ff5;border:1px solid #ad976855;border-radius:4px}
.mobile-ui .modal-card h2{font-size:26px;margin:12px 0 18px}
.mobile-ui .modal-card button{min-height:44px}
.mobile-ui .modal-card :is(.settings label,.catalog-filters,.book-toolbar,.social-greetings){flex-wrap:wrap}
.mobile-ui .modal-card .primary{width:100%;max-width:100%}
.mobile-ui .catalog-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.mobile-ui .catalog-grid .item-art{height:100px;filter:none}
.mobile-ui .catalog-grid .tile-name{font-size:15px}
.mobile-ui .item-hero>.item-model{height:180px;filter:none}
.mobile-ui #social-panel{position:fixed;top:calc(var(--phone-top,0px) + max(8px,env(safe-area-inset-top)));bottom:auto;left:var(--phone-pad);width:calc(100% - 2*var(--phone-pad));height:calc(var(--phone-height,100dvh) - max(8px,env(safe-area-inset-top)) - var(--phone-bottom));max-height:none;z-index:50;overflow-y:auto}
.mobile-ui #social-panel .social-main{flex:1;min-height:60px;overflow:auto}
.mobile-ui #social-panel :is(.social-head,.social-compose){flex-shrink:0}
.mobile-ui #social-panel button{min-height:44px}
.mobile-ui .social-greetings,.mobile-ui .company-buttons,.mobile-ui .company-person{flex-wrap:wrap}
.mobile-ui .social-close{min-width:44px}
.mobile-ui .grain{display:none}
@media (orientation:landscape){
 .mobile-ui .catalog-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
 .mobile-ui #mobile-menu{left:auto;width:min(380px,90vw)}
 .mobile-ui .guest-customize{grid-template-columns:130px minmax(0,1fr)}
 .mobile-ui #guest-form{grid-template-columns:repeat(2,minmax(0,1fr))}
 .mobile-ui #mobile-context-actions{left:170px;right:200px;bottom:var(--phone-bottom);max-height:calc(100dvh - 90px)}
 .mobile-ui .subtitle{width:55%;bottom:12px;font-size:13px}
}