/* Shared phone and touch layouts. Desktop planning geometry stays unchanged. */
.os-mobile-bar, .os-mobile-close, .stack-touch-hint, .touch-team-list, .touch-placement, .mobile-heatmap-hint { display: none; }

@media (max-width: 760px) {
  html { scroll-padding-top: 4.5rem; }
  body.os-has-sidebar { padding-top: calc(3.5rem + env(safe-area-inset-top, 0px)); --os-sidebar-size: 0rem; }
  body.os-mobile-open { overflow: hidden; }
  .os-has-sidebar .os-content, .studio.os-has-sidebar .shell { margin-left: 0; }
  .os-mobile-bar { position: fixed; inset: 0 0 auto; z-index: 95; display: flex; align-items: center; justify-content: space-between; gap: 8px; height: calc(3.5rem + env(safe-area-inset-top, 0px)); padding: env(safe-area-inset-top, 0px) 12px 0; background: #fff; border-bottom: 1px solid #e6e6f0; color: #303447; font: 600 14px/1.4 Arial, sans-serif; }
  .os-mobile-bar > span { flex: 1; text-align: center; }
  .os-mobile-bar button { display: inline-flex; align-items: center; justify-content: center; gap: 6px; min-height: 44px; min-width: 44px; padding: 8px; color: #6045c8; background: #f5f2ff; border: 1px solid #e8e1fb; border-radius: 9px; font: inherit; cursor: pointer; }
  .os-mobile-bar button:focus-visible { outline: 3px solid #7452ec; outline-offset: 2px; }
  .cloud-studio .os-sidebar, .os-sidebar { z-index: 130; width: min(19rem, 88vw); padding: max(14px, env(safe-area-inset-top, 0px)) 16px max(20px, env(safe-area-inset-bottom, 0px)); background: #fafaff; }
  body[data-os-collapsed="true"] .os-sidebar { visibility: hidden; pointer-events: none; transform: translateX(-100%); }
  .os-sidebar .os-mobile-close { display: flex; justify-content: space-between; align-items: center; min-height: 44px; width: 100%; margin-bottom: 16px; padding: 8px 10px; color: #6045c8; background: #eee9fb; border: 0; border-radius: 8px; font-size: 14px; }
  .os-mobile-close span { font-size: 24px; }
  .os-sidebar .os-collapse { display: none; }
  .os-sidebar .os-footer { padding-top: 20px; }
  .os-scrim:not([hidden]) { position: fixed; display: block; inset: 0; z-index: 120; background: #17183066; }
  .cloud-project-bar { position: relative; top: auto; margin-left: 0 !important; padding: 12px 16px; gap: 10px; }
  .cloud-project-context { gap: 5px 8px; }
  .cloud-project-context > a, .cloud-project-context strong { max-width: 100%; overflow-wrap: anywhere; white-space: normal; }
  .cloud-project-actions { width: 100%; display: flex; flex-wrap: wrap; gap: 8px; }
  .cloud-project-bar button, .cloud-studio-switch a { min-height: 44px; padding: 11px 12px; font-size: 14px; }
  .cloud-project-actions [data-cloud-state] { width: 100%; font-size: 14px; }
  .cloud-demo-tools { flex-wrap: wrap; gap: 5px; }
  .cloud-demo-tools > a { min-height: 44px; display: inline-flex; align-items: center; }
  .cloud-project-bar [data-cloud-recovery] { padding: 12px; }

  /* Home, project management, and native dialogs. */
  .site-header { flex-wrap: wrap; gap: 12px; padding: 16px; }
  .site-header nav { width: 100%; justify-content: space-between; flex-wrap: wrap; gap: 8px; }
  .site-header nav > a, .site-header nav #account-control a { display: inline-flex; align-items: center; min-height: 44px; font-size: 14px; }
  .site-header nav > a:first-child { display: none; }
  body > main:not(.os-content) { padding-inline: 16px; }
  .workspace-hub { padding: 18px 14px; }
  .workspace-project { padding: 18px 14px; }
  .workspace-primary, .workspace-secondary, .workspace-dialog button, .workspace-project-menu summary, .workspace-project-menu button, .workspace-views button, .workspace-notice button { min-height: 44px; }
  .workspace-hub-tools > button { white-space: normal; }
  .workspace-project-links > div { gap: 6px; }
  .workspace-project-links > div a, .workspace-project-links > div button { display: inline-flex; align-items: center; min-height: 44px; }
  .workspace-notice { flex-wrap: wrap; }
  .workspace-notice > span { flex-basis: 100%; }
  .workspace-dialog { width: calc(100vw - 20px); max-width: calc(100vw - 20px); max-height: calc(100dvh - 20px); padding: 20px 16px; }
  .workspace-dialog-heading { gap: 8px; align-items: flex-start; }
  .workspace-dialog-heading h2 { font-size: 23px; overflow-wrap: anywhere; }
  .workspace-dialog input:not([type=radio]), .workspace-dialog select, .workspace-find input, .workspace-find select { min-height: 44px; font-size: 16px; min-width: 0; }
  .workspace-find { width: 100%; }
  .workspace-find > label { min-width: 0; }
  .demo-industry-card { min-width: 0; }
  .studio-copy { min-width: 0; }
  .studio-card { padding: 20px 16px; }
  .studio-card h3 { overflow-wrap: anywhere; }
  .studio-preview { width: 76px; flex-basis: 76px; }
  .planned-card { min-width: 0; }
  .planned-heading { flex-wrap: wrap; }
  .campus-select button, .balance-button, .reset-button { min-height: 44px; }
  .playground input[type=range] { height: 32px; }

  /* Forecast keeps its planning table, with readable swipeable quarters. */
  .studio main { padding: 20px 12px; }
  .studio .topbar { padding: 12px; }
  .studio .top-actions { flex-wrap: wrap; }
  .studio .workspace-topline, .studio .workspace-tools { flex-wrap: wrap; }
  .studio .page-heading { min-width: 0; }
  .studio h1 { font-size: 30px; overflow-wrap: anywhere; }
  .studio :is(.btn, .text-btn, .icon-button, .series-button, .override-chip, .segmented button) { min-height: 44px; font-size: 14px; }
  .studio :is(input:not([type=range]):not([type=checkbox]):not([type=radio]), select, textarea) { font-size: 16px; max-width: 100%; min-width: 0; }
  .studio input[type=range] { min-height: 30px; }
  .studio #scenario-controls .scenario-bar { padding: 16px 12px; gap: 12px; }
  .studio #scenario-controls .assumption-summary { padding-inline: 12px; }
  .studio #scenario-controls .growth-control { min-width: 0; flex-wrap: wrap; }
  .studio #scenario-controls .scenario-select { flex: 1 1 150px; max-width: 100%; }
  .studio #scenario-controls .control-group { min-width: 0; max-width: 100%; flex-wrap: wrap; }
  .studio .assumption-fact strong { font-size: 14px; }
  .studio .assumption-fact span, .studio .override-chip small { font-size: 12px; }
  .studio .heatmap-panel { min-width: 0; padding: 18px 10px; }
  .studio .heatmap-panel .panel-head { flex-wrap: wrap; gap: 12px; }
  .studio .heatmap-panel .panel-actions { flex-wrap: wrap; width: 100%; gap: 8px; }
  .studio .heatmap-panel .segmented { max-width: 100%; flex-wrap: wrap; }
  .studio .heatmap-panel .segmented button { padding: 10px; font-size: 14px; }
  .mobile-heatmap-hint { display: block; margin: 4px 0 12px; font-size: 14px; color: #686b80; }
  .studio .heatmap-scroll { max-width: 100%; overscroll-behavior-x: contain; }
  .studio .heatmap { min-width: var(--mobile-heatmap-width) !important; }
  .studio .heatmap th:first-child { width: 140px; }
  .studio .heatmap .row-label { min-height: 44px; font-size: 14px; }
  .studio .heatmap .building-label { padding-left: 8px; }
  .studio .heatmap .expand-campus { width: 38px; min-width: 38px; height: 44px; }
  .studio .heatmap td button { min-height: 52px; font-size: 14px; }
  .studio .heatmap-legend { flex-wrap: wrap; }
  .studio dialog { max-width: calc(100vw - 20px); width: calc(100vw - 20px); max-height: calc(100dvh - 20px); padding: 20px 16px; }
  .studio .form-grid, .studio .form-row { grid-template-columns: minmax(0, 1fr); }
  .studio .form-actions .btn { white-space: normal; }
  .studio .chart-wrap, .studio .table-scroll { max-width: 100%; overflow-x: auto; }

  /* Stack places floor details above its full-width proportional seat bar. */
  .os-content .page { padding: 20px 12px 28px; }
  .os-content .hdr-id, .os-content .hdr-name, .os-content .hdr-actions, .os-content .planning-column { min-width: 0; max-width: 100%; }
  .os-content .hdr h1 { font-size: 27px; }
  .os-content .hdr-title-part { white-space: normal; overflow-wrap: anywhere; text-align: left; }
  .os-content .hdr-edit { max-width: 100%; min-width: 0; }
  .os-content .hdr-actions { gap: 8px; }
  .os-content .hdr-actions .seg { max-width: 100%; flex-wrap: wrap; }
  .os-content .hdr-actions .seg-scope { flex-basis: 100%; }
  .os-content :is(.btn, .tg, .floor-name, .bench-chip, .seg > button, .scene-actions button, .scene-overlay button, .drawer-tabs button, .menu-item, .swatch) { min-height: 44px; }
  .os-content :is(.btn, .tg, .seg > button, .card-note) { font-size: 14px; }
  .os-content :is(input:not([type=range]):not([type=checkbox]):not([type=radio]), select, textarea) { font-size: 16px; min-height: 44px; min-width: 0; max-width: 100%; }
  .os-content .card-head { flex-wrap: wrap; gap: 10px; }
  .os-content .card-head .card-title { white-space: normal; font-size: 16px; overflow-wrap: anywhere; }
  .os-content .stack-tools { width: 100%; min-width: 0; flex-wrap: wrap; }
  .os-content .stack-body { padding: 6px 12px 14px; }
  .os-content .floor-wrap[data-grouped] { margin-inline: 0; padding-inline: 10px; }
  .os-content .floor { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 10px; padding: 14px 0 4px; }
  .os-content .floor-meta { grid-column: 1; grid-row: 1; min-width: 0; }
  .os-content .floor-name { text-align: left; font-size: 16px; overflow-wrap: anywhere; }
  .os-content .floor-stats { grid-column: 2; grid-row: 1; min-width: 0; align-self: center; }
  .os-content .fs-band { flex-wrap: wrap; justify-content: flex-end; font-size: 12px; }
  .os-content .track-wrap { grid-column: 1 / -1; grid-row: 2; width: 100%; min-width: 0; height: 60px; overflow-x: auto; overflow-y: hidden; }
  .os-content .track { height: 44px; bottom: auto; }
  .os-content .lab-tags { position: static; flex-wrap: wrap; margin-bottom: 6px; }
  .os-content .track-wrap:has(.lab-tags) { display: flex; flex-direction: column; height: auto; min-height: 92px; margin-top: 0; }
  .os-content .track-wrap:has(.lab-tags) .track { position: relative; flex: none; min-height: 44px; margin-bottom: 16px; }
  .os-content .bldg-head-top { flex-wrap: wrap; gap: 6px; }
  .os-content .bldg-name { overflow-wrap: anywhere; }
  .os-content .stack-foot { flex-wrap: wrap; gap: 12px; font-size: 12px; }
  .os-content .bench-chip { white-space: normal; text-align: left; flex-wrap: wrap; }
  .os-content .alloc-panel { margin: 12px 0; padding: 14px 12px; gap: 14px; }
  .os-content .alloc-head b { font-size: 16px; overflow-wrap: anywhere; }
  .os-content .alloc-head .sub { flex-basis: 100%; font-size: 14px; }
  .os-content .split-row, .os-content .split-preview { font-size: 14px; gap: 8px; }
  .os-content .split-row select { flex-basis: 100%; width: 100%; }
  .os-content .split-row .btn { flex: 1 1 120px; white-space: normal; }
  .os-content .split-preview .to-pct { font-size: 13px; }
  .os-content .split-swap { font-size: 14px; padding-block: 8px; }
  .os-content .unit-seg .tg, .os-content .presets .tg { min-width: 44px; padding: 8px; font-size: 14px; }
  .os-content .menu { position: fixed; top: calc(4rem + env(safe-area-inset-top, 0px)); left: 12px; right: 12px; width: auto; max-height: calc(100dvh - 5rem); overflow: auto; z-index: 110; }
  .os-content .findbox { width: 100%; min-width: 0; max-width: 100%; }
  .os-content .findbox input { width: 100%; }
  .os-content .find-menu { width: 100%; min-width: 0; max-height: 50dvh; overflow-y: auto; }
  .os-content .find-row { min-height: 44px; flex-wrap: wrap; }
  .os-content .find-where { white-space: normal; }
  .backdrop { z-index: 149; }
  .drawer { z-index: 150; width: 100%; max-width: 100vw; padding-top: env(safe-area-inset-top, 0px); padding-bottom: env(safe-area-inset-bottom, 0px); }
  .drawer :is(button, input, select) { min-height: 44px; }
  .drawer :is(input, select, textarea) { font-size: 16px; min-width: 0; max-width: 100%; }
  .drawer-tabs { overflow-x: auto; flex: none; }
  .drawer-body { padding-inline: 14px; }
  .drawer .fld, .drawer .ed-item { min-width: 0; }
  .drawer .fld-row, .drawer .ed-bldg-head, .drawer .fl-row { flex-wrap: wrap; }
  .drawer-foot { flex-wrap: wrap; }
  .os-content .scene-viewport { height: min(440px, 58dvh); min-height: 250px; }
  .os-content .scene-compact .scene-viewport { height: 300px; }
  .os-content .scene-controls label { flex-wrap: wrap; }
  .os-content .scene-controls input { min-height: 30px; }
  .os-content .scene-overlay > div { flex-wrap: wrap; }
  .os-content .scene-metrics { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
  .os-content .scene-metrics dd { font-size: 20px; }
  .os-content .scene-interaction-bar { flex-wrap: wrap; }
  .os-content .scene-interaction-bar button, .os-content .scene-team-key button { min-height: 44px; min-width: 44px; }
  .summary { z-index: 150; }
  .summary .sum-page { padding: 22px 14px; }
  .summary .sum-hero, .summary .sum-bldgs, .summary .sum-cols { grid-template-columns: minmax(0, 1fr); }
  .summary .sum-stat, .summary .sum-bldg-top, .summary .sum-move { flex-wrap: wrap; }
  .summary .sum-verdict-word { font-size: 34px; }
  .summary button { min-height: 44px; }
  .toast { max-width: calc(100vw - 24px); width: max-content; bottom: max(12px, env(safe-area-inset-bottom, 0px)); white-space: normal; }
}

/* Also expose tap controls on tablets and other coarse-pointer devices. */
@media (max-width: 760px), (pointer: coarse) {
  .stack-desktop-hint { display: none; }
  .stack-touch-hint { display: block; line-height: 1.5; }
  .touch-team-list { display: block; border-bottom: 1px solid var(--line); padding: 4px 0 10px; }
  .touch-team-list summary { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-height: 44px; font-size: 14px; color: #6045c8; cursor: pointer; list-style: none; }
  .touch-team-list summary::-webkit-details-marker { display: none; }
  .touch-team-list summary::after { content: '+'; font-size: 20px; }
  .touch-team-list[open] summary::after { content: '−'; }
  .touch-team-list summary > span { margin-left: auto; border-radius: 6px; padding: 3px 8px; background: #f1edff; }
  .touch-team-list > div { display: grid; gap: 6px; }
  .touch-team-list button { display: flex; align-items: center; gap: 10px; min-height: 52px; width: 100%; padding: 10px; border: 1px solid #e6e2ef; border-radius: 8px; background: #fff; text-align: left; color: #303447; }
  .touch-team-list button[aria-expanded=true] { border-color: #8763dc; background: #f7f4ff; }
  .touch-team-list i { width: 8px; height: 30px; border-radius: 3px; flex: none; }
  .touch-team-list button > span { flex: 1; min-width: 0; font-size: 14px; overflow-wrap: anywhere; }
  .touch-team-list small { display: block; font-size: 12px; color: #686b80; margin-top: 4px; }
  .touch-team-list b { font-size: 12px; font-weight: 500; color: #6045c8; max-width: 66px; }
  .touch-placement { display: grid; gap: 10px; padding-bottom: 14px; border-bottom: 1px solid var(--line); }
  .touch-placement label { display: grid; gap: 8px; font-size: 14px; line-height: 1.5; }
  .touch-placement select { width: 100%; min-height: 44px; font-size: 16px; }
  .touch-placement p { font-size: 14px; line-height: 1.5; }
  .touch-placement .btn { min-height: 44px; font-size: 14px; }
  .touch-allocation-note { color: #686b80; }
}

@media print {
  .os-mobile-bar, .os-mobile-close, .touch-team-list, .touch-placement, .mobile-heatmap-hint { display: none !important; }
  body.os-has-sidebar { padding-top: 0; }
}
