:root{color-scheme:light;--bg:#f5f6f8;--surface:#fff;--stage:#f1f3f6;--field:#f6f7f9;--line:#e4e7ec;--text:#292e38;--muted:#7c8491;--accent:#5267c4;--accent-soft:#edf0fc;--accent-text:#465ab5;--model-shell:#ce7734;--model-drawer:#97bda8;--shell:#ce7734;--drawer:#97bda8;--grid-major:#c9d0d9;--grid-minor:#e0e5eb;--success:#679b85;--handle:#fff;--info:#f5f6fa}
:root[data-theme=dark]{color-scheme:dark;--bg:#171a20;--surface:#20242c;--stage:#1b1f27;--field:#272c35;--line:#343a45;--text:#e3e7ed;--muted:#939dac;--accent:#9aabf3;--accent-soft:#323b5b;--accent-text:#bdc9ff;--grid-major:#3c4655;--grid-minor:#2a3340;--success:#89bca6;--handle:#272c35;--info:#272c35}
:root[data-style=mono]{--accent:#303238;--accent-soft:#292c32;--accent-text:#fff;--bg:#f7f7f6;--stage:#f3f4f4;--line:#e6e7e7}
:root[data-style=mono][data-theme=dark]{--accent:#e2e4e8;--accent-soft:#e2e4e8;--accent-text:#252830;--bg:#17191c;--surface:#202226;--stage:#1b1e22;--field:#292c31;--line:#33373d}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font:13px/1.5 -apple-system,BlinkMacSystemFont,"PingFang SC","Segoe UI",sans-serif;-webkit-font-smoothing:antialiased}button,input,select{font:inherit;color:inherit}button{cursor:pointer}button,a,input,select{-webkit-tap-highlight-color:transparent}button{border:1px solid var(--line);background:var(--surface);border-radius:6px;transition:background .15s,border-color .15s}button:hover{border-color:var(--muted)}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--accent);outline-offset:3px}[hidden]{display:none!important}h1,h2,h3,p{margin:0}h2,h3{font-weight:500}svg{display:block;flex:none}header{height:64px;display:flex;align-items:center;gap:28px;padding:0 32px;border-bottom:1px solid var(--line);background:var(--surface)}.brand{display:flex;align-items:center;gap:10px;color:var(--text);text-decoration:none;font-size:17px;letter-spacing:-.4px}.brand svg{width:25px;height:28px}.thin{font-weight:400;color:var(--muted)}.project-path{display:flex;gap:12px;color:var(--muted);font-size:11px}.project-path strong{font-weight:400;color:var(--text)}.style-picker{margin-left:auto;display:flex;align-items:center;gap:10px;font-size:11px;color:var(--muted)}select{border:1px solid var(--line);background:var(--field);border-radius:6px;padding:7px 10px;font-size:11px}.theme-switch{display:flex;gap:3px;background:var(--field);padding:3px;border-radius:7px}.theme-switch button{border:0;background:transparent;color:var(--muted);padding:6px 9px;font-size:11px}.theme-switch button[aria-pressed=true]{background:var(--surface);color:var(--text)}.theme-switch span{margin-left:4px}
.workspace-title{max-width:1920px;margin:auto;padding:28px 32px;display:flex;justify-content:space-between;align-items:center}.eyebrow{font-size:9px;letter-spacing:1.8px;color:var(--muted);margin-bottom:7px}.workspace-title h1{display:flex;align-items:center;gap:12px;font-size:25px;line-height:1.4;font-weight:450;letter-spacing:.2px}.model-tag{font-size:10px;font-weight:400;letter-spacing:0;border:1px solid var(--line);padding:3px 7px;border-radius:4px;color:var(--muted)}.workspace-title p{font-size:12px;color:var(--muted);margin-top:8px}.local-badge{display:flex;align-items:center;gap:7px;font-size:10px;color:var(--muted)}.local-badge i,footer i{height:5px;width:5px;border-radius:50%;background:var(--success);display:inline-block}
main{display:grid;grid-template-columns:minmax(0,1fr) 296px;gap:24px;max-width:1920px;margin:auto;padding:0 32px 24px;align-items:start}.workspace{min-width:0}.stage{display:grid;grid-template-columns:208px minmax(0,1fr) 174px;grid-template-rows:68px 52px clamp(520px,calc(100vh - 300px),740px) 36px;gap:0 20px;padding:20px;background:var(--stage);border:1px solid var(--line);border-radius:12px;min-width:0;position:relative}.material-panel{grid-column:1;grid-row:1/5;background:var(--surface);border:1px solid var(--line);border-radius:9px;padding:20px 14px;min-height:0;display:flex;flex-direction:column}.material-title{display:flex;flex-direction:column;gap:16px;flex:none;margin-bottom:20px}.material-title h2{display:flex;justify-content:space-between;align-items:center;font-size:13px;font-weight:500}.material-title h2 span{font-size:10px;font-weight:400;color:var(--muted)}.material-families{display:flex;padding:3px;gap:3px;background:var(--field);border:1px solid var(--line);border-radius:6px}.material-families button{flex:1;padding:7px 2px;border:0;background:transparent;font-size:11px;color:var(--muted);white-space:nowrap}.material-families button[aria-pressed=true]{background:var(--surface);color:var(--text)}.material-actions{display:flex;align-items:center;justify-content:space-between;gap:4px}.material-target{display:flex;gap:3px}.material-target button{border:0;background:transparent;font-size:10px;padding:6px}.material-target button[aria-pressed=true]{background:var(--accent-soft);color:var(--accent-text)}.material-target button>span{display:none}.reset{border:0;background:transparent;color:var(--muted);font-size:11px;padding:4px;white-space:nowrap}.material-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px 4px;align-content:start;overflow:auto;min-height:0;scrollbar-width:thin;overscroll-behavior:contain}.material-swatch{border:1px solid transparent;display:flex;align-items:center;flex-direction:column;gap:7px;position:relative;background:transparent;padding:5px 0;touch-action:none;user-select:none;cursor:grab;min-width:0}.material-swatch:hover{background:var(--field);border-color:var(--line)}.material-swatch[aria-pressed=true]{border-color:var(--accent);background:var(--field)}.material-ball{display:block;width:28px;height:28px;border-radius:50%;background:radial-gradient(ellipse at 70% 24%,#ffffff8c,transparent 49%),radial-gradient(ellipse at 25% 78%,#0000003d,transparent 67%),var(--material-color);box-shadow:inset -1px -3px 6px #0002,0 3px 4px -3px #0005}.material-swatch[data-family=matte] .material-ball{background:radial-gradient(ellipse at 68% 25%,#ffffff4a,transparent 58%),radial-gradient(ellipse at 25% 78%,#00000022,transparent 67%),var(--material-color)}.material-swatch[data-material$="-01"] .material-ball{border:1px solid #aaa3}.color-name{font-size:10px;font-weight:400;line-height:1.5;color:var(--muted);white-space:nowrap}.material-swatch b{display:none;position:absolute;right:0;top:0;width:12px;height:12px;font-size:8px;font-weight:400;background:var(--accent);color:var(--surface);border-radius:50%}.material-swatch[aria-pressed=true] b{display:grid;place-items:center}.material-note{margin-top:20px;font-size:10px;line-height:1.8;color:var(--muted)}
.spec{grid-column:2/4;grid-row:1;display:grid;grid-template-columns:1.2fr 1.1fr .8fr;align-content:start;padding:5px 0 0;min-width:0}.spec>div{display:flex;flex-direction:column;gap:7px;padding:0 18px;min-width:0}.spec>div:first-child{padding-left:0}.spec>div+div{border-left:1px solid var(--line)}.spec span{font-size:10px;color:var(--muted)}.spec strong{font-size:13px;font-weight:400;white-space:nowrap;font-variant-numeric:tabular-nums}.stage-toolbar{grid-column:2/4;grid-row:2;display:flex;align-items:start;justify-content:space-between;gap:12px;z-index:2}.segmented{display:flex;gap:2px;background:var(--surface);border:1px solid var(--line);padding:3px;border-radius:7px}.segmented button{border:0;background:transparent;padding:6px 12px;font-size:11px;color:var(--muted)}.segmented button.active{background:var(--accent-soft);color:var(--accent-text)}.view-actions{display:flex;gap:6px}.subtle{display:flex;align-items:center;justify-content:center;width:32px;height:32px;background:var(--surface);color:var(--muted);padding:7px}.subtle span{display:none}.subtle[aria-pressed=true]{color:var(--text)}#viewport{grid-column:2;grid-row:3;position:relative;min-width:0;height:100%;touch-action:none}canvas{display:block;width:100%;height:100%}#loading{position:absolute;top:45%;width:100%;text-align:center;color:var(--muted);font-size:12px}#handles{position:absolute;inset:0;pointer-events:none}#handles button{position:absolute;transform:translate(-50%,-50%);pointer-events:auto;touch-action:none;display:flex;align-items:center;gap:5px;white-space:nowrap;padding:7px 10px;font-size:15px;background:var(--handle);color:var(--muted);cursor:ew-resize}#handles button span{font-size:10px}#handles button:nth-child(3){cursor:ns-resize}.measure-label{position:absolute;z-index:2;transform:translate(-50%,-50%);pointer-events:none;white-space:nowrap;font-size:10px;font-variant-numeric:tabular-nums;padding:4px 7px;border:1px solid var(--line);border-radius:4px;background:var(--surface);color:var(--muted)}
.assembly-floating{grid-column:3;grid-row:3;align-self:start;background:var(--surface);border:1px solid var(--line);border-radius:8px;padding:18px 12px;z-index:3}.compact-heading{font-size:13px;font-weight:500;margin-bottom:18px}.control-title{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:14px}.control-title h3{font-size:13px;font-weight:500}.assembly-floating>.control-title:first-of-type{display:block}.assembly-floating .control-title h3{font-size:11px;font-weight:400}.assembly-floating #countValue{display:block;font-size:10px;line-height:1.6;color:var(--muted);margin-top:6px}.set-controls{display:flex;gap:5px;margin:12px 0 18px}.set-controls button{flex:1;padding:7px 4px;font-size:11px}.set-controls button[aria-pressed=true],.count-controls button[aria-pressed=true],.assembly-controls button[aria-pressed=true]{background:var(--accent-soft);color:var(--accent-text);border-color:var(--accent-soft)}.layer-row{display:flex;align-items:center;justify-content:space-between;gap:6px;margin:13px 0}.layer-row>span{font-size:10px;color:var(--muted);white-space:nowrap}.count-controls{display:flex;gap:3px}.count-controls button{width:24px;height:28px;padding:0;font-size:11px}.rule{height:1px;background:var(--line);margin:20px 0}.rule+.rule{display:none}.assembly-controls{display:flex;gap:4px;margin-bottom:20px}.assembly-controls button{flex:1;padding:8px 2px;font-size:10px}.assembly-floating .control-title{margin-bottom:10px}.assembly-floating output{font-size:11px;color:var(--muted)}.range-labels{display:flex;justify-content:space-between;color:var(--muted);font-size:10px;margin-top:9px}.stage-footer{grid-column:2/4;grid-row:4;display:flex;align-items:end;gap:14px;pointer-events:none;color:var(--muted);font-size:10px}.part-legend{display:flex;gap:15px}.part-legend span{display:flex;align-items:center;gap:5px}.part-legend i{width:6px;height:6px;border-radius:50%;background:var(--shell)}.part-legend span+span i{background:var(--drawer)}.interaction-hint{margin-left:auto}.scale-tag{font-size:9px;border:1px solid var(--line);padding:1px 4px;border-radius:3px}
.main-settings{margin-top:20px;padding:20px;background:var(--surface);border:1px solid var(--line);border-radius:9px;min-width:0}.section-label{display:flex;align-items:center;justify-content:space-between;margin-bottom:26px}.section-label h3{font-size:13px;font-weight:500}.section-label small{font-size:10px;font-weight:400;color:var(--muted);margin-left:6px}#dimensions{display:flex;flex-direction:column;gap:22px}.dimension+.dimension{padding-top:22px;border-top:1px solid var(--line)}.dim-head{display:flex;justify-content:space-between;align-items:center;font-size:12px}.precision-note{font-size:10px;color:var(--muted)}.precision-control{display:grid;grid-template-columns:24px 30px minmax(40px,1fr) 30px 24px;gap:4px;align-items:center;margin:12px 0 16px}.precision-control button{font-size:10px;padding:6px 0;min-height:32px;color:var(--muted);background:transparent}.precision-control input{min-width:0;width:100%;text-align:center;font-size:22px;line-height:1.4;font-weight:400;font-variant-numeric:tabular-nums;background:var(--field);border:1px solid var(--line);border-radius:5px;padding:6px 2px}input[type=range]{display:block;width:100%;height:3px;accent-color:var(--accent);cursor:pointer;margin:10px 0}input[type=checkbox]{accent-color:var(--accent);margin:0}.dimension-options{display:flex;flex-direction:column;gap:16px;margin-top:24px}.lock{display:flex;align-items:center;gap:8px;font-size:11px;color:var(--muted)}.presets{display:flex;gap:5px}.presets button{font-size:10px;padding:6px 7px;color:var(--muted)}.presets button.active{background:var(--accent-soft);border-color:var(--accent-soft);color:var(--accent-text)}.export{margin-top:26px;padding-top:24px;border-top:1px solid var(--line)}.file-badge{font-size:9px;color:var(--muted);letter-spacing:.5px}.export-label{display:block;font-size:11px;color:var(--muted);margin:20px 0 9px}.parts-picker{position:relative;margin-bottom:16px}#parts-trigger{display:flex;align-items:center;justify-content:space-between;width:100%;padding:11px;font-size:12px;text-align:left;background:var(--field)}#parts-menu{position:absolute;bottom:calc(100% + 6px);left:0;right:0;padding:5px;background:var(--surface);border:1px solid var(--line);border-radius:7px;z-index:20;box-shadow:0 6px 24px #0001}#parts-menu button{display:flex;align-items:center;justify-content:space-between;width:100%;border:0;background:transparent;font-size:12px;padding:10px;text-align:left}#parts-menu button:hover{background:var(--field)}#parts-menu button[aria-pressed=true]::after{content:'✓'}.export-actions{display:flex;gap:8px}.export-actions button{flex:1;padding:12px 5px;font-size:12px;white-space:nowrap}.export-actions #mf{background:var(--accent-soft);color:var(--accent-text);border-color:var(--accent-soft)}.export>p{font-size:10px;color:var(--muted);line-height:1.9;margin-top:16px}#status{font-size:11px;color:var(--muted);line-height:1.8;margin-top:16px}#status:empty{margin:0}.canvas-note{font-size:10px;color:var(--muted);margin:16px 2px 7px;line-height:1.8}.mesh-info{font-size:9px;color:var(--muted);letter-spacing:.6px;margin-left:2px}footer{max-width:1920px;margin:0 auto;padding:8px 32px 24px;display:flex;justify-content:space-between;font-size:9px;color:var(--muted)}footer i{margin-right:6px}footer b{font-weight:400;margin:0 7px}
#drop-target{position:absolute;bottom:30px;left:50%;transform:translateX(-50%);z-index:4;color:var(--text);background:var(--surface);border:1px solid var(--line);padding:9px 13px;border-radius:6px;font-size:11px;white-space:nowrap;pointer-events:none}#color-ghost{position:fixed;z-index:1000;width:30px;height:30px;border-radius:50%;border:2px solid white;background:radial-gradient(circle at 70% 25%,#fff8,transparent 45%),var(--drag-color);transform:translate(-50%,-50%);pointer-events:none;box-shadow:0 3px 14px #0003}body.color-dragging{cursor:grabbing}
@media(max-width:1500px){main{grid-template-columns:minmax(0,1fr) 276px;gap:18px;padding:0 24px 24px}.workspace-title{padding:24px}.stage{grid-template-columns:184px minmax(0,1fr) 154px;gap:0 16px;padding:16px;grid-template-rows:68px 52px 610px 36px}.material-panel{padding:18px 11px}.material-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:13px 5px}.assembly-floating{padding:16px 10px}.count-controls button{width:21px}.main-settings{padding:18px 16px}.spec strong{font-size:12px}.spec>div{padding:0 12px}}
@media(max-width:1200px){.stage{grid-template-columns:166px minmax(0,1fr);grid-template-rows:68px 52px 500px auto 36px}.material-panel{grid-row:1/5}.spec,.stage-toolbar{grid-column:2}.spec{grid-template-columns:1fr 1fr;gap:10px}.spec>div:last-child{display:none}#viewport{grid-column:2;grid-row:3}.assembly-floating{grid-column:2;grid-row:4;display:grid;grid-template-columns:1fr 1fr;gap:12px 18px;padding:16px;margin-top:12px}.compact-heading{grid-column:1/-1;margin-bottom:0}.assembly-floating>.control-title{grid-column:1;margin:0}.assembly-floating .set-controls{grid-column:2;margin:0}.layer-row{margin:0}.assembly-floating .rule{display:none}.assembly-controls{grid-column:1/-1;margin:0}.assembly-floating #opening{margin:auto 0}.assembly-floating .range-labels{display:none}.stage-footer{grid-column:2;grid-row:5}.interaction-hint{display:none}.project-path{display:none}.style-picker{gap:6px}}
@media(max-width:950px){main{grid-template-columns:minmax(0,1fr) 254px;padding:0 16px 20px;gap:16px}.workspace-title{padding:24px 16px}.stage{grid-template-columns:minmax(0,1fr);grid-template-rows:64px 48px 440px auto auto 32px;padding:14px}.spec,.stage-toolbar,#viewport,.assembly-floating,.stage-footer,.material-panel{grid-column:1}.spec{grid-row:1;grid-template-columns:1fr 1fr 1fr}.spec>div:last-child{display:flex}.stage-toolbar{grid-row:2}#viewport{grid-row:3}.assembly-floating{grid-row:4}.material-panel{grid-row:5;margin-top:16px;max-height:320px;padding:16px}.material-title{flex-direction:row;flex-wrap:wrap;align-items:center;gap:12px;margin-bottom:14px}.material-title>div:first-child{width:100%}.material-families{flex:1}.material-actions{flex:1;min-width:155px}.material-grid{grid-template-columns:repeat(auto-fit,minmax(40px,1fr));gap:10px}.material-note{margin-top:12px}.stage-footer{grid-row:6}.main-settings{padding:18px 12px}.precision-control{grid-template-columns:22px 27px minmax(36px,1fr) 27px 22px;gap:3px}.precision-control input{font-size:20px}.spec span{font-size:9px}.spec strong{font-size:11px}.spec>div{padding:0 8px}}
@media(max-width:700px){header{height:auto;min-height:64px;flex-wrap:wrap;padding:14px 16px;gap:12px}.brand{font-size:15px}.style-picker{margin-left:auto}.style-picker>label{display:none}.theme-switch{margin-left:auto}.workspace-title{padding:24px 16px}.workspace-title h1{font-size:22px}.local-badge{display:none}main{display:flex;flex-direction:column;padding:0 12px 20px}.workspace,.main-settings{width:100%}.stage{grid-template-rows:64px 48px 400px auto auto 32px}.main-settings{padding:22px}.precision-control{grid-template-columns:30px 36px minmax(50px,1fr) 36px 30px;gap:6px}.precision-control input{font-size:22px}.assembly-floating{gap:14px}.layer-row>span{font-size:11px}.count-controls button{width:25px}.spec strong{white-space:normal}.model-tag{font-size:9px}.workspace-title p{font-size:11px}footer{padding:8px 16px 24px;gap:16px;line-height:1.7}footer>span:last-child{display:none}}

.assembly-floating .control-title:has(#countValue){display:block}input[type=range]{appearance:none;-webkit-appearance:none;background:var(--line);height:2px;border:0;border-radius:0}input[type=range]::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:10px;height:10px;border:2px solid var(--surface);border-radius:50%;background:var(--accent);box-shadow:0 0 0 1px var(--accent)}input[type=range]::-moz-range-thumb{width:7px;height:7px;border:2px solid var(--surface);border-radius:50%;background:var(--accent)}
@media(max-width:700px){.main-settings{margin-top:0}}

/* Theme families share the same light / dark controls. */
:root[data-style=clay]{--bg:#f5f1eb;--surface:#fffcf8;--stage:#eee8df;--field:#f5efe7;--line:#e1d7ca;--text:#493d33;--muted:#918070;--accent:#ad6546;--accent-soft:#eee0d5;--accent-text:#945237;--grid-major:#cbbdaf;--grid-minor:#e1d7cb;--success:#8b9a76;--handle:#fffcf8}
:root[data-style=clay][data-theme=dark]{--bg:#211e1b;--surface:#2c2723;--stage:#26211d;--field:#362e28;--line:#493d33;--text:#ede1d5;--muted:#b09b88;--accent:#dcaa83;--accent-soft:#503a2d;--accent-text:#efc39f;--grid-major:#584739;--grid-minor:#3b3028;--success:#a4b48f;--handle:#362e28}
.style-picker{font-size:12px;gap:10px}.style-picker select{font-size:12px;padding:8px 12px;min-width:155px}.theme-switch{gap:4px;padding:4px;border:1px solid var(--line);background:var(--field)}.theme-switch button{min-width:64px;height:32px;font-size:12px;padding:6px 10px}.theme-switch button[aria-pressed=true]{background:var(--accent-soft);color:var(--accent-text)}footer{display:block;text-align:center;font-size:11px;letter-spacing:.6px;padding:12px 24px 28px}
@media(max-width:700px){.style-picker select{min-width:135px}.theme-switch{margin-left:0}.theme-switch button{min-width:58px}footer{display:block}}
/* Consistent top cards and a sidebar that tracks the preview height. */
.stage{grid-template-rows:88px 52px clamp(520px,calc(100vh - 320px),720px) 36px}.spec{gap:12px;padding:0 0 16px;align-content:stretch;grid-template-columns:repeat(3,minmax(0,1fr))}.spec>div,.spec>div:first-child,.spec>div+div{padding:12px 14px;background:var(--surface);border:1px solid var(--line);border-radius:7px;justify-content:center;gap:7px}.spec span{line-height:1.4}.spec strong{line-height:1.5}.main-settings{margin-top:0;height:var(--preview-height,auto);overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin}
@media(max-width:1500px) and (min-width:1201px){.stage{grid-template-rows:88px 52px 610px 36px}.spec{gap:8px}.spec>div,.spec>div:first-child,.spec>div+div{padding:10px 12px}}
@media(max-width:1200px) and (min-width:951px){.stage{grid-template-rows:88px 52px 500px auto 36px}.spec{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.spec>div:last-child{display:none}.spec>div,.spec>div:first-child,.spec>div+div{padding:10px}}
@media(max-width:950px){.stage{grid-template-rows:88px 48px 440px auto auto 32px}.spec{gap:7px}.spec>div,.spec>div:first-child,.spec>div+div{padding:10px 8px}.spec>div:last-child{display:flex}.spec span{font-size:9px}.spec strong{font-size:11px;white-space:normal}}
@media(max-width:700px){.stage{grid-template-rows:88px 48px 400px auto auto 32px}.main-settings{height:auto;overflow:visible}}
@media(max-width:1200px) and (min-width:951px){.spec{grid-template-columns:repeat(3,minmax(0,1fr))}.spec>div:last-child{display:flex}.spec span{font-size:9px}.spec strong{font-size:11px;white-space:normal}.spec>div,.spec>div:first-child,.spec>div+div{padding:9px}}

/* One continuous WebGL canvas behind the floating panels. */
.stage{overflow:hidden}.stage>#viewport{position:absolute;inset:0;z-index:0;width:100%;height:100%;min-width:0;grid-area:auto}.stage>.material-panel,.stage>.spec,.stage>.stage-toolbar,.stage>.assembly-floating,.stage>.stage-footer{position:relative;z-index:3}.stage>.spec,.stage>.stage-toolbar,.stage>.stage-footer{pointer-events:none}.stage>.spec>div,.stage>.stage-toolbar>*{pointer-events:auto}
.measure-control{pointer-events:auto;padding:0;border:0;background:transparent;touch-action:none;z-index:2}.measure-value{background:var(--surface);border:1px solid var(--line);border-radius:5px;padding:7px 10px;font-size:11px;font-weight:400;white-space:nowrap;font-variant-numeric:tabular-nums;cursor:ew-resize;color:var(--text);touch-action:none}.measure-control[data-measure-axis="2"] .measure-value{cursor:ns-resize}.measure-control:hover .measure-value,.measure-control.adjusting .measure-value{border-color:var(--accent);color:var(--accent-text);background:var(--accent-soft)}.measure-control input{width:104px;text-align:center;padding:7px 8px;border:1px solid var(--accent);border-radius:5px;background:var(--surface);color:var(--text);font-size:12px;font-variant-numeric:tabular-nums;outline:2px solid var(--accent-soft);outline-offset:2px}.stage .material-panel,.stage .assembly-floating{align-self:start}.stage .material-panel{align-self:stretch}.measure-control input:focus{outline:2px solid var(--accent-soft)}
@media(max-width:950px){.stage>#viewport{top:126px;bottom:auto;height:440px;width:100%;left:0;right:0}}
@media(max-width:700px){.stage>#viewport{height:400px}}

/* Assembly tools sit in one horizontal dock below the model. */
.stage{grid-template-columns:208px minmax(0,1fr);grid-template-rows:88px 52px clamp(520px,calc(100vh - 390px),650px) auto 36px;gap:0 20px}.material-panel{grid-row:1/6}.spec,.stage-toolbar,.stage-footer{grid-column:2}.stage-footer{grid-row:5}.stage>.assembly-dock{grid-column:2;grid-row:4;display:flex;align-items:center;gap:20px;padding:14px 18px;margin:12px 0 0;align-self:end;min-width:0}.assembly-dock .dock-group{min-width:0;flex:1}.assembly-dock .dock-group+.dock-group{border-left:1px solid var(--line);padding-left:20px}.assembly-dock .dock-sets{flex:.85}.assembly-dock .dock-layers{flex:1}.assembly-dock .dock-pose{flex:1.1}.assembly-dock .dock-opening{flex:1.1}.assembly-dock .control-title:has(#countValue){display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 0 9px}.assembly-dock .control-title h3{margin:0;white-space:nowrap;font-size:11px}.assembly-dock #countValue{margin:0;font-size:9px;white-space:nowrap}.assembly-dock .set-controls{margin:0;gap:6px}.assembly-dock .set-controls button{padding:7px 8px}.assembly-dock .layer-row{margin:0;gap:12px}.assembly-dock .layer-row+.layer-row{margin-top:7px}.assembly-dock .layer-row>span{font-size:10px}.assembly-dock .count-controls button{height:27px;width:26px}.dock-label{display:block;font-size:11px;margin-bottom:9px}.assembly-dock .assembly-controls{margin:0;gap:5px}.assembly-dock .assembly-controls button{font-size:11px;padding:7px 6px}.assembly-dock .dock-opening .control-title{margin:0 0 14px}.assembly-dock #opening{margin:10px 0 6px}.assembly-dock .range-labels{display:none}
@media(max-width:1500px) and (min-width:951px){.stage{grid-template-columns:184px minmax(0,1fr);grid-template-rows:88px 52px 560px auto 36px;gap:0 16px}.stage>.assembly-dock{gap:14px;padding:14px}.assembly-dock .dock-group+.dock-group{padding-left:14px}.assembly-dock #countValue{display:none}.assembly-dock .count-controls button{width:23px}.assembly-dock .layer-row{gap:5px}.assembly-dock .assembly-controls button{font-size:10px;padding:7px 2px}.spec{grid-template-columns:repeat(3,minmax(0,1fr))}.spec>div:last-child{display:flex}}
@media(max-width:1200px) and (min-width:951px){.stage{grid-template-columns:166px minmax(0,1fr);grid-template-rows:88px 52px 500px auto 36px}.stage>.assembly-dock{display:grid;grid-template-columns:1fr 1fr;gap:16px}.assembly-dock .dock-group+.dock-group{padding-left:0;border-left:0}.assembly-dock .control-title:has(#countValue){display:flex}.material-panel{grid-row:1/6}}
@media(max-width:950px){.stage{grid-template-columns:minmax(0,1fr);grid-template-rows:88px 48px 440px auto auto 32px}.spec,.stage-toolbar,.stage>.assembly-dock,.stage-footer,.material-panel{grid-column:1}.stage>.assembly-dock{grid-row:4;display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:12px;padding:16px}.assembly-dock .dock-group+.dock-group{padding-left:0;border-left:0}.material-panel{grid-row:5}.stage-footer{grid-row:6}}
@media(max-width:700px){.stage{grid-template-rows:88px 48px 400px auto auto 32px}.stage>.assembly-dock{gap:16px 14px}.assembly-dock #countValue{display:none}.assembly-dock .count-controls button{width:24px}.assembly-dock .layer-row{gap:6px}}

.assembly-dock .dock-layers{flex:1.4;min-width:178px}.assembly-dock .dock-sets{min-width:126px}.assembly-dock .dock-pose{min-width:150px}.assembly-dock .dock-opening{min-width:140px}.assembly-dock .set-controls button{padding:7px 5px}.assembly-dock .count-controls{gap:4px}.assembly-dock .count-controls button{width:23px}.assembly-dock .layer-row>span{white-space:nowrap}
@media(max-width:1500px){.stage>.assembly-dock{display:grid;grid-template-columns:1fr 1fr;gap:18px 22px}.assembly-dock .dock-group+.dock-group{border-left:0;padding-left:0}.assembly-dock .dock-group{min-width:0}.assembly-dock .layer-row{gap:8px}.assembly-dock .count-controls button{width:24px}}
@media(max-width:700px){.stage>.assembly-dock{gap:16px}.assembly-dock .dock-layers{grid-column:1/-1;grid-row:2}.assembly-dock .dock-sets{grid-column:1/-1}.assembly-dock .dock-pose{grid-column:1}.assembly-dock .dock-opening{grid-column:2}}

/* Clear, even dimension controls and concise presets. */
.precision-control{align-items:stretch}.precision-control input,.precision-control button{height:38px;min-height:38px;box-sizing:border-box;margin:0}.precision-control input{line-height:24px;padding:6px 2px}.precision-control button{display:flex;align-items:center;justify-content:center;padding:0}.preset-heading{font-size:12px;font-weight:500;margin:0}.dimension-options{gap:12px}.brand{gap:9px;font-size:19px;font-weight:450;letter-spacing:-.3px}.brand svg{width:26px;height:28px}.workspace-title{padding-bottom:26px}

.coffee-card{display:flex;align-items:center;gap:16px;max-width:380px;padding:12px 14px 12px 18px;border:1px solid var(--line);border-radius:9px;background:var(--surface);margin-left:24px}.workspace-title .coffee-card p{margin:0;font-size:12px;line-height:1.9;color:var(--muted)}.coffee-qr{display:block;flex:none;padding:3px;border:1px solid #eee;border-radius:5px;background:#fff}.coffee-qr img{display:block;width:76px;height:76px;object-fit:contain;border-radius:2px}.workspace-title{gap:20px}
@media(max-width:700px){.workspace-title{align-items:flex-start;flex-wrap:wrap;gap:18px}.coffee-card{width:100%;max-width:none;margin:0;padding:12px 14px;gap:18px}.coffee-qr img{width:72px;height:72px}.workspace-title .coffee-card p{font-size:12px}}

#coffee-dialog{padding:36px 20px 20px;border:1px solid var(--line);border-radius:10px;background:#fff;max-width:calc(100vw - 32px)}#coffee-dialog::backdrop{background:#0006}#coffee-dialog img{display:block;width:320px;height:320px;max-width:100%;object-fit:contain}#coffee-close{position:absolute;right:8px;top:5px;border:0;background:white;color:#333;font-size:22px;padding:0 6px}
/* A handwritten note, without a card container. */
.coffee-card{max-width:460px;padding:0;border:0;border-radius:0;background:transparent;gap:24px}.workspace-title .coffee-card p{font-family:"Kaiti SC","STKaiti","KaiTi","楷体","Bradley Hand",cursive;font-size:17px;font-weight:400;line-height:1.8;letter-spacing:.5px;color:var(--text);transform:rotate(-2deg)}.coffee-qr{padding:0;border:0;border-radius:0;background:#fff}.coffee-qr img{width:116px;height:116px;border-radius:0}.coffee-qr:hover{outline:1px solid var(--line);outline-offset:5px}
@media(max-width:700px){.coffee-card{max-width:none;padding:0;gap:20px;margin-top:4px}.workspace-title .coffee-card p{font-size:16px;line-height:1.8}.coffee-qr img{width:108px;height:108px}}
.workspace-title .coffee-card p{transform:none}.coffee-qr{border:1px solid transparent;padding:4px;border-radius:7px;transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease;background:#fff}.coffee-qr:hover,.coffee-qr:focus-visible{transform:scale(1.045);border-color:var(--accent);box-shadow:0 5px 18px #00000016;outline:none}.coffee-qr img{border-radius:3px}@media(prefers-reduced-motion:reduce){.coffee-qr{transition:none}.coffee-qr:hover,.coffee-qr:focus-visible{transform:none}}

.measure-control.read-only .measure-value,.measure-control.read-only:hover .measure-value{cursor:default;background:var(--surface);border-color:var(--line);color:var(--muted);opacity:1}.measure-control.read-only{touch-action:auto}

.measure-overall{position:absolute;z-index:1;transform:translate(-50%,-50%);pointer-events:none;white-space:nowrap;color:var(--text);font-size:11px;font-weight:400;line-height:1.5;padding:0;background:transparent;border:0;box-shadow:none;font-variant-numeric:tabular-nums;text-shadow:0 1px 2px var(--stage)}
/* One compact support card for the note and QR. */
.workspace-title .coffee-card p{padding:0;border:0;border-radius:0;background:transparent;font-size:15px;line-height:1.55;letter-spacing:0;max-width:240px}.coffee-card{gap:16px;padding:12px 14px 12px 18px;border:1px solid var(--line);border-radius:9px;background:var(--surface)}
@media(max-width:700px){.workspace-title .coffee-card p{font-size:14px;line-height:1.6;padding:0;max-width:none}.coffee-card{gap:14px;padding:12px 14px}}

/* Compact unified support card. */
.coffee-card{max-width:360px;gap:12px;padding:8px 10px 8px 14px}.workspace-title .coffee-card p{font-size:14px;line-height:1.5;max-width:220px}.coffee-qr img{width:80px;height:80px}
@media(max-width:700px){.coffee-card{max-width:none;padding:8px 12px;gap:12px}.coffee-qr img{width:76px;height:76px}}

/* Responsive workspace: keep the canvas clear of controls at every viewport size. */
header{padding-inline:clamp(16px,2vw,40px)}
main{grid-template-columns:minmax(0,1fr) clamp(264px,20vw,340px);gap:clamp(16px,1.5vw,28px);padding-inline:clamp(16px,2vw,40px)}
.workspace-title{padding:20px clamp(16px,2vw,40px)}
.stage{grid-template-columns:176px minmax(0,1fr);grid-template-rows:88px 48px clamp(320px,calc(100dvh - 440px),640px) auto 32px;gap:0 16px;padding:16px}
.stage>#viewport{position:relative;inset:auto;grid-column:2;grid-row:3;width:100%;height:100%;min-height:0;overflow:hidden}
.stage>.assembly-dock{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;padding:16px}
.assembly-dock .dock-group{min-width:0}
.assembly-dock .dock-group+.dock-group{padding-left:0;border-left:0}
.material-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.main-settings{min-width:0}
@media(min-width:1800px){
 .stage{grid-template-columns:208px minmax(0,1fr);grid-template-rows:88px 48px clamp(400px,calc(100dvh - 420px),720px) auto 32px;gap:0 24px;padding:24px}
 .material-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
 .stage>.assembly-dock{grid-template-columns:repeat(4,minmax(0,1fr))}
}
@media(max-width:1100px){
 main{display:grid;grid-template-columns:minmax(0,1fr);gap:16px}
 .main-settings{height:auto;overflow:visible;padding:20px}
 .stage{grid-template-columns:minmax(0,1fr);grid-template-rows:88px 48px clamp(300px,48dvh,520px) auto auto 32px}
 .stage>#viewport{grid-column:1;grid-row:3;position:relative;inset:auto;width:100%;height:100%}
 .spec,.stage-toolbar,.stage>.assembly-dock,.material-panel,.stage-footer{grid-column:1}
 .spec{grid-row:1;grid-template-columns:repeat(3,minmax(0,1fr))}
 .spec>div:last-child{display:flex}
 .stage-toolbar{grid-row:2}
 .stage>.assembly-dock{grid-row:4}
 .material-panel{grid-row:5;margin-top:16px;max-height:none;padding:16px}
 .material-title{flex-direction:row;flex-wrap:wrap;align-items:center;gap:12px;margin-bottom:14px}
 .material-title h2{min-width:120px}
 .material-families{flex:1;max-width:240px}
 .material-actions{flex:1;min-width:180px}
 .material-grid{grid-template-columns:repeat(auto-fit,minmax(48px,1fr));gap:8px;max-height:200px}
 .material-note{margin-top:12px}
 .stage-footer{grid-row:6}
 #dimensions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
 .dimension+.dimension{padding-top:0;border-top:0}
 .precision-control{grid-template-columns:24px 28px minmax(36px,1fr) 28px 24px;gap:3px}
 .dimension-options{flex-direction:row;flex-wrap:wrap;align-items:center;gap:12px 20px}
 .export-actions{max-width:420px}
 .export{margin-top:20px;padding-top:20px}
}
@media(max-width:600px){
 header{padding:12px;gap:10px;min-height:0;display:grid;grid-template-columns:1fr auto}
 .brand{font-size:17px}
 .style-picker{grid-column:1;margin-left:0;justify-content:flex-start}
 .style-picker select{min-width:0;width:132px;font-size:12px;min-height:40px}
 .theme-switch{grid-column:2;grid-row:2;margin:0}
 .theme-switch button{min-width:52px;height:34px;padding:4px 6px}
 .workspace-title{padding:16px 12px;gap:12px}
 .workspace-title h1{font-size:22px}
 .coffee-card{width:100%;margin:0;max-width:none;padding:8px 12px}
 .coffee-qr img{width:52px;height:52px}
 .workspace-title .coffee-card p{font-size:13px;max-width:none;flex:1}
 main{padding:0 8px 16px;gap:12px}
 .stage{padding:10px;gap:0;grid-template-rows:auto 48px clamp(280px,48dvh,420px) auto auto 32px}
 .spec{padding-bottom:12px;gap:6px;min-height:84px}
 .spec>div,.spec>div:first-child,.spec>div+div{padding:8px 6px;gap:5px}
 .spec span{font-size:9px;overflow-wrap:anywhere}
 .spec strong{font-size:11px;white-space:normal;overflow-wrap:anywhere}
 .stage-toolbar{gap:6px;align-items:start}
 .segmented button{padding:8px 9px}
 .view-actions{gap:4px}.subtle{width:34px;height:34px}
 .stage>.assembly-dock{padding:12px;gap:16px 12px;margin-top:8px}
 .assembly-dock .dock-sets,.assembly-dock .dock-layers{grid-column:1/-1}
 .assembly-dock .dock-layers{grid-row:2}
 .assembly-dock .dock-pose{grid-column:1;grid-row:3}
 .assembly-dock .dock-opening{grid-column:2;grid-row:3}
 .assembly-dock .count-controls button{width:32px;height:36px}
 .assembly-dock .set-controls button,.assembly-dock .assembly-controls button{min-height:38px}
 .material-panel{padding:12px;margin-top:12px}
 .material-title{gap:8px}.material-families{max-width:none}
 .material-actions{flex-basis:100%}
 .material-grid{grid-template-columns:repeat(5,minmax(0,1fr));max-height:220px}
 .material-swatch{min-height:56px}
 .stage-footer{gap:8px;font-size:9px}.interaction-hint{display:none}
 .main-settings{padding:16px}
 #dimensions{grid-template-columns:minmax(0,1fr);gap:20px}
 .dimension+.dimension{border-top:1px solid var(--line);padding-top:20px}
 .precision-control{grid-template-columns:32px 40px minmax(56px,1fr) 40px 32px;gap:6px}
 .precision-control input,.precision-control button{height:44px;min-height:44px}
 .precision-control input{font-size:22px;line-height:30px}
 .main-settings input[type=range],.assembly-dock input[type=range]{height:20px;background:linear-gradient(var(--line),var(--line)) center/100% 2px no-repeat;margin:4px 0}
 .main-settings input[type=range]::-webkit-slider-thumb,.assembly-dock input[type=range]::-webkit-slider-thumb{width:18px;height:18px}
 .presets{flex-wrap:wrap}.presets button{min-height:38px;padding:8px 12px}
 .export-actions{max-width:none}.export-actions button{min-height:44px}
 .section-label{margin-bottom:20px}.precision-note{font-size:9px}
 footer{padding:12px}
}
@media(max-height:700px) and (min-width:1101px){
 .workspace-title{padding-block:12px}.coffee-qr img{width:56px;height:56px}
 .stage{grid-template-rows:80px 44px 300px auto 28px}
}
@media(min-width:1101px){
 .stage>.material-panel{position:absolute;inset:16px auto 16px 16px;width:176px;height:auto;min-height:0;margin:0;overflow:hidden}
}
@media(min-width:1800px){
 .stage>.material-panel{inset:24px auto 24px 24px;width:208px}
}