:root{--ground: #f3f5f7;--surface: #ffffff;--raised: #f2f8fd;--border: #e6e6e6;--rule: #f4f4f4;--control: #d6d9dd;--text: #1b1d1f;--muted: #5c6064;--accent: #1d5fd6;--accent-soft: #dcf1ff;--accent-ink: #0a3a80;--positive: #2f7a45;--negative: #c41c29;--done: #6b7075;--pill-pos-bg: #dcfae5;--pill-pos-ink: #04250e;--radius-card: 20px;--radius-control: 10px;--gap: 24px;--bg: var(--ground);--card: var(--surface);--fg: var(--text);--line: var(--border);--ok: var(--positive);color-scheme:light}@media(prefers-color-scheme:dark){:root:not([data-theme=light]){--ground: #101214;--surface: #1a1d20;--raised: #20252a;--border: #2c3136;--rule: #24292d;--control: #3b4249;--text: #eceef0;--muted: #a2a8ae;--accent: #7aa7f0;--accent-soft: #1a2c47;--accent-ink: #cfe3ff;--positive: #6fd39c;--negative: #ff8a85;--done: #8c9298;--pill-pos-bg: #12301f;--pill-pos-ink: #bdf0d1;color-scheme:dark}}*{box-sizing:border-box}body{margin:0;background:var(--ground);color:var(--text);font:400 16px/1.5 Manrope Variable,Manrope,Inter,system-ui,sans-serif;-webkit-font-smoothing:antialiased;font-variant-numeric:tabular-nums}button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.appbar{height:56px;display:flex;align-items:center;gap:14px;padding:0 24px;background:var(--ground);border-bottom:1px solid var(--border);font-size:14px;position:sticky;top:0;z-index:5}.appbar sa-logo{display:contents}.appbar-brand{display:inline-flex;align-items:center;gap:10px;font-weight:600;font-size:18px;letter-spacing:-.01em}.appbar-crumb{color:var(--muted);padding-left:14px;border-left:1px solid var(--border);display:inline-flex;align-items:center;gap:6px}.appbar-sync{margin-left:auto;display:inline-flex;align-items:center;gap:6px;font-size:14px;padding:2px 12px;border-radius:999px;background:var(--pill-pos-bg);color:var(--pill-pos-ink)}.stage{min-height:calc(100vh - 56px);grid-template-columns:minmax(0,1fr) minmax(560px,1.1fr)}.stage>sa-hero{min-height:0;font-size:15px;font-weight:400}.stage>.board{display:flex;flex-direction:column;justify-content:flex-start;align-items:stretch;align-self:start;padding:36px 24px 24px}.todoapp{background:var(--surface);margin:0 auto 24px;width:100%;max-width:560px;border:1px solid var(--border);border-radius:var(--radius-card);position:relative;overflow:hidden}.todoapp .header{padding:24px 24px 16px}.todoapp h1{font-size:28px;line-height:1.2;font-weight:600;letter-spacing:-.015em;color:var(--text);margin:0 0 16px}.new-todo,.edit{width:100%;font:inherit;font-size:16px;padding:0 16px;min-height:44px;border:1px solid var(--control);border-radius:var(--radius-control);background:var(--surface);color:var(--text)}.new-todo::placeholder{color:var(--muted);opacity:1}.new-todo:focus,.edit:focus{outline:2px solid var(--accent);outline-offset:-1px}.main{position:relative;border-top:1px solid var(--border)}.toggle-all{position:absolute;opacity:0;width:1px;height:1px;border:none}.toggle-all+label{display:block;padding:12px 24px;font-size:14px;color:var(--muted);cursor:pointer;border-bottom:1px solid var(--rule)}.toggle-all+label:hover{color:var(--text)}.toggle-all:checked+label{color:var(--accent-ink);background:var(--accent-soft)}.toggle-all:focus-visible+label{outline:2px solid var(--accent);outline-offset:-2px}.todo-list{margin:0;padding:0;list-style:none}.todo-list li{position:relative;font-size:16px;border-bottom:1px solid var(--rule)}.todo-list li .view{display:flex;align-items:center;padding:0 12px 0 16px;min-height:56px}.todo-list li .toggle{width:22px;height:22px;margin:0 14px 0 0;flex:none;accent-color:var(--accent);cursor:pointer}.todo-list li label{flex:1;padding:14px 8px 14px 0;overflow-wrap:anywhere;display:block;line-height:1.35}.todo-list li.completed label{color:var(--done);text-decoration:line-through}.todo-list li .destroy{display:none;width:36px;height:36px;border-radius:10px;font-size:22px;line-height:1;color:var(--muted)}.todo-list li .destroy:after{content:"×"}.todo-list li:hover .destroy,.todo-list li .destroy:focus{display:block}.todo-list li .destroy:hover{background:var(--raised);color:var(--negative)}.todo-list li.editing .view{display:none}.todo-list li.editing .edit{display:block;margin:8px 16px;width:calc(100% - 32px)}.footer{padding:12px 24px;min-height:56px;font-size:14px;color:var(--muted);display:flex;align-items:center;justify-content:space-between;gap:8px}.todo-count strong{color:var(--text);font-weight:600}.filters{margin:0;padding:0;list-style:none;display:flex;gap:4px}.filters a{color:var(--muted);padding:4px 12px;text-decoration:none;border:1px solid transparent;border-radius:999px;display:inline-block}.filters a:hover{background:var(--raised);color:var(--text)}.filters a.selected{border-color:var(--accent);background:var(--accent-soft);color:var(--accent-ink);font-weight:600}.clear-completed{font-size:14px;padding:4px 8px;border-radius:8px}.clear-completed:hover{background:var(--raised);color:var(--text)}.error{color:var(--negative);font-size:14px;margin:0;padding:8px 24px}.nothing{font-size:14px;color:var(--muted);padding:20px 24px;margin:0;text-align:center;border-top:1px solid var(--border)}.info{margin:0 auto;color:var(--muted);font-size:14px;text-align:center}.info p{margin:0}@media(max-width:1000px){.stage{grid-template-columns:1fr}.stage>sa-hero{display:none}}@media(max-width:560px){.appbar{padding:0 16px}.appbar-crumb{display:none}.board{padding:20px 16px}.todoapp .header{padding:20px 16px 16px}.footer{padding:12px 16px;flex-wrap:wrap;justify-content:center}.toggle-all+label{padding:12px 16px}.todo-list li .view{padding:0 8px 0 16px}.todo-list li .destroy{display:block}}