@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&display=swap');
:root{font-family:'DM Sans',system-ui,sans-serif;color:#253731;background:#f5f6f2;font-synthesis:none}*{box-sizing:border-box}body{margin:0}main{max-width:880px;margin:auto;padding:38px 28px}header,footer,.panel-heading,.panel-footer{display:flex;align-items:center;justify-content:space-between;gap:16px}.brand{font-size:24px;font-weight:700;letter-spacing:-1px;color:inherit;text-decoration:none}.tag{font-size:10px;letter-spacing:1.8px;border:1px solid #d8ded5;padding:8px 11px;border-radius:5px;color:#66736b}.intro{padding:65px 0 34px}.eyebrow{font-size:10px;font-weight:700;letter-spacing:2px;color:#568066}h1{font-size:49px;line-height:1.12;letter-spacing:-2px;font-weight:500;margin:18px 0}p{color:#778078;font-size:14px;line-height:1.7}.intro>p:last-child{max-width:430px}.panel{background:#fff;border:1px solid #dee3da;border-radius:12px;box-shadow:0 8px 24px #23372a04;overflow:hidden}.panel-heading{padding:24px 26px 16px}h2{font-size:17px;font-weight:600;margin:0}#count{font-size:11px;background:#eef2ea;border-radius:5px;padding:3px 7px;margin-left:7px;color:#6c786b}form{display:flex;gap:10px;padding:0 26px}input[type=text],input:not([type]){min-width:0;flex:1;font:inherit;font-size:13px;border:1px solid #dce2d7;border-radius:6px;padding:12px;background:#fafbf8}button{font:inherit;font-size:12px;font-weight:600;border:0;background:#365c44;color:white;padding:11px 15px;border-radius:6px;cursor:pointer;white-space:nowrap}button:hover{filter:brightness(.93)}button:disabled,input:disabled{opacity:.6;cursor:wait}.quiet{background:transparent;color:#738074;padding:8px}.delete:hover{color:#ac443a;background:#fff4f1}input:focus-visible,button:focus-visible,a:focus-visible{outline:2px solid #759e70;outline-offset:3px}#message{margin:10px 26px;min-height:20px;font-size:12px}#message.error{color:#b34237}ul{list-style:none;margin:0;padding:0 26px}li{display:flex;align-items:center;gap:12px;padding:16px 0;border-top:1px solid #edf0e9}.task-title{flex:1;overflow-wrap:anywhere;font-size:14px}.done{text-decoration:line-through;color:#98a093}input[type=checkbox]{accent-color:#426a4d;width:17px;height:17px;flex-shrink:0}#empty{text-align:center;padding:30px 16px 48px}#empty>span{font-size:30px;color:#7a9976;background:#f1f5ed;display:inline-block;padding:10px 16px;border-radius:12px}h3{font-weight:500;font-size:16px;margin:16px 0 0}#empty p{margin:6px 0;font-size:12px}.panel-footer{border-top:1px solid #e9ede4;background:#fbfcf9;padding:14px 26px;font-size:10px;color:#85907d}footer{margin-top:23px;font-size:10px;color:#84907f}footer>span:first-child{display:flex;align-items:center;gap:7px}.dot{width:6px;height:6px;border-radius:50%;background:#bb7967;display:inline-block}.online{background:#73a06b}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}[hidden]{display:none!important}@media(max-width:560px){main{padding:25px 16px}.intro{padding-top:45px}h1{font-size:40px}form{flex-wrap:wrap;padding:0 16px}form input{flex-basis:100%!important}.panel-heading{padding:20px 16px}ul{padding:0 16px}li{gap:6px}.panel-footer{padding:14px 16px}.tag{font-size:8px}footer{flex-wrap:wrap}}