.intro{padding:34px 0 8px}.intro .eyebrow{font-size:13px;letter-spacing:.2em;text-transform:uppercase;color:var(--terracotta);margin-bottom:10px}.intro h1{font-family:var(--serif);font-weight:500;font-size:clamp(30px,4.4vw,46px);line-height:1.05}.intro p{color:var(--clay-gray);max-width:54ch;margin-top:10px}.designer-layout{max-width:var(--maxw);margin:0 auto;padding:22px 24px 60px;display:grid;grid-template-columns:minmax(280px,400px) 1fr;gap:40px;align-items:start}@media(max-width:880px){.designer-layout{grid-template-columns:1fr}}.preview{position:sticky;top:90px}.stage{background:radial-gradient(120% 120% at 50% 20%,#fdfbf7,#ece5d9);border:1px solid var(--sand);border-radius:6px;padding:18px;aspect-ratio:1/1;display:flex;align-items:center;justify-content:center}.stage svg{width:100%;height:100%}.preview-meta{margin-top:12px;font-size:13px;color:var(--clay-gray);text-align:center;min-height:1.4em}.seg-tabs{display:flex;gap:8px;margin-top:14px;justify-content:center}.seg-tabs button{flex:1;max-width:130px;border:1px solid var(--sand);background:var(--surface);color:var(--clay-gray);border-radius:6px;padding:8px;font:inherit;font-size:13px;cursor:pointer}.seg-tabs button.on{border-color:var(--terracotta);color:var(--terracotta);background:#fff}.seg-tabs.hidden{display:none}.progress{display:flex;gap:6px;margin-bottom:20px;flex-wrap:wrap}.progress .dot{flex:1;min-width:16px;height:4px;border-radius:99px;background:var(--sand)}.progress .dot.done{background:var(--clay-light)}.progress .dot.now{background:var(--terracotta)}.step-h{font-family:var(--serif);font-weight:500;font-size:25px;margin-bottom:4px}.step-sub{color:var(--clay-gray);margin-bottom:22px;font-size:14.5px}.hint{background:var(--surface);border:1px solid var(--sand);border-radius:8px;padding:10px 12px;font-size:13px;color:var(--clay-gray);margin-bottom:18px}.group{margin-bottom:22px}.group h4{font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--clay-gray);margin-bottom:10px}.chips{display:flex;flex-wrap:wrap;gap:8px}.chip{border:1px solid var(--sand);background:var(--surface);color:var(--charcoal);border-radius:999px;padding:9px 15px;font:inherit;font-size:14px;cursor:pointer;transition:.15s}.chip:hover{border-color:var(--clay-light)}.chip.on{border-color:var(--terracotta);color:var(--terracotta);background:#fff;font-weight:500}.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:10px}.pcard{border:1px solid var(--sand);background:var(--surface);border-radius:6px;padding:12px 8px;text-align:center;cursor:pointer;transition:.15s}.pcard:hover{border-color:var(--clay-light)}.pcard.on{border-color:var(--terracotta);background:#fff}.pcard .ico{font-size:24px;display:block;margin-bottom:5px}.pcard .mini{display:block;margin:0 auto 6px;width:46px;height:46px}.pcard .lbl{font-size:12.5px}.swatches{display:flex;flex-wrap:wrap;gap:9px}.sw{width:34px;height:34px;border-radius:50%;cursor:pointer;border:2px solid transparent;box-shadow:0 0 0 1px var(--sand)}.sw.on{border-color:#fff;box-shadow:0 0 0 2px var(--terracotta)}.slider{margin-bottom:14px}.slider label{display:flex;justify-content:space-between;font-size:14px;color:var(--clay-gray);margin-bottom:4px}.slider input{width:100%}.toggle{display:flex;align-items:center;gap:12px;background:var(--surface);border:1px solid var(--sand);border-radius:6px;padding:14px;margin:18px 0}.toggle .t-txt{flex:1}.toggle .t-txt strong{display:block}.toggle .t-txt span{font-size:13px;color:var(--clay-gray)}.switch{position:relative;width:46px;height:26px;flex:none}.switch input{display:none}.switch .track{position:absolute;inset:0;background:var(--sand);border-radius:99px;transition:.2s}.switch .knob{position:absolute;top:3px;left:3px;width:20px;height:20px;background:#fff;border-radius:50%;transition:.2s}.switch input:checked+.track{background:var(--terracotta)}.switch input:checked+.track+.knob{left:23px}.nav-btns{display:flex;justify-content:space-between;align-items:center;margin-top:28px;border-top:1px solid var(--sand);padding-top:18px}.btn.link{border:0;background:none;color:var(--clay-gray);padding:0;text-decoration:underline;cursor:pointer;font:inherit;font-size:15px}.summary dl{display:grid;grid-template-columns:auto 1fr;gap:6px 18px;font-size:14.5px;margin-bottom:20px}.summary dt{color:var(--clay-gray)}.field{margin-bottom:14px}.field input,.field textarea{width:100%;padding:11px 13px;border:1px solid var(--sand);border-radius:5px;background:var(--surface);font:inherit;color:var(--charcoal)}.note{font-size:12.5px;color:var(--clay-gray)}
