:root{--ink:#242c2b;--muted:#7c8580;--green:#315d4d;--line:#e1e5df;--paper:#f5f6f2}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font:14px/1.6 -apple-system,BlinkMacSystemFont,'PingFang SC',sans-serif}button,input,select{font:inherit}button,a,input,select{outline-offset:4px}button{cursor:pointer;border:1px solid var(--line);background:white;border-radius:5px;padding:8px 13px;color:var(--ink)}button:hover{border-color:var(--green);background:#edf2eb}button:disabled{opacity:.45;cursor:not-allowed}a{color:var(--green);text-decoration:none}header{height:78px;background:#fff;display:flex;align-items:center;justify-content:space-between;padding:0 4vw;border-bottom:1px solid var(--line)}.brand{font-size:23px;font-weight:750;letter-spacing:3px;color:var(--ink)}.brand span{color:var(--green)}.brand small{font-weight:400;letter-spacing:2px;font-size:10px;display:block}nav{display:flex;gap:28px;align-items:center}nav .active{font-weight:600;border-bottom:2px solid var(--green);padding:26px 0}nav button{border:0}#connection{font-size:12px;color:var(--green)}main{max-width:1600px;margin:auto;padding:38px 4vw 130px}.intro{display:flex;justify-content:space-between;align-items:center;margin-bottom:32px}.eyebrow{font-size:10px;letter-spacing:2px;color:var(--muted);margin:0 0 8px}h1{font-size:32px;font-weight:500;letter-spacing:1px;margin:0 0 12px}h2{font-size:15px;margin:0;font-weight:600}h3{font-size:15px;margin:20px 0 12px}.intro p:not(.eyebrow){color:var(--muted);margin:0}.intro-actions{display:flex;gap:10px}.workspace{display:grid;grid-template-columns:335px 1fr;gap:24px}.controls{background:white;border:1px solid var(--line);border-radius:8px;align-self:start}.controls section{padding:23px;border-bottom:1px solid var(--line)}.section-title{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px;gap:10px}.section-title>span{font-size:11px;color:var(--muted)}.section-title button{font-size:11px;padding:4px 7px}label{display:block;font-size:12px;color:#626b66;margin:12px 0}input:not([type=file]),select{display:block;width:100%;padding:9px 10px;margin-top:5px;border:1px solid var(--line);border-radius:4px;background:#fcfdfb;color:var(--ink)}input[type=color]{padding:3px;height:41px}.fields{display:grid;grid-template-columns:1fr 1fr;gap:0 12px}.fields label{margin:7px 0}.hint{font-size:11px;color:var(--muted);line-height:1.8}.wall-group{margin-bottom:16px}.wall-heading{display:flex;justify-content:space-between;font-size:12px}.wall-heading span{color:var(--muted)}.wall-values{display:flex;gap:6px}.wall-values label{flex:1;min-width:0;font-size:10px;margin:3px 0}.wall-values input{padding:7px 4px;font-size:12px}#validation{font-size:11px;color:var(--green);background:#edf3ed;padding:10px;border-radius:4px}#validation.error{color:#aa523a;background:#fff0e9}.material-row{display:grid;grid-template-columns:48px 1fr;align-items:center;gap:8px;margin:6px 0;border-radius:4px}.material-row.active{background:#e8f1e8;outline:5px solid #e8f1e8}.material-row button{padding:3px;border:0;background:transparent;font-size:12px}.material-row select{padding:6px;margin:0;font-size:11px}.canvas-column{display:flex;flex-direction:column;gap:22px}.canvas-column section{background:#fff;border:1px solid var(--line);border-radius:8px;padding:24px}.drawing{background-image:radial-gradient(#ddd 1px,transparent 1px)!important;background-size:16px 16px!important}#plan{max-width:560px;margin:auto;height:360px}#plan svg{width:100%;height:100%;overflow:visible}#plan text{font-family:inherit;pointer-events:none}#plan rect[data-panel]{cursor:pointer;transition:fill .2s}#plan rect[data-panel]:hover{stroke:#315d4d;stroke-width:3}.drawing-footer{border-top:1px solid var(--line);padding-top:13px;display:flex;justify-content:space-between;font-size:10px;color:var(--muted)}.drawing-footer>span:first-child{color:var(--green)}.badge{background:#e9eee6;padding:3px 10px;border-radius:20px;letter-spacing:1px}.render-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}figure{margin:0}.image-holder{aspect-ratio:1;background:linear-gradient(145deg,#f0f1ec,#e5e8e1);border-radius:5px;display:grid;place-items:center;overflow:hidden;position:relative}.image-holder img{width:100%;height:100%;object-fit:contain;position:absolute;inset:0}.empty{display:flex;flex-direction:column;align-items:center;color:#8e9890;gap:8px}.empty>span{font-size:64px;font-weight:200;line-height:1.3;opacity:.4}.empty b{font-size:13px;font-weight:400}.empty small{font-size:10px}figcaption{font-size:10px;color:var(--muted);letter-spacing:1px;padding:12px 0;display:flex;justify-content:space-between}#result-links{display:flex;gap:16px;font-size:12px}table{width:100%;border-collapse:collapse;text-align:left;font-size:12px}th{font-weight:400;color:var(--muted);padding:8px;border-bottom:1px solid var(--line)}td{padding:8px;border-bottom:1px solid #f0f2ed}.swatch{display:inline-block;height:12px;width:12px;margin-right:8px;border-radius:3px;vertical-align:middle}.job{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);padding:12px 0;gap:12px}.job small{display:block;color:var(--muted);font-size:10px}.job button{font-size:11px}footer{position:fixed;bottom:0;left:0;right:0;display:flex;align-items:center;justify-content:flex-end;gap:28px;background:#ffffffee;backdrop-filter:blur(12px);padding:16px 4vw;border-top:1px solid var(--line);z-index:10}footer>div{margin-right:auto}footer b{font-size:13px;font-weight:500}footer small{display:block;font-size:10px;color:var(--muted)}footer label{margin:0;display:flex;align-items:center;gap:12px}footer select{margin:0;width:auto}.primary{background:var(--green);color:white;border-color:var(--green)}.primary:hover{background:#244738;color:white}#render{min-width:205px;padding:13px 20px;display:flex;justify-content:space-between}dialog{width:min(720px,94vw);max-height:90vh;padding:30px;border:1px solid var(--line);border-radius:12px;color:var(--ink)}dialog::backdrop{background:#15231d70;backdrop-filter:blur(4px)}#library-list{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.asset{border:1px solid var(--line);border-radius:5px;padding:10px;font-size:12px}.asset small{display:block;font-size:10px;color:var(--muted)}#toast{position:fixed;right:30px;top:90px;background:#253e32;color:white;border-radius:6px;padding:13px 20px;z-index:100;max-width:400px}#library-status{color:#aa523a;font-size:12px}form{border-bottom:1px solid var(--line);padding-bottom:20px}input[type=file]{display:block;margin-top:8px;max-width:100%}[hidden]{display:none!important}@media(max-width:1000px){.workspace{grid-template-columns:290px 1fr}.intro{gap:20px}.intro-actions{flex-direction:column}.canvas-column section{padding:16px}.drawing-footer{flex-direction:column}.render-grid{grid-template-columns:1fr}header{padding:0 20px}nav{gap:10px}#connection{max-width:130px}}@media(max-width:700px){header{height:65px}.brand{font-size:17px}.brand small{font-size:8px}nav .active{display:none}nav button{font-size:11px}#connection{font-size:10px}main{padding:25px 16px 155px}h1{font-size:26px}.intro{align-items:flex-start}.intro p:not(.eyebrow){font-size:12px}.workspace{display:flex;flex-direction:column}.controls{width:100%}.canvas-column{width:100%}.render-grid{grid-template-columns:1fr 1fr}footer{padding:12px 16px;gap:8px;flex-wrap:wrap}footer>div{width:100%;display:flex;justify-content:space-between}footer label{font-size:10px;flex:1}footer select{font-size:11px;width:100%}#render{min-width:135px;padding:10px;font-size:12px}.drawing-footer{font-size:9px}#library-list{grid-template-columns:1fr 1fr}}

.wall-values:has(label:nth-child(5)){display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}

#result-links{flex-wrap:wrap;align-items:center}#result-links button{font-size:11px;padding:4px 8px}

/* Parameter studio v2 */
.workspace{grid-template-columns:390px minmax(0,1fr)}
.controls .drawing{padding:20px 16px;background:#fff}.controls .drawing .section-title{align-items:flex-start}.controls .drawing h2{font-size:14px}.controls .drawing #dimension-label{font-size:10px;max-width:120px;text-align:right}
#plan{height:auto;max-width:400px}#plan svg{display:block;touch-action:none;width:100%;height:auto}#plan [data-pick]{cursor:pointer}#plan [data-pick]:hover rect{stroke:#315d4d;stroke-width:2}#plan [data-boundary]{cursor:ew-resize;touch-action:none}#plan [data-wall=B],#plan [data-wall=D]{cursor:ns-resize}#plan [tabindex]:focus{outline:none;filter:drop-shadow(0 0 3px #315d4d)}
.plan-edit-title{display:flex;justify-content:space-between;align-items:center;font-size:11px;gap:8px}.plan-edit-title small{font-size:9px;color:var(--muted)}#plan-editor{padding:12px;background:#f0f5ed;border-radius:5px;margin:0 0 12px}#plan-size-form{display:flex;gap:8px;align-items:flex-end;padding:0;border:0}#plan-size-form label{flex:1;margin:8px 0}#plan-size-form button{margin:8px 0;font-size:11px;padding:10px}#plan-editor label{font-size:10px}#plan-editor input,#plan-editor select{font-size:12px;padding:7px}#plan-message{font-size:10px;line-height:1.6;color:var(--green);margin:5px 0 0}.drawing-footer{flex-direction:column;gap:4px}
.viewer-toolbar{display:flex;align-items:center;justify-content:space-between;margin-top:-8px;margin-bottom:10px}.viewer-toolbar label{display:flex;align-items:center;gap:12px;margin:0;font-size:11px}.viewer-toolbar select{margin:0;width:auto;font-size:11px;padding:6px}.viewer-toolbar button{font-size:11px}#viewer-canvas{height:420px;border-radius:6px;overflow:hidden;background:#eef1eb;touch-action:none;position:relative}#viewer-canvas canvas{display:block;width:100%;height:100%;touch-action:none}.render-actions{display:flex;align-items:center;gap:10px}.pdf-button{padding:7px 10px;background:#315d4d;color:#fff;border-radius:4px;font-size:11px;white-space:nowrap}.pdf-button:hover{background:#254737}.renders .render-grid{grid-template-columns:1fr 1fr}.asset{min-height:72px}.asset .swatch{height:18px;width:24px}
@media(max-width:1150px){.workspace{grid-template-columns:330px minmax(0,1fr)}.render-actions{flex-direction:column;align-items:flex-end}#viewer-canvas{height:360px}.drawing .section-title{flex-wrap:wrap}}
@media(max-width:800px){.workspace{display:flex;flex-direction:column}.controls{width:100%}.controls .drawing #plan{max-width:400px;margin:auto}.canvas-column{width:100%}.render-actions{flex-direction:row}#viewer-canvas{height:340px}.controls section{padding:20px}.intro{gap:12px}.viewer-toolbar label{gap:6px}.render-grid{gap:10px}}

.material-dock{margin-top:18px;border-top:1px solid #d5ddd3;padding-top:12px}.material-dock summary{cursor:pointer;font-weight:600}#material-dock{display:grid;grid-template-columns:1fr 1fr;gap:6px;max-height:236px;overflow:auto;margin-top:10px}.material-chip{display:flex;align-items:center;gap:8px;text-align:left;font-size:11px;padding:8px;cursor:grab;background:#fff}.material-chip i{flex:none;width:27px;height:32px;border-radius:3px;box-shadow:inset 0 0 0 1px #0001;background-image:linear-gradient(110deg,#fff5,transparent 40%,#0002)!important}.material-chip:active{cursor:grabbing}.material-chip:focus-visible{outline:2px solid #315d4d}#material-drop-status{font-size:11px;color:#315d4d}#plan.accept-material{outline:2px dashed #749c82;border-radius:6px}#plan .drop-target rect{stroke:#ff9f32;stroke-width:5;filter:brightness(1.2)}

.material-chip{touch-action:none;user-select:none}

.material-chip img{width:27px;height:32px;object-fit:cover;border-radius:3px;pointer-events:none}.material-chip small{display:block;color:#507361;font-size:9px;letter-spacing:1px}

.catalog-tabs{display:flex;flex-wrap:wrap;gap:8px;margin:16px 0}.catalog-tabs button[aria-pressed=true]{background:#315d4d;color:#fff}.floor-drawing{margin-top:16px;border-top:1px solid #d5ddd3;padding-top:12px}#floor-plan{width:100%;background:#f3f5ef;color:#315d4d}#floor-plan svg{width:100%;max-height:170px}#floor-plan span{display:block;padding-bottom:10px}#material-picker{width:min(720px,94vw);max-height:85vh;padding:24px}#picker-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:12px;max-height:52vh;overflow:auto}.picker-card{display:flex;flex-direction:column;gap:10px;text-align:left;padding:10px;background:white}.picker-card img,.picker-card i{width:100%;height:85px;object-fit:cover;border-radius:4px}.picker-card i{background-image:linear-gradient(110deg,#fff5,transparent 40%,#0002)}.picker-card[aria-pressed=true]{outline:2px solid #315d4d}.group-choice{display:grid;grid-template-columns:24px 65px 1fr;align-items:center;gap:10px;margin:10px 0}.group-choice input{width:auto}.asset button{margin-top:8px}#organize-dialog{width:min(480px,90vw)}

/* Anchored, non-modal material strip. Sphere shading previews finish and texture. */
#material-picker{position:fixed;z-index:90;width:min(760px,calc(100vw - 24px));max-height:calc(100vh - 24px);overflow:auto;padding:16px;background:#fffffff5;backdrop-filter:blur(16px);border:1px solid #ccd7cc;border-radius:14px;box-shadow:0 12px 45px #182d3338}#material-picker .section-title{margin-bottom:8px}#material-picker .catalog-tabs{margin:10px 0}#picker-grid{display:flex;overflow-x:auto;gap:10px;padding:5px 4px 12px;max-height:210px}.picker-card{flex:0 0 108px;align-items:center;text-align:center;font-size:11px;border-radius:9px}.picker-card img,.picker-card i{display:block;width:72px;height:72px;min-height:72px;border-radius:50%;object-fit:cover;box-shadow:inset -12px -14px 18px #0008,inset 6px 5px 12px #fff9,0 7px 8px #0002}.picker-card i{background-image:radial-gradient(ellipse at 30% 22%,#fffE 0%,#fff4 15%,transparent 40%,#0007 100%)}.picker-card img{filter:drop-shadow(0 3px 2px #0003);mask-image:radial-gradient(circle,#000 67%,transparent 71%)}.image-holder{background:repeating-conic-gradient(#fff 0% 25%,#edf0ec 0% 50%) 0 0/20px 20px}
/* Material editing: retain readable codes and compact map removal controls. */
#material-map-state{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px;margin:16px 0}#material-map-state label{padding:12px;background:#f3f5ef;border-radius:8px}#material-map-state input[type=checkbox]{width:auto;display:inline-block;margin:8px 6px 0 0}.picker-card small,.material-chip small,.asset small{overflow-wrap:anywhere}.material-chip small{display:block;color:#637369}.picker-card small{max-width:100%;color:#637369}

#material-picker{width:min(1180px,calc(100vw - 24px))}
#picker-grid{display:block;max-height:calc(100dvh - 200px);overflow:auto;overscroll-behavior:contain}
.steel-families,.picker-other{display:grid;grid-template-columns:repeat(auto-fit,minmax(100px,1fr));gap:8px;align-items:start}
.picker-other{grid-template-columns:repeat(auto-fill,minmax(100px,1fr));margin-top:12px}
.steel-family{display:grid;gap:8px;min-width:0}
.steel-family h3{margin:4px 0;text-align:center;font-size:13px}
#picker-grid .picker-card{width:100%;min-width:0;overflow-wrap:anywhere}