@layer theme;@layer base{:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;--bg:#f5f6f4;--surface:#fff;--ink:#1a1c19;--muted:#6d7269;--line:#e3e6e0;--level-0:#ebede8;--accent:#1a1c19}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial;--bg:#121411;--surface:#1b1e1a;--ink:#eef0ea;--muted:#9ca296;--line:#2b2f29;--level-0:#262a24;--accent:#eef0ea}}*{box-sizing:border-box}body{background:var(--bg);color:var(--ink);margin:0;font:15px/1.5 system-ui,-apple-system,Segoe UI,sans-serif}button,input{font:inherit;color:inherit}input{border:1px solid var(--line);background:var(--surface);border-radius:.6rem;padding:.5rem .65rem}button{border:1px solid var(--line);background:var(--surface);cursor:pointer;border-radius:.6rem;padding:.5rem .9rem;font-weight:600}button.primary{background:var(--accent);color:var(--bg);border-color:#0000}}@layer components{@scope(streak-grid) to ([data-zb-slotted=streak-grid]){:scope{display:block;overflow-x:auto}.grid{grid-auto-flow:column;grid-template-rows:repeat(7, var(--cell,.85rem));grid-auto-columns:var(--cell,.85rem);gap:3px;width:max-content;display:grid}button{background:var(--level-0);cursor:pointer;border:0;border-radius:3px;width:100%;height:100%;padding:0}button:focus-visible{outline:2px solid var(--ink);outline-offset:1px}button[data-level="1"]{background:color-mix(in srgb, var(--habit) 30%, var(--level-0))}button[data-level="2"]{background:color-mix(in srgb, var(--habit) 55%, var(--level-0))}button[data-level="3"]{background:color-mix(in srgb, var(--habit) 78%, var(--level-0))}button[data-level="4"]{background:var(--habit)}button[data-today]{box-shadow:0 0 0 1.5px var(--ink)}button:disabled{visibility:hidden}}@scope(check-ring) to ([data-zb-slotted=check-ring]){:scope{align-items:center;gap:.35rem;display:inline-flex}.ring{width:3rem;height:3rem;color:var(--ink);font:inherit;cursor:pointer;background:0 0;border:0;border-radius:50%;place-items:center;padding:0;font-weight:800;display:grid;position:relative}svg{width:100%;position:absolute;inset:0;transform:rotate(-90deg)}circle{fill:none;stroke-width:3.5px}.track{stroke:var(--level-0)}.fill{stroke:var(--habit);stroke-linecap:round;transition:stroke-dasharray .3s}.done .count{color:#fff}.done .bg{fill:var(--habit)}.count{font-size:.8125rem;position:relative}.less{border:1px solid var(--line);background:var(--surface);width:1.6rem;height:1.6rem;color:var(--muted);cursor:pointer;border-radius:50%;padding:0}.less:disabled{visibility:hidden}}@scope(color-swatches) to ([data-zb-slotted=color-swatches]){:scope{display:block}div{flex-wrap:wrap;gap:.4rem;display:flex}button{cursor:pointer;width:1.75rem;height:1.75rem;box-shadow:inset 0 0 0 2px var(--surface);border:2px solid #0000;border-radius:50%;padding:0}button[aria-checked=true]{border-color:var(--ink)}}}@layer utilities;.app{max-width:46rem;margin:0 auto;padding:1.5rem 1.25rem 3rem}header{justify-content:space-between;align-items:flex-end;gap:1rem;margin-bottom:1.25rem;display:flex}h1{letter-spacing:-.03em;margin:0;font-size:1.75rem}.date{color:var(--muted);margin:0}.today{color:var(--muted);justify-items:end;font-size:.8125rem;display:grid}.today strong{color:var(--ink);font-size:1.5rem;line-height:1}.today progress{width:8rem;accent-color:var(--ink);margin-top:.3rem}.habits{gap:.85rem;margin:0 0 1rem;padding:0;list-style:none;display:grid}.habit{background:var(--surface);border:1px solid var(--line);border-radius:1rem;gap:.85rem;padding:1rem 1.1rem;display:grid}.top{align-items:center;gap:.85rem;display:flex}.name{flex:1;min-width:0}.name h2{margin:0;font-size:1.05rem}.name p{color:var(--muted);margin:0;font-size:.8125rem}.stats{text-align:right;gap:1rem;margin:0;display:flex}.stats dt{text-transform:uppercase;letter-spacing:.05em;color:var(--muted);font-size:.7rem}.stats dd{font-variant-numeric:tabular-nums;margin:0;font-weight:700}.remove{color:var(--muted);background:0 0;border:0;padding:.2rem .4rem;font-size:1.1rem}.new{width:100%;padding:.8rem}.add{background:var(--surface);border:1px solid var(--line);border-radius:1rem;gap:.75rem;padding:1.1rem;display:grid}.add h2{margin:0;font-size:1.05rem}.add label,.add .field{color:var(--muted);gap:.3rem;font-size:.8125rem;font-weight:600;display:grid}.add input{color:var(--ink);font-size:.9375rem;font-weight:400}.add input[type=number]{width:6rem}.actions{justify-content:flex-end;gap:.5rem;display:flex}@media (width<=34rem){.stats{display:none}}