:root{--cream:#fff5f9;--sand:#f8d9e6;--terracotta:#e0578f;--olive:#9b7fb6;--brown:#4a2340;--gold:#e9b872;--pink:#f48fb8;--pink-deep:#c2477d;--r:22px;--shadow:0 3px 12px #c2477d29;--ease:cubic-bezier(.2,.7,.2,1)}html,body{background:var(--cream);height:100%;color:var(--brown);margin:0;font-family:system-ui,Segoe UI,Tahoma,sans-serif;overflow:hidden}[hidden]{display:none!important}canvas{touch-action:none;width:100%;height:100%;display:block;position:fixed;inset:0}button{font:inherit;color:inherit;cursor:pointer}.bar{inset-inline:0;bottom:max(16px, env(safe-area-inset-bottom));flex-wrap:wrap;justify-content:center;gap:8px;padding:0 16px;display:flex;position:fixed}.pill{border-radius:var(--r);min-height:44px;box-shadow:var(--shadow);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);transition:background .25s var(--ease);background:#ffffffc7;border:0;padding:0 18px;font-size:15px}.pill.on{background:var(--terracotta);color:#fff}.top{top:max(12px, env(safe-area-inset-top));justify-content:space-between;gap:8px;display:flex;position:fixed;inset-inline:12px}#status{pointer-events:none;place-items:center;font-size:16px;transition:opacity .3s;display:grid;position:fixed;inset:0}.sheet{inset-inline:0;padding:14px 0 calc(78px + env(safe-area-inset-bottom));-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#f6f0e6e6;border-radius:22px 22px 0 0;position:fixed;bottom:0;box-shadow:0 -4px 20px #3b2f2a1a}.strip{scrollbar-width:none;gap:10px;padding:4px 16px;display:flex;overflow-x:auto}.chip{background:#fff;border:2px solid #0000;border-radius:16px;flex:none;gap:2px;width:84px;padding:4px;font-size:13px;display:grid}.chip img{aspect-ratio:1;object-fit:cover;background:#2a2420;border-radius:12px;width:100%}.chip.on{border-color:var(--terracotta)}.swatch{width:44px;height:44px;box-shadow:var(--shadow);border:3px solid #fff;border-radius:50%;flex:none}.swatch.on{outline:2px solid var(--terracotta);outline-offset:2px}@media (prefers-reduced-motion:reduce){*{transition:none!important}}
