:root{--bg-0:#07080d;--bg-1:#0c0e18;--bg-2:#141726;--glass:#ffffff0b;--glass-hi:#ffffff12;--hair:#ffffff17;--hair-soft:#ffffff0e;--ink:#f3f5fb;--muted:#9aa0b8;--faint:#8b91a9;--accent:#7c8cff;--accent-soft:#a3adff;--accent-2:#b98bff;--accent-glow:#7c8cff8c;--danger:#ff5b6e;--danger-soft:#ff8894;--danger-glow:#ff5b6e80;--paper:#eef2ff;--radius:24px;--ease:cubic-bezier(.22, 1, .36, 1);--ease-back:cubic-bezier(.34, 1.56, .64, 1);--undo-ms:4.6s}*{box-sizing:border-box;margin:0;padding:0}html{-webkit-font-smoothing:antialiased;text-rendering:optimizelegibility}body{min-height:100svh;color:var(--ink);background:radial-gradient(130% 100% at 50% -18%, var(--bg-2) 0%, var(--bg-1) 46%, var(--bg-0) 100%);place-items:center;padding:clamp(16px,4vw,48px);font-family:Inter,system-ui,sans-serif;display:grid;overflow:hidden}body:before{content:"";z-index:0;pointer-events:none;background:radial-gradient(38% 42% at 16% 20%,#7c8cff33,#0000 72%),radial-gradient(42% 46% at 86% 82%,#b98bff29,#0000 74%),radial-gradient(50% 50% at 78% 12%,#ff5b6e12,#0000 70%);position:fixed;inset:-20%}body:after{content:"";z-index:0;pointer-events:none;background:radial-gradient(120% 120%,#0000 52%,#0000008c 100%);position:fixed;inset:0}.grain{z-index:1;pointer-events:none;opacity:.045;mix-blend-mode:overlay;background-image:url(/textures/grain.png);background-size:200px;position:fixed;inset:0}.sr-only{clip:rect(0 0 0 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.sound-toggle{z-index:50;cursor:pointer;width:44px;height:44px;color:var(--ink);background:var(--glass);-webkit-backdrop-filter:blur(12px);border:1px solid var(--hair);box-shadow:inset 0 1px 0 var(--glass-hi), 0 10px 24px -14px #000c;transition:transform .3s var(--ease-back), background .3s, border-color .3s;border-radius:50%;place-items:center;font-size:17px;display:grid;position:fixed;top:20px;right:20px}.sound-toggle:hover{background:var(--glass-hi);border-color:var(--accent-soft);transform:scale(1.08)}.sound-toggle:active{transform:scale(.94)}.sound-toggle:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.stage{z-index:2;flex-direction:column;align-items:center;width:min(440px,100%);display:flex;position:relative}.stage:before{content:"";z-index:-1;pointer-events:none;background:radial-gradient(50% 50% at 50% 50%, var(--accent-glow), transparent 70%);opacity:.5;width:120%;height:70%;position:absolute;top:42%;left:50%;transform:translate(-50%,-50%)}.card{border-radius:var(--radius);background:linear-gradient(180deg, var(--glass-hi), var(--glass));-webkit-backdrop-filter:blur(24px)saturate(1.3);width:100%;min-height:400px;box-shadow:0 48px 90px -34px #000000d9, 0 14px 40px -20px #0009, inset 0 1px 0 #ffffff1f, inset 0 0 0 1px var(--hair-soft);flex-direction:column;padding:26px 24px 98px;display:flex;position:relative;overflow:hidden}.card:before{content:"";pointer-events:none;background:linear-gradient(#ffffff0f,#0000);height:40%;position:absolute;inset:0 0 auto}.card__body{z-index:2;flex-direction:column;flex:auto;justify-content:center;display:flex;position:relative}.card__head{z-index:2;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:16px;display:flex;position:relative}.card__eyebrow{letter-spacing:.3em;text-transform:uppercase;color:var(--accent-soft);align-items:center;gap:7px;font-family:Space Grotesk,sans-serif;font-size:.66rem;display:flex}.card__eyebrow:before{content:"";background:var(--accent);width:6px;height:6px;box-shadow:0 0 10px 1px var(--accent);border-radius:50%}.card__title{letter-spacing:-.015em;color:#fff;margin-top:6px;font-family:Space Grotesk,sans-serif;font-size:1.55rem;font-weight:700}.card__count{color:var(--muted);white-space:nowrap;font-variant-numeric:tabular-nums;background:var(--glass);border:1px solid var(--hair-soft);border-radius:999px;padding:5px 11px;font-size:.8rem}.card__count span{color:var(--ink);font-weight:600}.meter{z-index:2;margin-bottom:20px;position:relative}.meter__legend{font-variant-numeric:tabular-nums;justify-content:space-between;align-items:baseline;gap:10px;margin-bottom:8px;font-size:.74rem;display:flex}.meter__used{color:var(--muted)}.meter__used b{color:var(--ink);font-family:Space Grotesk,sans-serif;font-weight:600}.meter__freed{color:var(--accent-soft);opacity:0;transition:opacity .35s var(--ease), transform .35s var(--ease);align-items:center;gap:4px;font-weight:600;display:inline-flex;transform:translateY(3px)}.meter__freed.show{opacity:1;transform:none}.meter__freed:before{content:"";border-bottom:5px solid;border-left:3.5px solid #0000;border-right:3.5px solid #0000;width:0;height:0}.meter__bar{background:#ffffff12;border-radius:999px;height:7px;position:relative;overflow:hidden;box-shadow:inset 0 1px 2px #0006}.meter__fill{transform-origin:0;background:linear-gradient(90deg, var(--accent), var(--accent-2));box-shadow:0 0 12px var(--accent-glow);transition:transform .6s var(--ease);border-radius:999px;position:absolute;inset:0;transform:scaleX(1)}.meter__fill:after{content:"";animation:meterSheen 3.2s var(--ease) infinite;background:linear-gradient(90deg,#0000,#ffffff59,#0000);position:absolute;inset:0;transform:translate(-100%)}@keyframes meterSheen{0%,60%{transform:translate(-100%)}to{transform:translate(100%)}}.list{z-index:2;list-style:none;position:relative}.item{transition:grid-template-rows .42s var(--ease);grid-template-rows:1fr;display:grid}.item__wrap{min-height:0;overflow:hidden}.item__row{transition:background .28s var(--ease), border-color .28s var(--ease), transform .45s var(--ease), opacity .3s var(--ease);border:1px solid #0000;border-radius:15px;align-items:center;gap:14px;padding:12px;display:flex;position:relative;transform:translateZ(0)}.item+.item .item__row{margin-top:4px}.item__row:hover{background:var(--glass);border-color:var(--hair-soft)}:is(.item__row:has(.del:hover),.item__row:has(.del.hovering),.item__row:has(.del.arming)){background:color-mix(in srgb, var(--danger) 12%, transparent);border-color:color-mix(in srgb, var(--danger) 34%, transparent)}.item__icon{width:44px;height:44px;color:var(--tint,var(--accent));background:linear-gradient(160deg, color-mix(in srgb, var(--tint,var(--accent)) 32%, transparent), color-mix(in srgb, var(--tint,var(--accent)) 10%, transparent));box-shadow:inset 0 1px 0 #ffffff2e, inset 0 0 0 1px color-mix(in srgb, var(--tint,var(--accent)) 34%, transparent);border-radius:13px;flex:none;place-items:center;display:grid}.item__icon svg{filter:drop-shadow(0 1px 2px #0000004d);width:22px;height:22px;display:block}.item__meta{flex-direction:column;flex:auto;min-width:0;display:flex}.item__name{color:var(--ink);white-space:nowrap;text-overflow:ellipsis;font-size:.95rem;font-weight:600;overflow:hidden}.item__sub{color:var(--faint);font-variant-numeric:tabular-nums;margin-top:3px;font-size:.77rem}.del{--tw:0px;cursor:pointer;width:40px;height:40px;color:var(--danger-soft);background:color-mix(in srgb, var(--danger) 12%, transparent);transition:color .25s, background .25s, border-color .25s, transform .25s var(--ease), box-shadow .25s;border:1px solid #0000;border-radius:12px;flex:none;place-items:center;display:grid}.del:hover,.del.hovering{color:#fff;background:var(--danger);box-shadow:0 10px 22px -8px var(--danger-glow), 0 0 0 4px color-mix(in srgb, var(--danger) 16%, transparent);border-color:#ffffff40}.del:active{transform:scale(.9)}.del:focus-visible{outline:2px solid var(--danger);outline-offset:2px}.del svg{width:20px;height:20px;overflow:visible}.del .lid{transform-origin:20% 100%;transition:transform .3s var(--ease-back)}.del:hover .lid,.del.hovering .lid,.del.arming .lid{transform:translateY(-1.5px)rotate(-11deg)}.del.arming{color:#fff;background:var(--danger);box-shadow:0 0 0 4px color-mix(in srgb, var(--danger) 22%, transparent);transform:scale(.86)}.item--in .item__row{animation:rowIn .55s var(--ease) backwards;animation-delay:calc(var(--i,0) * 70ms + .12s)}@keyframes rowIn{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}.item.removing{grid-template-rows:0fr}.item.removing .item__row{opacity:0;transform:translate(10px)}.item.restoring{grid-template-rows:0fr}.empty{z-index:2;color:var(--muted);text-align:center;animation:emptyIn .5s var(--ease) both;flex-direction:column;align-items:center;gap:12px;padding:18px 12px 22px;font-size:.92rem;display:flex;position:relative}.empty[hidden]{display:none}.empty__spark{background:radial-gradient(circle, color-mix(in srgb, var(--accent) 40%, transparent), transparent 70%);border-radius:50%;place-items:center;width:46px;height:46px;display:grid;position:relative}.empty__spark:before{content:"";background:var(--accent-soft);width:12px;height:12px;box-shadow:0 0 18px 3px var(--accent);animation:twinkle 1.8s var(--ease) infinite;border-radius:50%;margin:auto;position:absolute;inset:0}@keyframes emptyIn{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}@keyframes twinkle{0%,to{opacity:.6;transform:scale(.7)}50%{opacity:1;transform:scale(1.15)}}.bin{z-index:4;pointer-events:none;filter:drop-shadow(0 12px 18px #0009);width:64px;height:68px;position:absolute;bottom:22px;right:22px;transform:translateZ(0)}.bin__can{transform-origin:50% 100%;position:absolute;inset:0}.bin.catch .bin__can{animation:binSquash .5s var(--ease-back)}@keyframes binSquash{0%{transform:scale(1)}35%{transform:scale(1.1,.86)translateY(3px)}70%{transform:scale(.97,1.04)}to{transform:scale(1)}}.bin__body{clip-path:polygon(6% 0,94% 0,86% 100%,14% 100%);transition:box-shadow .35s var(--ease);background:linear-gradient(#3a3f57 0%,#262a3d 55%,#1a1d2c 100%);border-radius:4px 4px 10px 10px;position:absolute;inset:18px 8px 0;box-shadow:inset 0 1px #ffffff29,inset 0 -8px 14px -6px #000000b3}.bin.open .bin__body{box-shadow:inset 0 1px 0 #ffffff29, inset 0 8px 16px -6px var(--accent-glow)}.bin__ribs{position:absolute;inset:0}.bin__ribs:before,.bin__ribs:after,.bin__body:after{content:"";background:linear-gradient(#ffffff2e,#ffffff0a);border-radius:2px;width:2px;position:absolute;top:14%;bottom:12%}.bin__ribs:before{left:38%}.bin__ribs:after{left:58%}.bin__body:after{left:48%}.bin__lid{transform-origin:12% 80%;height:8px;transition:transform .32s var(--ease-back);z-index:2;background:linear-gradient(#474d69,#2e3348);border-radius:5px;position:absolute;top:12px;left:3px;right:3px;box-shadow:inset 0 1px #ffffff38,0 3px 6px -2px #000000b3}.bin__handle{border:2.5px solid #474d69;border-bottom:none;border-radius:6px 6px 0 0;width:16px;height:6px;position:absolute;top:-5px;left:50%;transform:translate(-50%)}.bin.open .bin__lid{transform:rotate(-34deg)translateY(-1px)}.bin__tally{color:#fff;background:linear-gradient(180deg, var(--accent-soft), var(--accent));min-width:20px;height:20px;box-shadow:0 4px 14px -2px var(--accent-glow), inset 0 1px 0 #ffffff4d;opacity:0;transition:opacity .3s, transform .35s var(--ease-back);border-radius:10px;place-items:center;padding:0 5px;font-family:Space Grotesk,sans-serif;font-size:.72rem;font-weight:700;display:grid;position:absolute;top:-8px;right:-6px;transform:scale(.4)}.bin__tally.show{opacity:1;transform:scale(1)}.bin__tally.bump{animation:tallyBump .4s var(--ease-back)}@keyframes tallyBump{0%{transform:scale(1)}40%{transform:scale(1.35)}to{transform:scale(1)}}.fx{pointer-events:none;z-index:30;position:fixed;inset:0}.ball{will-change:transform;filter:drop-shadow(0 10px 14px #0009);width:34px;height:34px;position:fixed;top:0;left:0}.ball svg{width:100%;height:100%;display:block}.poof{will-change:transform, opacity;background:#bec8f0d9;border-radius:50%;width:7px;height:7px;position:fixed;top:0;left:0}.snack-slot{flex-direction:column;min-height:80px;display:flex}.snack{-webkit-backdrop-filter:blur(18px)saturate(1.3);border:1px solid var(--hair);opacity:0;transition:opacity .35s var(--ease), transform .45s var(--ease-back);background:#10121ed1;border-radius:16px;align-items:center;gap:12px;margin-top:22px;padding:11px 12px 11px 16px;display:flex;position:relative;transform:translateY(14px)scale(.96);box-shadow:0 28px 50px -22px #000000d9,inset 0 1px #ffffff14}.snack.show{opacity:1;transform:none}.snack__dot{background:var(--danger);width:8px;height:8px;box-shadow:0 0 10px var(--danger);border-radius:50%;flex:none}.snack__msg{color:#d9deec;white-space:nowrap;text-overflow:ellipsis;max-width:240px;font-size:.86rem;overflow:hidden}.snack__msg b{color:#fff;font-weight:600}.snack__undo{cursor:pointer;color:#fff;background:linear-gradient(180deg, var(--accent-soft), var(--accent));transition:transform .2s var(--ease), filter .25s, box-shadow .25s;border:1px solid #ffffff2e;border-radius:11px;flex:none;align-items:center;gap:5px;margin-left:2px;padding:7px 13px;font-family:Inter,sans-serif;font-size:.82rem;font-weight:600;display:inline-flex;box-shadow:inset 0 1px #ffffff47}.snack__undo:hover{filter:brightness(1.08);box-shadow:0 10px 22px -8px var(--accent-glow), inset 0 1px 0 #ffffff47}.snack__undo:active{transform:scale(.93)}.snack__undo:focus-visible{outline-offset:2px;outline:2px solid #fff}.snack__ring{flex:none;width:22px;height:22px;transform:rotate(-90deg)}.snack__ring-track{fill:none;stroke:#ffffff1f;stroke-width:3px}.snack__ring-fill{fill:none;stroke:var(--accent-soft);stroke-width:3px;stroke-linecap:round;stroke-dasharray:97.4;stroke-dashoffset:0}@keyframes ringDeplete{to{stroke-dashoffset:97.4px}}.snack.counting .snack__ring-fill{animation:ringDeplete var(--undo-ms) linear forwards}.snack.paused .snack__ring-fill{animation-play-state:paused}@media (width<=420px){.card{min-height:380px;padding:22px 18px 88px}.bin{bottom:16px;right:16px}.snack__msg{max-width:150px}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.12s!important;animation-duration:.001ms!important;animation-iteration-count:1!important}.item{transition:none}.item--in .item__row{animation:none}.meter__fill:after{display:none}.ball,.poof{display:none!important}}