:root{font-family:DM Sans,system-ui,sans-serif;color:#243b32;background:#f6f6f0;font-synthesis:none;--green:#315943;--muted:#6e7c70;--line:#dce1d6}*{box-sizing:border-box}body{margin:0}button,input{font:inherit}button{cursor:pointer;border:0;background:var(--green);color:#fff;border-radius:12px;padding:13px 20px;font-weight:600;transition:background .15s}button:hover{background:#234632}button:disabled{cursor:default;opacity:.5}button:focus-visible,input:focus-visible,summary:focus-visible,a:focus-visible{outline:3px solid #9cae62;outline-offset:3px}input{min-width:0;border:1px solid var(--line);border-radius:10px;background:#fff;padding:13px 15px;color:inherit;width:100%}main{max-width:860px;margin:auto;padding:0 28px}header{display:flex;align-items:center;justify-content:space-between;padding:34px 0;border-bottom:1px solid var(--line)}.brand{font-family:Manrope,system-ui,sans-serif;font-weight:800;letter-spacing:-3px;font-size:36px;color:var(--green);text-decoration:none}.brand span{color:#c3cf8e;font-size:12px;margin-left:5px;letter-spacing:0}.eyebrow{font-size:10px;letter-spacing:2px;font-weight:700;color:var(--muted)}.intro{padding:64px 0 26px}h1{font-family:Manrope,system-ui,sans-serif;font-size:clamp(42px,7vw,66px);letter-spacing:-3px;line-height:1.12;font-weight:500;margin:18px 0}p{line-height:1.65}.intro p{color:var(--muted);font-size:16px;margin-top:24px}.status-bar{display:flex;align-items:center;gap:9px;font-size:12px;color:var(--muted);padding:16px 0}.status-bar button{margin-left:auto;font-size:12px}.dot{height:7px;width:7px;flex-shrink:0;border-radius:50%;background:#7d9f65}.dot.offline{background:#b29255}.new-task{display:flex;gap:10px;padding:10px;background:#fff;border:1px solid var(--line);border-radius:16px;margin:4px 0 36px;box-shadow:0 4px 16px #243b3203}.new-task input{border:0;background:transparent}.section-heading{display:flex;align-items:center;gap:12px;margin:30px 0 15px}h2{font-size:15px;font-weight:600;margin:0}.section-heading>span{font-size:11px;border-radius:20px;background:#e7eadf;padding:3px 8px;color:var(--muted)}.tasks{list-style:none;padding:0;margin:0}.task{display:flex;align-items:center;gap:14px;border-bottom:1px solid var(--line);padding:20px 0}.check{width:25px;height:25px;flex-shrink:0;border:1px solid #aeb9a8;background:transparent;border-radius:50%;padding:0;color:var(--green)}.check:hover{background:#e3ead8}.check:disabled{opacity:1}.completed .check{background:#dfe7d5;border-color:#dfe7d5}.task-title{flex:1;min-width:0;overflow-wrap:anywhere;font-size:15px}.task-title small{display:block;color:var(--muted);font-size:10px;margin-top:4px}.completed .task-title>span{text-decoration:line-through;color:#819080}.task-actions{display:flex;gap:3px}.quiet{color:var(--green);background:transparent;padding:8px;font-size:12px;font-weight:500}.quiet:hover{background:#e8ecdf}.danger{color:#9a5c4e}.edit-form{display:flex;gap:8px;width:100%;flex-wrap:wrap}.edit-form input{flex:1;min-width:160px}.edit-form button{padding:10px 13px;font-size:12px}.empty{text-align:center;border:1px dashed #d3dbcb;border-radius:18px;padding:42px 20px;margin:12px 0 28px}.empty>span{font-size:40px;color:#9aaf7a}.empty h3{font-family:Manrope,system-ui,sans-serif;font-size:17px;font-weight:500}.empty p{color:var(--muted);font-size:13px}.card{border:1px solid var(--line);border-radius:18px;padding:26px;background:#fff}.card h2{font-size:20px}.pair-form{display:grid;gap:16px;max-width:520px}.pair-form p{font-size:13px;color:var(--muted)}label{font-size:13px;display:grid;gap:8px}.pair-form button{justify-self:start}.connection{margin-top:40px;font-size:12px;color:var(--muted);border-top:1px solid var(--line);padding-top:20px}.connection summary{cursor:pointer}.notice{background:#f1ead8;border:1px solid #dfd2ae;border-radius:14px;padding:18px 22px;margin:20px 0;font-size:13px}.notice h2{line-height:1.5}.storage-note{color:var(--muted);font-size:11px;margin-top:20px}footer{text-align:center;color:#8e9988;font-size:11px;padding:56px 0 28px;letter-spacing:.5px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media(max-width:540px){main{padding:0 20px}header{padding:22px 0}header>.eyebrow{font-size:8px;letter-spacing:1px}.intro{padding-top:44px}.intro p{font-size:14px;max-width:250px}.task{gap:10px}.task-actions{flex-direction:column;gap:0}.task-actions .quiet{padding:6px;font-size:11px}.new-task{padding:6px;gap:0}.new-task button{padding:12px;font-size:12px}.new-task input{padding:12px 9px;font-size:14px}.status-bar{font-size:10px}}
