@media (max-width: 1023px) {
  :root { --hud-block: 118px; }
  .app-shell { block-size: auto; min-block-size: 100dvb; }
  .company-hud { grid-template-columns: minmax(0, 1fr) auto; }
  .location-chip { grid-area: 1 / 2; justify-self: end; max-inline-size: 15rem; }
  .location-chip span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .hud-status { grid-area: 2 / 1 / 3 / 3; justify-content: flex-end; }
  .simulation-layout { display: flex; flex-direction: column; overflow: visible; }
  .feature-rail { display: none; }
  #appShell[data-user-role="owner"] .context-panel[data-view="welcome"] { order: -1; }
  .world-region { min-block-size: 70dvb; border-inline-end: 0; }
  .world-frame { min-block-size: 52dvb; }
  .map-person { inline-size: var(--person-narrow-inline); }
  .map-nameplate { min-inline-size: 0; max-inline-size: var(--person-narrow-inline); }
  .map-presence { display: none; }
  .map-role::after { content: ""; }
  .context-panel { min-block-size: 34dvb; border-block: var(--line-thin) solid var(--neutral-350); }
  .panel-body { overflow: visible; }
  .context-panel[data-view]:not([data-view="welcome"]) { position: fixed; inset-block: var(--hud-block) 0; inset-inline: auto 0; z-index: 60; inline-size: min(100%, 42rem); min-block-size: 0; box-shadow: var(--shadow-panel); }
  .context-panel[data-view]:not([data-view="welcome"]) .panel-body { overflow-y: auto; }
  .context-panel[data-mode="dialogue"] { position: fixed; inset-block: var(--hud-block) 0; inset-inline: auto 0; z-index: 60; inline-size: 100%; min-block-size: 0; box-shadow: var(--shadow-panel); }
}

@media (max-width: 640px) {
  :root { --mobile-nav-block: 72px; --hud-block: 60px; }
  body { padding-block-end: calc(var(--mobile-nav-block) + env(safe-area-inset-bottom)); background: var(--neutral-050); }
  .company-hud { position: sticky; inset-block-start: 0; grid-template-columns: minmax(0, 1fr) auto; gap: var(--space-2); min-block-size: var(--hud-block); padding: var(--space-2) var(--space-3); }
  .hud-status { grid-area: auto; }
  .company-brand { min-inline-size: 0; overflow: hidden; }
  .company-brand strong { min-inline-size: 0; white-space: nowrap; }
  .company-brand .brand-company { display: none; }
  .company-brand > div > #companyStatus { display: block; max-inline-size: 11rem; }
  .location-chip { display: flex; grid-area: auto; justify-self: auto; max-inline-size: 8.5rem; min-block-size: 40px; padding-inline: var(--space-2); }
  .location-chip span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .location-chip svg { inline-size: 18px; block-size: 18px; }
  .hud-status { position: fixed; inset-inline: 0; inset-block-end: 0; z-index: 100; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; min-block-size: calc(var(--mobile-nav-block) + env(safe-area-inset-bottom)); padding-block-end: env(safe-area-inset-bottom); color: var(--ink-900); background: var(--surface-000); border-block-start: var(--line-thin) solid var(--neutral-350); box-shadow: 0 -8px 24px rgb(16 27 38 / 10%); }
  #appShell[data-user-role="owner"] .hud-status { grid-template-columns: repeat(5, minmax(0, 1fr)); }
  #appShell[data-user-role="owner"] #workButton { display: none !important; }
  .hud-status > span:first-child { display: none; }
  .view-switch { display: contents; }
  .view-mode, .hud-button { position: relative; display: flex; flex-direction: column; justify-content: center; gap: 3px; inline-size: 100%; min-inline-size: 0; min-block-size: var(--mobile-nav-block); padding: var(--space-1); color: var(--ink-600); border: 0; border-radius: 0; background: transparent; font-size: 0.7rem; font-weight: 750; }
  .view-mode span, .hud-button span { display: block; }
  .view-mode svg, .hud-button svg { inline-size: 22px; block-size: 22px; }
  .view-mode[aria-pressed="true"] { color: var(--ink-600); background: transparent; }
  #appShell[data-mobile-section="home"] #ownerHomeButton,
  #appShell[data-mobile-section="office"] #viewOfficeButton,
  #appShell[data-mobile-section="cctv"] #viewCctvButton,
  #appShell[data-mobile-section="work"] #workButton,
  #appShell[data-mobile-section="mailbox"] #mailboxButton,
  #appShell[data-mobile-section="manage"] #adminMenuButton,
  .hud-button[aria-expanded="true"] { color: var(--company-accent-600); background: var(--company-accent-100); }
  #appShell[data-mobile-section="home"] #ownerHomeButton::before,
  #appShell[data-mobile-section="office"] #viewOfficeButton::before,
  #appShell[data-mobile-section="cctv"] #viewCctvButton::before,
  #appShell[data-mobile-section="work"] #workButton::before,
  #appShell[data-mobile-section="mailbox"] #mailboxButton::before,
  #appShell[data-mobile-section="manage"] #adminMenuButton::before,
  .hud-button[aria-expanded="true"]::before { content: ""; position: absolute; inset-block-start: 0; inset-inline: 22%; block-size: 3px; border-radius: 0 0 3px 3px; background: var(--company-accent-600); }
  .hud-button[data-work-state="sharing"] { color: var(--presence-available); }
  .work-state-dot { position: absolute; inset-block-start: 13px; inset-inline-end: calc(50% - 15px); }
  .hud-menu-wrap { display: contents; }
  .hud-menu { position: fixed; inset: auto var(--space-3) calc(var(--mobile-nav-block) + env(safe-area-inset-bottom) + var(--space-2)); z-index: 110; max-block-size: calc(100dvb - var(--hud-block) - var(--mobile-nav-block) - var(--space-6)); overflow-y: auto; color: var(--surface-000); }
  .hud-status > .user-badge { display: none; }
  .simulation-layout { min-block-size: 0; }
  .world-region { display: grid; grid-template-rows: 260px auto auto auto; min-block-size: 0; }
  .world-frame { min-block-size: 0; }
  .interaction-bar { align-items: stretch; flex-direction: column; }
  .primary-action { inline-size: 100%; }
  .world-controls { align-items: flex-start; flex-direction: column; }
  .floor-strip { inline-size: 100%; }
  .dpad { align-self: center; grid-template: repeat(3, 44px) / repeat(3, 52px); }
  .dpad-up { grid-area: 1 / 2; }.dpad-left { grid-area: 2 / 1; }.dpad-center { grid-area: 2 / 2; }.dpad-right { grid-area: 2 / 3; }.dpad-down { grid-area: 3 / 2; }
  .world-alternative { padding: var(--space-4); }
  .world-alternative summary { padding: 0; }
  .world-alternative summary > span:first-child { display: grid; gap: 0; }
  .world-alternative .nearby-list { max-block-size: none; padding: var(--space-3) 0 0; overflow-y: visible; }
  .nearby-list { grid-template-columns: 1fr; }
  .context-panel { min-block-size: 0; }
  .context-panel[data-view]:not([data-view="welcome"]), .context-panel[data-mode="dialogue"] { inset: 0 0 calc(var(--mobile-nav-block) + env(safe-area-inset-bottom)); z-index: 80; inline-size: 100%; block-size: auto; }
  .context-panel[data-view]:not([data-view="welcome"]) .panel-body { overflow-y: auto; }
  .panel-header { min-block-size: 72px; padding: var(--space-3) var(--space-4); }
  .panel-body { padding: var(--space-4); }
  .panel-toggle { display: inline-flex; align-items: center; justify-content: center; }
  #appShell[data-user-role="owner"] .context-panel[data-view="welcome"] .panel-toggle { display: none; }
  .context-panel[data-expanded="false"] { grid-template-rows: auto; }
  .context-panel[data-expanded="false"] .panel-body { display: none; }
  .form-grid { grid-template-columns: 1fr; }
  .welcome-actions { grid-template-columns: 1fr; }
  .owner-home { gap: var(--space-4); }
  .owner-home-hero { padding: var(--space-4); }
  .owner-home-hero h3 { font-size: var(--type-20); }
  .owner-home-hero-actions { grid-template-columns: 1fr; }
  .owner-team { display: none; }
  .drive-document-actions { grid-template-columns: 1fr; }
  .drive-tree .drive-tree { padding-inline-start: var(--space-2); }
  .payroll-controls, .payroll-grid { grid-template-columns: 1fr; }
  .thread-actions, .thread-actions button, .composer-actions, .composer-actions button { inline-size: 100%; }
  .map-nameplate { max-inline-size: var(--person-narrow-inline); padding-inline: var(--space-1); font-size: var(--type-14); }
  .map-nameplate small { display: none; }
  .map-person { inline-size: var(--person-narrow-inline); }
  #appShell[data-view-mode="cctv"] .world-region { display: block; min-block-size: calc(100dvb - var(--hud-block)); }
  #appShell[data-view-mode="cctv"] .cctv-stage { min-block-size: calc(100dvb - var(--hud-block)); overflow: visible; }
  .cctv-dashboard { padding: var(--space-3); }
  .cctv-dashboard .cctv-grid { grid-template-columns: 1fr; gap: var(--space-3); }
  .cctv-cell[data-zoom="true"] { position: fixed; inset: var(--space-2); z-index: 90; overflow: auto; margin: 0; background: var(--surface-000); box-shadow: var(--shadow-panel); }
  .cctv-cell[data-zoom="true"] .cctv-frame { max-block-size: calc(100dvb - 5rem); object-fit: contain; background: var(--navy-950); }
  .cctv-caption { position: sticky; inset-block-end: 0; flex-wrap: wrap; background: var(--surface-000); }
  .cctv-summary { line-height: var(--leading-body); }
  .work-consent { inline-size: calc(100% - 24px); max-block-size: calc(100dvb - 24px); padding: var(--space-4); }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

@media (prefers-contrast: more) {
  :root { --neutral-350: #59636a; --company-accent-600: #005f63; --local-accent-500: #a83f2c; }
  button, input, select, .context-panel, .world-region { border-width: 2px; }
}
