*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}body{font-family:system-ui,sans-serif;background:#f0f0f5;color:#111;line-height:1.5;font-size:16px}.login{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:100vh;gap:2rem}.login h1{font-size:2rem}.tasks{max-width:700px;margin:0 auto;padding:2.5rem 1.5rem;display:flex;flex-direction:column;gap:2rem}header{display:flex;align-items:center;justify-content:space-between}h1{font-size:1.75rem;font-weight:700}h2{font-size:.85rem;font-weight:700;color:#888;text-transform:uppercase;letter-spacing:.06em;margin-bottom:.75rem}.add-form{display:flex;gap:.75rem}.add-form input{flex:1;padding:.75rem 1rem;border:2px solid #ddd;border-radius:14px;font-size:1rem;background:#fff;outline:none;transition:border-color .15s}.add-form input:focus{border-color:#aaa}ul{list-style:none;display:flex;flex-direction:column;gap:.625rem}li{display:flex;flex-direction:column;gap:.5rem;background:#fff;border-radius:16px;padding:.875rem 1.125rem;box-shadow:0 1px 3px #0000000f}.task-main{display:flex;align-items:center;gap:.75rem}li.done .desc{text-decoration:line-through;color:#bbb}li input[type=checkbox]{width:1.1rem;height:1.1rem;flex-shrink:0;cursor:pointer;accent-color:#111}.desc{flex:1;font-size:1rem}.desc-input{flex:1;font-size:1rem;border:none;border-bottom:1.5px solid transparent;outline:none;background:transparent;font-family:inherit;padding:0;cursor:text;min-width:0}.desc-input:hover{border-bottom-color:#ddd}.desc-input.editing{border-bottom-color:#aaa}.notes-display{font-size:.82rem;color:#666;padding:.25rem .375rem;border-radius:8px;cursor:pointer;margin-left:1.85rem;transition:background .1s;white-space:pre-wrap}.notes-display.empty{color:#bbb;font-style:italic}.notes-display:hover{background:#f5f5f5}.notes-input{font-size:.82rem;color:#444;padding:.35rem .5rem;border:1.5px solid #ccc;border-radius:8px;margin-left:1.85rem;width:calc(100% - 1.85rem);resize:none;font-family:inherit;outline:none;background:#fafafa}.notes-input:focus{border-color:#aaa;background:#fff}.assignee-wrap{position:relative;flex-shrink:0}.assignee-trigger{display:inline-flex;align-items:center;gap:.35rem;padding:.3rem .75rem;background:#f0f0f5;border:2px solid transparent;border-radius:999px;font-size:.82rem;font-weight:500;color:#555;cursor:pointer;white-space:nowrap;transition:border-color .15s,background .15s;min-width:90px;text-align:left}.assignee-trigger:hover{background:#e6e6ee}.assignee-trigger.open{border-color:#aaa;background:#fff}.assignee-trigger input{border:none;outline:none;background:transparent;font-size:.82rem;font-weight:500;color:#555;width:80px;cursor:text;font-family:inherit;padding:0}.assignee-dropdown{position:absolute;right:0;top:calc(100% + 6px);background:#fff;border:1.5px solid #ddd;border-radius:14px;box-shadow:0 4px 16px #0000001a;overflow:hidden;z-index:100;min-width:140px}.assignee-option{padding:.6rem 1rem;font-size:.9rem;cursor:pointer;color:#333;transition:background .1s}.assignee-option:hover,.assignee-option.active{background:#f0f0f5}.assignee-option.clear{color:#aaa;font-style:italic}.btn{padding:.7rem 1.25rem;background:#111;color:#fff;border:none;border-radius:14px;cursor:pointer;font-size:1rem;font-weight:500;text-decoration:none;white-space:nowrap;transition:background .15s}.btn:hover{background:#333}.btn-link{background:none;border:none;cursor:pointer;color:#888;font-size:.9rem;padding:0;transition:color .15s}.btn-link:hover{color:#111}.muted{color:#aaa}.error{color:#c00}
