:root{--bg: #0b1a14;--bg-2: #0f2219;--panel: #13291f;--panel-2: #1a3528;--border: rgba(255, 255, 255, .08);--border-strong: rgba(255, 255, 255, .16);--text: #f2f6f3;--muted: #a3b5ab;--accent: #e63946;--accent-2: #ffb703;--green: #3ddc84;--danger: #ff6b6b;--radius: 14px;--radius-sm: 9px;--shadow: 0 10px 30px rgba(0, 0, 0, .35);--font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;color-scheme:dark}*{box-sizing:border-box}html,body{margin:0;padding:0}body{font-family:var(--font);color:var(--text);background:radial-gradient(1200px 600px at 10% -10%,#163a2a 0%,transparent 60%),radial-gradient(900px 500px at 110% 10%,#2a1a2e 0%,transparent 55%),var(--bg);min-height:100vh;-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent}h1,h2,h3,h4{margin:0;font-weight:700;letter-spacing:-.01em}p{margin:0}button{font-family:inherit}.muted{color:var(--muted)}.panel{background:linear-gradient(180deg,var(--panel) 0%,var(--bg-2) 100%);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:16px}.panel-title{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}.panel-title h2,.panel-title h3{font-size:1rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-weight:600}.btn{appearance:none;border:1px solid var(--border-strong);background:var(--panel-2);color:var(--text);padding:9px 14px;border-radius:var(--radius-sm);font-size:.92rem;font-weight:600;cursor:pointer;transition:transform .08s ease,background .15s ease,border-color .15s ease;display:inline-flex;align-items:center;gap:8px;line-height:1}.btn:hover{background:#21402f;border-color:#ffffff40}.btn:active{transform:scale(.97)}.btn:disabled{opacity:.5;cursor:default;transform:none}.btn.primary{background:var(--accent);border-color:transparent;color:#fff}.btn.primary:hover{background:#ff4b58}.btn.ghost{background:transparent;border-color:transparent;color:var(--muted)}.btn.ghost:hover{color:var(--text);background:rgba(255,255,255,.05)}.btn.small{padding:6px 10px;font-size:.82rem}.btn.icon{padding:8px;width:34px;height:34px;justify-content:center}input[type=range]{appearance:none;width:100%;height:28px;background:transparent;margin:0;cursor:pointer}input[type=range]::-webkit-slider-runnable-track{height:6px;border-radius:999px;background:var(--track, rgba(255, 255, 255, .14))}input[type=range]::-moz-range-track{height:6px;border-radius:999px;background:var(--track, rgba(255, 255, 255, .14))}input[type=range]::-webkit-slider-thumb{appearance:none;width:22px;height:22px;margin-top:-8px;border-radius:50%;background:#fff;border:3px solid var(--accent-2);box-shadow:0 2px 8px #00000080}input[type=range]::-moz-range-thumb{width:16px;height:16px;border-radius:50%;background:#fff;border:3px solid var(--accent-2);box-shadow:0 2px 8px #00000080}input[type=range]:focus-visible{outline:2px solid var(--accent-2);outline-offset:4px;border-radius:999px}.swatch{position:relative;width:44px;height:44px;border-radius:12px;border:2px solid rgba(255,255,255,.18);box-shadow:inset 0 0 0 1px #00000059,0 4px 10px #00000059;flex:0 0 auto}.swatch input[type=color]{position:absolute;inset:0;width:100%;height:100%;border:none;padding:0;background:none;cursor:pointer;opacity:0}.swatch.large{width:56px;height:56px}.swatch-remove{position:absolute;top:-6px;right:-6px;width:20px;height:20px;border-radius:50%;border:none;background:#000;color:#fff;font-size:12px;line-height:20px;cursor:pointer;box-shadow:0 0 0 2px var(--panel);display:flex;align-items:center;justify-content:center;padding:0}.chip{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:999px;border:1px solid var(--border-strong);background:rgba(255,255,255,.04);color:var(--text);font-size:.8rem;font-weight:600;cursor:pointer}.chip:hover{background:rgba(255,255,255,.09)}.chip.active{border-color:var(--accent-2);background:rgba(255,183,3,.12)}.chip .dots{display:inline-flex;gap:2px}.chip .dot{width:9px;height:9px;border-radius:50%;box-shadow:inset 0 0 0 1px #0000004d}.segmented{display:inline-flex;flex-wrap:wrap;gap:4px;padding:4px;border-radius:var(--radius-sm);background:rgba(0,0,0,.25);border:1px solid var(--border)}.segmented button{border:none;background:transparent;color:var(--muted);padding:7px 12px;border-radius:7px;font-weight:600;font-size:.85rem;cursor:pointer}.segmented button.active{background:var(--panel-2);color:var(--text);box-shadow:0 1px 3px #0006}.toggle{position:relative;display:inline-block;width:46px;height:26px;flex:0 0 auto}.toggle input{opacity:0;width:0;height:0;position:absolute}.toggle .track{position:absolute;inset:0;border-radius:999px;background:rgba(255,255,255,.15);transition:background .2s;cursor:pointer}.toggle .track:before{content:"";position:absolute;width:20px;height:20px;left:3px;top:3px;border-radius:50%;background:#fff;transition:transform .2s;box-shadow:0 1px 3px #0006}.toggle input:checked+.track{background:var(--green)}.toggle input:checked+.track:before{transform:translate(20px)}.toggle input:focus-visible+.track{outline:2px solid var(--accent-2);outline-offset:2px}.row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.spacer{flex:1}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}@keyframes pulse-ring{0%{box-shadow:0 0 #3ddc8499}to{box-shadow:0 0 0 10px #3ddc8400}}@media (prefers-reduced-motion: reduce){*{animation:none!important;transition:none!important}}