:root{color-scheme:dark;--ink:#f4efe8;--muted:#b9b1a8;--accent:#e6ff43;--panel:#171717}
*{box-sizing:border-box}body{margin:0;background:#0c0c0c;color:var(--ink);font-family:Inter,system-ui,sans-serif}.shell{width:min(100%,560px);margin:auto;min-height:100svh;background:#111}header{display:flex;justify-content:space-between;align-items:center;padding:18px 20px}.brand{font-weight:900;letter-spacing:.18em}.tag{font-size:10px;color:var(--accent);letter-spacing:.08em}.stage{position:relative;aspect-ratio:3/4;background:linear-gradient(145deg,#252525,#111);overflow:hidden}.stage video,.stage canvas{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.stage video{visibility:hidden}.empty{position:absolute;inset:0;display:grid;place-content:center;text-align:center;padding:32px}.empty .figure{font-size:72px;color:#575757}.empty h1{font-size:25px;margin:16px 0 6px}.empty p{color:var(--muted);margin:0}.status{position:absolute;left:14px;bottom:14px;background:#000a;border:1px solid #ffffff26;border-radius:999px;padding:8px 12px;font-size:12px}.controls{padding:18px 20px 28px}.product{display:flex;align-items:center;gap:12px;margin-bottom:16px}.product div:last-child{display:grid;gap:4px}.product small{color:var(--muted)}.swatch{width:45px;height:56px;background:#090909;border:1px solid #444;border-radius:4px}button{width:100%;border:0;border-radius:4px;padding:15px 18px;background:var(--accent);color:#111;font-weight:800;font-size:16px;cursor:pointer}button.secondary{margin-top:9px;background:#292929;color:var(--ink)}button:disabled{opacity:.45}.privacy{text-align:center;color:#827b73;font-size:11px;line-height:1.4;margin:14px 10px 0}

.empty[hidden]{display:none}