:root{--color-bg:#fff;--color-bg-elevated:#fafafa;--color-text:#1a1a1a;--color-text-muted:#6b6b6b;--color-text-subtle:#9a9a9a;--color-border:#e5e5e5;--color-border-strong:#d4d4d4;--color-accent:#111;--color-accent-fg:#fff;--font-sans:system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;--font-mono:ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;font-family:var(--font-sans);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizelegibility;line-height:1.5}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial}}:root[data-theme=dark]{--color-bg:#0a0a0a;--color-bg-elevated:#141414;--color-text:#f5f5f5;--color-text-muted:#a3a3a3;--color-text-subtle:#737373;--color-border:#2a2a2a;--color-border-strong:#3a3a3a;--color-accent:#f5f5f5;--color-accent-fg:#0a0a0a}*,:before,:after{box-sizing:border-box}*{margin:0;padding:0}html,body{height:100%}body{background-color:var(--color-bg);color:var(--color-text);font-family:var(--font-sans);line-height:inherit}img,picture,video,canvas,svg{max-width:100%;display:block}input,button,textarea,select{font:inherit;color:inherit}button{cursor:pointer;background:0 0;border:none}p,h1,h2,h3,h4,h5,h6{overflow-wrap:break-word}a{color:inherit;text-decoration:none}ul,ol{list-style:none}#root{isolation:isolate;min-height:100%}.app{min-height:100svh;font-family:var(--font-sans);flex-direction:column;align-items:center;padding:4rem 1.5rem;display:flex}.app h1{font-family:var(--font-sans);letter-spacing:-.02em;color:var(--color-text);margin-bottom:2.5rem;font-size:2rem;font-weight:600}.task-wrapper{flex-direction:column;align-items:center;gap:.75rem;width:100%;max-width:36rem;display:flex}button{height:2rem;font-family:var(--font-sans);color:var(--color-text-muted);border:1px solid var(--color-border);background-color:#0000;border-radius:.4375rem;padding:0 .75rem;font-size:.8125rem;font-weight:500;transition:color .15s,background-color .15s,border-color .15s}button.themeToggle{margin:1rem;position:absolute;top:0;right:0}button:hover{color:var(--color-text);background-color:var(--color-bg);border-color:var(--color-border-strong)}button:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px}.input-row{width:100%;max-width:36rem;font-family:var(--font-sans);align-items:center;gap:.5rem;margin-bottom:2rem;display:flex}.input-row input{height:2.5rem;font-family:var(--font-sans);color:var(--color-text);background-color:var(--color-bg);border:1px solid var(--color-border);border-radius:.5rem;outline:none;flex:1;padding:0 .875rem;font-size:.9375rem;transition:border-color .15s,box-shadow .15s}.input-row input::placeholder{color:var(--color-text-subtle)}.input-row input:hover{border-color:var(--color-border-strong)}.input-row input:focus{border-color:var(--color-accent);box-shadow:0 0 0 3px #0000000d}@media (prefers-color-scheme:dark){.input-row input:focus{box-shadow:0 0 0 3px #ffffff14}}.input-row select{height:2.5rem;font-family:var(--font-sans);color:var(--color-text);background-color:var(--color-bg);border:1px solid var(--color-border);cursor:pointer;border-radius:.5rem;outline:none;padding:0 1rem;font-size:.9375rem;font-weight:500;transition:border-color .15s,box-shadow .15s}.input-row select:hover{border-color:var(--color-border-strong)}.input-row select:focus{border-color:var(--color-accent);box-shadow:0 0 0 3px #0000000d}@media (prefers-color-scheme:dark){.input-row select:focus{box-shadow:0 0 0 3px #ffffff14}}.input-row button{height:2.5rem;font-family:var(--font-sans);color:var(--color-accent-fg);background-color:var(--color-accent);border:1px solid var(--color-accent);border-radius:.5rem;padding:0 1.125rem;font-size:.9375rem;font-weight:500;transition:opacity .15s,transform 50ms}.input-row button:hover{opacity:.85}.input-row button:active{transform:scale(.98)}.input-row button:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px}.todo-wrapper{width:100%;max-width:36rem;font-family:var(--font-sans);color:var(--color-text);background-color:var(--color-bg-elevated);border:1px solid var(--color-border);border-radius:.625rem;justify-content:space-between;align-items:center;gap:1rem;padding:.75rem 1rem;transition:border-color .15s;display:flex}.todo-wrapper:hover{border-color:var(--color-border-strong)}.todo-wrapper h3{font-family:var(--font-sans);color:var(--color-text);flex:1;margin:0;font-size:.9375rem;font-weight:500}.todo-wrapper h3.completed{color:var(--color-text-subtle);text-decoration:line-through}.todo-wrapper .actions{align-items:center;gap:.375rem;display:flex}.todo-wrapper .actions button{height:2rem;font-family:var(--font-sans);color:var(--color-text-muted);border:1px solid var(--color-border);background-color:#0000;border-radius:.4375rem;padding:0 .75rem;font-size:.8125rem;font-weight:500;transition:color .15s,background-color .15s,border-color .15s}.todo-wrapper .actions button:hover{color:var(--color-text);background-color:var(--color-bg);border-color:var(--color-border-strong)}.todo-wrapper .actions button:focus-visible{outline:2px solid var(--color-accent);outline-offset:2px}