/* The same screen frame is used by the floor plan and the embedded editor. */
@media screen {
  body>.app-shell>.topbar,body.constructor-mode>.app-shell>.topbar { height:var(--workspace-header-height); min-height:var(--workspace-header-height); padding:4px 10px; gap:12px; flex-wrap:nowrap; }
  .topbar .brand-block { width:128px; flex-shrink:0; gap:8px; }
  .topbar .brand-name { font-size:20px; }
  .topbar .brand-mark { width:26px; height:27px; }
  .topbar :is(.brand-caption,.eyebrow,.title-edit,.avatar-button) { display:none; }
  .topbar .project-title { min-width:0; flex:1; gap:6px; }
  .project-title>div,.title-row { min-width:0; }
  .topbar .title-row h1 { margin:0;font-size:14px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
  .topbar .back-button { width:26px; height:26px; font-size:16px; flex-shrink:0; }
  .topbar .top-actions { width:auto; gap:5px; flex-shrink:0; }
  .topbar :is(.outline-button,.primary-button,.ghost-button) { height:var(--workspace-nav-height); min-height:var(--workspace-nav-height); padding:0 8px; font-size:12px; border-radius:5px; }
  .topbar .history-button { width:28px; padding:4px; }
  .topbar .history-button svg { width:18px; height:18px; }
  .topbar .ai-settings-button { width:auto; min-width:46px; flex:none; white-space:nowrap; line-height:1.3; }
  .topbar .save-state { font-size:11px; }
  body>.app-shell>.project-modes,body.constructor-mode>.app-shell>.project-modes { display:grid; grid-template-columns:minmax(0,1fr) auto; height:var(--workspace-modes-height); min-height:var(--workspace-modes-height); padding:1px 10px; gap:8px; flex-shrink:0; overflow:hidden; }
  .project-mode-scroll { display:flex; align-items:center; gap:4px; min-width:0; height:100%; overflow-x:auto; overflow-y:hidden; overscroll-behavior-x:contain; scrollbar-width:none; }
  .project-mode-scroll::-webkit-scrollbar { display:none; }
  .project-mode-scroll>:is(button,.project-ai-actions),.project-ai-actions>button { flex:none; }
  .project-modes button { height:var(--workspace-nav-height); min-height:var(--workspace-nav-height); padding:3px 8px; font-size:12px; line-height:1.3; border-radius:5px; white-space:nowrap; }
  .project-modes button,.topbar :is(.outline-button,.primary-button,.ghost-button) { font-weight:500; }
  .project-modes button:hover { background:var(--menu-hover); color:var(--ink); }
  .project-modes button.active { background:var(--menu-selected); color:var(--ink); border-color:transparent; }
  .project-file-actions { gap:4px; min-width:max-content; margin-left:0; align-items:center; }
  .project-file-actions button { font-size:12px; }
  .project-modes>.project-file-actions { display:flex; align-self:center; }
  .project-modes .ai-command-icon { margin:0; font-family:inherit; font-size:inherit; }
  .project-ai-actions { display:flex;align-items:center;gap:4px;min-width:max-content; }
  .project-ai-actions .ai-image-open { display:inline-flex;align-items:center;gap:4px; }
  .project-ai-coming { height:var(--workspace-nav-height);min-height:var(--workspace-nav-height);padding:3px 8px;border:1px dashed #cbd3c4;border-radius:5px;background:#f7f9f4;color:#7d8675;font:500 12px/1.3 var(--font-ui);white-space:nowrap; }
  .project-ai-coming span { font-size:10px;text-transform:uppercase;letter-spacing:.04em;color:#9aa38f; }
  .ai-cost-badge { display:inline-block;margin-left:3px;padding:1px 4px;border-radius:4px;background:#eef4df;color:#5e793f;font:600 10px/1.2 var(--font-ui); }
  .token-quick-access { display:inline-flex;align-items:center;gap:4px;height:var(--workspace-nav-height);min-height:var(--workspace-nav-height);padding:0 7px;border:1px solid #d8e1cd;border-radius:5px;background:#f5f8ef;color:#52703e;font:500 12px/1 var(--font-ui);cursor:pointer;white-space:nowrap; }
  .token-quick-access:hover { background:#eaf2dc;border-color:#b9cda4; }
  .token-quick-access>span { font-size:12px;color:#789d4e; }
  .token-quick-access small { font-size:10px;color:#7a8774; }
  .workspace,.workspace.inspector-open,.project-modes~.workspace { position:relative; display:grid; grid-template-columns:var(--workspace-sidebar-width) minmax(0,1fr); grid-template-rows:var(--workspace-toolbar-height) minmax(0,1fr); overflow:hidden; }
  body.constructor-mode .workspace { display:none; }
  .workspace .canvas-panel { display:contents; }
  .workspace .canvas-toolbar { grid-column:1/-1; grid-row:1; height:var(--workspace-toolbar-height); min-height:0; padding:2px 10px; gap:8px; flex-wrap:nowrap; }
  .canvas-toolbar .canvas-action { height:var(--workspace-nav-height); min-height:var(--workspace-nav-height); font-size:12px; padding:3px 7px; border-radius:5px; }
  .canvas-toolbar .breadcrumbs { font-size:11px; }
  .canvas-toolbar .canvas-actions { gap:4px; }
  .workspace #canvasStage { grid-column:2; grid-row:2; width:100%; height:100%; min-width:0; min-height:0; }
  .workspace .left-panel { grid-column:1; grid-row:2; width:var(--workspace-sidebar-width); padding:8px; position:relative; z-index:8; }
  .workspace .panel-topline { padding:2px 4px 6px; min-height:24px; }
  .workspace .section-kicker,.workspace .section-heading { font-size:11px; letter-spacing:.035em; }
  .workspace .palette-section { padding-top:0; margin-top:0; }
  .palette-section>.section-heading,.palette-instruction,.sidebar-footer { display:none; }
  .library-search { margin:3px 0 8px; }
  .library-search input { min-height:30px; height:30px; font-size:13px; }
  .palette-group-header { min-height:28px; height:28px; font-size:13px; padding-block:2px; }
  .palette-group-header .palette-group-icon { font-size:16px; }
  .palette-items { padding:4px; gap:4px; }
  .palette-card { padding:6px; min-height:40px; }
  .palette-card b { font-size:12px; }
  .palette-card small { font-size:11px; }
  .palette-art { width:30px; height:30px; }
  .rooms-items .palette-card { display:grid; grid-template-columns:20px minmax(0,1fr); align-items:center; min-height:30px; padding:4px; }
  .rooms-items .palette-art { width:20px; height:20px; }
  .rooms-items .room-art::after { width:14px; height:14px; }
  .rooms-items .palette-card small { display:none; }
  .custom-library-heading { min-height:30px; padding:4px; }
  .custom-library-heading .palette-group-header { padding:0; margin:0 4px 0 0; min-height:24px; height:24px; }
  .left-panel :is(.palette-group-header,.custom-library-heading,.tool-button) { font:400 var(--menu-text-size)/20px var(--font-ui); border-radius:6px; }
  .left-panel .palette-group-header { height:var(--menu-row-height); min-height:var(--menu-row-height); padding:5px 7px; }
  .left-panel .palette-group-header:hover { background:var(--menu-hover); }
  .left-panel .palette-group.expanded>.palette-group-header { background:var(--menu-selected); }
  .left-panel .palette-items { grid-template-columns:minmax(0,1fr); padding:4px 0 7px; }
  .left-panel .palette-card { display:grid; grid-template-columns:28px minmax(0,1fr); align-items:center; gap:8px; min-height:36px; padding:5px 8px; border:1px solid transparent; border-radius:6px; background:var(--panel); }
  .left-panel .palette-card b { font:400 var(--menu-text-size)/20px var(--font-ui); white-space:nowrap; overflow:visible; }
  .left-panel .palette-card small { font:400 12px/17px var(--font-ui); }
  .left-panel .palette-art { width:28px; height:28px; }
  .left-panel .palette-card:hover { background:var(--menu-hover); border-color:transparent; transform:none; box-shadow:none; }
  /* Keep editor targets stationary; landing-like feedback comes from paint. */
  .app-shell :is(.back-button,.primary-button,.palette-card,.library-card):is(:hover,:active,.dragging) { transform:none; }
  .left-panel .palette-card[aria-expanded="true"] { background:var(--menu-selected); border-color:var(--line); }
  .left-panel .palette-card.invalid-size { border-color:var(--color-danger); }
  .left-panel .custom-card b { font-weight:400; font-size:var(--menu-text-size); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  .left-panel .custom-card-main:hover { background:var(--menu-hover); }
  .left-panel .custom-card { grid-template-columns:minmax(0,1fr); gap:5px; padding:7px; margin-bottom:6px; border:1px solid var(--line); background:var(--panel); }
  .left-panel .custom-card-main { padding:3px 0; width:100%; border-radius:5px; }
  .left-panel .custom-card-actions { display:flex; gap:6px; padding-top:5px; border-top:1px solid var(--line); }
  .left-panel .custom-card-actions button { flex:1; min-width:0; height:28px; padding:3px 7px; border:1px solid var(--line); border-radius:5px; background:var(--paper); color:var(--ink-soft); font:400 12px/20px var(--font-ui); }
  .left-panel .custom-card-actions button:hover { background:var(--menu-hover); }
  .left-panel .custom-card-actions .custom-card-delete:hover { color:var(--color-danger); background:#fff1ee; border-color:#e4b5ac; }
  .workspace .right-panel,.workspace.inspector-open .right-panel { position:absolute; z-index:12; top:var(--workspace-toolbar-height); bottom:0; right:0; width:var(--workspace-inspector-width); padding:10px; box-shadow:-5px 0 20px #202a3012; visibility:hidden; pointer-events:none; }
  .inspector-visible .workspace .right-panel { visibility:visible; pointer-events:auto; }
  .right-panel .inspector-header { padding-bottom:8px; margin-bottom:6px; }
  .right-panel .inspector-header h2 { font-size:15px; font-weight:500; }
  .compact-properties .property-row { margin-top:8px; gap:8px; }
  .compact-properties .property-input { height:32px; }
  .compact-properties :is(.room-tool-section summary,.property-help summary) { padding-block:7px; font-size:13px; }
  .compact-properties :is(.contour-button,.wall-action,.connect-button,.disconnect-button,.mirror-button,.back-to-room,.wall-split-controls button) { min-height:30px; font-size:12px; }
  .compact-properties .property-footer { padding:6px 0 0; }
  .compact-properties .property-footer button { min-height:30px; }
  .workspace :is(.left-panel,.right-panel) :is(button,label,summary,fieldset,legend,span,b,strong,p,small) { min-width:0; }
  .workspace .right-panel :is(button,summary,legend,b,strong,p,small) { overflow-wrap:anywhere; }
  .workspace .right-panel :is(.room-tool-section summary,.wall-action,.contour-button,.connect-button,.disconnect-button,.shared-elements button) { white-space:normal; height:auto; }
  .workspace .right-panel :is(.property-row,.property-field) { min-width:0; }
  .workspace .right-panel :is(input,select) { min-width:0; max-width:100%; }
  /* Nested property groups share the inspector's inset, not another card. */
  .workspace .compact-properties .door-controls { padding:10px 0; border:0; border-top:1px solid var(--line); border-radius:0; background:transparent; }
  .workspace .compact-properties :is(.room-tool-section>summary,.door-controls>strong) { padding:6px 8px; background:var(--paper); border-radius:6px; font-weight:500; }
  .workspace .compact-properties .room-tool-section[open]>summary { background:var(--green-light); box-shadow:inset 3px 0 var(--green); }
  .workspace-drawer-toggle { position:absolute; z-index:14; top:calc(50% + var(--workspace-toolbar-height)/2); transform:translateY(-50%); width:24px; height:94px; padding:4px 2px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px; border:1px solid var(--line-strong); border-radius:0 6px 6px 0; background:var(--panel); color:var(--ink-soft); box-shadow:0 3px 12px #202a3010; }
  .workspace-drawer-toggle b { font:600 11px/1.3 var(--font-ui); writing-mode:vertical-rl; transform:rotate(180deg); }
  #libraryToggle { left:var(--workspace-sidebar-width); }
  #inspectorToggle { right:0; border-radius:6px 0 0 6px; }
  .inspector-visible #inspectorToggle { right:var(--workspace-inspector-width); }
  .sidebar-collapsed .workspace { grid-template-columns:0 minmax(0,1fr); }
  .sidebar-collapsed .left-panel { visibility:hidden; pointer-events:none; }
  .sidebar-collapsed #libraryToggle { left:0; }
  .canvas-status { position:absolute; z-index:2; bottom:0; left:var(--workspace-sidebar-width); right:0; height:22px; min-height:22px; padding:2px 8px; font-size:10px; pointer-events:none; background:#ffffffc9; }
  .sidebar-collapsed .canvas-status { left:0; }
  .canvas-status .status-key { width:14px; height:14px; font-size:9px; }
  .canvas-status .status-center { font-size:10px; }
  .canvas-note { top:8px; left:32px; font-size:11px; }
  .navigation-help { display:none; }
  .zoom-control { bottom:30px; right:48px; height:30px; }
  .zoom-control button { width:28px; height:28px; }
  .fit-button { bottom:30px; right:10px; width:30px; height:30px; }
  .inspector-visible .zoom-control { right:calc(var(--workspace-inspector-width) + 48px); }
  .inspector-visible .fit-button { right:calc(var(--workspace-inspector-width) + 10px); }
  .scale-chip { bottom:32px; left:12px; }
  .workspace-focus>.app-shell>:is(.topbar,.project-modes) { display:none; }
  .project-3d-header { height:44px; padding:4px 12px; gap:12px; }
  .project-3d-header .section-kicker { display:none; }
  .project-3d-header .outline-button { height:30px; min-height:30px; font-size:12px; }
  .project-3d-badge { width:30px; height:30px; border-radius:6px; font-size:12px; }
  .project-3d-heading h2 { font-size:15px; margin:0; }
  .project-3d-tools { top:8px; gap:4px; }
  .project-3d-tools button { font-size:12px; }
  .project-3d-tools .project-3d-control { height:30px; padding:0 8px; }
  .project-3d-tools :is(.project-3d-segmented,.project-3d-zoom) { padding:2px; }
  .project-3d-tools :is(.project-3d-segmented button,.project-3d-zoom button) { height:24px; padding-inline:8px; }
  .project-3d-footer { min-height:24px; padding:3px 12px; }
}
@media screen and (max-width:1099px) {
  .workspace,.workspace.inspector-open,.project-modes~.workspace { grid-template-columns:0 minmax(0,1fr); }
  .workspace .left-panel { position:absolute; top:var(--workspace-toolbar-height); bottom:0; left:0; box-shadow:5px 0 20px #202a3012; }
  .canvas-status { left:0; }
  .topbar .save-state,.topbar .back-button { display:none; }
  .topbar .brand-block { width:124px; }
}
@media screen and (max-width:760px) {
  .topbar .brand-block { width:112px; }
  .topbar .brand-name { font-size:18px; }
  .topbar .top-actions { overflow-x:auto; max-width:60%; }
  .project-modes { overflow-x:auto; }
  .workspace .canvas-toolbar { overflow-x:auto; }
  .canvas-toolbar .breadcrumbs { display:none; }
}

/* Keep complete navigation targets reachable when fixed file actions no longer
   fit beside them. Desktop/tablet retain the original single 30px row. */
@media screen and (max-width:559px) {
  html[data-workspace="planner"] { --workspace-modes-height:60px; }
  .topbar .top-actions { min-width:0; flex-shrink:1; }
  body>.app-shell>.project-modes,body.constructor-mode>.app-shell>.project-modes {
    grid-template-columns:minmax(0,1fr);
    grid-template-rows:repeat(2,minmax(0,1fr));
    padding:1px 6px;
    gap:0;
  }
  .project-modes>.project-file-actions { justify-self:end; }
}
