.color-main{padding:135px 5vw 4rem;max-width:1500px;margin:auto}.color-heading h1{font:600 clamp(2.7rem,5vw,4.8rem)/1 Oswald;margin:.3em 0}.color-heading>p:last-child{color:#bbb;font-size:1rem;line-height:1.6}.color-heading .eyebrow{color:#ff925d}.color-workspace{display:grid;grid-template-columns:1.2fr 1fr;gap:2.4rem;align-items:start;margin-top:2rem}.room-wrap{overflow:hidden;border-radius:16px;border:1px solid #48483e;position:sticky;top:110px;background:#fff}.room-wrap svg{display:block;width:100%;height:auto}.surface{cursor:pointer}.surface:focus-visible{outline:none;stroke:#f15a16;stroke-width:5}.color-controls{min-width:0}.surface-buttons{display:flex;gap:.5rem}.surface-buttons button,#resetColors{background:#20201d;border:1px solid #55554c;color:#eee;border-radius:8px;padding:.8rem;font:700 .875rem Manrope;cursor:pointer}.surface-buttons button{flex:1}.surface-buttons button[aria-pressed=true]{border-color:#f15a16;background:#f15a161a}.surface-buttons button[aria-pressed=true]:before{content:"✓ ";color:#ff925d}.palette-heading{display:flex;justify-content:space-between;align-items:center;margin-top:1.4rem}.palette-heading h2{font:500 1.8rem Oswald;margin:0}#activeColor{font-size:1rem;min-height:1.5em;color:#ddd}.palette{display:grid;grid-template-columns:repeat(8,1fr);gap:.25rem}.swatch{display:grid;place-items:center;border:0;background:none;border-radius:8px;min-width:44px;min-height:48px;cursor:pointer;padding:5px}.swatch span{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;border:1px solid #a4a49d;color:#111;font:bold 20px Arial}.swatch[aria-pressed=true]{outline:2px solid #f15a16;outline-offset:-2px}.color-summary{margin:1.5rem 0}.color-summary>div{display:flex;justify-content:space-between;gap:1rem;padding:.7rem 0;border-bottom:1px solid #393931;font-size:.875rem}.color-summary dt{color:#aaa}.color-summary dd{margin:0;text-align:right}.email-help,.color-note,.palette-note{font-size:.875rem;line-height:1.6;color:#aaa}.color-note{border-left:2px solid #f15a16;padding-left:1rem}.color-controls button:focus-visible,.color-controls a:focus-visible{outline:3px solid #ffad84;outline-offset:3px}.colors-page .calc-cta{font-size:1rem}.colors-page .nav nav{gap:1rem}
@media(max-width:900px){.color-workspace{grid-template-columns:1fr;gap:1rem}.room-wrap{position:static}.color-main{padding:140px 1.4rem 3rem}.color-heading h1{font-size:3rem}.color-workspace{margin-top:1rem}.palette{grid-template-columns:repeat(8,1fr)}}
@media(max-width:480px){.color-main{padding-left:1rem;padding-right:1rem}.palette{grid-template-columns:repeat(6,1fr)}.surface-buttons button{font-size:.875rem;padding:.8rem .4rem}.color-summary>div{gap:.5rem}}
.color-workspace{grid-template-columns:1fr;max-width:740px;margin-left:auto;margin-right:auto;gap:1rem}.room-wrap{position:static}.color-controls{width:100%}

.color-heading{max-width:1060px;margin:auto}.color-main{padding-top:120px}.color-heading h1{font-size:clamp(2.8rem,5vw,4.5rem)}.color-workspace{max-width:1060px;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:2rem}.room-wrap{position:sticky;top:105px;border-radius:18px;box-shadow:0 24px 70px #0005;background:#f4f3f0}.room-caption{display:flex;justify-content:space-between;gap:1rem;padding:1rem 1.2rem;background:#20201c;color:#bcbcb3;font-size:.875rem}.room-caption span:first-child{color:#fff}.color-controls{padding:1.2rem;border:1px solid #37372e;border-radius:18px;background:linear-gradient(145deg,#22221d,#161613)}.preset-heading{margin-top:1.5rem}.preset-heading h2{font:500 1.5rem Oswald;margin:0}.preset-heading p{font-size:.875rem;color:#aaa;margin:.4rem 0 .9rem}.presets{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.5rem}.preset{min-height:80px;border:1px solid #45453b;border-radius:10px;background:#292923;color:#eee;padding:.65rem .35rem;font:500 .875rem Manrope;cursor:pointer}.preset-dots{display:flex;justify-content:center;margin-bottom:.5rem}.preset-dots i{width:22px;height:22px;border-radius:50%;border:1px solid #7776;margin-left:-3px}.preset[aria-pressed=true]{border-color:#ff854c;box-shadow:inset 0 0 0 1px #ff854c}.preset[aria-pressed=true]>span:last-child:before{content:"✓ "}.palette{grid-template-columns:repeat(6,minmax(0,1fr))}.swatch{min-width:0;min-height:44px}.swatch span{width:30px;height:30px}.surface{transition:fill .2s}.color-summary{margin:1rem 0}.palette-heading{margin-top:1.4rem}.room-caption span:last-child{text-align:right}
@media(max-width:950px){.color-workspace{grid-template-columns:1fr;max-width:680px;gap:1rem}.room-wrap{position:static}.color-main{padding-top:140px}.color-controls{padding:1rem}.room-caption{font-size:.875rem}.palette{grid-template-columns:repeat(6,minmax(0,1fr))}.room-caption span:last-child{max-width:150px}.presets{gap:.4rem}.preset{font-size:.875rem}.surface-buttons button{font-size:.875rem}}
@media(prefers-reduced-motion:reduce){.surface{transition:none}}
.room-wrap{perspective:1200px;background:#d6d2ca;box-shadow:0 25px 55px #1113,inset 0 0 0 1px #fff5}
#room{transform:rotateX(var(--room-x,0deg)) rotateY(var(--room-y,0deg));transform-origin:center;transition:transform .2s ease-out;filter:drop-shadow(0 10px 12px #0002)}
@media(prefers-reduced-motion:reduce){#room{transform:none;transition:none}}

.surface-buttons{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}
.surface-buttons button{min-width:0;white-space:normal}
.color-workspace{max-width:1400px;grid-template-columns:minmax(0,1.65fr) minmax(0,1fr)}
.color-heading{max-width:1400px}
@media(max-width:950px){.color-workspace{grid-template-columns:1fr}}

#room{isolation:isolate}.photo-surface{mix-blend-mode:multiply}.photo-surface:focus-visible{stroke:var(--accent);stroke-width:3;vector-effect:non-scaling-stroke}