/* Mobile play mode is driven by available viewport dimensions, including
   landscape phones. The original desktop page keeps its existing layout. */
.mobile-playbar,.mobile-dock,.mobile-launch{display:none}
.mobile-arsenal{border:2px solid #879268;border-radius:6px 6px 0 0;background:#1c2b23;color:#e3ecd9;padding:0;width:min(580px,calc(100% - 12px));max-width:none;max-height:calc(100dvh - 30px);margin:auto auto 0;box-shadow:inset 0 2px #c2c69b,0 -12px 50px #0008;overflow:hidden}
.mobile-arsenal:not([open]){display:none}
.mobile-arsenal[open]{animation:arsenal-slide-up .22s cubic-bezier(.2,.8,.2,1)}
.mobile-arsenal::backdrop{background:#08120dbc;backdrop-filter:blur(3px)}
.mobile-arsenal>header{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 12px;border-bottom:3px solid #111d17;background:linear-gradient(115deg,#5c6844,#34402c);box-shadow:inset 0 -1px #88956b}
.mobile-arsenal h2{margin:0;font:900 19px/1.15 Impact,'Arial Black',Arial,sans-serif;text-transform:uppercase;letter-spacing:1px;color:#f2e7bb}
.mobile-arsenal h2 small{font:10px monospace;color:#b7cba7;margin-left:7px;border:1px solid #8ea67b;padding:2px 5px;border-radius:3px}
.mobile-arsenal [data-mobile-close]{border:1px solid #92a384;border-radius:4px;background:#1b2a21;color:#e3eeda;min-width:40px;min-height:36px;font-size:26px;line-height:1}
.mobile-inventory{max-height:calc(100dvh - 92px);overflow-y:auto;overscroll-behavior:contain;padding:8px 10px 16px;scrollbar-width:thin;scrollbar-color:#849f75 #1c2a21}
.mobile-inventory .console{margin:0;padding:0;background:none;border:0;box-shadow:none}
.mobile-inventory .console-heading{display:none}
.mobile-inventory .tool-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}
.mobile-inventory .tool{min-height:76px;padding:8px 3px 5px;gap:4px}
.mobile-inventory .tool>svg{width:29px;height:29px}
.mobile-inventory .tool>span{font-size:10px;line-height:1.2;min-height:25px;overflow-wrap:anywhere}
.mobile-inventory .tool kbd,.mobile-inventory .tool small{display:none}
.mobile-inventory .tool .stapler-icon{height:29px;min-height:29px;font-size:30px;justify-content:center}
.mobile-inventory .game-bottom{flex-direction:column;align-items:stretch;gap:9px;margin-top:10px}
.mobile-inventory .tool-help{max-width:none;min-height:0;margin:0;font-size:11px;line-height:1.5}
.mobile-inventory .action-buttons button{flex:1;min-height:42px}
.mobile-inventory .challenge-deck{margin:14px 0 0;position:static;grid-template-columns:1fr 52px;gap:6px 9px;padding:10px;scroll-margin-top:8px}
.mobile-inventory .challenge-title{grid-row:1;grid-column:1}
.mobile-inventory .challenge-title h2{font-size:10px;letter-spacing:.4px}
.mobile-inventory .challenge-goal{grid-row:2;grid-column:1;font-size:10px;line-height:1.4}
.mobile-inventory .challenge-actions{grid-row:3;grid-column:1/-1;gap:6px}
.mobile-inventory .challenge-actions select{flex:1;width:0}
.mobile-inventory .challenge-deck select,.mobile-inventory .challenge-deck [data-challenge-start]{min-height:40px;font-size:10px}
.mobile-inventory .challenge-clock{grid-column:2;grid-row:1/3}
.mobile-inventory [data-challenge-status]{grid-column:1/-1;grid-row:4}
.mobile-inventory .challenge-foot{grid-row:5;margin:0}
.mobile-inventory .fly-toggle{min-height:32px}
body[data-mobile-play]{overflow:hidden;overscroll-behavior:none}
body[data-mobile-play] .game{position:fixed;inset:0;z-index:1000;display:flex;flex-direction:column;gap:6px;width:100%;height:100vh;height:100dvh;padding:env(safe-area-inset-top,0px) max(5px,env(safe-area-inset-right,0px)) max(6px,env(safe-area-inset-bottom,0px)) max(5px,env(safe-area-inset-left,0px));background:#19281f;overflow:hidden;isolation:isolate}
body[data-mobile-play] .game>.console,body[data-mobile-play] .game>.challenge-deck,body[data-mobile-play] .game>.session-bar,body[data-mobile-play] .mobile-launch{display:none}
body[data-mobile-play] .mobile-playbar{display:flex;flex:0 0 40px;align-items:center;gap:7px;color:#d8e7ca;padding:0 3px}
.mobile-playbar>strong{margin-right:auto;font:700 12px monospace;letter-spacing:1px}
.mobile-playbar>strong span{color:#9ebd89}
.mobile-playbar button,.mobile-playbar select{min-height:36px;padding:5px 8px;border:1px solid #73896766;border-radius:4px;background:#24372a;color:#dce9d0;font:11px Tahoma,Arial,sans-serif}
.mobile-playbar [data-mobile-fullscreen]{min-width:39px;font-size:23px;line-height:1}
body[data-mobile-play] .monitor{display:flex;flex-direction:column;flex:1;min-height:0;width:100%;padding:0 6px;border-radius:10px;box-shadow:0 2px #818b7b}
body[data-mobile-play] .monitor-top{flex:0 0 43px;height:43px;padding:0 3px;gap:5px}
body[data-mobile-play] .monitor-name{display:none}
body[data-mobile-play] .desktop-mode-tabs{flex-shrink:0}
body[data-mobile-play] .desktop-mode-tabs button{min-height:34px;font-size:10px;padding:5px 7px}
body[data-mobile-play] .monitor-controls{gap:2px;min-width:0;margin-left:auto}
body[data-mobile-play] .volume-control{margin:0;gap:0}
body[data-mobile-play] .volume-control input{width:44px;min-height:36px}
body[data-mobile-play] .volume-control output{display:none}
body[data-mobile-play] .icon-button{min-height:36px;min-width:38px;padding:3px;font-size:9px}
body[data-mobile-play] .screen-well{flex:1;min-height:0;padding:4px;display:flex;border-radius:7px}
body[data-mobile-play] .desktop{height:100%;min-height:0;width:100%;border-radius:3px;flex:1}
body[data-mobile-play] .monitor-chin{flex:0 0 22px;height:22px;padding:0 4px}
body[data-mobile-play] .chin-logo{font-size:6px}
body[data-mobile-play] .vents{height:7px;width:40px}
body[data-mobile-play] .power-light>span{display:none}
body[data-mobile-play] .mobile-dock{display:flex;flex:0 0 88px;gap:6px;padding:16px 3px 3px;align-items:stretch}
.mobile-dock button{border:1px solid #8ea97b;border-radius:7px;min-height:52px;display:flex;align-items:center;justify-content:center;gap:8px;background:#293c2e;color:#dce7d1}
.mobile-dock small{font:10px/1.3 Tahoma,Arial,sans-serif;display:block}
.mobile-dock b{font:700 12px/1.4 Tahoma,Arial,sans-serif;display:block;max-width:130px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.mobile-dock .mobile-arsenal-button{position:relative;isolation:isolate;flex:1;min-width:0;justify-content:flex-start;gap:0;padding:0 35px 0 46px;background:none;border:0;border-radius:4px;color:#f3e8bd;text-align:left;touch-action:manipulation}
.arsenal-drawer-face{position:absolute;inset:2px 0 0;border:1px solid #a0aa78;border-radius:3px;background:radial-gradient(circle at 5px 5px,#c9cf9f 0 1px,#182316 1.5px 2.5px,transparent 3px),radial-gradient(circle at calc(100% - 5px) 5px,#c9cf9f 0 1px,#182316 1.5px 2.5px,transparent 3px),repeating-linear-gradient(173deg,transparent 0 12px,#d6dcb808 13px,transparent 14px 22px),linear-gradient(115deg,#68784c,#414f32 70%,#56643d);box-shadow:inset 0 2px #b5bc8b,inset 0 -5px #26341f,inset 3px 0 #c0c59b22,0 4px #0a140e,0 5px #61724a;pointer-events:none;transition:transform .14s ease}
.arsenal-drawer-face:before{content:'';position:absolute;left:4px;right:4px;top:-7px;height:6px;border:1px solid #68774f;border-bottom:0;background:linear-gradient(#0a130d,#293820);box-shadow:inset 0 2px #050c09}
.arsenal-drawer-face:after{content:'';position:absolute;right:9px;top:1px;width:19px;height:4px;background:repeating-linear-gradient(125deg,#c5b66c 0 4px,#303a25 4px 8px)}
.arsenal-rifle{position:absolute;z-index:1;left:-1px;bottom:9px;width:54px;height:84px;pointer-events:none;filter:drop-shadow(2px 3px 1px #07120c88);transform-origin:50% 100%;transition:transform .2s ease}
.mobile-arsenal-button:after{content:'';position:absolute;z-index:2;left:5px;bottom:5px;width:40px;height:20px;border-top:2px solid #899269;background:linear-gradient(110deg,#66734a,#424f30);box-shadow:0 -2px #142015;pointer-events:none}
.arsenal-drawer-label{position:relative;z-index:2;display:flex;flex:1;min-width:0;flex-direction:column;gap:4px;padding:6px 0 8px}
.arsenal-stencil{display:block;color:#f4e8b8;font:900 clamp(19px,6.2vw,26px)/.95 Impact,'Arial Black',Arial,sans-serif;letter-spacing:.5px;text-shadow:0 1px #202a16;text-transform:uppercase}
.arsenal-stencil>span{display:block;width:fit-content;white-space:nowrap;-webkit-mask-image:linear-gradient(#000 0 52%,transparent 52% 56%,#000 56%);mask-image:linear-gradient(#000 0 52%,transparent 52% 56%,#000 56%)}
.arsenal-selected{display:flex;align-items:center;gap:4px;min-width:0;color:#dce4bf;font:10px/1 Tahoma,Arial,sans-serif}
.arsenal-selected svg{width:13px;height:13px;flex-shrink:0;filter:drop-shadow(0 1px #15200e)}
.arsenal-selected [data-mobile-tool]{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.arsenal-drawer-pull{position:absolute;z-index:3;left:10px;bottom:7px;display:flex;align-items:center;justify-content:center;width:30px;height:13px;border:2px solid #abb18d;border-radius:2px;background:#1d291b;box-shadow:0 2px #0b150c,inset 0 2px #080e08;color:#f4e8b8;pointer-events:none}
.arsenal-drawer-pull>span{font:bold 19px/1 Arial,sans-serif;transform:translateY(3px);transition:transform .2s ease}
.arsenal-ammo{position:absolute;z-index:3;right:-3px;top:7px;width:37px;height:69px;pointer-events:none;filter:drop-shadow(2px 2px 1px #081108aa);transform-origin:40% 0;transition:transform .22s ease}
.mobile-arsenal-button:active .arsenal-drawer-face{transform:translateY(2px)}
.mobile-arsenal-button:active .arsenal-ammo,.mobile-arsenal-button[aria-expanded=true] .arsenal-ammo{transform:rotate(-7deg)}
.mobile-arsenal-button:active .arsenal-rifle{transform:rotate(-3deg)}
.mobile-arsenal-button[aria-expanded=true] .arsenal-drawer-pull>span{transform:translateY(-2px) rotate(180deg)}
.mobile-arsenal-button:focus-visible{outline:3px solid #f4d68b;outline-offset:3px}
.mobile-dock .mobile-challenge-button{flex:0 0 85px;padding:5px;gap:5px}
.mobile-challenge-button>span:first-child{font-size:23px;color:#c8dba6}
.mobile-challenge-button[data-running=true]{background:#405a32;border-color:#d8e7b3}
.mobile-dock .mobile-reset-button{flex:0 0 41px;font-size:25px;padding:0}
@keyframes arsenal-slide-up{from{transform:translateY(70px);opacity:.5}to{transform:translateY(0);opacity:1}}
@media(max-width:350px){
  .mobile-dock .mobile-challenge-button{flex-basis:72px;gap:3px}
  .mobile-challenge-button>span:first-child{font-size:17px}
  .mobile-dock .mobile-reset-button{flex-basis:35px}
  .mobile-dock .mobile-arsenal-button{padding-left:41px;padding-right:30px}
  .arsenal-stencil{font-size:18px;letter-spacing:.2px}
  .arsenal-rifle{width:48px}
  .arsenal-ammo{width:32px}
}
@media(prefers-reduced-motion:reduce){
  .mobile-arsenal[open]{animation:none}
  .arsenal-drawer-face,.arsenal-rifle,.arsenal-ammo,.arsenal-drawer-pull>span{transition:none}
}
body[data-mobile-play] .office-companion{transform:scale(.65);transform-origin:bottom center}
body[data-mobile-play] .office-companion[data-companion-state=resigned]{transform:rotate(20deg) scale(.65)}
body[data-mobile-play] .companion-bubble{font-size:11px;width:155px}
@media(max-width:580px),(max-width:960px) and (max-height:580px){
  .mobile-launch{display:block;width:100%;min-height:44px;margin-bottom:12px;border:1px solid #dce8c3;border-radius:5px;background:#bdd5a5;color:#203323;font:bold 12px Tahoma,Arial,sans-serif}
}
@media(max-height:480px){
  body[data-mobile-play] .game{gap:3px}
  body[data-mobile-play] .mobile-playbar{flex-basis:34px}
  body[data-mobile-play] .mobile-playbar button,body[data-mobile-play] .mobile-playbar select{min-height:30px}
  body[data-mobile-play] .monitor-top{flex-basis:36px;height:36px}
  body[data-mobile-play] .monitor-chin{flex-basis:13px;height:13px}
}
@media(min-width:581px) and (max-height:480px){
  body[data-mobile-play] .mobile-dock{flex-basis:65px;padding-top:10px}
  body[data-mobile-play] .mobile-dock button{min-height:44px}
  .arsenal-drawer-label{padding:4px 0;gap:2px}
  .arsenal-stencil{display:flex;gap:6px;font-size:20px}
  .arsenal-selected{font-size:9px}
  .arsenal-rifle{height:65px;bottom:4px}
  .arsenal-ammo{height:54px;top:3px}
}

/* Match the game's compact window geometry so dragging, stapling and gravity
   continue to use the same bounds as the visible windows. */
.desktop[data-compact] .desktop-window[data-window]>.window-title{min-height:30px;font-size:10px;padding:2px 3px 2px 5px}
.desktop[data-compact] .window-buttons button{width:26px;height:25px}
.desktop[data-compact] .damage-dialog-body{min-height:0;padding:8px 10px;gap:9px;align-items:flex-start}
.desktop[data-compact] .damage-dialog-body>p{font-size:11px;line-height:1.45;overflow-wrap:anywhere}
.desktop[data-compact] .error-symbol{flex-shrink:0;width:23px;height:23px;font-size:18px}
.desktop[data-compact] .damage-dialog .window-actions{display:flex;gap:4px;padding:5px 7px 8px}
.desktop[data-compact] .damage-dialog .window-actions button{flex:1;min-width:0;min-height:33px;padding:3px;color:#151515;font-size:10px;line-height:1.15;white-space:normal;overflow-wrap:anywhere}
.desktop[data-compact] .back-window>.window-body,.desktop[data-compact] .front-window>.window-body{padding:8px;gap:8px}
.desktop[data-compact] .window-body p{margin:5px 0;line-height:1.4}
.desktop[data-compact] .window-actions{padding:5px 7px 8px}
.desktop[data-compact] .fake-button{min-height:32px}
.desktop[data-compact] .taskbar{height:32px;gap:3px}
.desktop[data-compact] .taskbar-apps .taskbar-task{flex-basis:66px;min-height:27px}
.desktop[data-compact] .start-button,.desktop[data-compact] .show-desktop{min-height:27px}
.desktop[data-compact] .taskbar-clock{padding:3px;font-size:9px}
