/* FDS extensions: compact space directory, project dialog and placement preview. */
.ss-project-menu { min-width: 0; max-width: 240px; gap: 8px; }
.ss-project-menu .ss-project { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ss-space-dialog { width: min(580px, calc(100vw - 24px)); max-height: calc(100dvh - 32px); overflow: auto; }
.ss-dialog-heading, .ss-space-heading { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.ss-dialog-heading { margin-bottom: 20px; }
.ss-dialog-heading form { flex-shrink: 0; }
.ss-space-dialog .ss-panel-section { margin-bottom: 20px; }
.ss-space-dialog .ss-object-list { max-height: 240px; overflow: auto; }
.ss-space-dialog :is(input, select) { max-width: 100%; }
.ss-space-help { position: relative; font-size: 12px; color: var(--fds-text-secondary); }
.ss-space-help summary { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; cursor: pointer; list-style: none; }
.ss-space-help summary::-webkit-details-marker { display: none; }
.ss-space-help summary:hover, .ss-space-help[open] summary { background: var(--fds-bg-muted); color: var(--fds-text-primary); }
.ss-space-help summary:focus-visible { outline: 2px solid var(--fds-blue-600); outline-offset: 2px; }
.ss-space-help svg { width: 16px; height: 16px; }
.ss-space-heading { position: relative; }
.ss-space-heading > .ss-space-help { position: static; }
.ss-space-help p { position: absolute; left: 0; right: 0; top: calc(100% + 4px); z-index: 12; margin: 0; padding: 10px 12px; white-space: normal; line-height: 1.6; color: var(--fds-text-primary); background: var(--fds-bg-panel); border: 1px solid var(--fds-border); border-radius: var(--fds-radius-md); box-shadow: var(--fds-shadow-1); }
/* Room size: one field per row with the label beside a wide input; the room
   block is set apart from the object directory below. */
.ss-room-section { padding-bottom: 16px; margin-bottom: 4px; border-bottom: 1px solid var(--fds-border); }
.ss-editor-page .ss-panel-section.ss-room-section { gap: 6px; }
/* Read-only room summary; size and clear height are edited in the outline dialog. */
.ss-room-summary { display: block; width: 100%; margin-top: 0; padding: 6px 8px; border: 1px solid var(--fds-border); border-radius: var(--fds-radius-md); background: var(--fds-bg-panel); color: var(--fds-text-primary); font: inherit; font-size: 13px; text-align: left; cursor: pointer; }
.ss-room-summary:hover { border-color: var(--fds-border-strong, var(--fds-text-tertiary)); }
.ss-room-summary:focus-visible { outline: 2px solid var(--fds-blue-600); outline-offset: 2px; }
.ss-space-workspace > .ss-floor-tools { margin: 4px 0 12px; }
.ss-space-workspace > .ss-floor-tools + .ss-ceiling-tools { margin-top: -4px; }
.ss-space-workspace.is-floor-open > .ss-floor-tools { margin-top: 0; }
.ss-space-workspace .ss-field-grid { margin-top: 8px; }
.ss-space-filters { display: flex; width: 100%; margin-top: 12px; }
.ss-space-filters .fds-btn { flex: 1; font-size: 12px; padding: 5px; min-width: 0; white-space: nowrap; }
.ss-space-group { border-top: 1px solid var(--fds-border); padding: 8px 0; }
.ss-space-group > summary { display: flex; justify-content: space-between; padding: 8px 4px; cursor: pointer; font-size: 13px; font-weight: 600; }
.ss-space-group > summary::before { content: '›'; margin-right: 6px; }
.ss-space-group[open] > summary::before { content: '⌄'; }
.ss-space-group > summary span:first-of-type { flex: 1; }
.ss-space-row { display: flex; align-items: center; gap: 4px; border: 1px solid transparent; border-radius: var(--fds-radius-md); margin: 4px 0; }
.ss-space-object { display: flex; align-items: baseline; flex: 1; min-width: 0; gap: 8px; padding: 10px 6px; text-align: left; border: 0; background: transparent; color: var(--fds-text-primary); cursor: pointer; }
.ss-space-object > span:last-child { min-width: 0; }
.ss-space-object strong { display: block; font-size: 13px; font-weight: 500; overflow-wrap: anywhere; }
.ss-space-object small, .ss-space-number { font-size: 12px; color: var(--fds-text-secondary); }
.ss-space-row > .fds-btn { font-size: 12px; padding: 6px; flex-shrink: 0; }
.ss-space-directory { min-height: 80px; overflow: visible; }
.ss-space-add-entry { position: sticky; bottom: calc(-1 * var(--fds-space-4)); z-index: 9; padding: var(--fds-space-4); margin: 0 calc(-1 * var(--fds-space-4)) calc(-1 * var(--fds-space-4)); background: var(--fds-bg-panel); border-top: 1px solid var(--fds-border); }
.ss-space-add-entry > .fds-btn { width: 100%; }
.ss-space-issues { max-height: 100px; overflow: auto; font-size: 12px; color: var(--fds-red-700); }
.ss-space-ghost { opacity: .75; }
.ss-space-ghost.is-invalid { filter: grayscale(1); opacity: .5; }
svg.is-space-placing { touch-action: none; cursor: crosshair; }
.ss-space-placement details { margin-bottom: 8px; }
.ss-space-selection { position: absolute; top: 12px; right: 12px; max-width: 70%; padding: 8px; border-radius: var(--fds-radius-md); background: var(--fds-bg-panel); font-size: 12px; box-shadow: var(--fds-shadow-1); }
@media (min-width: 1024px) {
  .ss-editor-page[data-workspace-step=space] .ss-editor-left { display: flex; flex-direction: column; overflow: hidden; }
  .ss-editor-page[data-workspace-step=space] :is(#step-panel, #step-panel > div:not(.ss-notice), .ss-space-workspace) { display: flex; flex-direction: column; flex: 1; min-height: 0; }
  .ss-space-workspace > :not(.ss-space-directory) { flex: 0 0 auto; }
  .ss-space-workspace .ss-space-directory { flex: 0 0 auto; }
  .ss-editor-page[data-workspace-step=space]:not(.is-space-adding):not(.is-floor-mode) .ss-editor-left { overflow-y: auto; }
  .ss-editor-page[data-workspace-step=space]:not(.is-space-adding):not(.is-floor-mode) :is(#step-panel, #step-panel > div:not(.ss-notice), .ss-space-workspace) { flex: 0 0 auto; }
  /* Floor and finish open (floor F1.1 review): a wider panel whose floor section scrolls on its own. */
  .ss-editor-page.is-floor-mode .ss-editor { grid-template-columns: var(--ss-rail-width, 64px) 380px minmax(0, 1fr) 300px; }
  .ss-space-workspace.is-floor-open > .ss-floor-tools { flex: 1 1 auto; min-height: 0; overflow: auto; overscroll-behavior: contain; }
}
/* Floor and ceiling sections on tablets and similar screens: the wider panel takes the inspector's room. */
@media (max-width: 1366px), (pointer: coarse) {
  .ss-editor-page.is-floor-mode .ss-editor-right { display: none; }
}
@media (min-width: 1024px) and (max-width: 1366px), (min-width: 1024px) and (pointer: coarse) {
  .ss-editor-page.is-floor-mode .ss-editor { grid-template-columns: var(--ss-rail-width, 64px) 380px minmax(0, 1fr); }
}
@media (max-width: 1023px) {
  .ss-space-directory { max-height: none; }
  .ss-space-add-entry { bottom: 0; padding-bottom: max(var(--fds-space-4), env(safe-area-inset-bottom)); }
}
@media (pointer: coarse) {
  .ss-space-workspace button, .ss-space-group > summary, .ss-space-help summary { min-height: 44px; }
}
.ss-space-object:focus-visible, .ss-space-group summary:focus-visible { outline: 2px solid var(--fds-blue-600); outline-offset: 2px; }
.ss-space-row.is-selected { border-color: var(--fds-blue-600); background: var(--fds-blue-50); }
@media (max-width: 1023px) { .ss-project-menu .ss-project { display: block; max-width: 110px; } }

.ss-space-workspace .ss-section-title { margin: 0; }
.ss-editor-page[data-workspace-step=space] .ss-notice { flex: 0 0 auto; }

/* Placement controls reserve their own layout area; the SVG has no card overlay. */
.ss-space-placement { padding: 12px; min-width: 0; font-size: var(--ss-type-note); overflow-wrap: anywhere; }
.ss-space-placement p { margin: 0 0 8px; }
.ss-space-placement-actions { position: sticky; bottom: 0; padding: 10px 0; background: var(--fds-bg-panel); }
.ss-space-placement details { margin-top: 12px; }
.ss-space-placement summary { cursor: pointer; padding-block: 8px; }
.is-space-placing #space-placement-desktop:not([hidden]) ~ .ss-panel { display: none; }
#space-placement-mobile { border-top: 1px solid var(--fds-border); background: var(--fds-bg-panel); }
.plan-wall.is-door-target, .is-door-target .plan-wall { stroke: var(--fds-blue-600); stroke-width: 3px; vector-effect: non-scaling-stroke; }
@media (max-width: 1023px) {
  .ss-editor-page.is-space-placing .ss-editor-stage { grid-template-rows: auto auto auto; }
  .ss-space-placement-actions { padding-bottom: 4px; }
}

/* FDS extension: creation occupies the sidebar, with persistent placement actions. */
.ss-editor-page.is-space-adding .ss-editor-left { display: flex; flex-direction: column; overflow: hidden; }
.ss-editor-page.is-space-adding :is(#step-panel, #step-panel > div:not(.ss-notice), .is-add-workspace) { display: flex; flex-direction: column; flex: 1; min-height: 0; overflow: hidden; }
.ss-editor-page.is-space-adding .is-add-workspace > .ss-space-add-form { display: flex; flex-direction: column; flex: 1; min-height: 0; overflow: hidden; gap: 0; padding: 0; border: 0; background: var(--fds-bg-panel); }
.ss-space-add-header { flex: 0 0 auto; padding-bottom: 12px; border-bottom: 1px solid var(--fds-border); }
.ss-space-add-header > .fds-btn { padding: 0; min-height: 32px; justify-content: flex-start; font-size: 12px; }
.ss-space-add-header h3 { font-size: 15px; margin: 6px 0 0; }
.ss-space-add-content { flex: 1; min-height: 0; overflow: auto; overscroll-behavior: contain; padding: 14px 2px; scroll-padding-block: 12px; }
.ss-space-add-section + .ss-space-add-section { margin-top: 16px; }
.ss-space-add-section h4 { margin: 0 0 10px; font-size: 12px; color: var(--fds-text-secondary); font-weight: 550; }
.ss-space-kind-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 6px; }
.ss-editor-page .ss-space-kind-grid .fds-btn { border-radius: var(--fds-radius-md); padding: 0 6px; min-height: 36px; font-size: 12px; }
.ss-editor-page .ss-space-kind-grid .fds-btn[aria-pressed=true] { color: var(--fds-blue-700); border-color: var(--fds-blue-200); background: var(--fds-blue-50); }
.ss-space-add-section .ss-field { margin-block: 10px; }
.ss-space-add-section .ss-field label { font-size: 12px; }
.ss-space-add-section .fds-meta { margin: 8px 0; font-size: 12px; line-height: 1.5; color: var(--fds-text-secondary); }
.ss-space-add-help { font-size: 12px; line-height: 1.5; color: var(--fds-text-secondary); }
.ss-space-add-help summary { cursor: pointer; padding: 8px 0; }
.ss-space-add-help p { margin: 0 0 8px; }
.ss-space-add-actions { flex: 0 0 auto; display: grid; gap: 8px; padding: 12px 0 0; border-top: 1px solid var(--fds-border); background: var(--fds-bg-panel); }
.ss-space-add-actions > button { width: 100%; font-size: 12px; min-height: 40px; }
.ss-space-add-actions .ss-space-drag-card { margin: 0; min-height: 44px; padding: 8px; border-radius: var(--fds-radius-md); }
/* Illustrated cards of the chosen kind go to the plan by a drag. On touch a swipe along the form scrolls it (ui/touch-drag.js). */
.ss-space-add-form .ss-door-type[data-space-drag] { cursor: grab; touch-action: pan-y; user-select: none; -webkit-user-select: none; -webkit-touch-callout: none; }
.ss-space-add-form .ss-door-type[data-space-drag]:active { cursor: grabbing; }
.ss-space-add-form .ss-door-type[data-space-drag] > svg { pointer-events: none; }
.ss-space-kind-art { margin-bottom: 10px; }
.ss-space-kind-art .ss-sk-zone { fill: var(--fds-gray-50); stroke: var(--fds-gray-500); stroke-width: 1.5; stroke-dasharray: 4 3; }
@media (max-width: 1023px) {
  .ss-editor-page.is-space-adding .ss-editor-left { height: auto; }
  .ss-editor-page.is-space-adding .is-add-workspace > .ss-space-add-form { flex: none; height: min(700px, var(--ss-add-available-height, 70dvh)); }
  .ss-space-add-header { padding-bottom: 8px; }
  .ss-space-add-content { padding-block: 10px; }
  .ss-space-add-actions { padding-top: 8px; }
  .ss-editor-page .ss-space-kind-grid .fds-btn, .ss-space-add-actions > button, .ss-space-add-header > .fds-btn { min-height: 44px; }
}

.ss-editor-page .ss-space-add-form .ss-field-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin: 0; }
.ss-editor-page .ss-space-add-form .ss-field { margin-block: 8px; }