:root{--accent-primary: #2563eb;--accent-light: #3b82f6;--bg: #f7f8fa;--surface: #ffffff;--surface-2: #f0f2f5;--border: #e2e5ea;--text: #1a1c20;--text-muted: #4b5563;--danger: #dc2626;--radius: 8px;--icon-bar-size: 56px;--accent-text: var(--accent-primary)}@media(prefers-color-scheme:dark){:root{--bg: #16181d;--surface: #1e2127;--surface-2: #262a31;--border: #333842;--text: #e8eaed;--text-muted: #9aa0aa;--accent-text: var(--accent-light)}}*{box-sizing:border-box}html,body,#root{block-size:100%;margin:0}body{font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;background:var(--bg);color:var(--text);font-size:15px;line-height:1.45}.sr-only{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}.app{display:flex;block-size:100vh}.icon-bar{inline-size:var(--icon-bar-size);flex:0 0 var(--icon-bar-size);background:var(--surface);border-inline-end:1px solid var(--border);display:flex;flex-direction:column;align-items:center;gap:4px;padding-block:12px}.icon-brand{color:var(--accent-text);font-size:20px;margin-block-end:12px}.icon-btn{inline-size:40px;block-size:40px;display:grid;place-items:center;font-size:20px;background:transparent;border:none;border-radius:var(--radius);cursor:pointer;color:var(--text)}.icon-btn:hover:not(:disabled){background:var(--surface-2)}.icon-btn.is-active{background:color-mix(in srgb,var(--accent-primary) 18%,transparent)}.icon-btn:disabled{opacity:.35;cursor:default}.icon-btn:focus-visible{outline:2px solid var(--accent-primary);outline-offset:2px}.icon-label{display:none}.main{flex:1;display:flex;flex-direction:column;min-inline-size:0}.topbar{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px 14px;padding-inline:20px;padding-block:10px;background:var(--surface);border-block-end:1px solid var(--border)}.topbar .brand-name{font-weight:700;color:var(--accent-text)}.topbar-right{display:flex;align-items:center;gap:14px}.user-ws{font-weight:600}.user-name{color:var(--text-muted)}.main-body{flex:1;display:flex;min-block-size:0}.content{flex:1;overflow:auto;padding:24px;min-inline-size:0}.detail-pane{flex:0 0 380px;overflow-y:auto;background:var(--surface);border-inline-start:1px solid var(--border)}.detail-empty{display:grid;place-items:center;block-size:100%;padding:24px;text-align:center;color:var(--text-muted)}.user-menu{position:relative}.user-summary{cursor:pointer;list-style:none;padding-inline:8px;padding-block:4px;border-radius:6px}.user-summary::-webkit-details-marker{display:none}.user-summary:hover{background:var(--surface-2)}.user-summary:focus-visible{outline:2px solid var(--accent-primary);outline-offset:2px}.user-menu[open] .user-menu-panel{position:absolute;inset-inline-end:0;inset-block-start:calc(100% + 6px);display:flex;flex-direction:column;gap:10px;align-items:flex-start;min-inline-size:160px;z-index:30;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:0 6px 20px #00000026;padding:12px}.view{max-inline-size:760px;margin-inline:auto}.projects-view{max-inline-size:1040px}.view-header h1{font-size:22px;margin-block:0 16px}.view-footer{color:var(--text-muted);margin-block-start:12px;font-size:13px}.task-group{margin-block-end:24px}.group-header{font-size:12px;text-transform:uppercase;letter-spacing:.05em;color:var(--text-muted);display:flex;align-items:center;justify-content:space-between;margin-block:0 8px}.group-count{color:var(--text-muted)}.empty-state{text-align:center;padding-block:48px;color:var(--text-muted)}.empty-title{font-size:17px;font-weight:600;color:var(--text);margin-block:0 4px}.muted{color:var(--text-muted)}.quick-add{margin-block-end:20px}.quick-add-input{inline-size:100%;padding:12px 14px;font-size:15px;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);color:var(--text)}.quick-add-input:focus-visible{outline:2px solid var(--accent-primary);outline-offset:1px}.quick-add-hint{font-size:12px;color:var(--text-muted);margin-block:4px 0}.quick-add-preview{display:flex;flex-wrap:wrap;gap:6px;margin-block-start:8px}.chip{font-size:12px;padding-inline:8px;padding-block:2px;border:1px solid var(--border);border-radius:999px;background:var(--surface-2)}.chip.is-matched{border-color:var(--accent-text);color:var(--accent-text)}.chip.is-unmatched{opacity:.6;border-style:dashed}.context-chip{background:transparent}.qa-chips{display:flex;flex-wrap:wrap;gap:6px;margin-block-end:8px}.chip-x{background:none;border:none;cursor:pointer;color:inherit;font-size:13px;line-height:1;padding:0;margin-inline-start:6px}.chip-x:hover{color:var(--danger)}.qa-input-wrap{position:relative}.qa-suggest{position:absolute;inset-block-start:calc(100% + 4px);inset-inline:0;list-style:none;margin:0;padding:4px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:0 6px 20px #00000026;z-index:20;max-block-size:240px;overflow-y:auto}.qa-option{padding-inline:10px;padding-block:7px;border-radius:6px;cursor:pointer}.qa-option.is-active{background:color-mix(in srgb,var(--accent-primary) 16%,transparent)}.qa-opt-sigil{color:var(--text-muted);margin-inline-end:2px}.task-list{list-style:none;margin:0;padding:0}.task-row{display:flex;align-items:flex-start;gap:10px;padding-block:10px;padding-inline:4px;border-block-end:1px solid var(--border)}.task-row.is-done .task-title{text-decoration:line-through;color:var(--text-muted)}.task-check{margin-block-start:3px;inline-size:16px;block-size:16px}.task-star{background:none;border:none;cursor:pointer;font-size:17px;color:var(--text-muted);padding:0;line-height:1.3}.task-star.is-on{color:#f5b301}.task-star:focus-visible{outline:2px solid var(--accent-primary);outline-offset:2px;border-radius:4px}.task-focus{background:none;border:none;cursor:pointer;font-size:14px;padding:0;line-height:1.3;opacity:.3;filter:grayscale(1)}.task-focus.is-on{opacity:1;filter:none}.task-focus:focus-visible{outline:2px solid var(--accent-primary);outline-offset:2px;border-radius:4px}.task-body{flex:1;min-inline-size:0}.task-title{display:block;inline-size:100%;text-align:start;background:none;border:none;padding:0;margin:0;font:inherit;color:inherit;cursor:pointer}.task-title:hover{color:var(--accent-text)}.task-title:focus-visible{outline:2px solid var(--accent-primary);outline-offset:2px;border-radius:4px}.task-meta{display:flex;flex-wrap:wrap;align-items:center;gap:8px;font-size:12px;color:var(--text-muted);margin-block-start:2px}.task-project{font-weight:600}.task-due.is-overdue{color:var(--danger);font-weight:600}.task-repeat{color:var(--text-muted);white-space:nowrap}.task-process,.new-project input,.lang-switch select{font:inherit;font-size:13px;border:1px solid var(--border);border-radius:6px;background:var(--surface);color:var(--text);padding-inline:6px;padding-block:3px}.task-delete{background:none;border:none;cursor:pointer;color:var(--text-muted);font-size:14px;padding-inline:4px}.task-delete:hover{color:var(--danger)}.projects-layout{display:flex;gap:24px;align-items:flex-start}.project-list{inline-size:220px;flex:0 0 220px}.project-list ul{list-style:none;margin:0;padding:0}.project-item{inline-size:100%;text-align:start;background:none;border:none;cursor:pointer;padding-block:8px;padding-inline:10px;border-radius:var(--radius);color:var(--text)}.project-item:hover{background:var(--surface-2)}.project-item.is-active{background:color-mix(in srgb,var(--accent-primary) 15%,transparent);font-weight:600}.new-project{display:flex;gap:6px;margin-block-start:12px}.new-project input{flex:1}.project-detail{flex:1;min-inline-size:0}.project-detail-header{display:flex;align-items:baseline;justify-content:space-between;margin-block-end:12px}.project-detail-header h2{margin:0;font-size:18px}.btn{font:inherit;cursor:pointer;padding-inline:14px;padding-block:8px;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);color:var(--text)}.btn-primary{background:var(--accent-primary);border-color:var(--accent-primary);color:#fff}.btn:focus-visible{outline:2px solid var(--accent-primary);outline-offset:2px}.link-btn{background:none;border:none;color:var(--accent-text);cursor:pointer;font:inherit}.link-btn:focus-visible{outline:2px solid var(--accent-primary);outline-offset:2px;border-radius:4px}.auth-loading{display:grid;place-items:center;color:var(--text-muted)}.login-gate{display:grid;place-items:center}.login-card{background:var(--surface);padding:40px;border-radius:16px;border:1px solid var(--border);text-align:center;max-inline-size:360px}.brand{display:inline-flex;align-items:center;gap:8px}.brand-lg{font-size:26px}.brand-mark{color:var(--accent-text)}.login-card .brand-name{font-size:inherit;margin:0}.brand-name{font-weight:700}.tagline{color:var(--text-muted);margin-block:8px 24px}.login-btn{display:inline-block;text-decoration:none}.login-note{font-size:12px;color:var(--text-muted);margin-block-start:16px}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:50;background:#00000073;display:grid;place-items:center;padding:20px}.modal{background:var(--surface);color:var(--text);border:1px solid var(--border);border-radius:12px;inline-size:min(560px,100%);max-block-size:90vh;overflow-y:auto;box-shadow:0 12px 40px #0000004d}.modal-head{display:flex;align-items:center;justify-content:space-between;padding-inline:20px;padding-block:14px;border-block-end:1px solid var(--border)}.modal-head h2{margin:0;font-size:17px}.modal-x{background:none;border:none;font-size:22px;cursor:pointer;color:var(--text-muted);line-height:1}.modal-x:hover{color:var(--text)}.task-detail-form{padding:20px;display:flex;flex-direction:column;gap:16px}.field{display:flex;flex-direction:column;gap:6px;border:none;padding:0;margin:0;min-inline-size:0}.field-label{font-size:12px;font-weight:600;color:var(--text-muted)}.field input[type=text],.field textarea,.field select,.field input[type=date]{font:inherit;color:var(--text);background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding-inline:10px;padding-block:8px}.field textarea{resize:vertical}.field input:focus-visible,.field textarea:focus-visible,.field select:focus-visible{outline:2px solid var(--accent-primary);outline-offset:1px}.field-row{display:flex;gap:16px}.field-row .field{flex:1}.field-inline{display:flex;align-items:center;gap:8px}.ctx-toggle-group{display:flex;flex-wrap:wrap;gap:6px}.ctx-toggle{cursor:pointer;background:var(--surface-2)}.ctx-toggle[aria-pressed=true]{background:color-mix(in srgb,var(--accent-primary) 16%,transparent)}.modal-actions{display:flex;align-items:center;gap:8px;margin-block-start:4px}.modal-actions .spacer{flex:1}.link-btn.danger{color:var(--danger)}@media(max-width:640px){.field-row{flex-direction:column;gap:16px}}.task-star,.task-delete,.chip-x,.modal-x{min-inline-size:24px;min-block-size:24px;display:inline-flex;align-items:center;justify-content:center}.task-delete:focus-visible,.chip-x:focus-visible,.modal-x:focus-visible,.project-item:focus-visible,.ctx-toggle:focus-visible{outline:2px solid var(--accent-primary);outline-offset:2px;border-radius:6px}.skip-link{position:absolute;inset-inline-start:8px;inset-block-start:-48px;z-index:100;background:var(--surface);color:var(--accent-text);padding-inline:12px;padding-block:8px;border:1px solid var(--border);border-radius:var(--radius);transition:inset-block-start .15s ease}.skip-link:focus{inset-block-start:8px}@media(prefers-reduced-motion:reduce){.skip-link{transition:none}}@media(max-width:767px){.app{flex-direction:column}.main{order:1;min-block-size:0}.icon-bar{order:2;inline-size:100%;flex:0 0 auto;block-size:auto;flex-direction:row;justify-content:space-around;align-items:stretch;gap:0;padding-block:6px;border-inline-end:none;border-block-start:1px solid var(--border)}.icon-brand{display:none}.icon-btn:disabled{display:none}.icon-btn{flex:1;inline-size:auto;block-size:auto;display:flex;flex-direction:column;align-items:center;gap:2px;padding-block:4px;font-size:18px}.icon-label{display:block;font-size:10px;line-height:1}}@media(max-width:640px){.projects-layout{flex-direction:column}.project-list{inline-size:100%;flex-basis:auto}.content{padding:16px}.task-process{display:none}}