:root{--ink:#0b0d1a;--glass:#ffffff12;--line:#ffffff24;--muted:#9aa0c3}*{box-sizing:border-box}body{color:#f3f4ff;background:radial-gradient(45rem 30rem at 12% -5%, #ff466e59, transparent 60%), radial-gradient(40rem 30rem at 95% 10%, #5a50ff59, transparent 60%), radial-gradient(40rem 30rem at 50% 110%, #00c8c838, transparent 60%), var(--ink);background-attachment:fixed;min-height:100vh;margin:0;font:16px/1.4 ui-rounded,SF Pro Rounded,system-ui,sans-serif}main{max-width:34rem;margin:0 auto;padding:3rem 1.25rem 7rem}header{align-items:center;gap:1.1rem;margin-bottom:2rem;display:flex}header img{border-radius:50%;width:4rem;height:4rem;animation:4s ease-in-out infinite float;box-shadow:0 0 0 6px #ff466e26,0 0 40px #ff466eb3}h1{letter-spacing:-.04em;background:linear-gradient(100deg,#fff 10%,#ff6a8b 45%,#8f7bff 90%);color:#0000;-webkit-background-clip:text;background-clip:text;margin:0;font-size:clamp(3rem,14vw,4.5rem);font-weight:900;line-height:1}.tag{color:var(--muted);letter-spacing:.08em;text-transform:uppercase;margin:.35rem 0 0;font-size:.75rem}#error{color:#ff8fa3;min-height:1.4em;margin:0 0 .5rem}#empty{text-align:center;color:var(--muted);border:1px dashed var(--line);border-radius:1.25rem;padding:2.5rem 1rem}ul{gap:.8rem;margin:0 0 1.5rem;padding:0;list-style:none;display:grid}li{--c:hsl(var(--h) 90% 65%);background:var(--glass);border:1px solid var(--line);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-radius:1.25rem;align-items:center;gap:.6rem;padding:.85rem .9rem .85rem 1.1rem;transition:transform .2s,border-color .2s;animation:.35s ease-out both in;display:flex;position:relative;overflow:hidden;box-shadow:0 10px 30px -12px #0009}li:before{content:"";background:var(--c);width:4px;box-shadow:0 0 18px var(--c);position:absolute;inset:0 auto 0 0}li:hover{border-color:var(--c);transform:translateY(-2px)}.name{overflow-wrap:anywhere;flex:1;font-weight:600}.value{text-align:right;font-variant-numeric:tabular-nums;min-width:2.2ch;color:var(--c);text-shadow:0 0 22px var(--c);padding-right:.3rem;font-size:2.2rem;font-weight:900;line-height:1}.value.bump{animation:.35s ease-out bump}button{font:inherit;cursor:pointer;color:inherit;border:1px solid var(--line);background:var(--glass);transition:transform .12s,background .2s,box-shadow .2s}li button{border-radius:50%;width:2.4rem;height:2.4rem;padding:0;font-size:1.2rem;font-weight:700}li button:hover:not(:disabled){background:#ffffff29;transform:scale(1.12)}li button:active:not(:disabled){transform:scale(.92)}.inc{background:var(--c);color:#12142a;box-shadow:0 0 18px -2px var(--c);border-color:#0000}li .inc:hover:not(:disabled){background:var(--c);box-shadow:0 0 26px 0 var(--c)}.del{color:var(--muted);width:1.9rem!important;height:1.9rem!important;font-size:.75rem!important}.del:hover:not(:disabled){color:#ff8fa3;border-color:#ff8fa3}button:disabled{opacity:.3;cursor:not-allowed}form{background:var(--glass);border:1px solid var(--line);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);border-radius:1.5rem;gap:.6rem;padding:.5rem;display:flex}label{flex:1;display:flex}label span{clip-path:inset(50%);width:1px;height:1px;position:absolute;overflow:hidden}input{width:100%;font:inherit;color:inherit;background:0 0;border:0;border-radius:1rem;flex:1;padding:.7rem 1rem}input::placeholder{color:var(--muted)}form button{color:#fff;background:linear-gradient(120deg,#ff4f79,#7b6bff);border:0;border-radius:1rem;padding:.7rem 1.6rem;font-weight:800;box-shadow:0 8px 24px -8px #ff4f79}form button:hover{transform:translateY(-1px);box-shadow:0 12px 28px -8px #ff4f79}button:focus-visible,input:focus-visible{outline-offset:2px;outline:3px solid #8f7bff}@keyframes in{0%{opacity:0;transform:translateY(10px)scale(.98)}}button.pop{animation:.35s ease-out pop}@keyframes pop{30%{transform:scale(.82)}65%{transform:scale(1.2)}}@keyframes bump{40%{transform:scale(1.35)}}@keyframes float{50%{transform:translateY(-6px)}}@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}