/* ExpresOS — shared SVG scenes. Touch capture belongs only to a viewport. */
.nb-view-switch, .nb-iso { min-width: 0; width: 100%; position: relative; }
.nb-view-switch { display: flex; flex-direction: column; height: 100%; min-height: 0; }
.nb-view-toolbar { display: flex; flex: 0 0 auto; align-items: stretch; gap: 4px; padding: 4px; }
.nb-view-toolbar > button { min-width: 48px; min-height: 48px; flex: 1 1 auto; padding: 6px 8px; font-size: 16px; line-height: 1.2; white-space: nowrap; overflow-wrap: normal; word-break: normal; }
.nb-view-toolbar > button[data-view='fullscreen'] { white-space: normal; }
.nb-view-toolbar > button[aria-pressed="true"] { background: var(--accent); color: var(--on-accent, #fff); font-weight: 700; }
.nb-view-stage { flex: 1 0 340px; min-height: 340px; height: clamp(340px, 54dvh, 560px); min-width: 0; width: 100%; overflow: hidden; position: relative; }
.nb-iso-svg { display: block; width: 100%; height: 100%; min-height: 180px; touch-action: none; user-select: none; -webkit-user-select: none; }
.nb-view-stage.nb-iso > .nb-iso-svg { min-height: 0; height: 100%; }
.nb-view-stage.nb-drawing { display: flex; flex-direction: column; }
.nb-view-stage.nb-drawing > .nb-drawing-stage { flex: 1 1 auto; height: auto; min-height: 0; }
.nb-view-stage.nb-drawing > :not(.nb-drawing-stage) { display: none; }
.nb-view-stage.nb-drawing > .nb-background-controls { display: flex; flex: 0 0 auto; }
.nb-view-stage.nb-drawing .nb-drawing-svg { height: 100% !important; max-height: 100%; }
.nb-drawing-stage { touch-action: none; overflow: hidden; }
.nb-dimension-label, .nb-side-label, .nb-iso-dimension text, .nb-record-dimension text { font-size: 18px; font-weight: 600; paint-order: stroke fill; stroke: var(--panel-solid, #fff); stroke-width: 4px; stroke-linejoin: round; }
[data-dimension][role="button"] { cursor: pointer; outline: none; }
[data-dimension]:focus-visible { outline: 3px solid var(--accent); outline-offset: 2px; }
[data-dimension].is-active { color: var(--accent); }
[data-dimension].is-active .nb-dimension-label, [data-dimension].is-active text { font-weight: 800; fill: var(--accent); }
[data-dimension].is-active line:not(.nb-dimension-hit) { stroke: var(--accent); stroke-width: 5px; }
[data-dimension].is-active .nb-iso-dimension-line { stroke: var(--accent); stroke-width: 4px; }
[data-dimension].is-invalid text { fill: var(--danger); }
.nb-iso-dimension.is-invalid { color: var(--danger, #c62435); }
.nb-iso-dimension.is-invalid .nb-iso-dimension-line { stroke: var(--danger, #c62435); }
.nb-iso-dimension.is-valid { color: var(--success, #208245); }
.nb-iso-dimension.is-valid .nb-iso-dimension-line, .nb-iso-dimension.is-valid text { stroke: var(--success, #208245); }
.nb-iso-dimension.is-valid text { fill: var(--success, #208245); stroke: var(--panel-solid, #fff); }
.nb-iso-solids .is-assumed, .nb-iso-solids [data-assumed="true"] { stroke-dasharray: 6 4; }
.nb-label-overlay { position: absolute; inset: 0; pointer-events: none; overflow: hidden; }
.nb-label-overlay button { position: absolute; pointer-events: auto; min-width: 48px; min-height: 48px; font-family: inherit; font-size: 18px; font-weight: 600; line-height: 1.2; border: 1px solid var(--border); border-radius: 6px; color: var(--text); background: var(--panel-solid); transform: translate(-50%, -50%); }
.nb-label-overlay button.is-active { border: 3px solid var(--accent); }
.nb-label-overlay button.is-assumed { border-style: dashed; }
.nb-scene-fullscreen, .nb-fullscreen-dialog { width: 100dvw; max-width: 100dvw; height: 100dvh; max-height: 100dvh; margin: 0; padding: max(6px, env(safe-area-inset-top)) max(6px, env(safe-area-inset-right)) max(6px, env(safe-area-inset-bottom)) max(6px, env(safe-area-inset-left)); box-sizing: border-box; border: 0; background: var(--panel-solid, #fff); color: var(--text, #111); }
.nb-scene-fullscreen::backdrop, .nb-fullscreen-dialog::backdrop { background: #0009; }
.nb-fullscreen-dialog[open] { display: flex; flex-direction: column; }
.nb-fullscreen-fallback { position: fixed; inset: 0; z-index: 10000; display: flex; flex-direction: column; }
.nb-fullscreen-close { min-width: 48px; min-height: 48px; align-self: flex-end; font-size: 16px; }
.nb-fullscreen-body { flex: 1 1 auto; min-height: 0; overflow: auto; }
.nb-fullscreen-body .nb-view-stage, .nb-fullscreen-body .nb-iso { height: 100%; }
.nb-view-message { margin: 4px 8px; font-size: 16px; }
.nb-three { position: relative; width: 100%; height: 100%; min-width: 0; min-height: 0; overflow: hidden; }
/* The 3D canvas is absolutely positioned and gives the stage no height of its own: without a floor the flex stage collapses to 0 px. */
.nb-view-stage.nb-three, .nb-view-stage:has(> .nb-three-canvas) { min-height: 340px; }
.nb-fullscreen-body .nb-view-stage.nb-three, .nb-fullscreen-body .nb-view-stage:has(> .nb-three-canvas) { min-height: 280px; }
.nb-three-canvas, .nb-three-dimensions { position: absolute; inset: 0; display: block; width: 100%; height: 100%; }
.nb-three-canvas { touch-action: none; user-select: none; -webkit-user-select: none; }
.nb-three-dimensions { pointer-events: none; color: var(--text, #152333); }
.nb-three-dimensions line, .nb-three-dimensions path { stroke: currentColor; }
.nb-three-dimensions .is-active { stroke: var(--accent, #145ea8); }
.nb-three-dimensions .is-invalid { stroke: var(--danger, #b42335); }
.nb-three-dimensions .is-valid { stroke: var(--success, #208245); }
.nb-three .nb-label-button.is-invalid { border-color: var(--danger, #b42335); color: var(--danger, #b42335); }
.nb-three .nb-label-button.is-valid { border-color: var(--success, #208245); color: var(--success, #208245); }
.nb-view-stage[aria-busy="true"] { cursor: progress; }
.nb-background-controls { display: flex; gap: 8px; align-items: center; font-size: 16px; }
.nb-background-controls input { min-height: 48px; min-width: 0; flex: 1; }
.nb-drawing-nudges { display: flex; gap: 4px; }
.nb-drawing-nudges button { min-height: 48px; flex: 1; font-size: 16px; }
.nb-sun .nb-view-toolbar > button, .nb-sun .nb-label-overlay button, .nb-sun .nb-fullscreen-close, [data-sun="true"] .nb-view-toolbar > button { min-height: 56px; min-width: 56px; font-size: 18px; font-weight: 700; }
.nb-sun .nb-label-overlay button { min-height: 56px !important; min-width: 56px !important; }
.nb-sun .nb-dimension-label, .nb-sun .nb-record-dimension text { font-weight: 700; stroke-width: 5px; }
@media (prefers-reduced-motion: reduce) { .nb-view-switch *, .nb-label-overlay * { animation: none !important; transition: none !important; } }
@media print { .nb-view-toolbar, .nb-fullscreen-close, .nb-background-controls { display: none; } .nb-iso-svg { min-height: 0; } }

/* The dimensions occupy their own column; the drawing always keeps its own viewport. */
.nb-view-workspace { display: flex; flex-direction: column; flex: 1 0 auto; min-width: 0; min-height: 0; width: 100%; }
.nb-element-panel { min-width: 0; flex: 0 0 auto; color: var(--text, #152333); background: var(--panel-solid, #fff); }
.nb-sheet-open .nb-view-workspace:not(.is-fullscreen) > .nb-element-panel { display: none; }
.nb-element-details { min-width: 0; }
.nb-element-details > summary { box-sizing: border-box; min-height: 48px; padding: 12px; font-size: 18px; font-weight: 700; cursor: pointer; border-bottom: 1px solid var(--border, #bbb); }
.nb-element-content { padding: 4px 8px 8px; overflow: auto; max-height: min(46dvh, 360px); }
.nb-element-table { width: 100%; border-collapse: collapse; table-layout: fixed; font-size: 16px; }
.nb-element-caption { padding: 8px 2px; text-align: left; font-size: 13px; color: var(--muted, #5c6570); }
.nb-element-table tbody, .nb-element-table tr { display: block; width: 100%; }
.nb-element-table tr { border-bottom: 1px solid var(--border, #bbb); }
.nb-element-table th, .nb-element-table td { display: block; box-sizing: border-box; width: 100%; padding: 0; text-align: left; }
.nb-element-table tr.is-selected { background: var(--accent-soft, #e1effb); box-shadow: inset 3px 0 var(--accent, #145ea8); }
.nb-element-select { display: block; width: 100%; min-height: 48px; padding: 8px; border: 0; background: transparent; color: inherit; text-align: left; font: inherit; font-weight: 700; cursor: pointer; overflow-wrap: anywhere; }
.nb-element-select[aria-pressed="true"] { color: var(--accent, #145ea8); }
.nb-element-pair { display: flex; align-items: flex-start; gap: 3px; padding: 0 6px 8px; }
.nb-element-value { display: inline-flex; flex-direction: column; align-items: flex-start; min-width: 0; flex: 1 1 0; }
.nb-element-edit, .nb-element-number { display: inline-flex; align-items: center; justify-content: center; min-height: 48px; max-width: 100%; box-sizing: border-box; padding: 4px; font: inherit; font-weight: 700; font-variant-numeric: tabular-nums; }
.nb-element-edit { min-width: 48px; border: 1px solid var(--border, #bbb); border-radius: 5px; color: var(--accent, #145ea8); background: var(--panel-solid, #fff); cursor: pointer; }
.nb-element-times, .nb-element-unit { line-height: 48px; flex: 0 0 auto; }
.nb-element-origin { font-size: 11px; line-height: 1.25; font-weight: 400; overflow-wrap: anywhere; color: var(--muted, #5c6570); padding: 2px; }
.nb-element-detail { display: flex; align-items: flex-start; gap: 5px; padding: 0 8px 8px; font-size: 13px; }
.nb-element-detail > :not(.nb-element-value) { line-height: 48px; }
.nb-element-detail .nb-element-value { flex: 0 1 auto; }
.nb-element-show-all { width: 100%; margin-top: 8px; min-height: 48px; }
.nb-element-panel button:focus-visible, .nb-element-details > summary:focus-visible, .nb-iso-solid[tabindex]:focus-visible { outline: 3px solid var(--accent, #145ea8); outline-offset: -3px; }
.nb-iso-solid.is-dimmed { opacity: .18; }
.nb-iso-solid.is-selected { stroke-width: 1.4; }
.nb-sun .nb-element-select, .nb-sun .nb-element-edit, .nb-sun .nb-element-number, .nb-sun .nb-element-show-all, .nb-sun .nb-element-details > summary { min-height: 56px; font-size: 18px; }
.nb-sun .nb-element-origin { font-size: 13px; color: var(--text, #111); }
.nb-fullscreen-body > .nb-view-workspace { height: 100%; }
/* A docked scene owns a fixed viewport. Renderer floors belong to standalone/fullscreen scenes. */
.nb-measuring-scene > .nb-view-switch { height: 100%; min-height: 0; overflow: hidden; }
.nb-measuring-scene .nb-view-workspace:not(.is-fullscreen) { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); grid-template-rows: minmax(0, 1fr) auto; flex: 1 1 0; min-height: 0; position: relative; overflow: hidden; }
.nb-measuring-scene .nb-view-workspace:not(.is-fullscreen) > .nb-view-stage { grid-row: 1; grid-column: 1 / -1; height: 100%; min-height: 0; max-height: 100%; }
.nb-measuring-scene .nb-view-workspace:not(.is-fullscreen) > .nb-element-panel { grid-row: 2; grid-column: 1; }
.nb-measuring-scene .nb-view-workspace:not(.is-fullscreen) > .nb-scene-legend-host { grid-row: 2; grid-column: 2; position: static; }
.nb-measuring-scene .nb-scene-legend { position: static; }
.nb-measuring-scene .nb-element-content, .nb-measuring-scene .nb-scene-legend-host .nb-scene-legend-list { position: absolute; inset-inline: 0; bottom: 48px; z-index: 5; max-height: calc(100% - 48px); overflow: auto; background: var(--panel-solid, #fff); }
.nb-measuring-scene .nb-view-message { flex: 0 1 auto; max-height: 48px; overflow: auto; }
.nb-sun .nb-measuring-scene .nb-element-content, .nb-sun .nb-measuring-scene .nb-scene-legend-host .nb-scene-legend-list { bottom: 56px; max-height: calc(100% - 56px); }
@media (min-width: 600px) {
  .nb-view-workspace.is-fullscreen { display: grid; grid-template-columns: 280px minmax(0, 1fr); gap: 8px; }
  .is-fullscreen > .nb-element-panel { overflow: auto; border-right: 1px solid var(--border, #bbb); }
  .is-fullscreen > .nb-element-panel .nb-element-details > summary { list-style: none; cursor: default; pointer-events: none; }
  .is-fullscreen > .nb-element-panel .nb-element-details > summary::-webkit-details-marker { display: none; }
  .is-fullscreen > .nb-element-panel .nb-element-content { max-height: none; overflow: visible; }
}
@media (max-width: 599px) {
  .is-fullscreen > .nb-element-panel .nb-element-content { max-height: 42dvh; }
}
@media print { .nb-element-panel { display: none; } }

.notebook, .pm-flow, .nb-view-switch, .nb-client-scene-legend {
  --nb-foam: #f4ce36; --nb-base-both: #72a18a; --nb-base-inside: #39a6a1;
  --nb-sill-in: #9b86c8; --nb-sill-out: #809ba6; --nb-vent: #327ec9;
  --nb-intake: #d48234; --nb-handle: #b65d91; --nb-screen: #4d9c73;
  --nb-old-frame: #858585; --nb-reveal: #bdab90; --nb-insulation: #f4dacf; --nb-roller: #909fa9;
}
:root[data-theme='dark'] .notebook, :root[data-theme='dark'] .nb-view-switch {
  --nb-foam: #ffe267; --nb-base-both: #90bca6; --nb-base-inside: #59c1ba;
  --nb-sill-in: #b39adf; --nb-sill-out: #9bb7c2; --nb-vent: #66a9ec;
  --nb-intake: #e9a455; --nb-handle: #dc8ab9; --nb-screen: #7aba9c;
  --nb-old-frame: #a2a2a2; --nb-reveal: #c9bba6; --nb-insulation: #f4dacf; --nb-roller: #b4c2cb;
}
:root .nb-sun, :root .nb-sun .nb-view-switch, :root [data-sun='true'] { --nb-foam: #ffdd00; --nb-base-both: #5a926f; --nb-base-inside: #008e88; --nb-old-frame: #666; --nb-insulation: #f0c6b3; --nb-roller: #718894; }
.nb-iso-solid[data-material='insulation'] { stroke: #976c5b; stroke-opacity: .9; }
.nb-iso-solid[data-material='cut'][data-solid='insulation'] { stroke: #976c5b; stroke-opacity: .9; }
.nb-sun .nb-iso-solid[data-solid='insulation'], [data-sun='true'] .nb-iso-solid[data-solid='insulation'] { stroke: #714c3d; stroke-width: 1.2; }
.nb-scene-legend-host { flex: 0 0 auto; min-width: 0; position: relative; color: var(--text, #172b3a); background: var(--panel-solid, #fff); }
.nb-scene-legend { min-width: 0; position: relative; }
.nb-scene-legend > summary { min-height: 48px; padding: 12px; box-sizing: border-box; cursor: pointer; font-size: 16px; font-weight: 650; }
.nb-scene-legend-list { list-style: none; display: grid; gap: 8px; margin: 0; padding: 12px; font-size: 14px; line-height: 1.4; }
.nb-scene-legend-list li { display: flex; align-items: center; gap: 10px; min-width: 0; }
.nb-scene-legend-list li > span { overflow-wrap: anywhere; }
.nb-legend-swatch { flex: 0 0 26px; filter: drop-shadow(0 0 .5px #172b3a); }
.nb-legend-illustration { width: 96px; height: 72px; flex: 0 0 96px; object-fit: cover; border-radius: 5px; margin-inline-start: auto; }
.is-fullscreen > .nb-view-stage { height: 100%; min-height: 280px; flex: 1 1 auto; }
@media (min-width: 900px) { .nb-view-stage { min-height: 440px; height: clamp(440px, 62dvh, 720px); } }
.nb-scene-legend-host .nb-scene-legend-list { position: absolute; bottom: 48px; inset-inline: 0; z-index: 5; max-height: 40dvh; overflow: auto; border: 1px solid var(--border-strong, #72838e); border-radius: 10px; background: var(--panel-solid, #fff); box-shadow: 0 4px 18px #0003; }
.nb-client-scene-legend { color: #172b3a; background: #fff; }
.nb-client-scene-legend summary { min-height: 48px; font-size: 16px; }
.nb-client-scene-legend .nb-scene-legend-list { font-size: 16px; }
.nb-element-note { display: block; margin: 0; padding: 0 8px 8px; font-size: 13px; line-height: 1.4; color: var(--muted, #526570); }
.nb-element-value.is-invalid .nb-element-number, .nb-element-value.is-invalid .nb-element-edit { color: var(--danger, #c62435); }
.nb-element-value.is-valid .nb-element-number { color: var(--success, #208245); }
.nb-sheet-open .nb-scene-legend-host { display: none; }
.nb-sun .nb-scene-legend > summary { min-height: 56px; font-size: 18px; }
.nb-sun .nb-scene-legend-list { font-size: 18px; }
.nb-sun .nb-scene-legend-host .nb-scene-legend-list { bottom: 56px; }
@media (min-width: 600px) {
  .nb-view-workspace.is-fullscreen > .nb-scene-legend-host { grid-column: 1 / -1; }
  .nb-view-workspace.is-fullscreen { grid-template-rows: minmax(0, 1fr) auto; }
}