:root{--ink:#1d1a24;--muted:#6f6a7a;--panel:#ffffffc7;--panel-border:#ffffffe6;--chip:#1d1a240f;--chip-hover:#1d1a241a;--accent:#ff4d8d;--accent-ink:#fff;--ring:#1d1a24;--shadow:0 20px 60px #28143c2e;--bg:#c9c6cc;--seg-bg:#ebe9ee}body[data-env=neon]{--ink:#eef1ff;--muted:#97a2c8;--panel:#0c1028bd;--panel-border:#ffffff14;--chip:#ffffff12;--chip-hover:#ffffff21;--accent:#4f7bff;--ring:#eef1ff;--shadow:0 20px 60px #00000080;--bg:#070a1c;--seg-bg:#161c3a}body[data-env=sunset]{--bg:#3a2030;--accent:#ff7a3d}*{box-sizing:border-box}html,body{background:var(--bg);height:100%;color:var(--ink);-webkit-font-smoothing:antialiased;margin:0;font-family:Fredoka,ui-rounded,system-ui,sans-serif;overflow:hidden}#app{touch-action:none;cursor:grab;width:100%;height:100%;display:block;position:fixed;inset:0}#app:active{cursor:grabbing}.brand{color:var(--ink);pointer-events:none;align-items:center;gap:8px;font-size:20px;font-weight:600;display:flex;position:fixed;top:20px;left:24px}.brand .logo{color:var(--accent);font-size:22px}.brand .hint{color:var(--muted);margin-left:12px;font-size:13px;font-weight:400}.panel{background:var(--panel);border:1px solid var(--panel-border);width:340px;box-shadow:var(--shadow);-webkit-backdrop-filter:blur(18px)saturate(1.4);border-radius:24px;flex-direction:column;gap:18px;padding:22px 22px 18px;transition:background .4s,color .4s;display:flex;position:fixed;top:16px;bottom:16px;right:16px;overflow-y:auto}h1{letter-spacing:-.01em;margin:0;font-size:24px;font-weight:600}h2{text-transform:uppercase;letter-spacing:.08em;color:var(--muted);justify-content:space-between;margin:0 0 10px;font-size:13px;font-weight:500;display:flex}h2 .value{text-transform:none;letter-spacing:0;color:var(--ink);font-weight:500}button{font:inherit;color:inherit}.swatches{flex-wrap:wrap;gap:10px;display:flex}.swatches-inner{display:contents}.swatch{--c:#ccc;background:radial-gradient(circle at 35% 30%, #ffffffa6, transparent 45%), var(--c);cursor:pointer;border:none;border-radius:50%;width:34px;height:34px;padding:0;transition:transform .15s;position:relative;box-shadow:inset 0 -3px 6px #0000002e,0 2px 6px #0000001f}.swatch:hover{transform:scale(1.1)}.swatch[aria-pressed=true],.swatch.custom.active{outline:2px solid var(--ring);outline-offset:3px}.swatch-original{background:radial-gradient(circle at 35% 30%,#ffffffa6,#0000 45%),radial-gradient(circle at 70% 70%,#fff6dd 0 18%,#0000 19%),radial-gradient(circle at 30% 65%,#ff2020 0 16%,#0000 17%),#ff8c8c}.swatch.custom{background:conic-gradient(red,#ff0,#0f0,#0ff,#00f,#f0f,red);place-items:center;display:grid;overflow:hidden}.swatch.custom.active{background:radial-gradient(circle at 35% 30%, #ffffffa6, transparent 45%), var(--c)}.swatch.custom span{color:#fff;text-shadow:0 1px 2px #00000080;pointer-events:none;font-weight:600}.swatch.custom input{opacity:0;cursor:pointer;width:100%;height:100%;position:absolute;inset:0}.chips{flex-wrap:wrap;gap:8px;display:flex}.chip{background:var(--chip);cursor:pointer;border:1.5px solid #0000;border-radius:999px;align-items:baseline;gap:6px;padding:8px 14px;font-size:15px;transition:background .15s,border-color .15s;display:inline-flex}.chip:hover{background:var(--chip-hover)}.chip small{color:var(--muted);font-size:12px}.chip[aria-pressed=true]{border-color:var(--ring)}.chip.size{justify-content:center;min-width:48px;font-weight:500}.toggle{cursor:pointer;align-items:center;gap:10px;margin-top:14px;font-size:15px;display:inline-flex}.toggle input{opacity:0;position:absolute}.toggle .track{background:var(--chip-hover);border-radius:999px;width:40px;height:24px;transition:background .2s;position:relative}.toggle .track:after{content:"";background:#fff;border-radius:50%;width:18px;height:18px;transition:transform .2s;position:absolute;top:3px;left:3px;box-shadow:0 1px 3px #0000004d}.toggle input:checked+.track{background:var(--accent)}.toggle input:checked+.track:after{transform:translate(16px)}.toggle input:focus-visible+.track{outline:2px solid var(--ring);outline-offset:2px}.panel footer{border-top:1px solid var(--chip-hover);flex-direction:column;gap:12px;margin-top:auto;padding-top:14px;display:flex}.summary{justify-content:space-between;align-items:baseline;gap:12px;font-size:15px;display:flex}.price{font-size:26px;font-weight:600}.actions{gap:8px;display:flex}.actions .primary{background:var(--accent);color:var(--accent-ink);cursor:pointer;border:none;border-radius:14px;flex:1;padding:13px 18px;font-size:16px;font-weight:600;transition:transform .1s,filter .15s}.actions .primary:hover{filter:brightness(1.06)}.actions .primary:active{transform:scale(.98)}.actions .icon{background:var(--chip);cursor:pointer;border:none;border-radius:14px;place-items:center;width:48px;display:grid}.actions .icon:hover{background:var(--chip-hover)}#toast{color:#fff;opacity:0;pointer-events:none;background:#14101ce0;border-radius:999px;padding:10px 18px;font-size:15px;transition:opacity .2s,transform .2s;position:fixed;bottom:32px;left:50%;transform:translate(-50%,20px)}#toast.show{opacity:1;transform:translate(-50%)}#loader{color:#1d1a24;z-index:10;background:#e9e6ec;place-content:center;justify-items:center;gap:14px;transition:opacity .5s,visibility .5s;display:grid;position:fixed;inset:0}#loader.done{opacity:0;visibility:hidden}#loader .blob{background:radial-gradient(circle at 35% 30%,#fff8,#0000 45%),#ff6f9d;border-radius:50% 50% 45% 45%/60% 60% 40% 40%;width:64px;height:44px;animation:.9s ease-in-out infinite wobble}#loader .bar{background:#00000014;border-radius:2px;width:160px;height:4px;overflow:hidden}#loader .bar span{background:#ff4d8d;width:0;height:100%;transition:width .2s;display:block}@keyframes wobble{0%,to{transform:scale(1)}50%{transform:scale(1.15,.85)}}@media (width<=760px){.brand{font-size:17px;top:12px;left:16px}.brand .hint{display:none}.panel{width:auto;max-height:46vh;padding:18px 16px calc(14px + env(safe-area-inset-bottom));border-radius:22px 22px 0 0;gap:14px;inset:auto 0 0}h1{display:none}#toast{bottom:calc(48vh + 12px)}}#app.grabbing,#app.grabbing:active{cursor:grabbing}#app.can-grab{cursor:pointer}.segmented{background:var(--chip);border-radius:14px;grid-template-columns:1fr 1fr;gap:4px;padding:4px;display:grid}.segmented button{color:var(--muted);cursor:pointer;background:0 0;border:none;border-radius:10px;padding:8px 10px;font-size:15px;font-weight:500;transition:background .15s,color .15s,box-shadow .15s}.segmented button[aria-pressed=true]{background:var(--panel-solid,#fff);color:var(--ink);box-shadow:0 1px 4px #0000001f}body[data-env=neon] .segmented button[aria-pressed=true]{--panel-solid:#ffffff24}body:not([data-mode=pit]) .pit-only,body[data-mode=pit] .showroom-only{display:none}.pit-actions{flex-wrap:wrap;gap:8px;display:flex}.chip.strong{background:var(--accent);color:var(--accent-ink);font-weight:600}.chip.strong:hover{background:var(--accent);filter:brightness(1.06)}.chip:disabled{opacity:.4;cursor:default}.link{text-transform:none;letter-spacing:0;color:var(--muted);cursor:pointer;text-underline-offset:2px;background:0 0;border:none;padding:0;font-size:13px;text-decoration:underline}.link:hover{color:var(--ink)}.sliders{gap:10px;display:grid}.slider{grid-template-columns:1fr auto;row-gap:4px;font-size:15px;display:grid}.slider output{font-variant-numeric:tabular-nums;color:var(--muted);font-size:14px}.slider input{--fill:50%;appearance:none;cursor:pointer;background:0 0;grid-column:1/-1;width:100%;height:22px;margin:0}.slider input::-webkit-slider-runnable-track{background:linear-gradient(to right, var(--accent) var(--fill), var(--chip-hover) var(--fill));border-radius:3px;height:6px}.slider input::-moz-range-track{background:linear-gradient(to right, var(--accent) var(--fill), var(--chip-hover) var(--fill));border-radius:3px;height:6px}.slider input::-webkit-slider-thumb{-webkit-appearance:none;background:#fff;border:none;border-radius:50%;width:20px;height:20px;margin-top:-7px;box-shadow:0 1px 4px #0000004d}.slider input::-moz-range-thumb{background:#fff;border:none;border-radius:50%;width:20px;height:20px;box-shadow:0 1px 4px #0000004d}.slider input:focus-visible{outline:2px solid var(--ring);outline-offset:2px;border-radius:4px}@media (width<=760px){.segmented{z-index:1;background:var(--seg-bg);box-shadow:0 0 0 6px var(--seg-bg);position:sticky;top:-18px}}.pit-count{font-variant-numeric:tabular-nums;font-size:15px}.mode-body{flex-direction:column;gap:18px;display:flex}.stats{grid-template-columns:1fr 1fr;gap:8px;margin-bottom:10px;display:grid}.stat{background:var(--chip);border-radius:14px;flex-direction:column;padding:10px 14px;display:flex}.stat-value{font-variant-numeric:tabular-nums;font-size:26px;font-weight:600;line-height:1.1}.stat-label{color:var(--muted);font-size:13px}.pit-status{color:var(--muted);margin:0 0 10px;font-size:13px}.palettes{grid-template-columns:repeat(3,1fr);gap:8px;display:grid}.palette{background:var(--chip);cursor:pointer;text-align:left;border:1.5px solid #0000;border-radius:12px;flex-direction:column;gap:6px;padding:8px 10px;font-size:13px;display:flex}.palette:hover{background:var(--chip-hover)}.palette[aria-pressed=true]{border-color:var(--ring)}.palette .dots{display:flex}.palette .dots span{border:1.5px solid var(--panel-solid,#fff);border-radius:50%;width:14px;height:14px;margin-right:-4px}body[data-mode=pit] .actions{justify-content:flex-end}
