@import "https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600&family=Playfair+Display:ital,wght@1,600&display=swap";:root{font-synthesis:none;text-rendering:optimizelegibility;font-family:DM Sans,Arial,sans-serif}html,body,#root{min-width:320px;min-height:100%;margin:0}button{font-family:inherit}*{box-sizing:border-box}main{color:#161618;background:#f2f0eb;min-height:100vh}header{background:#f7f5f0e0;border-bottom:1px solid #d9d5cc;justify-content:space-between;align-items:center;height:72px;padding:0 4vw;display:flex}.brand{color:#111;letter-spacing:.22em;font-size:17px;font-weight:700;text-decoration:none}.brand span{color:#77726a;margin-left:4px;font-weight:400}.header-copy{letter-spacing:.08em;color:#6b6861;text-transform:uppercase;font-size:12px}.status-dot{background:#45b878;border-radius:50%;width:7px;height:7px;margin-right:8px;display:inline-block;box-shadow:0 0 0 4px #45b87820}.workspace{grid-template-columns:minmax(330px,38%) 1fr;min-height:calc(100vh - 72px);display:grid}.config-panel{border-right:1px solid #d9d5cc;padding:clamp(36px,5vh,70px) clamp(28px,4vw,72px);overflow-y:auto}.eyebrow{color:#746b84;letter-spacing:.2em;text-transform:uppercase;margin-bottom:18px;font-size:11px;font-weight:600}h1{letter-spacing:-.055em;margin:0;font-size:clamp(38px,4vw,66px);font-weight:500;line-height:.98}h1 em{color:#7956a6;font-family:Playfair Display,serif;font-weight:600}.intro{color:#77736c;max-width:440px;margin:22px 0 34px;font-size:14px;line-height:1.6}.control-row{border-top:1px solid #dad6cd;justify-content:space-between;align-items:center;padding:20px 0;display:flex}.control-number{color:#9b9489;letter-spacing:.16em;margin-bottom:5px;font-size:10px;display:block}h2{margin:0;font-size:15px;font-weight:600}.control-row p{color:#918c84;margin:3px 0 0;font-size:11px}.stepper{background:#e9e6df;border:1px solid #cbc6bd;border-radius:99px;align-items:center;display:flex;overflow:hidden}.stepper button{color:#5f5b55;cursor:pointer;background:0 0;border:0;width:35px;height:34px;font-size:18px}.stepper button:hover{background:#dcd8d0}.stepper strong{text-align:center;width:26px;font-size:14px}.theme-control{border-top:1px solid #dad6cd;padding:20px 0 24px}.swatches{gap:8px;margin-top:13px;display:flex}.swatches button{color:#625f59;cursor:pointer;background:0 0;border:1px solid #0000;border-radius:99px;align-items:center;gap:6px;padding:6px 10px 6px 7px;font-size:11px;display:flex}.swatches button span{background:var(--swatch);border-radius:50%;width:14px;height:14px;display:block;box-shadow:inset 0 0 0 1px #ffffff60}.swatches button.active{color:#222;background:#ffffff80;border-color:#c8c2b8}.quote-box{border-top:1px solid #dad6cd;align-items:stretch;gap:18px;margin-top:6px;padding-top:20px;display:flex}.quote-box>div{flex:1}.quote-box span{color:#8f8a82;letter-spacing:.12em;text-transform:uppercase;font-size:9px;display:block}.quote-box strong{margin-top:4px;font-size:20px;display:block}.quote-box button{color:#fff;letter-spacing:.04em;cursor:pointer;background:#17171a;border:0;border-radius:4px;flex:1.25;justify-content:space-between;align-items:center;padding:12px 16px;font:500 11px DM Sans,sans-serif;display:flex}.quote-box button:hover{background:#7956a6}.quote-box button span{color:#fff;font-size:18px}.viewer{background:#090b11;min-height:600px;position:relative;overflow:hidden}.viewer:after{content:"";pointer-events:none;position:absolute;inset:0;box-shadow:inset 0 0 120px #0009}.viewer canvas{inset:0;position:absolute!important}.viewer-top,.viewer-bottom{z-index:2;color:#ffffff75;letter-spacing:.13em;pointer-events:none;justify-content:space-between;font-size:9px;display:flex;position:absolute;left:28px;right:28px}.viewer-top{top:26px}.viewer-bottom{align-items:flex-end;bottom:25px}.viewer-bottom strong{color:#fff;letter-spacing:.03em;margin-top:5px;font-size:12px;display:block}.live{align-items:center;gap:8px;display:flex}.live i{background:var(--accent);width:7px;height:7px;box-shadow:0 0 12px var(--accent);border-radius:50%}@media (width<=850px){header{padding:0 20px}.header-copy{display:none}.workspace{grid-template-columns:1fr}.config-panel{border-right:0;padding:36px 24px 28px}.viewer{min-height:62vh}.quote-box{flex-direction:column}.quote-box button{min-height:48px}}