*{box-sizing:border-box}body{color:#18181b;background:#f4f4f5;margin:0;font-family:ui-sans-serif,system-ui,-apple-system,sans-serif}.app-shell{flex-direction:column;min-height:100dvh;display:flex}.topbar{color:#fff;z-index:10;background:#18181b;justify-content:space-between;align-items:center;gap:1rem;height:3.5rem;padding:0 1.5rem;display:flex;position:sticky;top:0}.topbar h1{letter-spacing:-.01em;margin:0;font-size:1.1rem;font-weight:700}.topbar-right{align-items:center;gap:.75rem;display:flex}.topbar-user{color:#a1a1aa;font-size:.8rem}.page{width:100%;max-width:52rem;margin:0 auto;padding:2rem 1.25rem}.tabs{background:#e4e4e7;border-radius:.625rem;gap:.25rem;margin-bottom:1.75rem;padding:.25rem;display:flex}.tab{cursor:pointer;color:#71717a;background:0 0;border:none;border-radius:.375rem;flex:1;padding:.5rem;font-size:.875rem;font-weight:500;transition:all .15s}.tab.active{color:#18181b;background:#fff;box-shadow:0 1px 3px #0000001a}.section-header{justify-content:space-between;align-items:center;gap:1rem;margin-bottom:1rem;display:flex}.section-header h2{margin:0;font-size:1rem;font-weight:600}.badge{text-transform:uppercase;letter-spacing:.04em;border-radius:99px;align-items:center;gap:.25rem;padding:.15rem .45rem;font-size:.7rem;font-weight:600;display:inline-flex}.badge-open{color:#1d4ed8;background:#dbeafe}.badge-done{color:#15803d;background:#dcfce7}.badge-overdue{color:#dc2626;background:#fee2e2}.badge-soon{color:#a16207;background:#fef9c3}.badge-owner{color:#7c3aed;background:#f3e8ff}.badge-member{color:#0369a1;background:#e0f2fe}.todo-list{flex-direction:column;gap:.75rem;display:flex}.todo-card{background:#fff;border:1.5px solid #e4e4e7;border-radius:.75rem;align-items:flex-start;gap:.875rem;padding:1rem 1.125rem;transition:border-color .15s;display:flex}.todo-card:hover{border-color:#a1a1aa}.todo-card.done-card{opacity:.6}.todo-card.overdue-card{border-left:3px solid #dc2626}.todo-card.soon-card{border-left:3px solid #ca8a04}.todo-checkbox{accent-color:#18181b;cursor:pointer;flex-shrink:0;width:1.25rem;height:1.25rem;margin-top:.125rem}.todo-body{flex:1;min-width:0}.todo-title{margin:0 0 .25rem;font-size:.9375rem;font-weight:600;line-height:1.4}.todo-title.done-title{color:#a1a1aa;text-decoration:line-through}.todo-desc{color:#52525b;margin:0 0 .5rem;font-size:.8125rem;line-height:1.5}.todo-meta{color:#71717a;flex-wrap:wrap;align-items:center;gap:.375rem;font-size:.75rem;display:flex}.todo-meta-sep{color:#d4d4d8}.todo-actions{flex-shrink:0;gap:.375rem;display:flex}button{cursor:pointer;border:none;border-radius:.5rem;font-family:inherit;font-size:.875rem;transition:opacity .15s}button:hover{opacity:.8}.btn-primary{color:#fff;background:#18181b;padding:.5rem 1rem;font-weight:500}.btn-danger{color:#dc2626;background:#fee2e2;padding:.375rem .625rem;font-size:.75rem;font-weight:500}.btn-ghost{color:#71717a;background:0 0;border:1px solid #e4e4e7;padding:.375rem .625rem;font-size:.75rem}.btn-icon{color:#71717a;background:0 0;border:1px solid #e4e4e7;border-radius:.375rem;align-items:center;padding:.375rem;line-height:1;display:inline-flex}.btn-sm{padding:.25rem .625rem;font-size:.75rem}.modal-backdrop{z-index:100;background:#00000073;justify-content:center;align-items:center;padding:1rem;display:flex;position:fixed;inset:0}.modal{background:#fff;border-radius:.875rem;width:100%;max-width:28rem;padding:1.5rem;box-shadow:0 20px 60px #0003}.modal h2{margin:0 0 1.25rem;font-size:1.1rem}.form-group{flex-direction:column;gap:.3rem;margin-bottom:.875rem;display:flex}.form-group label{color:#52525b;font-size:.8125rem;font-weight:500}input[type=text],input[type=email],input[type=datetime-local],textarea{color:#18181b;background:#fafafa;border:1.5px solid #e4e4e7;border-radius:.5rem;width:100%;padding:.6rem .75rem;font-family:inherit;font-size:.9rem;transition:border-color .15s}input:focus,textarea:focus{background:#fff;border-color:#18181b;outline:none}textarea{resize:vertical;min-height:4rem}.form-row{gap:.5rem;display:flex}.form-row button{flex-shrink:0}.empty{text-align:center;color:#a1a1aa;padding:3rem 1rem;font-size:.9rem}.empty-icon{margin-bottom:.5rem;font-size:2.5rem}.member-list{flex-direction:column;gap:.375rem;margin-top:.75rem;display:flex}.member-item{background:#f4f4f5;border-radius:.5rem;justify-content:space-between;align-items:center;padding:.5rem .625rem;font-size:.8125rem;display:flex}.member-name{font-weight:500}.member-email{color:#71717a;font-size:.75rem}.filter-bar{flex-wrap:wrap;gap:.375rem;margin-bottom:1rem;display:flex}.filter-chip{color:#71717a;cursor:pointer;background:#fff;border:1.5px solid #e4e4e7;border-radius:99px;padding:.3rem .7rem;font-size:.75rem;font-weight:500}.filter-chip.active{color:#fff;background:#18181b;border-color:#18181b}main.centered{text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:.5rem;min-height:100dvh;display:flex}p.sub{color:#71717a;margin-top:0}.actions{flex-direction:column;align-items:center;gap:.75rem;margin-top:1.25rem;display:flex}a.sub{color:#71717a;font-size:.875rem}button.secondary{color:#71717a;background:0 0}@media (max-width:480px){.tabs{gap:.125rem}.tab{padding:.4rem .25rem;font-size:.75rem}.topbar{padding:0 1rem}}
