.configurator{background:#111419;grid-template-columns:minmax(0,1fr) 25rem;min-height:100dvh;display:grid}.scene-area{min-width:0;min-height:100dvh;position:relative;overflow:hidden}.scene-area:before{z-index:1;pointer-events:none;content:"";background:radial-gradient(circle at 72% 24%,#46849a1c,#0000 28%),radial-gradient(circle at 28% 76%,#d35b9114,#0000 26%),linear-gradient(110deg,#ffffff06,#0000 42%);position:absolute;inset:0}.scene-copy{z-index:2;pointer-events:none;max-width:28rem;position:absolute;top:clamp(1.4rem,4vw,3.4rem);left:clamp(1.4rem,5vw,4.8rem)}.eyebrow,.step-label{color:#62c7cc;letter-spacing:.16em;text-transform:uppercase;font-size:.68rem;font-weight:700}.scene-copy h1{color:#f6f3ed;letter-spacing:-.055em;margin:.35rem 0 0;font-size:clamp(2.35rem,4.4vw,4.35rem);font-weight:550;line-height:.98}.scene-copy p{color:#a9afb9;margin:.85rem 0 0;font-size:clamp(.82rem,1.25vw,1rem)}.canvas-shell{cursor:grab;touch-action:none;width:100%;height:100dvh}.canvas-shell:active{cursor:grabbing}.control-panel{z-index:3;background:linear-gradient(#23262cfa,#17191efc);border-left:1px solid #ffffff13;flex-direction:column;min-height:100dvh;padding:2rem 1.6rem 1.35rem;display:flex;position:relative;overflow-y:auto;box-shadow:-24px 0 60px #0000003d}.mobile-panel-toggle{display:none}.panel-intro h2{color:#f2efe9;letter-spacing:-.035em;margin:.35rem 0 0;font-size:1.62rem;font-weight:600}.panel-intro p{color:#8f97a2;margin:.55rem 0 0;font-size:.86rem;line-height:1.55}.zone-tabs{gap:.48rem;margin-top:1.55rem;display:grid}.zone-tab{color:#d8d9dc;text-align:left;cursor:pointer;background:#ffffff06;border:1px solid #ffffff12;border-radius:.72rem;grid-template-columns:1rem 1fr;align-items:center;gap:.75rem;width:100%;min-height:3.65rem;padding:.65rem .8rem;transition:border-color .16s,background .16s,transform .16s;display:grid}.zone-tab:hover{background:#ffffff0b;transform:translate(-2px)}.zone-tab.is-active{background:#62c7cc12;border-color:#62c7cc8c;box-shadow:inset 0 0 0 1px #62c7cc14}.zone-colour{border:1px solid #ffffff38;border-radius:50%;width:1rem;height:1rem;box-shadow:0 2px 8px #0000003d}.zone-copy{justify-content:space-between;align-items:baseline;gap:.7rem;display:flex}.zone-copy strong{font-size:.86rem;font-weight:600}.zone-copy small{color:#818995;font-size:.7rem}.colour-picker{margin-top:1.65rem}.picker-heading{justify-content:space-between;align-items:end;gap:1rem;display:flex}.picker-heading h3{color:#e9e7e2;margin:.2rem 0 0;font-size:1rem}.picker-heading output{color:#9ca3ad;font-size:.72rem}.swatch-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:.46rem;margin-top:.75rem;display:grid}.swatch{color:#b7bcc4;cursor:pointer;background:#ffffff07;border:1px solid #ffffff13;border-radius:.62rem;align-items:center;gap:.55rem;min-width:0;min-height:2.55rem;padding:.45rem .55rem;font-size:.74rem;display:flex}.swatch:hover{background:#ffffff0e}.swatch.is-active{color:#fff;background:#ffffff16;border-color:#fff6}.swatch-colour{border:1px solid #ffffff2e;border-radius:50%;flex:none;width:1.2rem;height:1.2rem;box-shadow:0 2px 6px #0000004d}.selection-summary{color:#777f8a;justify-content:space-between;align-items:center;gap:1rem;margin-top:auto;padding-top:1.5rem;font-size:.7rem;display:flex}.selection-summary strong{color:#cacdd2;text-align:right;max-width:13rem;font-weight:500}.shop-button{color:#101418;background:#62c7cc;border:1px solid #62c7cc;border-radius:.68rem;justify-content:center;align-items:center;width:100%;min-height:3.15rem;margin-top:.85rem;font-size:.82rem;font-weight:750;text-decoration:none;transition:background .16s,border-color .16s,transform .16s;display:flex}.shop-button:hover{background:#8cdee2;border-color:#8cdee2;transform:translateY(-1px)}.shop-button:focus-visible{outline-offset:2px;outline:2px solid #fff}.reset-button{color:#aeb3bb;cursor:pointer;background:0 0;border:1px solid #ffffff1f;border-radius:.68rem;width:100%;min-height:2.8rem;margin-top:.55rem;font-size:.77rem}.reset-button:hover{color:#fff;border-color:#ffffff3d}@media (width<=760px){.configurator{grid-template-rows:1fr;grid-template-columns:1fr;height:100svh;min-height:100svh;overflow:hidden}.scene-area,.canvas-shell{height:100svh;min-height:100svh}.scene-copy{top:1rem;left:1rem}.scene-copy h1{font-size:2rem}.scene-copy p{margin-top:.45rem;font-size:.72rem}.control-panel{overscroll-behavior:contain;touch-action:pan-y;will-change:transform;border-top:1px solid #ffffff14;border-left:0;border-radius:1.15rem 1.15rem 0 0;min-height:0;max-height:56svh;padding:1.2rem 1rem 1rem;transition:transform .22s;position:fixed;bottom:0;left:0;right:0;overflow-y:auto;transform:translateY(0);box-shadow:0 -18px 50px #00000040}.control-panel.is-collapsed{transform:translateY(calc(100% - 4.25rem))}.mobile-panel-toggle{z-index:4;color:#ece9e3;letter-spacing:.04em;cursor:pointer;background:#23262c;border:0;border-bottom:1px solid #ffffff14;border-radius:1.15rem 1.15rem 0 0;justify-content:space-between;align-items:center;width:calc(100% + 2rem);min-height:4.25rem;margin:-1.2rem -1rem 1rem;padding:1rem 1.15rem;font-size:.8rem;font-weight:700;display:flex;position:sticky;top:-1.2rem}.toggle-chevron{border-bottom:2px solid #62c7cc;border-right:2px solid #62c7cc;width:.65rem;height:.65rem;transition:transform .18s;transform:rotate(225deg)}.control-panel:not(.is-collapsed) .toggle-chevron{transform:rotate(45deg)}.panel-intro h2{font-size:1.35rem}.zone-tabs{grid-template-columns:repeat(3,minmax(0,1fr));margin-top:1rem}.zone-tab{text-align:center;grid-template-columns:1fr;justify-items:center;min-height:4.25rem;padding:.55rem .35rem}.zone-copy{display:block}.zone-copy strong{font-size:.7rem;display:block}.zone-copy small{margin-top:.1rem;font-size:.61rem;display:block}.colour-picker{margin-top:1rem}.swatch-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.swatch{justify-content:center;padding:.4rem}.swatch span:last-child{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;padding:0;position:absolute;overflow:hidden}.swatch-colour{width:1.45rem;height:1.45rem}.selection-summary{margin-top:1.15rem}}:root{color:#ece9e3;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:#111419;font-family:Inter,Avenir Next,Segoe UI,sans-serif}*{box-sizing:border-box}html{background:#111419}body{min-width:320px;min-height:100vh;margin:0}button,input,textarea,select{font:inherit}button:focus-visible{outline-offset:2px;outline:2px solid #62c7cc}#root{min-height:100vh}