/* Mobile is a task workspace: the model stays visible, tools stay within reach. */
.mobile-sheet-bar, .mobile-more, .mobile-scene-tools { display: none; }
.mobile-more:not([open]) > .mobile-menu-content, .mobile-views:not([open]) > .mobile-view-popover { display: none; }
#tabs { grid-template-columns: repeat(4, minmax(0, 1fr)); }
#tabs button { min-width: 0; padding-inline: 5px; font-size: 12px; }
#tabs button > span { display: none; }
.header-right { min-width: 0; overflow-x: auto; scrollbar-width: thin; }
.header-right button { flex-shrink: 0; }
@media (min-width: 901px) and (max-width: 1450px) {
  .brand .studio, .brand-divider { display: none; }
  .brand img { width: 170px; }
  .header-right { gap: 4px; }
  .header-right button { font-size: 12px; padding: 8px; }
}
.touch-placement[hidden] { display: none; }
.touch-placement { position: absolute; z-index: 12 !important; left: 16px; right: 16px; bottom: 14px; max-width: 500px; margin: auto; padding: 12px; border: 1px solid #86ad9b; border-radius: 12px; background: #f8fffcf5; box-shadow: 0 8px 30px #1b384d22; }
.touch-placement.invalid { border-color: #cf8d82; background: #fffaf7f5; }
.touch-placement-message { font-size: 12px; line-height: 1.5; margin: 0 0 8px; color: #23463c; }
.touch-placement.invalid .touch-placement-message { color: #8c342b; }
.touch-nudge, .touch-placement-actions { display: flex; align-items: center; gap: 6px; }
.touch-nudge { margin-bottom: 8px; }
.touch-nudge span { margin-right: auto; font-size: 12px; }
.touch-nudge button { min-width: 44px; min-height: 44px; padding: 6px; }
.touch-placement-actions button { min-height: 44px; font-size: 13px; }
.touch-placement-actions .touch-confirm { flex: 1; }
.touch-suggest { flex: 1; }
.scale-key { position: absolute; left: 20px; bottom: 47px; padding: 5px 8px; border-radius: 5px; color: #456172; background: #ffffffdc; font-size: 11px; pointer-events: none; }
.auto-place { margin-top: 8px; background: #eff5f7; border-color: #a4bac7; }
.project-shortcut { margin-bottom: 10px; padding: 10px; background: #f1f6f7; border-color: #c1d3dd; font-size: 12px; color: #294c60; }
.project-delivery { margin-top: 18px; display: grid; gap: 8px; }
.color-lock { padding: 12px; margin-bottom: 12px; border: 1px solid #bcd4c8; border-radius: 8px; background: #f2faf5; color: #2c5946; font-size: 13px; line-height: 1.5; }
.color-lock button { margin-top: 8px; width: 100%; }

@media (max-width: 900px) {
  html, body { height: 100%; overflow: hidden; overscroll-behavior: none; }
  body { height: var(--mobile-viewport-height, 100dvh); min-height: 0; display: flex; flex-direction: column; }
  body > header { flex: 0 0 54px; height: 54px; min-height: 0; padding: 4px 10px; gap: 8px; position: relative; z-index: 25; }
  .brand { gap: 0; min-width: 0; }
  .brand img { width: 134px; max-width: 100%; }
  .brand .studio, .brand-divider { display: none; }
  .header-right { flex: 0 0 auto; margin-left: auto; width: auto; overflow: visible; flex-wrap: nowrap; gap: 6px; }
  .header-right > #undo { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; padding: 0; font-size: 23px; border-color: transparent; background: #f2f6f7; }
  .header-right > #undo span { display: none; }
  .mobile-more { display: block; }
  .mobile-more > summary { min-height: 44px; display: flex; align-items: center; justify-content: center; gap: 8px; list-style: none; cursor: pointer; border: 1px solid #d7e1e6; padding: 9px 12px; border-radius: 8px; color: #324a5a; font-size: 13px; font-weight: 600; }
  .mobile-more > summary::-webkit-details-marker, .mobile-views > summary::-webkit-details-marker { display: none; }
  .mobile-more > summary span { font-size: 20px; line-height: .8; }
  .mobile-more[open] > summary { background: #edf4f7; border-color: #9eb7c5; }
  .mobile-menu-content { position: absolute; right: 8px; top: calc(100% + 6px); z-index: 40; width: min(292px, calc(100vw - 16px)); max-height: calc(var(--mobile-viewport-height, 100dvh) - 140px); overflow-y: auto; overscroll-behavior: contain; display: flex; flex-direction: column; gap: 5px; background: #fff; border: 1px solid #cbdbe5; padding: 12px; border-radius: 12px; box-shadow: 0 12px 36px #1a374833; }
  .mobile-menu-content > p { font-size: 11px; text-transform: uppercase; letter-spacing: 1px; color: #6c8190; margin: 0 0 6px; }
  .header-right .mobile-menu-content button, .header-right .mobile-menu-content #shot { display: flex; align-items: center; width: 100%; max-width: none; min-height: 44px; padding: 10px 12px; margin: 0; justify-content: flex-start; text-align: left; font-size: 14px; border-radius: 7px; }
  .header-right .mobile-menu-content button span { display: inline; }
  .header-right .mobile-menu-content .primary { max-width: none; }
  .mobile-menu-content .fullscreen-toggle { gap: 8px; }
  .mobile-menu-content .mobile-price { background: #f7941e; border-color: #f7941e; color: #253440; font-weight: 650; }
  body > main { flex: 1 1 0; min-height: 0; height: auto; display: grid; grid-template-columns: minmax(0, 1fr); grid-template-rows: minmax(110px, .95fr) minmax(100px, 1.05fr); overflow: hidden; }
  main > .viewport { order: 0; min-height: 0; height: auto; grid-column: 1; grid-row: 1; }
  main > aside { order: 1; min-height: 0; min-width: 0; grid-column: 1; grid-row: 2; overflow-x: hidden; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; padding: 0 16px 18px; border-top: 1px solid #bfd0dc; border-radius: 16px 16px 0 0; z-index: 10; box-shadow: 0 -5px 20px #263f4b12; scroll-padding-top: 58px; background: #fff; }
  main > .summary { display: none; }
  html[data-mobile-panel="full"] main { grid-template-rows: minmax(96px, .32fr) minmax(120px, 1fr); }
  html[data-mobile-panel="peek"] main { grid-template-rows: minmax(0, 1fr) 48px; }
  html[data-mobile-panel="peek"] main > aside { overflow: hidden; padding-bottom: 0; }
  html[data-mobile-panel="peek"] main > aside > :not(.mobile-sheet-bar) { visibility: hidden; }
  .mobile-sheet-bar { display: flex; align-items: center; position: sticky; top: 0; z-index: 15; background: #fff; margin: 0 -16px; padding: 0 10px 0 16px; min-height: 48px; border-bottom: 1px solid #e8eff3; touch-action: none; }
  .mobile-sheet-toggle { flex: 1; min-width: 0; display: flex; align-items: center; gap: 8px; border: 0; background: #fff; border-radius: 0; min-height: 48px; padding: 5px 0; color: #294959; font-size: 13px; text-align: left; touch-action: none; }
  .sheet-grip { width: 20px; height: 4px; flex: 0 0 auto; background: #b7cbd5; border-radius: 3px; }
  .mobile-sheet-toggle b { font-weight: 650; margin-right: auto; }
  .sheet-action { white-space: nowrap; font-size: 11px; font-weight: 500; color: #607f90; }
  .mobile-sheet-collapse { width: 44px; height: 44px; flex: 0 0 44px; min-height: 44px; margin-left: 4px; border: 0; padding: 0; color: #456778; background: #f4f7f9; border-radius: 9px; font-size: 22px; }
  body > #tabs { flex: 0 0 auto; order: 3; position: relative; top: auto; bottom: auto; z-index: 20; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 4px; margin: 0; padding: 6px 8px max(6px, env(safe-area-inset-bottom)); width: 100%; border: 0; border-top: 1px solid #d3e0e7; background: #fff; box-shadow: 0 -3px 12px #233e4d0a; }
  body > #tabs button { align-items: center; justify-content: center; flex-direction: column; gap: 5px; min-height: 52px; padding: 6px 2px; font-size: 12px; font-weight: 600; line-height: 1.2; border: 0; border-radius: 9px; background: #f3f6f8; color: #4d6676; box-shadow: none; }
  body > #tabs button::before { display: block; font-size: 17px; line-height: 1; font-weight: 500; }
  body > #tabs [data-stage="design"]::before { content: '↔'; }
  body > #tabs [data-stage="joinery"]::before { content: '▥'; }
  body > #tabs [data-stage="interior"]::before { content: '▱'; }
  body > #tabs [data-stage="finish"]::before { content: '◧'; }
  body > #tabs button.active { color: #243c4a; background: #fff0d9; box-shadow: inset 0 -3px #f7941e; }
  body > #tabs button > span { display: none; }
  .panel-heading { padding-top: 12px; padding-bottom: 10px; }
  .panel-heading > span { display: none; }
  .panel-heading h1 { font-size: 20px; margin: 0; line-height: 1.25; }
  #controls button, #controls summary, #controls select, #controls input:not([type="checkbox"]):not([type="range"]) { min-height: 44px; }
  #controls summary { display: flex; align-items: center; }
  #controls input[type="range"] { min-height: 36px; }
  #controls input[type="number"], #controls input[type="text"], #controls select, #controls textarea { font-size: 16px; }
  #controls .field { margin-bottom: 14px; }
  #controls .compact-choice { grid-template-columns: minmax(0, 1fr) minmax(145px, 1fr); }
  #controls .compact-dimension { grid-template-columns: minmax(0, 1fr) 100px; }
  #controls .compact-number input { padding: 9px 4px 9px 10px; }
  .compact-dimension .compact-slider { height: 36px; margin: 2px 0; }
  .compact-dimension { padding: 6px 0 2px; }
  .compact-choice { padding: 8px 0; }
  .compact-choice > label, .compact-dimension > label { font-size: 14px; }
  .aside-bottom { display: none; }
  .scene-top { top: 8px; left: 9px; right: 9px; z-index: 3 !important; }
  .scene-top .project-title { display: flex; align-items: center; justify-content: space-between; gap: 6px; width: 100%; max-width: none; padding: 4px 5px 4px 10px; border-radius: 10px; background: #ffffffed; border: 1px solid #d5e1e7; box-shadow: 0 4px 16px #2945550b; }
  .project-title > span, .project-title p { display: none; }
  .scene-top .project-title h2 { font-size: 15px; white-space: nowrap; letter-spacing: -.3px; margin: 0; }
  .project-title .price-cta { margin: 0; min-height: 44px; padding: 8px 10px; font-size: 11px; border-radius: 7px; white-space: nowrap; }
  .quick-views, .mode-toolbar, .view-controls, .scene-bottom { display: none; }
  .mobile-scene-tools { display: flex; position: absolute; z-index: 11 !important; bottom: 8px; left: 9px; right: 9px; gap: 7px; align-items: flex-end; pointer-events: none; }
  .mobile-scene-tools > * { pointer-events: auto; }
  .mobile-views { position: relative; }
  .mobile-views > summary, .mobile-scene-tools .scene-layers > summary { min-height: 44px; display: flex; align-items: center; justify-content: center; gap: 9px; border: 1px solid #c6d8e2; background: #fffffff5; border-radius: 9px; color: #385767; padding: 8px 12px; font-size: 12px; font-weight: 600; cursor: pointer; list-style: none; }
  .mobile-views[open] > summary, .mobile-scene-tools .scene-layers[open] > summary { background: #ebf3f8; border-color: #88a7b9; }
  .mobile-view-popover { position: absolute; bottom: calc(100% + 8px); left: 0; width: min(316px, calc(100vw - 24px)); max-height: max(104px, calc(var(--mobile-scene-height, 300px) - 62px)); overflow-y: auto; overscroll-behavior: contain; border-radius: 12px; padding: 12px; border: 1px solid #c3d6e1; background: #fff; box-shadow: 0 8px 25px #1a374828; }
  .mobile-view-popover > p { margin: 0 0 10px; color: #567181; font-size: 12px; line-height: 1.4; }
  .mobile-view-grid, .mobile-view-options { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
  .mobile-view-grid button, .mobile-view-options button { min-height: 44px; min-width: 0; white-space: normal; font-size: 12px; padding: 8px; border-radius: 7px; }
  .mobile-view-grid button[aria-pressed="true"] { border-color: #eaa345; background: #fff2df; color: #47341e; }
  .mobile-view-options { margin-top: 10px; padding-top: 10px; border-top: 1px solid #e1e9ee; }
  .mobile-scene-tools .scene-layers { position: relative; top: auto; right: auto; bottom: auto; width: auto; padding: 0; margin: 0; overflow: visible; border: 0; background: transparent; box-shadow: none; }
  .mobile-scene-tools .scene-layers > summary { margin: 0; }
  .mobile-scene-tools .scene-layers .layer-buttons { position: absolute; bottom: calc(100% + 8px); left: 0; width: min(216px, calc(100vw - 135px)); max-height: max(110px, calc(var(--mobile-scene-height, 300px) - 62px)); overflow-y: auto; overscroll-behavior: contain; border: 1px solid #c3d6e1; border-radius: 12px; padding: 8px; background: #fff; box-shadow: 0 8px 25px #1a374828; }
  .mobile-scene-tools .layer-buttons button { min-height: 44px; font-size: 13px; }
  .mobile-scene-tools .scene-layers > p { display: none; }
  .mobile-fit { min-width: 44px; height: 44px; margin-left: auto; padding: 0; border-color: #c6d8e2; background: #fffffff5; border-radius: 9px; color: #45687a; font-size: 26px; }
  .dimension-label { padding: 4px 6px; opacity: .94; pointer-events: none !important; min-width: 0; }
  .dimension-label small { font-size: 8px; }
  .dimension-label strong { font-size: 11px; }
  .scale-key { display: none; }
  #mobileWalk { bottom: 61px; right: 9px; }
  #mobileWalk button { min-width: 44px; width: 44px; height: 44px; padding: 0; }
  #selectionInfo { bottom: 61px; left: 9px; max-width: calc(100% - 18px); font-size: 12px; padding: 8px 10px; }
  #conflict { top: 58px; right: 9px; width: calc(100% - 18px); max-width: none; max-height: calc(100% - 68px); overflow-y: auto; z-index: 15 !important; padding: 12px; }
  #conflict button { min-height: 44px; }
  #toast { top: 61px; left: 9px; font-size: 12px; padding: 9px 11px; max-width: calc(100% - 18px); }
  html[data-mobile-panel="full"] .dimension-label { display: none; }
  html[data-mobile-panel="full"] .scene-top .project-title { padding-block: 1px; }
  html[data-mobile-panel="full"] .mobile-scene-tools { bottom: 5px; }
  html[data-touch-placement="true"] .mobile-scene-tools, html[data-touch-placement="true"] #selectionInfo { display: none; }
  .touch-placement { left: 8px; right: 8px; bottom: 8px; padding: 10px; }
  .touch-placement-message { font-size: 12px; margin-bottom: 7px; }
  .touch-placement-actions { flex-wrap: wrap; }
  .touch-suggest { flex-basis: 100%; }
  .touch-nudge span { font-size: 11px; }
  .tour-active .mobile-scene-tools, .tour-active .scene-top { display: none; }
  .tour-controls { width: calc(100% - 18px); bottom: 9px; padding: 12px 14px 15px; gap: 9px; flex-direction: column; align-items: stretch; }
  .tour-caption > span { display: none; }
  .tour-caption > strong { font-size: 17px; }
  .tour-caption > p { font-size: 12px; margin: 5px 0 0; }
  .tour-actions { gap: 5px; max-width: none; justify-content: flex-end; }
  .tour-actions button, .tour-speed select { min-height: 44px; }
  .tour-speed { margin-right: auto; }
  .precision-workbench { position: absolute; inset: 0; min-height: 0; overflow: hidden; }
  html[data-mobile-workbench="true"] .scene-top, html[data-mobile-workbench="true"] .mobile-scene-tools,
  .precision-active .scene-top, .precision-active .mobile-scene-tools { display: none; }
  .precision-workbench button, .precision-workbench select { min-height: 44px; }
  .precision-workbench svg { touch-action: none; }
  .precision-workbench .precision-top { flex-wrap: wrap; gap: 5px; }
  dialog { max-height: calc(var(--mobile-viewport-height, 100dvh) - 20px); overflow-y: auto; overscroll-behavior: contain; }
  dialog input, dialog textarea, dialog select { font-size: 16px; }
}
@media (min-width: 600px) and (max-width: 900px) and (max-height: 560px) and (orientation: landscape) {
  body > header { flex-basis: 48px; height: 48px; }
  .brand img { width: 118px; }
  body > main, html[data-mobile-panel="full"] main { grid-template-columns: minmax(0, 1fr) minmax(275px, 39%); grid-template-rows: minmax(0, 1fr); }
  main > aside { grid-column: 2; grid-row: 1; border-radius: 0; border-top: 0; border-left: 1px solid #cbd9e0; }
  html[data-mobile-panel="peek"] main { grid-template-columns: minmax(0, 1fr) 48px; grid-template-rows: minmax(0, 1fr); }
  html[data-mobile-panel="peek"] main > aside { padding: 0; }
  html[data-mobile-panel="peek"] .mobile-sheet-bar { margin: 0; padding: 0; height: 100%; }
  html[data-mobile-panel="peek"] .mobile-sheet-toggle { flex-direction: column; writing-mode: vertical-rl; justify-content: center; width: 48px; height: 100%; padding: 8px; }
  html[data-mobile-panel="peek"] .mobile-sheet-toggle b { margin: 0; }
  html[data-mobile-panel="peek"] .sheet-grip { display: none; }
  body > #tabs { padding-block: 4px; }
  body > #tabs button { flex-direction: row; min-height: 44px; gap: 9px; }
  .panel-heading { padding-top: 8px; }
  .panel-heading h1 { font-size: 18px; }
  .tour-controls { flex-direction: row; align-items: center; }
  .tour-caption > p { display: none; }
}
@media (max-width: 599px) and (max-height: 430px) {
  body > header { flex-basis: 46px; height: 46px; padding-block: 1px; }
  body > main { grid-template-rows: minmax(58px, .45fr) minmax(0, 1fr); }
  html[data-mobile-panel="full"] main { grid-template-rows: 58px minmax(0, 1fr); }
  html[data-mobile-panel="peek"] main { grid-template-rows: minmax(0, 1fr) 48px; }
  body > #tabs { padding-block: 3px; }
  body > #tabs button { min-height: 44px; flex-direction: row; gap: 5px; font-size: 11px; }
  body > #tabs button::before { font-size: 14px; }
  .scene-top, .mobile-scene-tools, #labels { display: none; }
  html[data-mobile-panel="peek"] .mobile-scene-tools { display: flex; }
}
@media (max-width: 599px) and (max-height: 600px) {
  html[data-mobile-panel="full"] .mobile-scene-tools { display: none; }
  html[data-mobile-panel="full"] .scene-top .project-title { width: auto; padding: 5px 9px; }
  html[data-mobile-panel="full"] .scene-top .price-cta { display: none; }
}
@media (max-width: 359px) {
  .brand img { width: 114px; }
  .mobile-sheet-toggle { font-size: 12px; gap: 6px; }
  .sheet-grip { width: 15px; }
  .sheet-action { font-size: 10px; }
  .scene-top .project-title h2 { font-size: 13px; }
  .project-title .price-cta { padding-inline: 7px; font-size: 10px; }
}