:root{--bg:#17212b;--surface:#232e3c;--surface-2:#2b3a4c;--line:#2f3e50;--text:#f1f5f9;--muted:#8a9aa9;--accent:#2ea6ff;--accent-2:#3390ec;--danger:#e53935;--ok:#4caf50}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{background:var(--bg);color:var(--text);-webkit-tap-highlight-color:transparent;font-family:-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;font-size:15px}#root{flex-direction:column;display:flex}.center{flex:1;justify-content:center;align-items:center;display:flex}.col{flex-direction:column;gap:12px}.muted{color:var(--muted)}.spinner{border:3px solid var(--line);border-top-color:var(--accent);border-radius:50%;width:32px;height:32px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.header{border-bottom:1px solid var(--line);background:var(--bg);z-index:5;align-items:center;gap:10px;padding:12px 14px;display:flex;position:sticky;top:0}.header .info{flex:1;min-width:0}.header .l-title{white-space:nowrap;text-overflow:ellipsis;font-size:17px;font-weight:700;overflow:hidden}.l-subtitle{color:var(--muted);white-space:nowrap;text-overflow:ellipsis;margin-top:2px;font-size:12px;overflow:hidden}.back{color:var(--accent);background:0 0;border:none;padding:0 6px;font-size:26px;line-height:1}.invite-btn{padding:8px 12px}.members{align-items:center;gap:4px;margin-top:5px;display:flex}.badge{background:var(--surface-2);color:var(--muted);border-radius:8px;padding:2px 8px;font-size:11px}.badge.owner{color:#ffd54f}.badge.editor{color:var(--accent)}.list-scroll{flex:1;padding:12px 12px 24px;overflow-y:auto}.card{background:var(--surface);cursor:pointer;border:1px solid #0000;border-radius:12px;margin-bottom:10px;padding:14px}.card:active{border-color:var(--accent)}.card .title{font-size:16px;font-weight:600}.card .subtitle{color:var(--muted);white-space:nowrap;text-overflow:ellipsis;margin-top:2px;font-size:12px;overflow:hidden}.card .meta{color:var(--muted);align-items:center;gap:10px;margin-top:7px;font-size:12px;display:flex}.progress{background:var(--line);border-radius:2px;height:4px;margin-top:9px;overflow:hidden}.progress>div{background:var(--ok);height:100%}.form-row{gap:8px;margin:10px 0;padding:0 12px;display:flex}.form-row.stack{flex-direction:column;align-items:stretch;gap:5px;margin:10px 0;padding:0}.form-row.stack label{font-size:12px}input,textarea{background:var(--surface);border:1px solid var(--line);color:var(--text);border-radius:10px;outline:none;flex:1;width:100%;min-width:0;padding:10px 12px;font-size:15px}textarea{resize:none;min-height:64px;font-family:inherit;line-height:1.4}input:focus,textarea:focus{border-color:var(--accent)}.danger-btn{width:100%;color:var(--danger);border:1px solid var(--danger);background:0 0;margin-top:8px}button{background:var(--accent-2);color:#fff;cursor:pointer;border:none;border-radius:10px;padding:10px 16px;font-size:15px;font-weight:600}button:disabled{opacity:.5;cursor:default}button.ghost{background:var(--surface-2);color:var(--text)}.divider{text-align:center;color:var(--muted);margin:16px 0 6px;font-size:12px}.ava{color:#fff;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:22px;height:22px;font-weight:700;display:flex}.item-row{background:var(--surface);border-radius:12px;align-items:flex-start;gap:10px;margin-bottom:8px;padding:10px 12px;display:flex}.check{color:#fff;background:0 0;border:2px solid #4a5b6e;border-radius:50%;justify-content:center;align-items:center;width:24px;min-width:24px;height:24px;margin-top:2px;padding:0;font-size:14px;font-weight:700;line-height:1;display:flex}.check.checked{background:var(--ok);border-color:var(--ok)}.item-body{flex:1;min-width:0}.item-title{word-break:break-word}.item-title.done{color:var(--muted);text-decoration:line-through}.item-desc{color:var(--muted);word-break:break-word;white-space:pre-wrap;margin-top:2px;font-size:12px}.chip{background:var(--surface-2);color:var(--text);border-radius:10px;align-items:center;gap:5px;margin:5px 6px 0 0;padding:2px 9px 2px 3px;font-size:12px;display:inline-flex}.chip.ghost{color:var(--muted);padding:2px 9px}.chip-ava{color:#fff;border-radius:50%;justify-content:center;align-items:center;width:18px;height:18px;font-size:10px;font-weight:700;display:flex}.add-bar{padding:10px 12px calc(10px + env(safe-area-inset-bottom));background:linear-gradient(transparent, var(--bg) 30%);gap:8px;display:flex;position:sticky;bottom:0}.overlay{z-index:20;background:#0000008c;align-items:flex-end;display:flex;position:fixed;inset:0}.sheet{background:var(--surface);width:100%;padding:16px 16px calc(16px + env(safe-area-inset-bottom));border-radius:16px 16px 0 0;max-height:75vh;overflow-y:auto}.sheet h3{margin:0 0 12px}.member-row{cursor:pointer;border-radius:10px;align-items:center;gap:10px;padding:10px 8px;display:flex}.member-row:active{background:var(--surface-2)}.member-row .name{flex:1}.member-row .role{color:var(--muted);font-size:12px}.role-tabs{gap:8px;margin-bottom:12px;display:flex}.role-tabs button{flex:1;padding:10px 8px;font-size:13px}.role-tabs button.active{background:var(--accent-2)}.role-tabs button:not(.active){background:var(--surface-2)}.link-box{background:var(--bg);word-break:break-all;border-radius:10px;margin:10px 0;padding:10px;font-size:13px}.toast{color:#fff;z-index:50;background:#000c;border-radius:10px;max-width:90%;padding:8px 14px;font-size:13px;position:fixed;bottom:80px;left:50%;transform:translate(-50%)}.empty{text-align:center;color:var(--muted);padding:40px 20px;line-height:1.6}
