/* ── mobile.css — SEJR/OS on a phone ─────────────────────────────────
   The Win95 desktop becomes a one-window-at-a-time mobile OS: every window
   opens full-screen like an app, the taskbar becomes a bottom bar, desktop
   icons become a tap grid, and the Start menu becomes a bottom sheet.
   All rules are scoped to html.mobile (set by the head script on small screens),
   so desktop play is untouched. */

html.mobile, html.mobile body{ overscroll-behavior:none; }

/* inputs at ≥16px so iOS doesn't zoom the page on focus */
html.mobile input, html.mobile select, html.mobile button{ font-size:16px; }
html.mobile .btn.tiny{ font-size:12px; padding:4px 8px; }
html.mobile .small{ font-size:12px; }

/* ══ command center → phone: HUD strip, one app on stage, bottom tab bar ══ */
html.mobile #hud{ margin:0; border-left:0; border-right:0; border-top:0; }
html.mobile .hud-top{ gap:6px; padding:3px 4px; padding-top:max(3px, env(safe-area-inset-top, 0)); }
html.mobile .hud-brand{ font-size:0; padding:2px; }
html.mobile .hud-brand .logo-flag{ font-size:12px; }
html.mobile #hud-who, html.mobile .hud-chip.goal, html.mobile .hud-chip.decide, html.mobile .hud-spacer{ display:none !important; }
html.mobile #hud-storm{ flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; font-size:11px; padding:3px 6px; }
html.mobile .hud-clock{ margin-left:auto; }
html.mobile .hud-clock .spd{ width:34px; height:32px; font-size:14px; }
html.mobile .hud-clock .spd[data-spd="3"]{ display:none; }
html.mobile .hud-clock .spd.step{ width:42px; font-size:12px; }
html.mobile .hud-clock #tb-date{ font-size:11px; min-width:0; padding:0 3px; }
html.mobile #hud-vitals{ display:flex; overflow-x:auto; gap:5px; padding:5px; scrollbar-width:none; -webkit-overflow-scrolling:touch; }
html.mobile #hud-vitals::-webkit-scrollbar{ display:none; }
html.mobile .vital{ flex:0 0 116px; padding:3px 7px 5px; }
html.mobile .v-val{ font-size:17px; }

html.mobile #shell{ display:flex; padding:0; gap:0; margin-bottom:calc(56px + env(safe-area-inset-bottom, 0)); }
html.mobile #rail{ display:none; }
html.mobile #stage{ flex:1; border:0; }
html.mobile #stage-head{ padding:3px 4px 0 8px; min-height:40px; }
html.mobile #stage-title{ display:none; }
html.mobile .st-tab{ font-size:14px; padding:8px 12px 7px; }
html.mobile .st-tab.on{ padding-bottom:10px; }
html.mobile #stage-pop{ display:none; }
html.mobile .pane .winbody{ padding:10px; -webkit-overflow-scrolling:touch; }
html.mobile .winbody table{ display:block; overflow-x:auto; -webkit-overflow-scrolling:touch; }
html.mobile .statusbar{ font-size:11px; overflow:hidden; }
html.mobile .kpi-strip .kpi-box{ flex:1 1 44%; min-width:0; }
html.mobile .btn.step2{ min-width:46px; min-height:38px; font-size:16px; }

html.mobile #inbox{ display:none; position:absolute; inset:0; width:auto; z-index:60; border:0; box-shadow:none; outline:0; }
html.mobile #desktop.decide-open #inbox{ display:flex; }
html.mobile .pane-head .inbox-x{ display:inline-flex; width:38px; height:32px; font-size:15px; }
html.mobile .dc-go{ min-height:40px; font-size:15px; width:100%; }
html.mobile .dx-acts .btn{ flex:1 1 100%; min-height:44px; font-size:15px; text-align:center; }
html.mobile .decide-box{ max-height:92vh; }
html.mobile .dx-body{ font-size:15px; }

html.mobile #taskbar{ display:none; }
html.mobile #tabbar{ display:flex; position:fixed; left:0; right:0; bottom:0; z-index:550; height:56px;
  padding-bottom:env(safe-area-inset-bottom, 0); box-sizing:content-box; background:var(--c-chrome);
  border-top:2px solid #fff; box-shadow:0 -1px 0 var(--c-chrome-dk); }
html.mobile .tab{ position:relative; flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:1px;
  background:none; border:0; font:600 11px var(--f-ui); color:var(--c-ink-2); padding:4px 0 2px; }
html.mobile .tab-i{ font-size:20px; line-height:1.1; }
html.mobile .tab.on{ color:var(--c-navy); box-shadow:inset 0 3px 0 var(--c-navy); background:#d4d4d4; }
html.mobile .tab-n{ position:absolute; top:3px; left:calc(50% + 6px); font:700 11px var(--f-num); background:var(--c-bad); color:#fff; padding:1px 5px; min-width:18px; }

/* floating windows don't exist on phones, but keep them sane if one sneaks in */
html.mobile .window{ position:fixed !important; left:0 !important; top:0 !important; width:100vw !important; height:calc(100% - 56px) !important; min-width:0; }
html.mobile .titlebar{ padding:7px 8px; font-size:14px; }
html.mobile .titlebar .tb-btn{ width:38px; height:32px; font-size:15px; }

/* ══ start menu → the workspaces sheet ══ */
html.mobile #startmenu{
  left:0; right:0; bottom:calc(56px + env(safe-area-inset-bottom, 0)); width:auto; max-height:74vh;
  box-shadow:0 -4px 18px rgba(0,0,0,.4);
}
html.mobile #startmenu .sm-side{ display:none; }
html.mobile #startmenu .sm-items{ overflow-y:auto; -webkit-overflow-scrolling:touch; }
html.mobile .sm-item{ padding:11px 12px; font-size:15px; }
html.mobile .sm-head{ font-size:12px; padding:9px 12px 3px; }
html.mobile #startmenu #acct-bar{ position:static; border-radius:0; margin:4px 0 0; flex-wrap:wrap; }

/* ══ overlays: message boxes, victory, confirm ══ */
html.mobile .victory-box{
  width:auto !important; max-width:96vw; max-height:86vh;
  overflow-y:auto; -webkit-overflow-scrolling:touch;
}
html.mobile .victory-box .content{ padding:14px 14px; }

/* ══ SEJR/OS career screen ══ */
html.mobile .login-box{ width:94vw; max-width:480px; }
html.mobile .login-form input, html.mobile .login-form select{ width:100%; box-sizing:border-box; }
html.mobile .login-form td:first-child{ font-size:12px; white-space:nowrap; padding-right:6px; }
html.mobile .login-buttons{ flex-wrap:wrap; gap:6px; }
html.mobile .login-buttons .btn{ flex:1 1 100%; padding:10px 6px; }
html.mobile #past-careers .pc-row{ font-size:12px !important; }

/* ══ the account gate (public landing) ══ */
html.mobile .gate-wrap{ flex-direction:column; gap:22px; padding:20px 16px 40px; }
html.mobile .gate-hero h1{ font-size:30px; }
html.mobile .gate-hero{ flex:0 0 auto; }
html.mobile .gate-panel{ flex:0 0 auto; width:100%; }
html.mobile .gate-card{ max-width:420px; margin:0 auto; }

/* ══ BSOD & boot ══ */
html.mobile .bsod-inner{ max-width:94vw; padding:14px; }
html.mobile #bsod-text{ font-size:12px; line-height:1.5; }
html.mobile #boot pre{ font-size:11px; }

/* ══ misc breathing room ══ */
html.mobile .term{ font-size:11px; overflow-x:auto; }
html.mobile .org-tree{ overflow-x:auto; }

html.mobile .paper-name{ font-size:22px; letter-spacing:1px; }
html.mobile .paper-head{ font-size:21px; }
html.mobile .paper-box{ padding:10px 12px; }
html.mobile #toasts{ bottom:72px; right:6px; left:6px; }

html.mobile .crisis-acts{ grid-template-columns:1fr; }

html.mobile .qm-grid{ grid-template-columns:1fr 1fr; }