:root{--bg:#f5f3ff;--surface:#fff;--text:#1e1b2e;--muted:#6b6880;--primary:#7c3aed;--primary-text:#fff;--accent:#14b8a6;--border:#e4e0f5;--danger:#dc2626;--nav-h:56px;--side-w:260px;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;font-family:system-ui,sans-serif}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial;--bg:#14121f;--surface:#1f1b30;--text:#ede9fe;--muted:#a29fbb;--border:#332e4d;--primary:#8b5cf6}}*{box-sizing:border-box}body{background:var(--bg);color:var(--text);margin:0}input,button{font:inherit;border-radius:10px;padding:10px 14px}input{border:1px solid var(--border);background:var(--surface);color:var(--text);min-width:0}button{cursor:pointer;background:var(--primary);color:var(--primary-text);border:0}button.ghost,button.icon{color:var(--text);background:0 0}button.ghost,.muted{color:var(--muted)}.error{color:var(--danger)}.grow{flex:1}.card{flex-direction:column;gap:12px;max-width:380px;margin:10vh auto 0;padding:24px 16px;display:flex}.link{color:var(--primary);background:0 0;padding:4px;text-decoration:underline}.navbar{height:var(--nav-h);z-index:20;background:var(--primary);color:var(--primary-text);align-items:center;gap:10px;padding:0 12px;display:flex;position:fixed;inset:0 0 auto}.navbar .icon,.navbar .ghost{color:var(--primary-text)}.side{top:var(--nav-h);width:var(--side-w);z-index:15;background:var(--surface);border-right:1px solid var(--border);flex-direction:column;gap:12px;padding:16px;transition:transform .2s;display:flex;position:fixed;bottom:0;left:0;overflow-y:auto;transform:translate(-100%)}.side.open{transform:none}.side h2{color:var(--muted);text-transform:uppercase;letter-spacing:.05em;margin:10px 0 0;font-size:.8rem}.overlay{inset:var(--nav-h) 0 0 0;z-index:10;background:#0006;position:fixed}main{padding:calc(var(--nav-h) + 16px) 16px 16px;flex-direction:column;gap:12px;max-width:640px;margin:0 auto;display:flex}ul{flex-direction:column;gap:8px;margin:0;padding:0;list-style:none;display:flex}li{background:var(--bg);border-radius:10px;align-items:center;gap:10px;padding:6px 6px 6px 12px;display:flex}li span{flex:1}.counters li{background:var(--surface);border:1px solid var(--border);padding:10px 12px}.counters button{width:44px;height:44px;padding:0;font-size:1.4rem}.counters b{text-align:center;min-width:3ch;color:var(--accent);font-size:1.3rem}.total{font-size:1.1rem}.row{gap:8px;display:flex}.row input{flex:1}@media (width>=768px){.navbar .icon,.overlay{display:none}.side{transform:none}main{margin-left:var(--side-w);max-width:none;padding-left:32px;padding-right:32px}main>*{max-width:640px}}.tabs{flex-direction:column;gap:6px;display:flex}.tabs button{text-align:left;background:var(--bg);color:var(--text)}.tabs button.active{background:var(--primary);color:var(--primary-text)}.presets{flex-wrap:wrap;gap:8px;display:flex}.presets button{background:var(--surface);color:var(--primary);border:1px solid var(--border)}.calendar{background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:12px}.cal-head{justify-content:space-between;align-items:center;margin-bottom:8px;display:flex}.cal-grid{text-align:center;grid-template-columns:repeat(7,1fr);gap:4px;display:grid}.day{aspect-ratio:1;color:var(--text);background:0 0;border-radius:10px;padding:0;position:relative}.day.in{background:color-mix(in srgb, var(--primary) 18%, transparent)}.day.edge{background:var(--primary);color:var(--primary-text)}.day i{color:var(--accent);font-size:.65rem;font-style:normal;font-weight:700;position:absolute;bottom:1px;right:3px}.day.edge i{color:var(--primary-text)}h3{margin:4px 0 0}.toast{z-index:30;background:var(--text);color:var(--bg);border-radius:999px;padding:10px 18px;position:fixed;bottom:20px;left:50%;transform:translate(-50%);box-shadow:0 4px 16px #0004}.toast button{margin-left:8px;padding:6px 12px}.toast button.ghost{color:var(--bg)}label{color:var(--muted);flex-direction:column;flex:1;gap:4px;font-size:.85rem;display:flex}label input{font-size:1rem}.toast.wide{border-radius:14px;align-items:center;gap:4px;width:calc(100% - 32px);max-width:440px;font-size:.9rem;display:flex}.toast.wide span{flex:1}.loader{margin:auto;position:fixed;inset:0}