:root{--layer-width:440px}
main{position:relative;grid-template-columns:var(--layer-width) minmax(0,1fr)}
#partList .layer-row,.layer-columns{display:grid;grid-template-columns:minmax(110px,1fr) 28px 42px 90px;gap:3px;padding:2px 5px;align-items:center}
#partList .layer-label{display:flex;align-items:center;min-width:0;padding-left:calc(var(--depth)*26px)}
#partList .layer-row .layer-expand{width:18px;flex:none}
#partList .layer-row .layer-name{font-size:12px;flex:1;white-space:nowrap;min-width:0}
#partList .layer-row .layer-count{width:28px;min-width:28px;text-align:right}
#partList .layer-row .layer-state{width:42px;min-width:42px;margin:0;font-size:10px;text-align:center}
#partList .layer-modes{display:grid;grid-template-columns:repeat(3,30px);gap:0;width:90px}
#partList .layer-row .layer-modes button{width:28px!important;min-height:30px;margin:0 1px}
.layer-columns{position:sticky;top:0;z-index:2;background:#102b3b;border-bottom:1px solid #33576d;font-size:10px;color:#a8c7d9;min-height:31px;padding-left:6px;padding-right:6px}.layer-columns>span:nth-child(2){text-align:right}.layer-columns>span:nth-child(3){text-align:center}.layer-columns .column-modes{display:grid;grid-template-columns:repeat(3,30px);text-align:center;font-size:9px}
#panelResize{position:absolute;top:16px;bottom:0;width:11px;min-height:0;border:0;border-radius:5px;background:transparent;padding:0;cursor:col-resize;touch-action:none;z-index:5}#panelResize:before{content:'';position:absolute;top:36%;bottom:36%;left:4px;width:3px;background:#496b7e;border-radius:3px}#panelResize:hover:before,#panelResize:focus-visible:before{background:var(--cyan)}#panelResize:active{transform:none}.resizing-layers{cursor:col-resize;user-select:none}#panelResize[hidden],main>aside[hidden]{display:none!important}
main.layers-hidden{grid-template-columns:minmax(0,1fr)}main.layers-hidden>.stage{grid-column:1}
.selection-details[open]{max-height:290px}.selection-details .part-info #partDescription{display:block;font-size:12px;line-height:1.8;max-height:none;overflow:visible}.look-for{color:#9fc7d9;font-size:11px;line-height:1.7;padding-left:9px;border-left:2px solid #367e93;margin:8px 0}
#highlightNotice{position:absolute;top:205px;left:22px;right:20px;max-width:470px;padding:9px 12px;border:1px solid #aa6d3e;border-radius:7px;background:#392d20ed;color:#ffd0a5;font-size:11px;line-height:1.6;pointer-events:none}#highlightNotice[hidden]{display:none}.locate-actions{display:flex;gap:6px;margin:10px 0}.locate-actions button{flex:1;font-size:11px;min-height:34px;padding:5px 8px}#locateToggle{border-color:#ac7648;color:#ffcb9a;background:#5a361f}#locateToggle[aria-pressed=false]{background:#112737;color:#d8eaf6;border-color:var(--line)}
#classification ul{margin-left:20px;padding-left:28px;border-left:1px solid #335166}#classification li{padding-left:8px;margin:6px 0}#classification h3{padding-left:6px}
@media(min-width:1450px){#highlightNotice{top:135px;left:22px}}
@media(max-width:1100px){main{grid-template-columns:var(--layer-width) minmax(0,1fr)}.stage h1{font-size:19px}.viewbar{flex-wrap:wrap;right:12px}.view-note{top:205px}#highlightNotice{top:237px}.layer-legend{gap:8px;font-size:9px}.stage .toolbox{flex-wrap:wrap}.stage .canvas-bottom{right:10px}}
@media(max-width:850px){main{grid-template-columns:var(--layer-width) minmax(0,1fr)}#highlightNotice{top:260px}.selection-details[open]{max-height:250px}}
@media(max-width:650px){main{grid-template-columns:minmax(0,1fr)}#panelResize{display:none}main.layers-hidden{grid-template-rows:460px}main.layers-hidden>.stage{grid-row:1}.selection-details[open]{max-height:220px}.view-note{top:172px}#highlightNotice{top:211px;left:15px;font-size:10px}.layer-columns{font-size:9px}}
.selection-details[open]{max-height:250px}

/* v147: explanation is outside the layer panel; window controls stay in its title bar. */
.window-controls{display:flex;gap:3px}.window-controls button{width:29px;padding:0!important;font-size:18px!important;color:#b8cbd8!important}.window-controls #panelToggle:hover{background:#903d4b;color:white!important}
body>.selection-details{margin:12px 18px 0;border:1px solid var(--line);border-radius:10px;background:#102330;max-height:none!important}
body>.selection-details>summary{padding:10px 16px;display:flex;gap:14px;align-items:center}body>.selection-details .part-info{display:grid;grid-template-columns:minmax(200px,1fr) minmax(200px,1fr) 220px;gap:8px 20px;padding:4px 16px 14px}body>.selection-details .part-info p{margin:0}body>.selection-details .part-meta{grid-column:1/3}body>.selection-details .locate-actions{margin:0}body>.selection-details .part-info button{min-height:32px}body>.selection-details .two-buttons{grid-column:3}body>.selection-details #focus{grid-column:3;grid-row:2}
#panelReopen{position:absolute;left:12px;top:12px;z-index:6;width:34px;height:34px;font-size:22px;background:#173448}#panelReopen[hidden]{display:none}main.layers-hidden .stage-heading{left:58px}
@media(max-width:850px){body>.selection-details .part-info{display:flex;flex-direction:column}.window-controls{gap:1px}}

/* Space below the last line, including embedded browser bottom chrome. */
body{padding-bottom:max(150px,env(safe-area-inset-bottom));scroll-padding-bottom:100px}.playback{height:auto!important;min-height:140px;overflow:visible;flex-shrink:0}#chapters{padding-bottom:16px;min-height:40px;flex-wrap:wrap}#chapters button{white-space:normal;line-height:1.6;height:auto}#soilToggle[aria-pressed=true]{border-color:#ca9861;color:#ffd5a0}#soilNotice{position:absolute;top:175px;left:22px;right:22px;padding:8px 12px;background:#392d20ed;color:#ffd0a5;font-size:11px;border-radius:6px;pointer-events:none}#soilNotice[hidden]{display:none}@media(max-width:1100px){#soilNotice{top:260px}.viewbar{max-width:calc(100% - 24px)}}

/* v149: text and controls have their own layout, outside the render rectangle. */
main>.stage{display:flex;flex-direction:column;min-height:580px!important}.viewer-header{flex:none;padding:14px 18px;display:flex;gap:12px;flex-wrap:wrap;justify-content:space-between;align-items:center;background:#0c202ed9}.viewer-header .stage-heading,.viewer-header .viewbar{position:static!important;max-width:none!important}.viewer-header .stage-heading h1{font-size:17px;margin:4px 0}.viewer-header #chapterNumber{font-size:23px}.viewer-header .status{font-size:10px}.viewer-header .eyebrow{font-size:10px}.viewer-header .viewbar{flex-wrap:wrap;gap:6px}.viewer-header .viewbar button{font-size:11px;padding:6px 9px}
.model-area{position:relative;flex:1;min-height:240px;overflow:hidden}.model-area #viewport{position:absolute;inset:0}.stage .canvas-bottom{position:static!important;flex:none;padding:8px 16px;background:#0c202e}.stage .canvas-bottom p{margin:5px 0}.stage .orientation{display:none}
.viewer-messages{margin:10px 18px 0;display:flex;flex-direction:column;gap:5px}.viewer-messages #soilNotice,.viewer-messages #highlightNotice,.viewer-messages #selectionTag,.viewer-messages .view-note,.viewer-messages #chamberNotice{position:static!important;max-width:none;pointer-events:auto;white-space:normal;padding:7px 12px;line-height:1.6;margin:0;border-radius:5px;font-size:11px;background:#102737;color:#b7cddc}.viewer-messages [hidden]{display:none!important}#toast{position:static;transform:none;max-width:none;margin:10px 18px;box-shadow:none}#chamberToggle[aria-pressed=true]{border-color:#c89660;color:#ffd6a0}main.layers-hidden .viewer-header{padding-left:54px}
@media(max-width:650px){main>.stage{height:640px!important}}

/* v152: size the viewer from the available browser window. */
body{padding-bottom:max(48px,env(safe-area-inset-bottom));min-height:100dvh;height:auto}
header{height:64px;min-height:64px;padding-inline:20px}
main{height:max(460px,calc(100dvh - 310px));min-height:460px;padding:12px 16px 0;gap:12px}
main>aside{height:100%;margin:0}main>.stage{height:100%!important;min-height:0!important}
.viewer-header{padding:10px 14px}.viewer-header .stage-heading h1{margin:2px 0}.stage .canvas-bottom{padding:7px 14px}
.model-area{min-height:220px}.playback{min-height:100px;margin-top:10px;padding:12px 20px;gap:16px}#chapters{padding-bottom:4px;min-height:28px}
.viewer-messages{margin:8px 16px 0}body>.selection-details{margin:8px 16px 0}body>.selection-details>summary{padding:8px 12px}
@media(min-width:2000px){main{height:calc(100dvh - 320px)}.viewer-header{padding:14px 20px}.viewer-header .stage-heading h1{font-size:20px}}
@media(max-width:900px){:root{--layer-width:340px}main{grid-template-columns:min(38vw,var(--layer-width)) minmax(0,1fr)}.layer-header{padding:10px 7px}.layer-titlebar h2{font-size:14px}.layer-legend{flex-wrap:wrap}.viewer-header{gap:6px}.viewer-header .viewbar{gap:4px}.playback{flex-direction:column;align-items:stretch}}
@media(max-width:700px){main{display:flex;flex-direction:column;height:auto;min-height:0;gap:10px;padding:10px}main>aside{height:340px;min-height:340px;flex:none}main>.stage{height:max(460px,calc(100dvh - 160px))!important;min-height:460px!important;flex:none}#panelResize{display:none}main.layers-hidden>.stage{height:max(460px,calc(100dvh - 230px))!important}.viewer-header{flex-direction:column;align-items:flex-start}.viewer-header .viewbar{width:100%}.model-area{min-height:240px}.stage .canvas-bottom p{font-size:10px}header{height:56px;min-height:56px}.viewer-messages,body>.selection-details{margin-inline:10px}}

/* v153: selected component name in the toolbar, never over the machine. */
.viewer-header{justify-content:flex-start;column-gap:20px}.viewer-header .stage-heading{flex:0 0 auto}.header-selection{flex:1 1 180px;min-width:140px;padding:6px 12px;border-left:2px solid #45ced7;display:flex;flex-direction:column;gap:5px;align-self:center}.header-selection>span{font-size:10px;color:#88b5c7;letter-spacing:.08em}.header-selection #partTitle{font-size:18px;line-height:1.4;color:#e9faff;white-space:normal;overflow-wrap:anywhere;font-weight:600}.viewer-header .viewbar{flex:0 1 auto;margin-left:auto}
@media(max-width:1100px){.header-selection{flex-basis:160px}.header-selection #partTitle{font-size:16px}.viewer-header .viewbar{margin-left:0}}
@media(max-width:700px){.header-selection{flex:0 0 auto;width:100%;min-width:0;box-sizing:border-box;padding:4px 10px}.header-selection #partTitle{font-size:16px}.viewer-header{align-items:stretch}}

/* v154: a distinct two-line selection card. */
.viewer-header .header-selection{display:grid!important;grid-template-columns:minmax(0,1fr);grid-template-rows:auto auto;align-content:center;gap:7px;flex:1 1 190px;min-width:160px;max-width:440px;padding:10px 16px;border:1px solid #315361;border-left:3px solid #54ced4;border-radius:8px;background:linear-gradient(110deg,#173642,#112a37);box-shadow:inset 0 1px 0 #ffffff05}
.viewer-header .header-selection>span{display:block;grid-row:1;color:#8eb4c3;font-size:10px;line-height:1.2;letter-spacing:.14em;font-weight:500}
.viewer-header .header-selection #partTitle{display:block;grid-row:2;font-size:19px;line-height:1.45;color:#f0fbff;font-weight:600;letter-spacing:.025em;margin:0;white-space:normal;overflow-wrap:anywhere}
@media(max-width:1100px){.viewer-header .header-selection{padding:8px 12px;gap:5px;flex-basis:170px}.viewer-header .header-selection #partTitle{font-size:17px}}
@media(max-width:700px){.viewer-header .header-selection{flex:0 0 auto;min-width:0;max-width:none;width:100%}}

/* v162: aligned checkbox column, independent multi-part visibility controls. */
#partList .layer-row,.layer-columns{grid-template-columns:22px minmax(90px,1fr) 24px 38px 90px}
.layer-check{appearance:auto!important;width:16px!important;height:16px!important;margin:0!important;accent-color:#54ced4;cursor:pointer;justify-self:center}
.layer-batch{border:1px solid #315361;border-radius:7px;margin:8px 0;padding:7px;background:#102632}
.batch-caption,.batch-actions{display:flex;align-items:center;gap:6px}.batch-caption{justify-content:space-between;font-size:11px;margin-bottom:5px}
.layer-batch button{font-size:11px;padding:5px 7px;min-height:30px}.batch-actions button:first-child{flex:1}.layer-batch .current-only{margin-top:6px;width:100%}
.layer-batch button:disabled{opacity:.4;cursor:default}
#partList .layer-row,.layer-columns{grid-template-columns:22px minmax(90px,1fr) 28px 42px 90px}
.layer-columns>span:nth-child(2){text-align:left}.layer-columns>span:nth-child(3){text-align:right}.layer-columns>span:nth-child(4){text-align:center}
@media(max-width:650px){main:not(.layers-hidden){grid-template-rows:560px auto}main>aside{height:560px}}

/* Playback stays in the viewer header, outside the model canvas. */
.viewer-header{position:relative;padding-right:66px!important;min-height:62px}
.viewer-header .viewport-play{position:absolute;right:12px;top:12px;width:40px;height:40px;min-height:40px;padding:0;display:grid;place-items:center;border:1px solid #54ced4;border-radius:50%;background:#123e4b;color:#a7fbff;font-size:18px;line-height:1;cursor:pointer}
.viewer-header .viewport-play:hover{background:#1c5865;box-shadow:0 0 0 3px #54ced422}
.viewer-header .viewport-play:focus-visible{outline:2px solid #c1ffff;outline-offset:3px}
.viewer-header .viewport-play.playing{background:#256578;color:#fff}
.viewer-header .viewport-play:disabled{opacity:.4;cursor:wait}
@media(max-width:700px){.viewer-header .viewport-play{width:44px;height:44px}}

/* v164: view options above a compact playback strip. */
.viewer-header{padding-right:14px!important;align-items:flex-start}
.viewer-controls{display:flex;flex-direction:column;gap:9px;flex:0 1 380px;min-width:0;margin-left:auto;align-self:flex-start}
.viewer-header .viewer-controls .viewbar{margin:0;width:100%;justify-content:flex-end}
.viewer-transport{display:flex;align-items:center;gap:9px;width:100%;min-width:0}
.viewer-header .viewer-transport .viewport-play{position:static;width:32px;height:32px;min-height:32px;flex:0 0 32px;font-size:14px}
#viewportSeek{appearance:none;flex:1;min-width:50px;width:100%;height:6px;margin:10px 0;padding:0;border:0;border-radius:10px;background:linear-gradient(to right,#54ced4 var(--progress,0%),#365460 var(--progress,0%));accent-color:#54ced4;cursor:pointer}
#viewportSeek::-webkit-slider-thumb{appearance:none;width:12px;height:12px;border-radius:50%;background:#a7fbff}
#viewportSeek::-moz-range-thumb{width:12px;height:12px;border:0;border-radius:50%;background:#a7fbff}
#viewportTime{white-space:nowrap;font-size:10px;color:#a7cbd8;font-variant-numeric:tabular-nums}
@media(max-width:700px){.viewer-controls{flex:0 0 auto;width:100%;margin:0}.viewer-header .viewer-controls .viewbar{justify-content:flex-start}.viewer-header .viewer-transport .viewport-play{width:36px;height:36px;flex-basis:36px}}

#shellLabelForm{display:flex;flex-direction:column;gap:12px}#shellText{width:100%;padding:12px;border:1px solid #426170;border-radius:6px;background:#0d2634;color:#f0fbff;font:inherit}#shellInk{width:70px;height:38px;padding:3px;background:#0d2634;border:1px solid #426170}#shellLabelForm p{font-size:12px;line-height:1.7;color:#aac5cf}.shell-label-actions{display:flex;gap:10px}#shellLabelDialog{max-width:min(500px,calc(100vw - 28px))}

#shellSize{width:100%;accent-color:#54ced4}#shellSizeValue{float:right;font-variant-numeric:tabular-nums;color:#a7fbff}

.ink-swatches{display:flex;flex-wrap:wrap;gap:10px}.ink-swatches button{width:34px;height:34px;min-height:34px;padding:0;border:2px solid #71808b;border-radius:50%;background:var(--ink);position:relative}.ink-swatches button[aria-pressed=true]{outline:2px solid #71eff2;outline-offset:3px}.ink-swatches button[aria-pressed=true]:after{content:'✓';position:absolute;inset:0;display:grid;place-items:center;color:white;text-shadow:0 1px 3px black,0 0 3px black}.ink-rgb{display:flex;gap:10px}.ink-rgb label{flex:1;min-width:0;display:flex;align-items:center;gap:6px}.ink-rgb input{width:100%;min-width:0;background:#0d2634;color:white;border:1px solid #426170;border-radius:5px;padding:8px}#shellLabelForm small{color:#aac5cf;font-size:11px}

/* v169: header has its own space; only rows scroll, so they cannot overlap. */
#partList{display:flex;flex-direction:column;overflow:hidden;padding:0;min-height:0}
.layer-heading-scroll{flex:none;overflow-y:hidden;scrollbar-gutter:stable;padding:0 5px;background:#102b3b;border-bottom:1px solid #33576d}
.layer-rows-scroll{flex:1;min-height:0;overflow:auto;scrollbar-gutter:stable;scrollbar-width:thin;scrollbar-color:#3d5c71 transparent;padding:0 5px 6px}
.layer-heading-scroll{scrollbar-width:thin}
#partList .layer-columns{position:static;min-height:34px;padding:2px 5px;border:1px solid transparent;border-radius:0}

/* Centered vector icon: no font bearings or inherited text padding. */
.window-controls button{display:grid;place-items:center;flex-shrink:0;line-height:1}
#classificationOpen svg{display:block;width:18px;height:18px;fill:currentColor;overflow:visible}
#classificationOpen svg path{fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round}
#viewport canvas{touch-action:none;user-select:none;-webkit-user-select:none}
