/* FDS extension: approved SpaceScene editor visual standard V1.0.
   Primitive colors/spacing remain vendor-owned; editor sizing is local. */
.ss-editor-page {
  --ss-type-note: .75rem;
  --ss-type-body: .8125rem;
  --ss-type-emphasis: .875rem;
  --ss-panel-padding: var(--fds-space-4);
  --ss-group-gap: var(--fds-space-5);
  --ss-control-height: 32px;
  --ss-input-height: 34px;
  font-size: var(--ss-type-body);
  line-height: 1.5;
}
.ss-editor-page :is(.ss-editor-left, .ss-editor-right) {
  padding: var(--ss-panel-padding);
  gap: var(--ss-group-gap);
  font-size: var(--ss-type-body);
}
.ss-editor-page :is(.ss-panel-title, .ss-section-title, .ss-case-group > summary, .ss-showcase-generation > summary) {
  color: var(--fds-text-primary);
  font-size: var(--ss-type-body);
  font-weight: 600;
  line-height: 1.5;
  letter-spacing: normal;
  text-transform: none;
}
.ss-editor-page :is(.fds-meta, .ss-section-subtitle, .ss-unit-suffix, .ss-case-code, .ss-case-size, .ss-case-count, .ss-draft, .ss-project) {
  font-size: var(--ss-type-note);
  line-height: 1.5;
}
.ss-editor-page :is(.fds-meta, .ss-unit-suffix) { color: var(--fds-text-secondary); }
.ss-editor-page .ss-case-code { font-weight: 500; }
.ss-editor-page .ss-case-name { font-size: var(--ss-type-body); }
.ss-editor-page .ss-high-badge { font-size: var(--ss-type-note); }
.ss-editor-page :is(.ss-step-panel, .ss-step-panel > div) { gap: var(--ss-group-gap); }
.ss-editor-page .ss-panel-section { gap: var(--fds-space-3); }
.ss-editor-page #properties > div { display: grid; gap: var(--fds-space-4); min-width: 0; }
.ss-editor-page #properties > div > :is(.ss-facts, .ss-chips) {
  padding-top: var(--fds-space-4);
  border-top: 1px solid var(--fds-border);
}
.ss-editor-page .ss-editor-right > .ss-panel + .ss-panel {
  border-top: 1px solid var(--fds-border);
  padding-top: var(--ss-group-gap);
}
.ss-editor-page .ss-facts { gap: 0; font-size: var(--ss-type-body); }
.ss-editor-page .ss-facts > div { min-height: 32px; align-items: baseline; padding-block: 6px; gap: var(--fds-space-3); }
.ss-editor-page .ss-facts dt { min-width: 0; color: var(--fds-text-secondary); }
.ss-editor-page .ss-facts dd { min-width: 0; font-weight: 500; overflow-wrap: anywhere; }
.ss-editor-page .ss-key-value { font-size: var(--ss-type-emphasis); font-weight: 600; }
.ss-editor-page .ss-summary-facts > div:nth-child(6) { margin-top: var(--fds-space-2); padding-top: var(--fds-space-3); border-top: 1px solid var(--fds-border); }
.ss-editor-page :is(.ss-prop-title, .ss-prop-name) { margin: 0; font-size: var(--ss-type-emphasis); line-height: 1.5; overflow-wrap: anywhere; }
.ss-editor-page :is(.ss-prop-name, .ss-prop-title b) { font-weight: 600; }
.ss-editor-page .ss-prop-title > span { font-size: var(--ss-type-body); color: var(--fds-text-secondary); }
.ss-editor-page .ss-showcase-heading { display: grid; gap: var(--fds-space-1); }
.ss-editor-page .ss-showcase-heading p { margin: 0; }
.ss-editor-page .ss-showcase-heading .ss-prop-title { font-size: var(--ss-type-note); }
.ss-editor-page .ss-showcase-heading .ss-prop-title b { font-weight: 500; }
.ss-editor-page .ss-field { min-width: 0; gap: 6px; }
.ss-editor-page .ss-field > :is(label, span) { font-size: var(--ss-type-body); font-weight: 400; }
.ss-editor-page :is(.fds-input, .fds-select) {
  height: var(--ss-input-height);
  min-width: 0;
  font-size: var(--ss-type-body);
  border-radius: var(--fds-radius-sm);
  padding-inline: 10px;
}
.ss-editor-page .ss-unit-suffix { min-width: 0; flex-shrink: 0; }
.ss-editor-page .ss-field-error { font-size: var(--ss-type-note); line-height: 1.5; }
.ss-editor-page .fds-btn {
  min-height: var(--ss-control-height);
  height: auto;
  padding: 4px 12px;
  font-size: var(--ss-type-body);
  line-height: 1.5;
  font-weight: 500;
}
.ss-editor-page .ss-inline { flex-wrap: wrap; }
.ss-editor-page .ss-inline > .fds-select { flex: 1 1 100px; }
.ss-editor-page .ss-variant-head { font-size: var(--ss-type-body); }
.ss-editor-page :is(.ss-add-case, .ss-add-run) > summary { padding: 6px 12px; min-height: var(--ss-input-height); }
.ss-editor-page .ss-diag-head { flex-wrap: wrap; row-gap: var(--fds-space-1); }
.ss-editor-page :is(.ss-diag p, .ss-diag-empty, .ss-notice) { font-size: var(--ss-type-body); line-height: 1.6; }
.ss-editor-page .ss-diag p { color: var(--fds-text-secondary); }
.ss-editor-page .ss-diag-head code { overflow-wrap: anywhere; font-size: var(--ss-type-note); }
.ss-editor-page :is(.fds-badge, .ss-check) { font-size: var(--ss-type-note); }
.ss-editor-page .ss-editor-right :is(.ss-diag, .ss-diag-empty) { padding-inline: 0; }
.ss-editor-page .ss-view-action { font-size: var(--ss-type-note); }
.ss-editor-page :is(.ss-case-group > summary, .ss-add-case > summary, .ss-add-run > summary, .ss-list-item, .fds-btn, .fds-input, .fds-select):focus-visible {
  outline: 2px solid var(--fds-blue-600);
  outline-offset: 2px;
}
@media (pointer: coarse) {
  .ss-editor-page { --ss-control-height: 44px; --ss-input-height: 44px; }
  .ss-editor-page :is(.ss-view-action, .ss-step, .ss-tab, .ss-toolbar .fds-segmented button) { min-height: 44px; }
  .ss-editor-page :is(.ss-case-group > summary, .ss-view-help > summary, .ss-snap-control > label) { min-height: 44px; }
  .ss-editor-page .ss-3d-material .fds-select { min-height: 44px; height: 44px; }
  .ss-editor-page .ss-snap-help summary { width: 44px; height: 44px; }
}

/* FDS extension: independent placement and form choices for adding a case. */
.ss-editor-page .ss-showcase-picker { gap: 8px; }
.ss-add-label { font-size: var(--ss-type-note); color: var(--fds-text-secondary); }
.ss-showcase-picker p { margin: 0; overflow-wrap: anywhere; }
.ss-editor-page .ss-case-choice { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.ss-editor-page .ss-case-choice .fds-btn { padding-inline: 8px; }
.ss-case-forms { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.ss-case-footprints { grid-template-columns: repeat(auto-fit, minmax(64px, 1fr)); }
.ss-case-form-option { min-width: 0; display: grid; gap: 6px; align-content: start; }
.ss-case-form-option .fds-btn { width: 100%; }
.ss-case-form-option .fds-btn[aria-pressed="true"]:not(:disabled) { border-color: var(--fds-blue-600); background: var(--fds-blue-50); color: var(--fds-text-primary); }
.ss-case-form-option .fds-btn:disabled { color: var(--fds-text-muted); background: var(--fds-bg-muted); opacity: 1; }
.ss-case-form-option .fds-meta { font-size: var(--ss-type-note); }
.ss-case-tools { flex-shrink: 0; padding-bottom: 16px; border-bottom: 1px solid var(--fds-border); }
.ss-editor-page .ss-case-item { justify-content: flex-start; }
.ss-case-copy { flex: 1; }
.ss-case-ordinal { min-width: 3ch; flex-shrink: 0; text-align: center; align-self: flex-start; line-height: 24px; font-size: var(--ss-type-note); font-variant-numeric: tabular-nums; color: var(--fds-text-secondary); background: var(--fds-bg-muted); border-radius: var(--fds-radius-sm); }
.ss-case-item[aria-pressed="true"] .ss-case-ordinal { color: var(--fds-blue-600); background: var(--fds-blue-50); }
@media (min-width: 1024px) {
  /* Override the generic step-panel grid with an explicit vertical rail. */
  .ss-editor-page .ss-step-panel > div > .ss-case-editor { display: flex; flex-direction: column; }
  .ss-case-editor > :is(.ss-section-title, .ss-case-footer) { flex-shrink: 0; }
  /* Expanded form and directory share one scroll area, without nested clipping. */
  .ss-case-editor:has(:is(.ss-add-case, .ss-add-run)[open]) { overflow-y: auto; }
  .ss-case-editor:has(:is(.ss-add-case, .ss-add-run)[open]) .ss-case-directory { flex: 0 0 auto; overflow: visible; }
}

/* FDS extension: single-cabinet placement controls and transient 2D preview. */
.ss-add-dimensions { display: grid; grid-template-columns: 1fr; gap: 8px; }
.ss-add-dimensions .ss-field { display: grid; grid-template-columns: 3em minmax(0, 1fr); align-items: center; gap: 8px; }
.ss-add-failure { display: grid; gap: 8px; font-size: var(--ss-type-note); }
.ss-add-failure ul { margin: 0; padding-left: 18px; overflow-wrap: anywhere; }
.ss-placement-panel { position: absolute; z-index: 5; bottom: 12px; left: 12px; right: 12px; max-height: 42%; overflow: auto; padding: 12px; border: 1px solid var(--fds-border); border-radius: var(--fds-radius-md); background: var(--fds-bg-panel); box-shadow: var(--fds-shadow-1); font-size: var(--ss-type-note); }
.ss-placement-panel p { margin: 0 0 8px; }
.ss-placement-ghost { stroke-width: 2px; vector-effect: non-scaling-stroke; fill-opacity: .2; stroke-dasharray: 6 4; }
.ss-placement-ghost.is-checking { fill: var(--fds-gray-400); stroke: var(--fds-text-secondary); }
.ss-placement-ghost.is-valid { fill: var(--fds-blue-50); stroke: var(--fds-blue-600); }
.ss-placement-ghost.is-invalid { fill: var(--fds-red-50); stroke: var(--fds-red-700); }

/* FDS extension: one capsule for every floating and toolbar control (owner review 2026-10-03).
   The unit pill is the reference: 36px tall (44px on touch), pill radius, hairline border,
   12px text. The toolbar's view switch and lighting presets, undo/redo, the snap and labels
   switches and the stage's floating capsules (title, options, camera actions) all follow it. */
.ss-editor-page { --ss-capsule-height: 36px; --ss-capsule-inner: 28px; --ss-float-height: var(--ss-capsule-height); }
@media (pointer: coarse) { .ss-editor-page { --ss-capsule-height: 44px; --ss-capsule-inner: 36px; } }
.ss-editor-page .ss-toolbar .fds-segmented {
  box-sizing: border-box; height: var(--ss-capsule-height); padding: 3px; gap: 2px; align-items: center;
  border: 1px solid var(--fds-border); background: var(--fds-bg-muted);
}
.ss-editor-page .ss-toolbar .fds-segmented button {
  box-sizing: border-box; min-height: 0; height: var(--ss-capsule-inner); padding: 0 12px;
  font-size: var(--ss-type-note); line-height: 1;
}
.ss-editor-page .ss-toolbar :is(#undo-button, #redo-button) {
  box-sizing: border-box; min-height: 0; height: var(--ss-capsule-height); padding: 0 12px;
  border: 1px solid var(--fds-border); border-radius: var(--fds-radius-pill); background: var(--fds-bg-panel);
  color: var(--fds-text-primary); font-size: var(--ss-type-note); font-weight: 400;
}
.ss-editor-page .ss-toolbar :is(#undo-button, #redo-button):hover:not(:disabled) { border-color: var(--fds-text-primary); }
.ss-editor-page .ss-toolbar :is(#undo-button, #redo-button):disabled { color: var(--fds-text-muted); background: var(--fds-bg-panel); }
.ss-editor-page .ss-toolbar .ss-snap-control { box-sizing: border-box; min-height: var(--ss-capsule-height); padding-block: 0; font-size: var(--ss-type-note); }
.ss-editor-page .ss-toolbar .ss-snap-control > label { min-height: 0; }
.ss-editor-page .ss-unit-current { box-sizing: border-box; min-height: var(--ss-capsule-height); height: var(--ss-capsule-height); }
.ss-editor-page .ss-stage-head > div, .ss-editor-page .ss-3d-material, .ss-editor-page .ss-3d-corner { font-size: var(--ss-type-note); }
.ss-editor-page .ss-stage-viewport :is(.ss-3d-corner, .ss-view-actions) .ss-view-action { min-height: var(--ss-capsule-inner); }
.ss-editor-page .ss-3d-material .fds-select { min-height: var(--ss-capsule-inner); height: var(--ss-capsule-inner); }
.ss-editor-page .ss-3d-foot .ss-3d-corner .ss-view-help > summary { width: var(--ss-capsule-inner); height: var(--ss-capsule-inner); min-height: var(--ss-capsule-inner); }

/* FDS extension: customer corner controls share the settings capsule dimensions. */
.ss-editor-page[data-view="walk"] .ss-3d-corner { height: var(--ss-capsule-height); min-height: var(--ss-capsule-height); }
.ss-editor-page[data-view="walk"] .ss-customer-actions .fds-btn,
.ss-editor-page[data-view="walk"] .ss-customer-zoom button {
  box-sizing: border-box; height: var(--ss-capsule-inner); min-height: var(--ss-capsule-inner);
  padding: 0 10px; border-radius: var(--fds-radius-pill); font-size: var(--ss-type-note); line-height: 1;
}
.ss-editor-page[data-view="walk"] .ss-customer-zoom button { width: var(--ss-capsule-inner); padding: 0; font-size: 18px; }
.ss-editor-page[data-view="walk"] .ss-customer-zoom output { font-size: var(--ss-type-note); }

/* FDS extension: group placement footprints retain screen-sized ghost outlines. */
g.ss-placement-ghost > polygon { vector-effect: non-scaling-stroke; }

/* FDS extension: local editing mode and drag feedback inside the single-case canvas. */
.ss-display-move-tools { position:absolute; top:calc(var(--ss-float-height,36px) + 24px); right:var(--fds-space-3,12px); flex-direction:column; z-index:4; display:flex; align-items:flex-end; gap:var(--fds-space-2,8px); max-width:calc(100% - 24px); pointer-events:none; }
.ss-display-move-tools[hidden] { display:none; }
.ss-display-move-tools button { pointer-events:auto; white-space:nowrap; min-height:44px; }
.ss-display-move-tools button[aria-pressed="true"] { background:var(--fds-text-primary); color:var(--fds-bg-panel); }
.ss-display-move-feedback { padding:8px 10px; border-radius:var(--fds-radius-md,8px); background:var(--fds-bg-panel); max-width:320px; }
.ss-display-move-feedback:empty { display:none; }
.ss-single-case-host[data-display-move="on"] canvas { cursor:grab; }
.ss-single-case-host[data-display-dragging] canvas { cursor:grabbing; }
@media(max-width:767px) { .ss-display-move-tools { top:calc(2 * var(--ss-float-height,44px) + 24px); flex-wrap:wrap; } .ss-display-move-feedback { max-width:100%; font-size:12px; } }

.ss-editor-page .ss-single-case-host[data-display-move="on"] :is(.ss-single-case-map,.ss-3d-foot) { display:none; }