:root{--designer-ink:#171512;--designer-paper:#f5f1eb;--designer-stone:#d8d0c4;--designer-rust:#b95b27;--designer-line:rgba(23,21,18,.14);--designer-soft:#ebe4da}
.designerPage{background:var(--designer-paper);color:var(--designer-ink)}
.designerPage header{background:rgba(245,241,235,.92);border-color:var(--designer-line)}
.designerHero{min-height:690px;position:relative;overflow:hidden;background:#201c18;color:#f8f2e8}
.designerHeroTexture{position:absolute;inset:0;opacity:.25;background:linear-gradient(115deg,transparent 0 38%,rgba(214,198,177,.15) 38.2% 39%,transparent 39.2% 54%,rgba(214,198,177,.12) 54.2% 54.5%,transparent 54.7%),radial-gradient(circle at 80% 14%,rgba(189,119,67,.38),transparent 28%),linear-gradient(135deg,#1a1714,#342a22 55%,#171513)}
.designerHeroGrid{position:relative;z-index:1;display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center;min-height:690px}
.designerHeroCopy{max-width:620px}.designerKicker,.designerSectionHeading .eyebrow{font-size:12px;letter-spacing:2px;text-transform:uppercase;font-weight:700;color:#d49a70}.designerHero h1{font-size:clamp(52px,6vw,86px);line-height:.98;letter-spacing:-2px;margin:22px 0 28px;color:#f8f2e8}.designerHero h1 em{font-style:normal;color:#d7a578}.designerHeroCopy>p{font-size:19px;line-height:1.7;color:rgba(248,242,232,.78);max-width:560px}.designerGhostButton{background:transparent;color:#f8f2e8;border-color:rgba(248,242,232,.35)}.designerGhostButton:hover{background:rgba(255,255,255,.08)}.designerDisclaimer{font-size:12px!important;color:rgba(248,242,232,.56)!important;margin-top:30px}.designerDisclaimer span{color:#d49a70;margin-right:7px}
.designerHeroVisual{height:520px;position:relative;border:1px solid rgba(248,242,232,.22);background:linear-gradient(145deg,rgba(255,255,255,.08),rgba(255,255,255,.01));box-shadow:20px 30px 90px rgba(0,0,0,.25);overflow:hidden}.heroCompass{position:absolute;top:24px;left:26px;font-size:11px;letter-spacing:2px;line-height:1.4;color:#e3c4a3;z-index:2}.heroCompass span{color:rgba(255,255,255,.45)}.roomSketch{position:absolute;inset:55px 30px 70px;transform:perspective(720px) rotateX(8deg) rotateY(-10deg);transform-style:preserve-3d}.sketchWall{position:absolute;inset:5% 10% 32% 8%;background:linear-gradient(145deg,#b2a89d,#ddd4c7);border:1px solid rgba(255,255,255,.38);box-shadow:inset 0 0 0 1px rgba(38,31,24,.12)}.sketchFloor{position:absolute;left:0;right:0;bottom:0;height:42%;background:repeating-linear-gradient(110deg,rgba(87,66,48,.18) 0 2px,transparent 2px 50px),linear-gradient(155deg,#92745d,#c4a98b);clip-path:polygon(8% 0,100% 15%,100% 100%,0 100%)}.sketchIsland{position:absolute;left:25%;bottom:21%;width:49%;height:22%;background:linear-gradient(#e6ded2 0 18%,#6f5140 19% 100%);transform:skewY(-10deg);box-shadow:18px 18px 0 rgba(36,26,19,.18)}.sketchStone{position:absolute;background:#eee9e0;box-shadow:inset 0 0 0 1px rgba(111,74,51,.2)}.slab-one{left:31%;bottom:41%;width:43%;height:5%;transform:skewY(-10deg)}.slab-two{right:13%;top:21%;width:8%;height:43%;background:linear-gradient(100deg,#e9e1d6,#b99f8c,#f2ece3)}.sketchLabel{position:absolute;font-size:9px;letter-spacing:1.5px;color:#3f3025}.label-stone{right:0;top:17%}.label-space{left:7%;bottom:9%}.heroVisualCaption{position:absolute;left:26px;right:26px;bottom:22px;border-top:1px solid rgba(248,242,232,.22);padding-top:13px;display:flex;justify-content:space-between;gap:16px;font-size:11px;text-transform:uppercase;letter-spacing:1px;color:rgba(248,242,232,.55)}.heroVisualCaption strong{color:#f8f2e8;font-weight:500}
.designerIntro{background:#f5f1eb}.designerSectionHeading{display:grid;grid-template-columns:1fr 1fr;gap:50px;align-items:end}.designerSectionHeading h2{font-size:48px;line-height:1.05;margin:16px 0 0}.designerSectionHeading .lead{margin:0}.designerProcessGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--designer-line);margin-top:75px}.designerProcessGrid article{background:#f5f1eb;padding:28px 28px 8px 0;min-height:185px}.designerProcessGrid article+article{padding-left:28px}.processNumber{font-family:var(--serif);font-size:26px;color:var(--designer-rust)}.designerProcessGrid h3{font-family:var(--sans);font-size:16px;margin:26px 0 8px}.designerProcessGrid p{font-size:14px;line-height:1.65;color:#6d665d;max-width:260px}
.materialsSampleSection{padding-top:28px}.materialsSampleGrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:32px}.materialSampleCard{background:#fff;border:1px solid var(--designer-line);padding:14px;display:grid;gap:12px}.materialSampleCard.selected{border-color:var(--designer-rust);box-shadow:inset 0 0 0 1px var(--designer-rust)}.materialSampleImage{overflow:hidden;border:1px solid rgba(23,21,18,.08);background:#f2eee8}.materialSampleImage img{display:block;width:100%;height:220px;object-fit:cover}.materialSampleMeta{display:flex;justify-content:space-between;align-items:center;gap:12px}.materialSampleCategory{display:inline-block;font-size:10px;letter-spacing:1.4px;text-transform:uppercase;color:#7b695d;padding:6px 8px;background:#f2eadf}.materialSampleMeta h3{margin:10px 0 0;font-size:20px}.materialSampleCard p{margin:0;color:#625b55;line-height:1.6}.materialSampleCard small{font-size:12px;letter-spacing:.5px;color:#6f655d}
.designerApp{padding-top:72px;background:#eae1d6}.designerAppHeader{display:flex;justify-content:space-between;align-items:end;margin-bottom:24px}.designerAppHeader h2{font-size:42px;margin:12px 0 0}.designerSaveState{font-size:12px;text-transform:uppercase;letter-spacing:1px;color:#6e6255;border-bottom:1px solid var(--designer-line);padding-bottom:8px}.designerLayout{display:grid;grid-template-columns:220px minmax(0,1fr);background:#f8f5f0;min-height:680px;border:1px solid var(--designer-line);box-shadow:0 20px 50px rgba(51,37,25,.1)}.wizardRail{background:#27231f;color:#f6efe6;padding:28px 20px;display:flex;flex-direction:column}.wizardRailTop{display:flex;justify-content:space-between;align-items:start;padding-bottom:28px;border-bottom:1px solid rgba(255,255,255,.16)}.wizardOverline{font-size:10px;text-transform:uppercase;letter-spacing:1.5px;color:#c3a68a}.wizardRailTop strong{font-family:var(--serif);font-size:22px;font-weight:600}.stepList{list-style:none;padding:25px 0;margin:0;display:grid;gap:5px}.stepList button{width:100%;text-align:left;border:0;background:transparent;color:rgba(246,239,230,.52);padding:12px 8px;display:flex;gap:12px;align-items:center;font:600 12px var(--sans);cursor:pointer}.stepList button span{font:12px var(--serif);color:rgba(246,239,230,.38)}.stepList li.active button,.stepList li.done button{color:#f6efe6}.stepList li.active button{background:rgba(255,255,255,.08)}.stepList li.active button span,.stepList li.done button span{color:#d49a70}.wizardRailNote{margin-top:auto;border-top:1px solid rgba(255,255,255,.16);padding-top:20px;display:flex;gap:10px}.wizardRailNote>span{color:#d49a70}.wizardRailNote p{font-size:11px;line-height:1.6;color:rgba(246,239,230,.55);margin:0}
.wizardPanel{padding:50px 6%;min-width:0}.wizardStep{display:none;min-height:575px}.wizardStep.active{display:flex;flex-direction:column}.stepIntro{max-width:650px}.stepLabel{font-size:11px;text-transform:uppercase;letter-spacing:1.6px;color:var(--designer-rust);font-weight:700}.stepIntro h3{font-size:38px;margin:14px 0 10px}.stepIntro p{font-size:16px;color:#746b61;line-height:1.65;margin:0 0 30px}.projectTypeGrid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.projectTypeCard{min-height:125px;border:1px solid var(--designer-line);background:#fff;text-align:left;padding:16px;cursor:pointer;transition:.2s ease;display:flex;flex-direction:column;justify-content:space-between}.projectTypeCard:hover,.projectTypeCard.selected{border-color:var(--designer-rust);box-shadow:inset 0 0 0 1px var(--designer-rust);transform:translateY(-2px)}.projectTypeCard .typeIcon{font-size:23px;color:var(--designer-rust)}.projectTypeCard strong{font:600 14px var(--sans)}.projectTypeCard small{font-size:11px;line-height:1.4;color:#81766b}.wizardActions{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:auto;padding-top:35px}.wizardActions .btn{box-shadow:none}.uploadDrop{min-height:190px;border:1px dashed #aa9a89;background:rgba(255,255,255,.45);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;text-align:center;cursor:pointer}.uploadDrop:hover{background:#fff;border-color:var(--designer-rust)}.uploadIcon{font-size:32px;color:var(--designer-rust);line-height:1}.uploadDrop strong{font-size:16px}.uploadDrop span{font-size:13px;color:#756c62}.uploadDrop small{font-size:11px;color:#a09384}.photoGrid{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin-top:16px}.photoItem{position:relative;aspect-ratio:1;overflow:hidden;background:#ddd}.photoItem img{width:100%;height:100%;object-fit:cover}.photoItem button{position:absolute;top:5px;right:5px;width:27px;height:27px;border:0;border-radius:50%;background:#201c18;color:#fff;cursor:pointer}.formHint{font-size:12px;color:#83776b}.unitSwitcher{display:flex;align-items:center;gap:5px;margin-bottom:20px;color:#776e64;font-size:12px}.unitSwitcher button{border:1px solid var(--designer-line);background:transparent;padding:8px 13px;font:700 12px var(--sans);cursor:pointer}.unitSwitcher button.active{background:#28231e;color:#fff;border-color:#28231e}.measurementGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.measurementGrid label,.optionalGrid label,.materialToolbar label{font-size:12px;font-weight:700;color:#453d36;position:relative}.measurementGrid label>span{display:block;float:right;font-size:10px;color:var(--designer-rust);font-weight:500}.measurementGrid input{margin-top:7px;padding:16px 40px 16px 14px;border-radius:0;background:#fff;border-color:var(--designer-line)}.unitLabel{position:absolute;right:14px;bottom:16px;color:#8a7a6c}.optionalDetails{margin-top:26px;border-top:1px solid var(--designer-line);border-bottom:1px solid var(--designer-line);padding:16px 0}.optionalDetails summary{font-size:13px;font-weight:700;cursor:pointer}.optionalGrid{display:grid;grid-template-columns:repeat(2,1fr);gap:15px;margin-top:18px}.optionalGrid input{margin-top:6px;border-radius:0;background:#fff}.wizardPanel textarea{border-radius:0;margin-top:8px;min-height:180px;background:#fff;border-color:var(--designer-line)}.stylePicker{margin-top:22px}.stylePicker>span{font-size:12px;font-weight:700}.styleOptions{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}.styleOption{border:1px solid var(--designer-line);background:transparent;padding:9px 13px;font-size:12px;cursor:pointer}.styleOption.selected{background:#28231e;color:#fff;border-color:#28231e}.materialToolbar{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:16px}.materialToolbar select{margin-top:6px;border-radius:0;background:#fff;padding:10px 32px 10px 10px}.materialGrid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.materialCard{border:1px solid var(--designer-line);background:#fff;cursor:pointer;text-align:left;position:relative}.materialCard.selected{border-color:var(--designer-rust);box-shadow:inset 0 0 0 1px var(--designer-rust)}.materialCard img{width:100%;height:104px;object-fit:cover;display:block;filter:saturate(.78)}.materialCardBody{padding:11px}.materialCardBody strong{display:block;font:600 13px var(--sans)}.materialCardBody small{display:block;color:#81776d;font-size:10px;margin-top:5px}.materialCheck{position:absolute;top:8px;right:8px;border-radius:50%;width:20px;height:20px;background:#fff;border:1px solid #9f8d7e;font-size:12px;text-align:center;line-height:18px;color:transparent}.materialCard.selected .materialCheck{background:var(--designer-rust);color:#fff;border-color:var(--designer-rust)}.reviewGrid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px}.reviewItem{padding:16px;background:#fff;border:1px solid var(--designer-line)}.reviewItem span{display:block;font-size:10px;text-transform:uppercase;letter-spacing:1px;color:#8b7b6d;margin-bottom:7px}.reviewItem strong{font-size:14px;font-weight:600}.honestState{display:flex;gap:13px;background:#f0e4d7;border-left:3px solid var(--designer-rust);padding:16px;margin-top:20px}.honestState>span{font-size:23px;color:var(--designer-rust)}.honestState strong{font-size:13px}.honestState p{font-size:12px;line-height:1.5;color:#75695e;margin:4px 0 0}
.workspace{background:#f5f1eb;padding-top:70px}.workspaceHeader{display:flex;justify-content:space-between;align-items:end;margin-bottom:22px}.workspaceHeader h2{font-size:42px;margin:10px 0 0}.workspaceStatus{font-size:12px;color:#73685c;display:flex;gap:8px;align-items:center}.statusDot{width:8px;height:8px;border-radius:50%;background:#bd6a3f}.workspaceShell{display:grid;grid-template-columns:180px minmax(0,1fr) 210px;min-height:590px;background:#1e1c19;color:#eee8df;box-shadow:0 22px 55px rgba(44,31,21,.18)}.workspaceSidebar{padding:20px 16px;border-right:1px solid rgba(255,255,255,.1);display:flex;flex-direction:column}.rightSidebar{border-right:0;border-left:1px solid rgba(255,255,255,.1)}.workspaceSidebarTitle{font-size:10px;text-transform:uppercase;letter-spacing:1.5px;color:#b69a80;margin-bottom:22px}.workspaceTabs{display:grid;gap:4px}.workspaceTabs button{border:0;background:transparent;color:#8d8880;text-align:left;padding:9px 7px;font:12px var(--sans);cursor:pointer}.workspaceTabs button.active,.workspaceTabs button:hover{background:rgba(255,255,255,.1);color:#f5eee5}.workspaceSidebarFooter{margin-top:auto;display:grid;gap:5px;font-size:10px;color:#78736c}.designViewport{min-width:0;display:flex;flex-direction:column;background:#464039}.viewportToolbar,.viewportFooter{display:flex;justify-content:space-between;gap:12px;padding:14px 17px;font-size:9px;letter-spacing:1px;color:#bdb1a1}.viewportToolbar button{margin-left:auto;border:0;background:transparent;color:#cdbda9}.viewportScene{position:relative;flex:1;min-height:400px;overflow:hidden;background:radial-gradient(circle at 50% 25%,rgba(197,171,143,.26),transparent 31%),linear-gradient(150deg,#49443d,#292824)}.viewportRoom{position:absolute;inset:13% 12%;transform:perspective(700px) rotateX(6deg) rotateY(-9deg)}.viewportBackWall{position:absolute;inset:0 10% 31%;background:linear-gradient(135deg,#aaa193,#ded3c5);border:1px solid rgba(255,255,255,.3)}.viewportSideWall{position:absolute;right:0;top:0;width:11%;height:69%;background:#918476;clip-path:polygon(0 0,100% 12%,100% 100%,0 87%)}.viewportFloor{position:absolute;inset:68% 0 0;background:repeating-linear-gradient(110deg,rgba(74,51,37,.25) 0 2px,transparent 2px 48px),linear-gradient(145deg,#896a53,#b89d80);clip-path:polygon(0 0,100% 12%,100% 100%,0 100%)}.viewportCounter{position:absolute;left:13%;top:49%;width:54%;height:10%;background:#ede6dc;border-bottom:12px solid #4c392c;transform:skewY(-7deg)}.viewportIsland{position:absolute;left:24%;top:65%;width:48%;height:17%;background:linear-gradient(#e4dbcf 0 20%,#6d4e3d 21%);transform:skewY(-7deg)}.viewportSlab{position:absolute;right:23%;top:18%;width:12%;height:48%;background:linear-gradient(100deg,#e7dfd5,#c6af9d,#efe8de)}.viewportCenterNote{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:#f0e7dc;text-shadow:0 2px 18px #211d19}.viewportCenterNote span{font-size:10px;text-transform:uppercase;letter-spacing:2px;color:#d1a67f}.viewportCenterNote strong{font:27px var(--serif);margin:8px 0}.viewportCenterNote small{font-size:11px;color:#c8bdb1}.viewportAnnotation{position:absolute;font-size:9px;letter-spacing:1px;color:#e5c7a7}.annotationOne{top:23%;left:12%}.annotationTwo{bottom:19%;right:13%}.selectedObject{border-bottom:1px solid rgba(255,255,255,.12);padding-bottom:20px}.objectPreview{height:92px;background:linear-gradient(135deg,#ded6ca,#9a8573);margin-bottom:12px;position:relative}.objectPreview span{position:absolute;inset:20px 16px;background:rgba(255,255,255,.42);transform:skewY(-12deg)}.selectedObject strong{display:block;font-size:13px;font-weight:600}.selectedObject small{display:block;font-size:10px;color:#8e887f;margin-top:5px}.propertyList{display:grid;gap:15px;padding:20px 0}.propertyList label{font-size:10px;color:#918b83}.propertyList strong{display:block;color:#eae2d8;font-size:11px;font-weight:500;margin-top:4px}.workspaceActions{margin-top:auto;display:grid;gap:8px}.workspaceActions .btn{border-color:rgba(255,255,255,.18);background:transparent;color:#eee8df;box-shadow:none;padding:10px 8px;font-size:11px}.workspaceActions .btnPrimary{background:var(--designer-rust);border-color:var(--designer-rust)}.workspaceActions small{font-size:9px;color:#b7a99a}.workspaceNotice{margin-top:15px;padding:13px 16px;background:#e7dacb;color:#5f4e40;font-size:13px}
@media(max-width:980px){.designerHeroGrid{grid-template-columns:1fr;gap:40px;padding:70px 0}.designerHero{min-height:auto}.designerHeroVisual{height:430px}.designerSectionHeading{grid-template-columns:1fr;gap:20px}.designerProcessGrid{margin-top:45px}.designerLayout{grid-template-columns:1fr}.wizardRail{padding:18px 20px}.stepList{display:flex;overflow:auto;padding:14px 0 0}.stepList li{flex:1;min-width:110px}.stepList button{display:grid;gap:4px;padding:10px 8px}.wizardRailNote{display:none}.wizardPanel{padding:35px 5%}.workspaceShell{grid-template-columns:150px minmax(0,1fr)}.rightSidebar{grid-column:1/-1;border-left:0;border-top:1px solid rgba(255,255,255,.1);display:grid;grid-template-columns:1fr 1fr 1fr;gap:20px}.workspaceActions{margin-top:0}.workspaceSidebarFooter{display:none}}
@media(max-width:640px){.designerHero h1{font-size:52px}.designerHeroCopy>p{font-size:16px}.designerHeroVisual{height:350px}.heroVisualCaption{display:grid;gap:4px}.designerSectionHeading h2,.designerAppHeader h2,.workspaceHeader h2{font-size:34px}.designerProcessGrid{display:block;background:none}.designerProcessGrid article,.designerProcessGrid article+article{padding:22px 0;border-bottom:1px solid var(--designer-line);min-height:0}.designerAppHeader,.workspaceHeader{display:block}.designerSaveState,.workspaceStatus{display:inline-flex;margin-top:15px}.projectTypeGrid{grid-template-columns:repeat(2,1fr)}.projectTypeCard{min-height:110px}.measurementGrid,.optionalGrid,.reviewGrid{grid-template-columns:1fr}.materialGrid{grid-template-columns:repeat(2,1fr)}.materialCard img{height:90px}.photoGrid{grid-template-columns:repeat(3,1fr)}.workspaceShell{display:block}.leftSidebar{display:none}.rightSidebar{display:block}.rightSidebar .propertyList{grid-template-columns:repeat(2,1fr)}.workspaceActions{grid-template-columns:1fr 1fr}.workspaceActions .btnPrimary{grid-column:1/-1}.viewportScene{min-height:330px}}
#threeViewport{position:relative;min-height:440px;background:#312e2a;touch-action:none}
#threeViewport canvas{display:block;width:100%;height:100%;min-height:440px;cursor:grab}
#threeViewport canvas:active{cursor:grabbing}.viewportLoading{position:absolute;inset:0;display:grid;place-items:center;color:#d8cabc;font-size:12px;letter-spacing:.08em;text-align:center;padding:30px}
.viewportToolbar button{cursor:pointer;padding:4px 7px;border:1px solid rgba(255,255,255,.16);border-radius:3px}.viewportToolbar button:hover{background:rgba(255,255,255,.08)}
