*{box-sizing:border-box}body{margin:0;background:#09090b;color:#eee;font:14px Inter,Arial,sans-serif}header{height:76px;border-bottom:1px solid #242428;display:flex;align-items:center;justify-content:space-between;padding:0 42px;background:#0b0b0e}.brand{font-size:21px;font-weight:800;letter-spacing:.04em}.brand b{color:#dfb83f}nav{display:flex;gap:30px}nav a{color:#777;text-decoration:none}nav .active{color:#fff}.hero{padding:44px 5vw 30px;display:flex;justify-content:space-between;align-items:end}.hero span,.viewer small,.review small{font-size:10px;letter-spacing:.18em;color:#8d8d98}.hero h1{font-size:52px;line-height:1;margin:12px 0}.hero em{color:#dfb83f;font-style:normal}.hero p{max-width:650px;color:#898992;line-height:1.6}.pill{border:1px solid #4a3d1d;color:#efd16e;background:#1c1910;border-radius:999px;padding:9px 13px;font-size:10px;letter-spacing:.12em}.builder{display:grid;grid-template-columns:180px minmax(420px,1fr) 300px;gap:14px;padding:0 5vw}.steps,.options{background:#101014;border:1px solid #24242a;border-radius:16px;overflow:hidden}.step{padding:16px;border-bottom:1px solid #202025;cursor:pointer}.step.active{background:#211d12}.step b{color:#dfb83f;font-size:10px;margin-right:8px}.step strong{font-size:12px}.step span{display:block;color:#666;font-size:10px;margin:5px 0 0 22px}.viewer{position:relative;min-height:610px;border:1px solid #24242a;border-radius:16px;overflow:hidden;background:radial-gradient(circle at 50% 44%,#22202a 0,#111116 38%,#0b0b0e 72%)}canvas{width:100%;height:560px;display:block;touch-action:none}.viewer-top{position:absolute;z-index:2;left:20px;right:20px;top:18px;display:flex;justify-content:space-between;pointer-events:none}.viewer-top strong{display:block;margin-top:5px;font-size:12px}.draghint{font-size:10px;color:#666}.views{position:absolute;z-index:3;bottom:16px;left:50%;transform:translateX(-50%);display:flex;background:#101014;border:1px solid #303038;border-radius:10px;padding:4px}.views button,.options button{background:transparent;color:#777;border:0;padding:9px 12px;border-radius:7px;cursor:pointer;font-size:10px}.views button.active{background:#dfb83f;color:white}.options{padding:18px;max-height:610px;overflow:auto}.option-title{font-size:10px;letter-spacing:.14em;color:#888;margin:0 0 9px}.card{padding:14px 0;border-bottom:1px solid #222228}.choices{display:flex;flex-wrap:wrap;gap:6px}.choices button{border:1px solid #292930;background:#151519;color:#aaa}.choices button.active{border-color:#dfb83f;color:#fff;background:#2b2411}.swatch{width:20px;height:20px;border-radius:50%;padding:0!important;border:2px solid #333!important}.swatch.active{border-color:#fff!important;box-shadow:0 0 0 2px #dfb83f}.review{margin:14px 5vw 40px;border:1px solid #29292f;background:#101014;border-radius:16px;padding:22px;display:flex;justify-content:space-between;align-items:center}.review h2{margin:7px 0;font-size:20px}.review p{margin:0;color:#777;font-size:12px}.price{display:flex;align-items:center;gap:20px}.price strong{font-size:25px}.price button{background:#dfb83f;color:#fff;border:0;border-radius:9px;padding:13px 18px;font-weight:800;cursor:pointer}@media(max-width:1050px){.builder{grid-template-columns:150px 1fr}.options{grid-column:1/-1;display:grid;grid-template-columns:repeat(2,1fr);gap:8px}.review{margin-left:5vw;margin-right:5vw}}@media(max-width:700px){header{padding:0 18px}nav{display:none}.hero{padding:30px 18px}.hero h1{font-size:38px}.pill{display:none}.builder{display:block;padding:0 18px}.steps{display:flex;overflow:auto;margin-bottom:10px}.step{min-width:150px}.viewer{min-height:500px}.options{margin-top:10px}.review{margin:10px 18px 30px;display:block}.price{margin-top:18px}}

/* Collapsible customization categories. */
.options .category{padding:0;align-self:start;min-width:0}
.category-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:15px 0;cursor:pointer;list-style:none;user-select:none}
.category-heading::-webkit-details-marker{display:none}
.category-info{display:flex;flex-direction:column;gap:5px;min-width:0}
.category .option-title{margin:0;color:#c5c5ce;line-height:1.5}
.category-selection{font-size:11px;color:#85858f;line-height:1.4;overflow-wrap:anywhere}
.category-chevron{width:7px;height:7px;flex-shrink:0;margin-right:4px;border-right:1.5px solid #dfb83f;border-bottom:1.5px solid #dfb83f;transform:rotate(45deg);transition:transform .15s ease}
.category[open] .category-chevron{transform:rotate(225deg)}
.category[open] .category-heading .option-title{color:#efd16e}
.category .choices{padding:2px 2px 16px}
.category-heading:focus-visible,.choices button:focus-visible{outline:2px solid #efd16e;outline-offset:3px}
@media(max-width:1050px){.options{display:block}}
@media(prefers-reduced-motion:reduce){.category-chevron{transition:none}}

.choices button.cherry-option{color:#f2bfd0;border-color:#784357;background:linear-gradient(115deg,#35212a,#19151b);padding:9px 12px}
.choices button.cherry-option::before{content:'✿';color:#e87ea4;margin-right:6px}
.choices button.cherry-option.active{border-color:#f5dc8a;box-shadow:0 0 0 1px #dfb83f}

/* Build summary on the left; one customization category on the right. */
.builder{grid-template-columns:250px minmax(0,1fr) 280px;align-items:start}
.build-panel.review{grid-column:auto;display:flex;flex-direction:column;align-items:stretch;gap:20px;margin:0;padding:20px;min-width:0}
.build-panel.review h2{font-size:18px;line-height:1.4;overflow-wrap:anywhere}
.build-panel small{font-size:10px;color:#9696a3;letter-spacing:.14em}
#buildSummary{margin:18px 0 0}
.build-row{padding:10px 0;border-bottom:1px solid #25252d}
.build-row dt{font-size:9px;letter-spacing:.1em;color:#8c8c99;margin-bottom:5px}
.build-row dd{margin:0}
.build-row button{border:0;padding:0;background:none;text-align:left;font:inherit;font-size:12px;line-height:1.5;color:#e2e2eb;cursor:pointer}
.build-row button:hover{color:#efd16e}
.build-panel .price{display:grid;grid-template-columns:1fr auto;gap:14px;margin:0}
.build-panel .price button{grid-column:1/-1;width:100%;font-size:11px}
.build-panel:focus-visible{outline:2px solid #efd16e;outline-offset:3px}
.options{display:flex;flex-direction:column;padding:22px;min-height:400px;max-height:none;grid-column:auto}
.wizard-progress{font-size:10px;letter-spacing:.14em;color:#a5a5b3}
.category-progress{appearance:none;width:100%;height:3px;border:0;margin:14px 0 28px;background:#353021;color:#dfb83f}
.category-progress::-webkit-progress-bar{background:#353021}
.category-progress::-webkit-progress-value{background:#dfb83f}
.category-progress::-moz-progress-bar{background:#dfb83f}
.wizard-content{flex:1}
#categoryTitle{font-size:19px;line-height:1.4;margin:0;color:#eee}
#categoryTitle:focus{outline:none}
.wizard-selected{font-size:12px;line-height:1.5;color:#92929f;margin:12px 0 23px}
.wizard-selected span{color:#e4cf8d}
.wizard-content .choices{gap:12px}
.wizard-content .swatch{width:28px;height:28px}
.wizard-nav{display:flex;justify-content:space-between;gap:12px;border-top:1px solid #302c21;padding-top:20px;margin-top:30px}
.options .wizard-nav button{padding:11px 18px;font-size:12px;border:1px solid #403a29;color:#ddd}
.options .wizard-nav #nextCategory{background:#dfb83f;color:white;border-color:#dfb83f;flex:1}
.options .wizard-nav button:disabled{opacity:.35;cursor:default}
.wizard-nav button:focus-visible,.build-row button:focus-visible{outline:2px solid #f5dc8a;outline-offset:3px}
@media(max-width:1150px){.builder{grid-template-columns:220px minmax(0,1fr) 240px;gap:10px;padding:0 3vw}.options{padding:18px}.build-panel.review{padding:16px}.draghint{display:none}}
@media(max-width:950px){.builder{grid-template-columns:1fr 1fr;grid-template-areas:'viewer viewer' 'summary options'}.viewer{grid-area:viewer}.build-panel{grid-area:summary}.options{grid-area:options;margin:0}.viewer{min-height:520px}canvas{height:470px}}
@media(max-width:600px){.builder{display:grid;grid-template-columns:1fr;grid-template-areas:'viewer' 'options' 'summary';padding:0 18px}.options{min-height:330px}.viewer{min-height:400px}canvas{height:350px}.viewer-top strong{font-size:10px}.build-panel.review{margin:0}.builder{margin-bottom:30px}}

@media(max-width:700px){nav.builder-nav{display:flex;gap:16px;font-size:12px}}

/* Wider center viewer with matching panel heights. */
.builder{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,2fr) minmax(0,1fr);grid-template-areas:'summary viewer options';align-items:stretch;--panel-height:680px}
.builder>.build-panel{grid-area:summary}
.builder>.viewer{grid-area:viewer}
.builder>.options{grid-area:options}
.builder>.build-panel,.builder>.viewer,.builder>.options{height:var(--panel-height);min-height:0;max-height:none;min-width:0;width:100%;margin:0;overflow:hidden}
.builder>.build-panel>div:first-child{flex:1;min-height:0;overflow-y:auto;padding-right:4px}
.builder>.build-panel>.price{flex-shrink:0;padding-top:16px;border-top:1px solid #302c21}
.builder>.viewer canvas{width:100%;height:100%}
.builder>.options{display:flex;flex-direction:column}
.builder .wizard-content{min-height:0;overflow-y:auto;padding:3px}
.builder .wizard-nav,.builder .wizard-progress,.builder .category-progress{flex-shrink:0}
.builder .viewer-top{display:block}
.builder .draghint{margin-top:8px}
@media(max-width:950px){.builder{grid-template-columns:minmax(0,1fr);grid-template-areas:'viewer' 'options' 'summary';--panel-height:560px}.builder>.options{margin:0}}

/* Dark text keeps the gold action buttons easy to read. */
.views button.active,.price button,.options .wizard-nav #nextCategory{color:#17140a}

.module-note{padding:12px 14px;border:1px solid #dfb83f66;border-radius:10px;background:#dfb83f12;color:#edcf7c;font-size:13px;line-height:1.5;}
.choices button:disabled{opacity:.45;cursor:not-allowed;}
