:root{--bg:#f6f6f7;--surface:#fff;--surface-sunken:#fafafa;--border:#e4e4e7;--border-strong:#d4d4d8;--text:#18181b;--text-muted:#52525b;--text-faint:#65656f;--accent:#2563eb;--accent-soft:#eff6ff;--danger:#b91c1c;--danger-soft:#fef2f2;--warn:#92400e;--warn-soft:#fffbeb;--ok:#166534;--radius:8px;--sidebar-w:232px;--detail-w:348px;--header-h:52px}*{box-sizing:border-box}html,body{height:100%;margin:0;padding:0}body{background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;word-break:keep-all;font-family:Pretendard,-apple-system,Segoe UI,Malgun Gothic,Apple SD Gothic Neo,Noto Sans KR,sans-serif;font-size:14px;line-height:1.55}h1,h2,h3{letter-spacing:-.01em;margin:0;font-weight:600}button,input,select,textarea{font:inherit;color:inherit}a{color:var(--accent)}:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:4px}.sr-only{clip:rect(0 0 0 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.btn{border:1px solid var(--border-strong);border-radius:var(--radius);background:var(--surface);cursor:pointer;white-space:nowrap;align-items:center;gap:6px;padding:6px 12px;display:inline-flex}.btn:hover:not(:disabled){background:var(--surface-sunken);border-color:#b8b8be}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background:var(--accent);border-color:var(--accent);color:#fff}.btn-primary:hover:not(:disabled){background:#1d4ed8;border-color:#1d4ed8}.btn-quiet{color:var(--text-muted);background:0 0;border-color:#0000;padding:4px 8px}.btn-quiet:hover:not(:disabled){color:var(--text);background:#efeff1;border-color:#0000}.btn-danger{color:var(--danger)}.btn-danger:hover:not(:disabled){background:var(--danger-soft);border-color:#fca5a5}.field{flex-direction:column;gap:4px;display:flex}.field>label,.label{color:var(--text-muted);font-size:12px;font-weight:600}.input,.select,.textarea{border:1px solid var(--border-strong);border-radius:var(--radius);background:var(--surface);width:100%;padding:7px 10px}.input:hover,.select:hover,.textarea:hover{border-color:#b8b8be}.textarea{resize:vertical;min-height:92px;line-height:1.6}.hint{color:var(--text-muted);font-size:12px}.notice{border:1px solid var(--border);border-radius:var(--radius);background:var(--surface-sunken);padding:10px 12px;font-size:13px}.notice-error{background:var(--danger-soft);color:var(--danger);border-color:#fca5a5}.notice-ok{color:var(--ok);background:#f0fdf4;border-color:#a7f3d0}.auth-page{place-items:center;min-height:100%;padding:48px 20px;display:grid}.auth-card{background:var(--surface);border:1px solid var(--border);border-radius:12px;flex-direction:column;gap:16px;width:100%;max-width:380px;padding:28px;display:flex}.auth-card h1{font-size:20px}.auth-form{flex-direction:column;gap:12px;display:flex}.auth-links{justify-content:space-between;gap:12px;font-size:13px;display:flex}.shell{grid-template-columns:var(--sidebar-w) minmax(0, 1fr) var(--detail-w);grid-template-rows:var(--header-h) minmax(0, 1fr);grid-template-areas:"head head head""nav main detail";height:100vh;display:grid}.shell.no-detail{grid-template-columns:var(--sidebar-w) minmax(0, 1fr);grid-template-areas:"head head""nav main"}.head{background:var(--surface);border-bottom:1px solid var(--border);grid-area:head;align-items:center;gap:12px;padding:0 16px;display:flex}.head h1{font-size:15px}.head .spacer{flex:1}.head-user{color:var(--text-muted);text-overflow:ellipsis;white-space:nowrap;max-width:220px;font-size:12px;overflow:hidden}.head-status{color:var(--text-muted);text-align:right;min-width:52px;font-size:12px}.nav{background:var(--surface);border-right:1px solid var(--border);grid-area:nav;padding:12px 8px 24px;overflow-y:auto}.nav-group+.nav-group{margin-top:18px}.nav-group-head{justify-content:space-between;align-items:center;padding:0 8px 4px;display:flex}.nav-group-head h2{letter-spacing:.04em;color:var(--text-faint);text-transform:uppercase;font-size:11px}.nav ul{margin:0;padding:0;list-style:none}.nav-item{text-align:left;cursor:pointer;background:0 0;border:0;border-radius:6px;align-items:center;gap:8px;width:100%;padding:6px 10px;display:flex}.nav-item:hover{background:#f1f1f3}.nav-item[aria-current=page]{background:var(--accent-soft);color:#1d4ed8;font-weight:600}.nav-item .name{text-overflow:ellipsis;white-space:nowrap;flex:1;overflow:hidden}.nav-item .count{color:var(--text-faint);font-variant-numeric:tabular-nums;font-size:12px}.nav-item[aria-current=page] .count{color:#1d4ed8}.nav-row{align-items:center;gap:2px;display:flex}.nav-row .nav-item{min-width:0}.nav-row .row-actions{opacity:0;display:flex}.nav-row:hover .row-actions,.nav-row:focus-within .row-actions{opacity:1}.icon-btn{width:24px;height:24px;color:var(--text-muted);cursor:pointer;background:0 0;border:0;border-radius:5px;place-items:center;font-size:14px;line-height:1;display:grid}.icon-btn:hover{color:var(--text);background:#e4e4e7}.archived-toggle{text-align:left;width:100%;color:var(--text-muted);cursor:pointer;background:0 0;border:0;border-radius:6px;margin-top:4px;padding:4px 10px;font-size:12px}.archived-toggle:hover{background:#f1f1f3}.main{grid-area:main;padding:20px 24px 64px;overflow-y:auto}.main-head{align-items:baseline;gap:10px;margin-bottom:4px;display:flex}.main-head h2{font-size:19px}.main-head .meta{color:var(--text-muted);font-size:13px}.main-sub{color:var(--text-muted);margin-bottom:16px;font-size:13px}.compose{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);flex-direction:column;gap:8px;margin-bottom:16px;padding:10px;display:flex}.compose-row{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.compose-row .input{flex:1;min-width:180px}.compose-row .select,.compose-row .input[type=date]{flex:none;width:auto;min-width:0}.task-list{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);margin:0;padding:0;list-style:none;overflow:hidden}.task-list>li+li{border-top:1px solid var(--border)}.subtasks{margin:0;padding:0;list-style:none}.subtasks>li{border-top:1px solid var(--border)}.task{text-align:left;background:0 0;border:0;align-items:flex-start;gap:10px;width:100%;padding:9px 12px;display:flex}.task.sub{background:var(--surface-sunken);padding-left:40px}.task.selected{background:var(--accent-soft)}.task-check{width:16px;height:16px;accent-color:var(--accent);cursor:pointer;flex:none;margin:3px 0 0}.task-body{text-align:left;cursor:pointer;background:0 0;border:0;flex:1;min-width:0;padding:0}.task-title{text-overflow:ellipsis;white-space:nowrap;display:block;overflow:hidden}.task.done .task-title{color:var(--text-faint);text-decoration:line-through}.task-meta{color:var(--text-muted);flex-wrap:wrap;align-items:center;gap:8px;margin-top:2px;font-size:12px;display:flex}.task-meta .overdue{color:var(--danger);font-weight:600}.tag{color:var(--text-muted);background:#f1f1f3;border-radius:10px;align-items:center;gap:4px;padding:0 6px;font-size:11px;display:inline-flex}.prio{background:0 0;border-radius:2px;flex:none;align-self:stretch;width:3px}.prio.high{background:#dc2626}.prio.low{background:#cbd5e1}.empty{text-align:center;color:var(--text-muted);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:40px 16px}.empty p{margin:0 0 4px}.state-card{background:var(--surface);border:1px solid var(--border);border-radius:12px;max-width:560px;margin:24px auto;padding:20px}.state-card.error{border-color:#fca5a5}.state-card h2{margin-bottom:8px;font-size:16px}.state-card ol{padding-left:20px;line-height:1.8}.state-card pre{background:var(--surface-sunken);border:1px solid var(--border);white-space:pre-wrap;word-break:break-all;color:var(--text-muted);border-radius:6px;margin:10px 0 0;padding:8px 10px;font-size:12px}.detail{background:var(--surface);border-left:1px solid var(--border);flex-direction:column;grid-area:detail;gap:14px;padding:16px;display:flex;overflow-y:auto}.detail-head{justify-content:space-between;align-items:center;gap:8px;display:flex}.detail-head h2{color:var(--text-muted);font-size:13px}.detail-grid{grid-template-columns:1fr 1fr;gap:10px;display:grid}.detail section{border-top:1px solid var(--border);flex-direction:column;gap:8px;padding-top:12px;display:flex}.detail section h3{color:var(--text-muted);font-size:12px}.subtask-add{gap:6px;display:flex}.detail-footer{border-top:1px solid var(--border);color:var(--text-faint);justify-content:space-between;align-items:center;gap:8px;margin-top:auto;padding-top:12px;font-size:12px;display:flex}.weekday-picker{gap:4px;display:flex}.weekday-picker label{flex:1}.weekday-picker input{opacity:0;width:1px;height:1px;position:absolute}.weekday-picker span{border:1px solid var(--border-strong);cursor:pointer;background:var(--surface);border-radius:6px;place-items:center;height:28px;font-size:12px;display:grid}.weekday-picker input:checked+span{background:var(--accent);border-color:var(--accent);color:#fff;font-weight:600}.weekday-picker input:focus-visible+span{outline:2px solid var(--accent);outline-offset:2px}@media (max-width:1100px){.shell,.shell.no-detail{grid-template:"head""main"minmax(0,1fr)"nav"/minmax(0,1fr);height:auto;min-height:100vh}.nav{border-right:0;border-top:1px solid var(--border);padding:10px 8px}.detail{z-index:20;border-left:0;position:fixed;inset:0;box-shadow:0 0 0 100vmax #0000004d}.main{padding:14px 12px 40px}}