:root{color-scheme:dark;--ink:#f1f1ef;--muted:#a1a6a9;--line:#ffffff20;--pink:#e40046;--panel-width:370px}
body{background:#050607;color:var(--ink)}main{max-width:none;overflow:hidden;padding:0;margin:0}header{position:absolute;inset:0 0 auto;z-index:5;background:linear-gradient(#050607d9,transparent);padding:26px 3.5%;height:111px;align-items:flex-start;pointer-events:none}header a,header nav{pointer-events:auto}.brand strong{font-size:33px}.brand .furniture{font-size:12px}.brand small{color:#9c9fa2;font-size:12px;margin-top:8px}nav{font-size:14px;gap:32px}nav .active{padding:12px 0}.bag{background:#ffffff05;border-color:#ffffff26;border-radius:5px}.bag span{border-radius:3px}.concept{position:absolute;top:28px;left:255px;z-index:6;display:block;background:none;padding:0;color:#999e9f;font-size:12px;letter-spacing:1px}.concept span{display:block;font-size:12px;max-width:185px;line-height:1.5;margin-top:5px;color:#737b80}
.config{position:relative;display:block;margin:0;border:0;width:100%;min-height:720px;height:100svh;background:#050607;isolation:isolate}.studio{position:absolute;inset:0;display:block;background:#050607;min-height:0;padding:0}.viewer-stage{position:absolute;inset:0;width:100%;height:100%;overflow:hidden}.viewer-stage::after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,#050607a6 0%,transparent 22%,transparent 71%,#050607 100%);z-index:1}#cabinet{width:100%;height:100%;max-height:none;touch-action:pan-y;cursor:grab}#cabinet:active{cursor:grabbing}.scene-intro{position:absolute;z-index:2;left:4%;top:155px;pointer-events:none}.scene-intro h1{font-size:clamp(26px,3.1vw,49px);font-weight:500;letter-spacing:-1.8px;line-height:1.13;margin:0;color:#f1f0eb}.scene-intro .eyebrow{font-size:12px;color:#929a9e;letter-spacing:2px;margin-bottom:15px}.studio-top{top:auto;bottom:155px;left:4%;right:calc(var(--panel-width) + 8%);z-index:3;font-size:12px;color:#a4abae;letter-spacing:1.3px}.studio-top span:last-child{color:#929b9e}.studio-bottom{left:4%;right:calc(var(--panel-width) + 8%);bottom:39px;z-index:3;font-size:12px;color:#7c858a;flex-direction:row}.view-controls{position:absolute;bottom:77px;left:4%;right:calc(var(--panel-width) + 8%);z-index:3;margin:0;padding:0;gap:7px;justify-content:flex-start}.view-controls button{border:1px solid #ffffff20;background:#ffffff05;backdrop-filter:blur(12px);color:#adb5bb;border-radius:5px;font-size:13px;padding:11px 15px}.view-controls button.selected,.view-controls button[aria-pressed=true]{background:#ffffff12;border-color:#ffffff66;color:#fff}.view-controls button:hover{background:#ffffff16;color:white}#viewer-help{position:absolute;z-index:3;bottom:123px;left:4%;font-size:12px;text-align:left;color:#7e888d;margin:0;pointer-events:none}#model-status{color:#afb9bd;right:calc(var(--panel-width) + 7%);font-size:14px;padding-top:150px;z-index:2}
.options{position:absolute;z-index:4;right:3.5%;top:121px;bottom:34px;width:var(--panel-width);padding:25px 24px 22px;background:linear-gradient(135deg,#272b2e9c,#101416ba);border:1px solid #ffffff22;border-top-color:#ffffff38;border-radius:13px;box-shadow:0 28px 85px #0008,inset 0 1px 0 #ffffff07;backdrop-filter:blur(25px) saturate(115%);-webkit-backdrop-filter:blur(25px) saturate(115%);overflow-y:auto;scrollbar-width:thin;scrollbar-color:#ffffff30 transparent}.option-heading{margin-bottom:18px;align-items:center}.option-heading .eyebrow{font-size:12px;letter-spacing:1.7px;color:#f1f2f2;margin:0}.option-heading>span:last-child{font-size:12px;color:#818b91}.model-dimensions{gap:5px;margin-bottom:18px;padding-bottom:17px;border-color:#ffffff17}.model-dimensions strong{font-size:24px;letter-spacing:-1px;font-weight:400;color:#e9ecec}.model-dimensions span{font-size:12px;color:#899296}fieldset{margin-bottom:17px}legend{font-size:13px;font-weight:500;margin-bottom:9px;color:#d6dce0}legend small{font-size:12px;color:#838f96}.segments{gap:5px}.segments button{border-radius:4px;background:#080c0f4d;border-color:#ffffff14;color:#99a5ac;padding:9px 0;font-size:14px}.segments button:hover{background:#ffffff10;color:white}.segments button.selected{background:#ecedeb;color:#161d21;border-color:#ecedeb;box-shadow:0 2px 8px #0003}.swatches{gap:10px;padding:3px 0;margin-bottom:11px}.swatches button{width:27px;height:27px;border-color:#ffffff3b}.swatches button.selected:after{border-color:#e9eeee;inset:-4px}select,input{color:var(--ink);background:#080c0f4d;border:1px solid #ffffff1e;border-radius:4px}select{font-size:12px;padding:9px 10px}select option{background:#171c20;color:#eef1f1}.patterns{gap:5px}.patterns button{font-size:12px;min-height:68px;padding:9px 3px;gap:6px;background:#080c0f40;border:1px solid #ffffff15;border-radius:4px;color:#96a2a9}.patterns button.selected{border-color:#a7b4bc;background:#ffffff0b;box-shadow:none;color:#fff}.pattern-icon{width:29px;height:18px;opacity:.7;border-radius:1px}.patterns button.selected .pattern-icon{opacity:1}.price-block{border-color:#ffffff17;padding-top:17px}.price-block small{font-size:12px;color:#939fa5}.price-block strong{font-size:30px;font-weight:500;color:#f4f4ef}.demo-label{background:#ffffff07;border:1px solid #ffffff14;color:#89969d;border-radius:3px;font-size:12px;padding:5px}.delivery{font-size:12px;color:#ccd3d7;margin:13px 0 17px}.delivery span{font-size:12px;color:#858f96}.add-row label{font-size:12px;color:#96a3aa}.add-row input{height:44px;width:54px;background:#080c0f4d;border-color:#ffffff1e;padding:8px}.primary{border-radius:4px;font-size:12px;padding:13px 14px;gap:10px;background:#c9003d}.primary:hover{background:#e40046}.add-row .primary{min-height:44px}.fine{font-size:12px;color:#7e8b92;margin-top:11px}.model-note{font-size:12px;color:#727e85;line-height:1.5;margin-top:13px}.text-btn{color:#c1c9ce;margin-top:12px}
.order{padding:75px 5% 85px;background:#080a0c;max-width:1500px;margin:0 auto}.section-head{border-color:#ffffff16}.section-head h2{font-weight:500;font-size:32px;letter-spacing:-1px}.section-head .eyebrow{color:#8b969e}.section-head>span{color:#929da4}#empty>span{color:#343c42}#empty p,.item p,.project-note p{color:#919da5}.item{border-color:#ffffff16}.item input{background:#151b20;color:white;border-color:#ffffff20}.cart-preview,.cart-preview-empty{background:#050607;border-radius:4px}.item-actions button,.quote-actions button{color:#bcc7cf;background:transparent}.project-note small,.totals>small{color:#7d8b93}.totals .total{border-color:#ffffff20}.pillars{border-top:1px solid #ffffff13}.pillars article,.pillars article:nth-child(2),.pillars article:nth-child(3){background:#07090b;border-right:1px solid #ffffff12;padding:48px 12%}.pillars article>span{color:#7f8e98}.pillars h2{font-size:33px;font-weight:500;line-height:1.2;color:#e0e5e8}.pillars p{font-size:14px;color:#8e9ba4}footer{background:#050607;border-top:1px solid #ffffff13;color:#9ba7ae}.footer-brand{color:#dce2e6}dialog{color:#e8eef2;background:#151a1e;border:1px solid #ffffff20;border-radius:12px;box-shadow:0 30px 100px #0009}dialog input,dialog select{background:#0b1014;color:#eee;border-color:#ffffff22}dialog .close{color:white;background:transparent}dialog p{color:#a4b0b8}.notice{background:#ffffff08;color:#b9c3ca}#toast{background:#252e34;border:1px solid #ffffff20;border-radius:6px}
@media(min-width:1600px){:root{--panel-width:400px}.options{padding:28px}.config{min-height:760px}.scene-intro{top:170px}.model-dimensions{margin-bottom:24px}fieldset{margin-bottom:23px}.segments button{padding:11px 0}.patterns button{min-height:76px}.price-block{padding-top:21px}header{padding-left:4%;padding-right:4%}}
@media(max-width:1100px){:root{--panel-width:335px}.options{padding:22px 19px;right:2.5%}.scene-intro{top:140px}.scene-intro h1{font-size:34px}.scene-intro .eyebrow{font-size:12px}.concept{display:none}.studio-top,.studio-bottom,.view-controls{right:calc(var(--panel-width) + 5%)}.view-controls button{font-size:12px;padding:10px 11px}.swatches{gap:9px}.swatches button{width:26px;height:26px}.studio-bottom{flex-direction:column;gap:4px;bottom:25px}}
@media(max-width:760px){header{height:96px;padding:22px 6%}.brand strong{font-size:29px}.brand .furniture{font-size:12px}.brand small{display:none}nav{gap:20px;font-size:13px}nav>a:nth-child(2){display:none}.bag{padding:10px}.config{height:auto;min-height:0;padding:0 5% 34px}.studio{position:relative;height:640px;margin:0 -5.56%;width:111.12%}.viewer-stage{height:640px}.scene-intro{top:120px;left:7%}.scene-intro h1{font-size:32px}.scene-intro .eyebrow{font-size:12px;margin-bottom:10px}.studio-top{bottom:135px;left:7%;right:7%;font-size:12px}.studio-bottom{bottom:26px;left:7%;right:7%;flex-direction:row;font-size:12px}.view-controls{left:7%;right:7%;bottom:57px;flex-wrap:wrap}.view-controls button{font-size:12px;padding:10px 12px}#viewer-help{left:7%;bottom:108px;font-size:12px}#model-status{right:0;padding-top:70px}.options{position:relative;inset:auto;width:100%;margin-top:-6px;max-height:none;padding:25px 23px;border-radius:12px;background:linear-gradient(135deg,#242a2fc2,#12171ac9)}.option-heading .eyebrow{font-size:12px}.model-dimensions strong{font-size:25px}.model-dimensions span{font-size:12px}legend{font-size:14px}legend small{font-size:12px}fieldset{margin-bottom:22px}.segments button{padding:12px 0}.patterns button{font-size:12px;min-height:75px}.swatches{gap:12px}.swatches button{height:29px;width:29px}select{font-size:14px;padding:12px}.price-block small{font-size:12px}.delivery{font-size:12px}.delivery span{font-size:12px}.add-row .primary{font-size:13px}.fine,.model-note{font-size:12px}.order{padding:45px 6% 55px}.pillars{grid-template-columns:1fr}.pillars article,.pillars article:nth-child(2),.pillars article:nth-child(3){padding:32px 7%;border-bottom:1px solid #ffffff12}.pillars h2{font-size:28px}.pillars p{font-size:13px}}
@media(max-width:380px){.swatches{gap:10px}.swatches button{width:26px;height:26px}.view-controls{gap:4px}.view-controls button{padding:9px;font-size:12px}}
@media(prefers-reduced-transparency:reduce){.options{background:#151b20}.view-controls button{background:#11171c}}
/* Keep the glass controls readable; short screens scroll the panel itself. */
legend,.view-controls button,.patterns button,.primary,select{font-size:14px}.patterns{grid-template-columns:repeat(2,minmax(0,1fr))}.patterns button{flex-direction:row;justify-content:flex-start;text-align:left;padding:9px 10px;min-height:58px;gap:9px}.patterns .pattern-icon{width:25px;flex:0 0 25px}.pillars p,.project-note p,#empty p{font-size:16px;line-height:1.65}.model-note{font-size:12px}.swatches{flex-wrap:wrap}.model-dimensions{margin-bottom:17px}.options{scroll-padding-bottom:24px}.scene-intro h1{font-weight:500}
@media(max-width:760px){.patterns button{font-size:14px;min-height:59px}.view-controls button{font-size:13px}.model-note,.fine{font-size:12px}}
#viewer-help{right:calc(var(--panel-width) + 8%);line-height:1.5}
@media(max-width:760px){#viewer-help{right:7%}}

/* A feathered, translucent glow supports the copy without a panel edge. */
.scene-intro{isolation:isolate;width:max-content;max-width:86%;text-shadow:0 2px 6px #000c,0 0 2px #0009}
.scene-intro::before{content:'';position:absolute;inset:-24px -32px;z-index:-1;background:radial-gradient(ellipse at center,rgba(5,6,7,.66) 25%,rgba(5,6,7,.5) 50%,rgba(5,6,7,.18) 70%,transparent 85%);filter:blur(10px);pointer-events:none}
.scene-intro h1{color:#fff}
.scene-intro h1 span{display:block;white-space:nowrap}
.scene-intro .eyebrow{color:#e0e4e6;font-size:14px;font-weight:600;letter-spacing:1.6px;line-height:1.5;margin:0 0 15px}
/* Keep a shallow introduction above the cabinet on laptop-sized viewports. */
@media(min-width:761px) and (max-width:1536px),(min-width:761px) and (max-height:900px){
 .scene-intro{top:118px;max-width:calc(100% - var(--panel-width) - 12%)}
 .scene-intro h1{font-size:clamp(24px,2.35vw,32px);letter-spacing:-.8px;line-height:1.15}
 .scene-intro h1 span{display:inline}
 .scene-intro .eyebrow{margin-bottom:8px;letter-spacing:1.3px}
 .scene-intro::before{inset:-18px -28px}
}
@media(max-width:760px){
 .scene-intro{top:110px}
 .scene-intro h1{font-size:clamp(23px,6.1vw,28px);letter-spacing:-.8px;line-height:1.15}
 .scene-intro h1 span{display:inline}
 .scene-intro .eyebrow{margin-bottom:8px;letter-spacing:1px}
 .scene-intro::before{inset:-18px -24px}
}
/* Discrete dimensions: quiet rulers around the scene, generous pointer targets. */
:root{--panel-right:3.5vw}
.viewer-toolbar{position:absolute;z-index:3;left:4%;right:calc(var(--panel-width) + 8%);bottom:66px;display:flex;align-items:center;gap:28px}
.viewer-toolbar .view-controls{position:static;inset:auto;flex:0 0 auto;flex-wrap:nowrap;margin:0}
.width-control{flex:1 1 200px;min-width:180px;max-width:480px;margin-left:auto}
.slider-caption{display:block;font-size:12px;line-height:18px;color:#b7c0c5;letter-spacing:.6px}
.width-rail{position:relative;height:48px}
.dimension-range{appearance:none;-webkit-appearance:none;display:block;width:100%;height:32px;margin:0;padding:0;border:0;border-radius:0;background:transparent;cursor:pointer;touch-action:none}
.dimension-range:focus-visible{outline:1px solid #cad5dc;outline-offset:5px;border-radius:3px}
.dimension-range::-webkit-slider-runnable-track{inline-size:100%;block-size:2px;background:#c5cfd266;border:0;border-radius:1px}
.dimension-range::-moz-range-track{inline-size:100%;block-size:2px;background:#c5cfd266;border:0;border-radius:1px}
.dimension-range::-webkit-slider-thumb{box-sizing:border-box;appearance:none;-webkit-appearance:none;inline-size:14px;block-size:14px;margin-block-start:-6px;background:#edf1f2;border:1px solid #fff;border-radius:50%;box-shadow:0 1px 8px #0009}
.dimension-range::-moz-range-thumb{box-sizing:border-box;inline-size:14px;block-size:14px;background:#edf1f2;border:1px solid #fff;border-radius:50%;box-shadow:0 1px 8px #0009}
.dimension-range:hover::-webkit-slider-thumb,.dimension-range:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 5px #e4edf21c,0 1px 8px #0009}
.width-ticks{position:absolute;left:7px;right:7px;top:16px;pointer-events:none}
.width-ticks span{position:absolute;transform:translateX(-50%);padding-top:11px;color:#9da9af;font-size:12px;white-space:nowrap;font-variant-numeric:tabular-nums}
.width-ticks span::before{content:'';position:absolute;width:1px;height:5px;top:0;left:50%;background:#dce5e477}
.width-ticks span:first-child::before,.width-ticks span:last-child::before{height:7px}
.height-control{position:absolute;z-index:3;right:calc(var(--panel-width) + var(--panel-right) + 10px);top:50%;transform:translateY(-50%);width:56px}
.height-control .slider-caption{text-align:center;margin-bottom:12px}
.height-rail{position:relative;height:clamp(160px,29vh,260px)}
.height-rail .dimension-range{writing-mode:vertical-lr;direction:rtl;width:32px;height:100%;margin-left:2px}
.height-ticks{position:absolute;left:18px;top:7px;bottom:7px;pointer-events:none}
.height-ticks span{position:absolute;left:0;transform:translateY(50%);padding-left:16px;color:#a8b3b9;font-size:12px;line-height:16px;font-variant-numeric:tabular-nums}
.height-ticks span::before{content:'';position:absolute;left:0;top:50%;width:7px;height:1px;background:#dce5e477}
.slider-unit{display:block;text-align:center;font-size:12px;color:#8f9ba3;margin-top:12px}
.dimension-tag{position:absolute;z-index:2;pointer-events:none;white-space:nowrap;font-size:13px;line-height:20px;letter-spacing:.5px;font-variant-numeric:tabular-nums;color:#d0d8dc;text-shadow:0 1px 4px #000,0 0 10px #000;padding:0 5px;background:radial-gradient(ellipse,#05060755,transparent 75%)}
.dimension-tag[hidden]{display:none}
.width-tag{transform:translate(-50%,0)}
.height-tag{transform:translate(-50%,-50%) rotate(-90deg)}
.studio-top{bottom:180px}#viewer-help{bottom:148px}
@media(max-width:1100px){:root{--panel-right:2.5vw}.viewer-toolbar{gap:18px;right:calc(var(--panel-width) + 5%)}.viewer-toolbar .view-controls button{font-size:12px;padding:10px 9px}.width-control{min-width:150px}}
@media(min-width:761px) and (max-width:1000px){.viewer-toolbar{flex-wrap:wrap;gap:12px;bottom:58px}.width-control{flex-basis:100%;max-width:none}.studio-top{bottom:226px}#viewer-help{bottom:194px}.viewer-toolbar .view-controls{width:100%}.viewer-toolbar .view-controls button{flex:1}}
@media(max-width:760px){.viewer-toolbar{left:7%;right:7%;bottom:26px;flex-wrap:wrap;gap:10px}.viewer-toolbar .view-controls{width:100%;gap:5px}.viewer-toolbar .view-controls button{flex:1;padding:10px 7px;font-size:12px}.width-control{flex-basis:100%;max-width:none;margin:0}.height-control{right:1%;top:51%;width:49px}.height-control .slider-caption{font-size:12px;letter-spacing:0}.height-rail{height:185px}.height-ticks span{padding-left:13px}.studio-top,.studio-bottom{display:none}#viewer-help{bottom:162px;right:7%;font-size:12px}.dimension-tag{font-size:12px}}

.width-ticks span:first-child{transform:translateX(-100%)}
.width-ticks span:first-child::before{left:100%}

/* Compact choices with the ordering action anchored inside the viewport. */
.options{display:flex;flex-direction:column;bottom:auto;height:auto;max-height:calc(100svh - 139px);padding:18px;overflow:hidden}
.options-body{min-height:0;overflow-y:auto;overflow-x:hidden;padding:3px;scrollbar-width:thin;scrollbar-color:#ffffff30 transparent}
.options .option-heading{margin-bottom:10px;line-height:18px}
.options .model-dimensions{gap:3px;margin-bottom:12px;padding-bottom:10px}
.options .model-dimensions strong{font-size:23px;line-height:28px}
.options .model-dimensions span{display:none}
.options fieldset{margin-bottom:12px}
.options legend{font-size:14px;line-height:18px;margin-bottom:8px}
.options .size-field{min-height:34px;margin-bottom:9px}
.options .size-field legend{float:left;width:105px;display:block;margin:0;padding-top:1px}
.options .size-field legend small{display:block;font-size:12px;line-height:14px}
.options .size-field .segments{margin-left:109px;gap:4px}
.options .segments button{height:34px;padding:0;font-size:14px}
.options .swatches{gap:7px;flex-wrap:nowrap;padding:4px 0;margin:0}
.options .swatches button{width:26px;height:26px;flex:0 0 26px}
.options .swatches .more-colors{display:grid;place-items:center;background:#ffffff08;color:#e7ecef;border:1px dashed #b7c0c599;font-size:23px;line-height:1;padding:0}
.options .swatches .more-colors:hover{background:#ffffff20;border-style:solid}
.options .patterns{gap:5px}
.options .patterns button{min-height:36px;padding:6px 8px;font-size:14px;line-height:18px;gap:7px}
.options .patterns .pattern-icon{width:21px;flex-basis:21px;height:16px}
.options-body>fieldset:last-child{margin-bottom:3px}
.options-checkout{flex-shrink:0;padding-top:10px}
.options .price-block{padding-top:10px;gap:8px}
.options .price-block>div{display:flex;flex-direction:row-reverse;align-items:center;gap:10px}
.options .price-block small{font-size:12px;line-height:14px;max-width:73px;margin:0}
.options .price-block strong{font-size:25px;line-height:31px;white-space:nowrap}
.options .demo-label{display:none}
.options .delivery{font-size:12px;line-height:15px;margin:7px 0 9px}
.options .delivery span{font-size:12px;line-height:15px;margin:0}
.options .add-row{gap:9px}
.options .add-row label{gap:3px;line-height:14px}
.options .add-row input{height:42px;width:54px}
.options .add-row .primary{min-height:42px;font-size:14px;padding:10px 12px}
.options #cancel-edit{margin-top:7px}
@media(min-width:761px) and (max-height:740px){.options{top:103px;max-height:calc(100svh - 119px);padding:14px 16px}.options .option-heading{margin-bottom:7px}.options .model-dimensions{display:none}.options fieldset{margin-bottom:9px}.options-checkout{padding-top:7px}}
@media(max-width:760px){.options{height:auto;max-height:none;padding:18px}.options-body{overflow:visible}.options .swatches{justify-content:space-between;gap:4px}}
@media(max-width:360px){.options{padding:14px 10px}.options .swatches button{width:24px;height:24px;flex-basis:24px}.options .size-field legend{width:97px}.options .size-field .segments{margin-left:101px}.options .patterns button{padding:6px;font-size:12px}}

/* Meter marks and the intermediate widths share the nonlinear scale. */
.width-stops{position:absolute;left:7px;right:7px;top:16px;pointer-events:none}
.width-stops i{position:absolute;top:0;width:1px;height:5px;background:#dce5e4aa;transform:translateX(-50%)}
.width-ticks span{padding-top:15px}
.width-ticks span::before,.width-ticks span:first-child::before,.width-ticks span:last-child::before{height:11px;background:#dce5e4bb}

/* Native dialog keeps keyboard focus within the full RAL palette. */
#ral-modal{width:min(740px,94vw);max-height:88svh;padding:24px;overflow:hidden}
#ral-modal[open]{display:flex;flex-direction:column}
.ral-heading{display:flex;justify-content:space-between;align-items:flex-start;flex-shrink:0}
.ral-heading .eyebrow{margin:0 0 5px;font-size:12px;color:#aebac0}
#ral-title{font-size:27px;margin:0;letter-spacing:-.5px}
#ral-close{width:36px;height:36px;flex:0 0 36px;border-color:#ffffff22;background:#ffffff05;border-radius:50%;font-size:25px;color:#fff;line-height:1}
.ral-filters{display:grid;grid-template-columns:1fr 1fr;gap:12px;flex-shrink:0}
#ral-modal .ral-filters label{margin-top:18px;color:#bcc6cc}
#ral-modal input,#ral-modal select{height:42px;padding:9px 11px;font-size:14px}
#ral-count{margin:12px 0;font-size:12px;flex-shrink:0}
#ral-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:8px;overflow-y:auto;min-height:0;padding:4px;scrollbar-width:thin}
.ral-tile{padding:5px;border:1px solid #ffffff20;border-radius:5px;background:#080c0f4d;display:flex;flex-direction:column;gap:7px;font-size:12px;line-height:18px;color:#dfe5e9}
.ral-chip{width:100%;height:46px;border-radius:2px;border:1px solid #ffffff17}
.ral-tile:hover{background:#ffffff13;border-color:#ffffff70}
.ral-tile.selected{border-color:#fff;box-shadow:inset 0 0 0 1px #fff}
#ral-note{font-size:12px;margin:14px 0 0;flex-shrink:0;color:#9da9b1}
@media(max-width:520px){#ral-modal{padding:18px}#ral-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:6px}.ral-filters{gap:8px}.ral-chip{height:40px}}

/* Explicit touch controls replace browser-dependent number spinners. */
.quantity-field{display:flex;flex-direction:column;gap:3px;min-width:0;flex:0 0 auto}
.quantity-field>label,.options .quantity-field>label{font-size:12px;line-height:16px;color:#a8b4bc;display:block}
.quantity-stepper{display:flex;align-items:center;width:132px;border:1px solid #ffffff2c;border-radius:5px;background:#080c0f66}
.quantity-stepper button{flex:0 0 44px;width:44px;height:44px;padding:0;border:0;border-radius:4px;background:#ffffff09;color:#edf1f2;font-size:24px;line-height:1;touch-action:manipulation;user-select:none;-webkit-user-select:none}
.quantity-stepper button:hover:not(:disabled){background:#ffffff20}
.quantity-stepper button:active:not(:disabled){background:#ffffff30}
.quantity-stepper button:disabled{opacity:.3;cursor:default}
.quantity-stepper input,.options .add-row .quantity-stepper input,.item .quantity-stepper input{width:42px;min-width:0;flex:1 1 42px;height:44px;border:0;border-radius:0;padding:0 2px;text-align:center;font-size:16px;font-variant-numeric:tabular-nums;background:transparent;appearance:textfield;-moz-appearance:textfield}
.quantity-stepper input::-webkit-inner-spin-button,.quantity-stepper input::-webkit-outer-spin-button{appearance:none;-webkit-appearance:none;margin:0}
.options .add-row .primary{min-height:46px;padding:10px;gap:5px}
.item{grid-template-columns:85px minmax(0,1fr) 132px 130px 90px}
@media(max-width:900px){.item{grid-template-columns:65px minmax(0,1fr) 132px 105px 75px}}
@media(max-width:680px){.item{grid-template-columns:60px minmax(0,1fr);gap:12px 16px}.item .quantity-field{grid-column:2;grid-row:2}.item .item-price{grid-column:2;grid-row:3;text-align:left}.item .item-actions{grid-column:2;grid-row:4;flex-direction:row;gap:20px}}

/* Keep the basket label and count together, including narrow phone headers. */
header nav{flex-shrink:0}
header .bag{display:inline-flex;align-items:center;justify-content:center;gap:8px;white-space:nowrap;flex-shrink:0}
header .bag #badge{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;margin:0;min-width:23px;line-height:18px;font-variant-numeric:tabular-nums}
@media(max-width:420px){header{padding-left:4%;padding-right:4%;gap:8px}header .brand{width:110px;flex:0 0 110px}header .brand .furniture{font-size:10px;letter-spacing:4px}header nav{gap:8px}header .bag{padding:10px 8px;gap:6px}header .bag #badge{padding:3px 5px}}

/* Native vertical scrolling wins until a deliberate horizontal thumb drag. */
#width-slider{pointer-events:none;touch-action:pan-y pinch-zoom}
#width-gesture{position:absolute;inset:0 0 auto;height:32px;z-index:1;touch-action:pan-y pinch-zoom;cursor:pointer;user-select:none;-webkit-user-select:none}

/* Suppress mobile tap flash on the transparent width-slider hit surface. */
#width-gesture,#width-slider{-webkit-tap-highlight-color:transparent}

.options #color-label{min-width:0;text-align:right;line-height:18px;overflow-wrap:anywhere}

.options .price-block small{max-width:125px}
.options #acoustic-label{min-width:0;text-align:right;line-height:18px}

/* Mandatory order costs remain separate from cabinet quantities. */
#order-costs[hidden]{display:none}
.order-cost{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:20px 0;border-bottom:1px solid #ffffff16}
.order-cost>div{min-width:0}
.order-cost h3{font-size:14px;font-weight:500;line-height:1.4;margin:0 0 5px}
.order-cost p{font-size:12px;line-height:1.5;color:#a1adb5;margin:0}
.order-cost>strong{font-size:15px;font-weight:600;white-space:nowrap;flex-shrink:0}
.cost-vat-note{font-size:12px;color:#8e9ba4;margin:10px 0 0;text-align:right}
@media(max-width:680px){.order-cost{gap:12px;padding:17px 0}.order-cost>strong{font-size:14px}}

/* Trade pricing: unit and line prices at the right, net order total first. */
.order .item{grid-template-columns:85px minmax(0,1fr) 132px minmax(270px,300px);gap:20px}
.item-details{min-width:0}
.order .item .item-actions{display:flex;flex-direction:row;gap:16px;margin-top:12px}
.order .item .item-actions button{font-size:12px;padding:4px 0}
.order .item .item-price{display:grid;grid-template-columns:1fr 1fr;gap:20px;text-align:right;grid-column:auto;grid-row:auto}
.item-price small{display:block;font-size:12px;line-height:18px;font-weight:400;color:#a4afb7;margin-bottom:5px}
.item-price strong{display:block;font-size:17px;line-height:24px;font-weight:500;white-space:nowrap;font-variant-numeric:tabular-nums}
.item-price .line-subtotal strong{font-size:20px;font-weight:600;color:#f4f5f3}
.totals .order-net-total{display:flex;flex-direction:column;align-items:flex-end;gap:7px;padding:0 0 15px;margin:0 0 14px;border-bottom:1px solid #ffffff26;color:#f4f5f3}
.totals .order-net-total>span{font-size:16px;font-weight:500}
.totals .order-net-total>strong{font-size:34px;font-weight:600;line-height:1.15;letter-spacing:-.6px;font-variant-numeric:tabular-nums}
.totals .tax-total{font-size:13px;line-height:19px;font-weight:400;color:#9ba6ae;margin-bottom:7px;gap:12px}
.totals .tax-total>span:last-child{white-space:nowrap;font-variant-numeric:tabular-nums}
.totals>small{margin-top:16px;line-height:1.5}
.project-note .b2b-note{font-size:14px;color:#c2cbd1;margin:0 0 12px}
.modal-total{display:flex;flex-direction:column;align-items:flex-end;gap:7px;margin:22px 0 14px;padding-bottom:14px;border-bottom:1px solid #ffffff26}
.modal-total small{font-size:14px;font-weight:400;color:#dfe5e9}
.modal-total strong{font-size:32px;font-weight:600;font-variant-numeric:tabular-nums}
.modal-tax{display:flex;justify-content:space-between;gap:12px;font-size:13px;color:#9ba6ae;margin-bottom:7px}
.modal-tax span:last-child{white-space:nowrap}
.modal-tax+.notice{margin-top:18px}
@media(min-width:681px) and (max-width:1000px){.order .item{grid-template-columns:65px minmax(0,1fr) 260px;gap:12px 16px}.order .item .quantity-field{grid-column:2;grid-row:2}.order .item .item-price{grid-column:3;grid-row:1 / 3;gap:14px}}
@media(max-width:680px){.order .item{grid-template-columns:60px minmax(0,1fr);gap:14px 16px}.order .item .quantity-field{grid-column:2;grid-row:2}.order .item .item-price{grid-column:1 / -1;grid-row:3;gap:20px;padding-top:3px}.item-price strong{font-size:16px}.item-price .line-subtotal strong{font-size:19px}.totals .order-net-total>strong{font-size:32px}}

/* Product imagery and drawings stay with the exact cart configuration. */
.order .item{grid-template-columns:85px minmax(0,1fr) 190px minmax(270px,300px)}
.cart-preview-button{position:relative;width:100%;padding:0;border:1px solid #ffffff1a;border-radius:5px;background:#050607;cursor:zoom-in;overflow:hidden}
.cart-preview-button .cart-preview{display:block}
.cart-preview-button>span{position:absolute;right:3px;bottom:3px;display:grid;place-items:center;width:19px;height:19px;background:#182129d9;color:#fff;border-radius:3px;font-size:15px;line-height:1}
.cart-preview-button:hover{border-color:#ffffff65}
.item-tools{display:flex;gap:14px;align-items:flex-end}
.drawing-button{position:relative;flex:0 0 44px;width:44px;height:46px;display:grid;place-items:center;background:#ffffff04;color:#b9c7d0;border:1px solid #ffffff25;border-radius:5px;cursor:pointer}
.drawing-button svg{width:27px;height:33px}
.drawing-button:hover{color:#fff;background:#ffffff0e;border-color:#ffffff55}
.drawing-button.pending .drawing-progress{position:absolute;right:3px;top:3px;width:7px;height:7px;border-radius:50%;background:#aabecb;animation:drawing-pulse 1.2s ease-in-out infinite alternate}
.drawing-button.error{border-color:#cd8d58}
@keyframes drawing-pulse{to{opacity:.3}}
.media-open{overflow:hidden}
#media-modal{width:min(1320px,96vw);max-width:none;max-height:94svh;padding:0;overflow:hidden;background:#10161b}
#media-modal[open]{display:flex;flex-direction:column}
#media-modal::backdrop{background:#020507aa;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.media-toolbar{display:flex;align-items:center;gap:18px;padding:12px 18px;border-bottom:1px solid #ffffff1c;flex-shrink:0}
#media-modal h2{margin:0 auto 0 0;font-size:16px;letter-spacing:0;font-weight:500}
#drawing-download{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:9px 16px;border:1px solid #ffffff38;border-radius:5px;color:#f3f6f8;background:#ffffff08;font-size:14px;text-decoration:none;white-space:nowrap}
#drawing-download[hidden]{display:none}
#media-close{width:44px;height:44px;flex-shrink:0;font-size:28px;color:#fff;background:transparent;border:0;border-radius:5px}
#media-close:hover,#drawing-download:hover{background:#ffffff15}
#media-content{overflow:auto;min-height:0;padding:18px;overscroll-behavior:contain}
#media-content .large-cabinet-preview{display:block;width:100%;max-height:77svh;object-fit:contain}
#media-content .drawing-sheet{display:block;width:100%;min-width:760px;height:auto;background:#fff;box-shadow:0 10px 30px #0005}
.media-loading{padding:65px 20px;text-align:center}
.media-retry{padding:12px 18px;background:#29343d;color:white;border:1px solid #ffffff30;border-radius:5px}
.cart-preview-button:focus-visible,.drawing-button:focus-visible,#drawing-download:focus-visible,#media-close:focus-visible{outline:2px solid #d9e8f3;outline-offset:3px}
@media(min-width:681px) and (max-width:1000px){.order .item{grid-template-columns:65px minmax(0,1fr) 260px}.order .item .item-tools{grid-column:2;grid-row:2}}
@media(max-width:680px){.order .item{grid-template-columns:60px minmax(0,1fr)}.order .item .item-tools{grid-column:1 / -1;grid-row:2}.media-toolbar{padding:8px 10px;gap:8px}#media-modal h2{font-size:14px}#drawing-download{padding:8px 10px}#media-content{padding:10px}}
@media(prefers-reduced-motion:reduce){.drawing-button.pending .drawing-progress{animation:none}}
.order .item{grid-template-columns:85px minmax(0,1fr) 264px minmax(270px,300px)}
.model-download-button{height:46px;width:60px;flex:0 0 60px;padding:4px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;background:#ffffff04;color:#b9c7d0;border:1px solid #ffffff25;border-radius:5px;cursor:pointer}
.model-download-button svg{width:21px;height:21px}.model-download-button span{font-size:12px;line-height:14px;white-space:nowrap}
.model-download-button:hover{color:white;background:#ffffff0e;border-color:#ffffff55}
.model-download-button:focus-visible,.model-download-choices a:focus-visible{outline:2px solid #d9e8f3;outline-offset:3px}
#media-modal.show-model-downloads{width:min(640px,94vw)}
.show-model-downloads #media-content{padding:24px}
.show-model-downloads #media-content>p{font-size:15px;line-height:1.6;margin:0 0 20px}
.model-download-choices{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:20px 0}
.model-download-choices a{display:flex;flex-direction:column;gap:10px;min-height:108px;padding:18px;background:#ffffff07;border:1px solid #ffffff30;border-radius:6px;color:#f1f4f6;text-decoration:none}
.model-download-choices a:hover{background:#ffffff12;border-color:#a2b6c4}
.model-download-choices strong{font-size:17px;font-weight:500}.model-download-choices span{font-size:13px;line-height:1.5;color:#a8b5bf}
.show-model-downloads #media-content>.model-download-note{font-size:13px;color:#a8b5bf}.show-model-downloads #media-content>.model-download-code{font-size:12px;color:#788a97;overflow-wrap:anywhere;margin-bottom:0}
@media(min-width:681px) and (max-width:1100px){.order .item{grid-template-columns:65px minmax(0,1fr) 260px;gap:12px 16px}.order .item .item-tools{grid-column:1 / 3;grid-row:2}.order .item .item-price{grid-column:3;grid-row:1 / 3;gap:14px}}
@media(max-width:680px){.order .item{grid-template-columns:60px minmax(0,1fr)}.model-download-choices{grid-template-columns:1fr}.model-download-choices a{min-height:90px}.show-model-downloads #media-content{padding:18px}}
.hieselaar-name{color:#0089b6}
.pillars article{background:#e40046;border:0;padding:48px 12%;color:#fff}
.pillars article:nth-child(2){background:#0089b6;border:0;color:#07151b}
.pillars article:nth-child(3){background:#2e3336;border:0;color:#fff}
.pillars article h2{color:inherit}
.pillars article>span,.pillars article p{color:inherit;opacity:.9}
.pillars article>span{font-size:12px}.pillars article p{font-size:16px;line-height:1.65}
.photo-gallery{padding:72px 5% 48px;max-width:1600px;margin:auto}
.photo-gallery+.photo-gallery{padding-top:36px;padding-bottom:80px}
.gallery-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:26px}
.gallery-heading .eyebrow{font-size:12px;color:#8d9ba5;letter-spacing:1.4px;margin:0 0 12px}
.gallery-heading h2{font-size:clamp(28px,3vw,40px);font-weight:500;letter-spacing:-1px;margin:0;color:#edf1f3}
.gallery-note{font-size:13px;color:#94a1aa;margin:12px 0 0}
.gallery-controls{display:flex;align-items:center;gap:12px;flex-shrink:0}
.gallery-controls button{display:grid;place-items:center;width:46px;height:46px;padding:0;background:#ffffff04;color:#edf1f3;border:1px solid #ffffff35;border-radius:50%}
.gallery-controls button:hover:not(:disabled){background:#ffffff14;border-color:#ffffff80}
.gallery-controls button:disabled{opacity:.28;cursor:default}
.gallery-controls svg{width:22px;height:22px}.gallery-counter{font-size:13px;color:#a3b0b9;font-variant-numeric:tabular-nums;min-width:48px;text-align:center}
.gallery-track{display:flex;gap:24px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:thin;scrollbar-color:#46545f #101519;overscroll-behavior-x:contain;padding-bottom:16px}
.gallery-track{--gallery-height:clamp(300px,38vw,480px)}
.gallery-track{cursor:grab;user-select:none;-webkit-user-select:none}
.gallery-track.mouse-dragging{cursor:grabbing;scroll-snap-type:none;scroll-behavior:auto}
.gallery-slide img{-webkit-user-drag:none}
#projects-track{--gallery-height:clamp(300px,42vw,540px)}
.gallery-track::after{content:'';flex:0 0 var(--gallery-tail,0px)}
.gallery-slide{flex:0 0 auto;width:min(calc(var(--gallery-height) * var(--photo-ratio)),82vw);min-width:0;margin:0;scroll-snap-align:start}
.gallery-slide img{display:block;width:100%;height:var(--gallery-height);object-fit:contain;background:#0b0e10;border-radius:3px}
.gallery-slide figcaption{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:15px 0;color:#e4e9ed;font-size:16px}
.gallery-slide figcaption small{color:#91a0ab;font-size:12px;white-space:nowrap}
.gallery-track:focus-visible,.gallery-controls button:focus-visible{outline:2px solid #0089b6;outline-offset:5px}
@media(max-width:760px){.pillars article{display:block;padding:32px 7%}.pillars article p{max-width:38em}.photo-gallery{padding:44px 6% 28px}.photo-gallery+.photo-gallery{padding-top:20px;padding-bottom:48px}.gallery-heading{align-items:flex-start;gap:16px;flex-wrap:wrap;margin-bottom:22px}.gallery-controls{margin-left:auto}.gallery-track{gap:16px;--gallery-height:320px}#projects-track{--gallery-height:280px}.gallery-slide figcaption{font-size:14px;flex-wrap:wrap;gap:6px}.gallery-slide figcaption small{font-size:12px}}

.options .price-exclusions{font-size:13px;line-height:1.4;color:#b9c5cd;margin:5px 0 0}

.order-cost .cost-heading{display:flex;align-items:center;gap:3px;margin-bottom:0}
.cost-info{display:grid;place-items:center;flex:0 0 44px;width:44px;height:44px;padding:0;background:transparent;border:0;color:#aebdc7}
.cost-info span{display:grid;place-items:center;width:23px;height:23px;border:1px solid #6d818f;border-radius:50%;font-size:14px;font-weight:500;line-height:1}
.cost-info:hover{color:white}.cost-info:hover span{border-color:#c8d8e3;background:#ffffff0b}
.cost-info:focus-visible{outline:2px solid #0089b6;outline-offset:1px;border-radius:50%}

.order-cost .service-icon{width:56px;height:56px;border-radius:12px;flex-shrink:0}.order-cost>div{flex:1}@media(max-width:480px){.order-cost .service-icon{width:40px;height:40px;border-radius:9px}.order-cost{gap:10px}}

.cart-preview-button{aspect-ratio:1}.cart-preview-button .cart-preview{height:auto;aspect-ratio:1;object-fit:contain;background:#050607}

.options .delivery .next-placement{display:block;line-height:1.4}.options .delivery #next-placement-date{display:inline;color:#e1e8ed;white-space:nowrap}

.cart-heading-actions{display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:10px 18px;color:#929da4;font-size:13px}
#clear-cart{padding:9px 12px;min-height:40px;border:1px solid #ffffff26;border-radius:5px;background:transparent;color:#bac4cb;font-size:12px}
#clear-cart:hover{background:#ffffff0b;border-color:#ffffff60;color:white}
.clear-cart-actions{display:flex;justify-content:flex-end;gap:12px;flex-wrap:wrap;margin-top:24px}
.clear-cart-actions>button{padding:12px 16px;border-radius:5px;background:transparent;color:#e8eef2;border:1px solid #ffffff30}
dialog .clear-cart-actions>.primary{width:auto;margin:0;background:#c9003d;border-color:#c9003d}
@media(max-width:650px){.cart-heading-actions{align-items:flex-end;flex-direction:column;gap:6px}#clear-cart{font-size:11px;padding:8px}.order .section-head{gap:12px}}

.options .acoustic-controls{display:grid;grid-template-columns:minmax(0,1fr) 46px;align-items:center;gap:8px}
.options .acoustic-controls .patterns{gap:4px}
.options .acoustic-controls .patterns button{padding:6px 3px;font-size:12px;gap:4px;min-width:0}
.options .acoustic-controls .pattern-icon{width:15px;flex-basis:15px;height:14px}
.acoustic-colors{display:flex;gap:6px;align-items:center}
.options .acoustic-colors button{width:20px;height:20px;min-width:20px;padding:0;border:1px solid #ffffff66;border-radius:50%;background:#3e4448;position:relative}
.options .acoustic-colors button[data-acoustic=light]{background:#b3bdc3}
.acoustic-colors button[aria-pressed=true]:after{content:'';position:absolute;inset:-4px;border:1px solid #dfe8ed;border-radius:50%}
.acoustic-colors button:disabled{opacity:.3;cursor:default}
