:root{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,Hiragino Sans GB,Microsoft YaHei,Noto Sans CJK SC,Arial,sans-serif;color:#242c29;background:#f7f8f6;font-synthesis:none;text-rendering:optimizeLegibility;--bg: #fff;--page: #f7f8f6;--text: #242c29;--muted: #67726d;--line: #e5eae6;--accent: #267a72;--fill: #edf6f3;--danger: #ad4739;--circle: #8a9690}@media(prefers-color-scheme:dark){:root{color:#e4eae6;background:#171b19;--bg: #202522;--page: #171b19;--text: #e4eae6;--muted: #a8b5ac;--line: #343d36;--accent: #91d5cb;--fill: #293f38;--danger: #f1aa9c;--circle: #82978a}}*{box-sizing:border-box}body{margin:0;min-width:320px}button,input,textarea,select{font:inherit}button{border:0;background:none;color:inherit;cursor:pointer;min-height:44px;border-radius:8px;padding:8px 12px;display:inline-flex;align-items:center;justify-content:center;gap:8px}button:hover{background:var(--fill)}button:disabled{cursor:default;opacity:.45}button:disabled:hover{background:none}button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--accent);outline-offset:3px}svg{width:20px;height:20px;stroke-width:1.7;flex-shrink:0}input,textarea,select{color:var(--text);background:var(--bg);border:1px solid var(--line);border-radius:8px;padding:11px 12px;min-height:44px;min-width:0;width:100%}input::placeholder,textarea::placeholder{color:var(--muted);opacity:1}textarea{resize:vertical;line-height:1.65}h1,h2,h3,p{margin:0}h1{font-size:1.625rem;font-weight:650;line-height:1.35;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}h2{font-size:1.25rem;line-height:1.5;font-weight:600}h3{display:flex;align-items:center;gap:10px;font-size:1rem;font-weight:650}.app-shell{max-width:1120px;margin:0 auto;min-height:100dvh;display:grid;grid-template-columns:200px minmax(0,1fr)}.sidebar{position:sticky;top:0;height:100dvh;padding:40px 12px 24px;display:flex;flex-direction:column;gap:24px}.brand{display:flex;align-items:center;gap:12px;font-size:1.25rem;padding:4px 12px 16px}.sidebar nav{display:flex;flex-direction:column;gap:4px}.nav-item{width:100%;justify-content:flex-start;padding:10px 12px;min-width:0;text-align:left;font-size:.9375rem}.nav-item>span:not(.list-dot){overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.nav-item.active{color:var(--accent);background:var(--fill);font-weight:600}.sidebar-label{display:flex;justify-content:space-between;align-items:center;padding-left:12px;color:var(--muted);font-size:.75rem;margin-bottom:-16px;min-height:28px}.list-dot{width:8px;height:8px;background:var(--accent);border-radius:50%;flex-shrink:0;margin:0 6px}.sidebar-bottom{margin-top:auto;padding-top:16px}.main{width:100%;max-width:820px;padding:48px 40px 100px;margin:0 auto;min-width:0}.page-header{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:24px}.heading-block{min-width:0}.view-date{margin-top:4px;color:var(--muted);font-size:.8125rem}.completed-toggle{margin:20px 0 8px;color:var(--muted);font-size:.875rem}.completed-toggle:disabled{opacity:1}.completed-toggle>svg{width:16px}.mobile-title{display:none}.connection-notice{color:var(--muted);font-size:.75rem;margin-bottom:16px}.header-actions{display:flex;flex-shrink:0;gap:4px}.header-actions>.icon-button{color:var(--muted)}.icon-button{width:44px;height:44px;min-width:44px;padding:10px}.text-button{color:var(--accent);font-size:.875rem;white-space:nowrap}.primary{background:var(--accent);color:var(--bg);font-size:.875rem;font-weight:550}.primary:hover{background:var(--accent);opacity:.88}.danger{color:var(--danger)}.danger-primary{background:var(--danger);color:var(--bg)}.danger-primary:hover{background:var(--danger);opacity:.88}.search{display:flex;align-items:center;gap:10px;color:var(--muted);margin-bottom:20px}.search input,.composer input{background:transparent;border:0;padding:8px 12px;border-radius:8px;caret-color:var(--accent)}.search input:focus-visible,.composer input:focus-visible{outline:none;background:var(--fill)}.composer{display:flex;align-items:center;gap:8px;margin-bottom:12px}.composer-add{flex-shrink:0;width:44px;padding:10px;color:var(--accent)}.composer:not(.has-draft) .composer-add{display:none}.is-selecting .composer{opacity:.55}.task-row-actions{display:flex;flex-shrink:0;width:88px}.trash-row .task-row-actions{width:44px}.drag-handle{touch-action:none;color:var(--muted);cursor:grab}.drag-handle:disabled{visibility:hidden}.task-row-actions .icon-button:focus-visible{outline-offset:-3px}.task-row.dragging{position:relative;z-index:2;background:var(--bg);box-shadow:0 6px 18px #0001}.task-row.dragging .drag-handle{cursor:grabbing;color:var(--accent)}.task-list{list-style:none;margin:0;padding:0}.task-row{display:flex;align-items:flex-start;gap:8px;min-width:0;padding:6px 4px;border-bottom:1px solid var(--line)}.task-row.selected{background:var(--fill);border-radius:8px}.task-check{width:44px;height:44px;flex-shrink:0;display:grid;place-items:center;position:relative}.task-check input{position:absolute;width:44px;height:44px;min-height:0;margin:0;inset:0;opacity:0;cursor:pointer}.task-check>span{width:22px;height:22px;border:1.5px solid var(--circle);border-radius:50%;pointer-events:none;display:grid;place-items:center}.task-check input:checked+span{border-color:var(--accent);background:var(--accent);color:var(--bg)}.task-check input:focus-visible+span{outline:2px solid var(--accent);outline-offset:4px}.task-check svg{width:14px;height:14px;stroke-width:2.5}.task-content{flex:1;min-width:0;align-items:stretch;justify-content:flex-start;text-align:left;flex-direction:column;gap:6px;padding:8px 0;border-radius:0}.task-content:hover{background:none}.task-content:disabled{opacity:1}.task-title{font-size:1rem;line-height:1.5;overflow-wrap:anywhere}.completed .task-title{color:var(--muted);text-decoration:line-through;text-decoration-thickness:1px}.task-title-line{display:flex;align-items:baseline;gap:8px}.task-title-line .task-title{min-width:0}.note-indicator{width:14px;height:14px;color:var(--muted)}.task-meta{display:block;font-size:.75rem;line-height:1.5;color:var(--muted);overflow-wrap:anywhere}.row-delete{color:var(--muted);opacity:0}.task-row:hover .row-delete,.row-delete:focus-visible{opacity:1}.row-delete:hover{color:var(--danger)}.restore{color:var(--accent)}.empty-state{min-height:280px;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;gap:12px;padding:40px 12px}.empty-state h2{font-size:.875rem;font-weight:400;color:var(--muted)}.empty-state>.empty-state-icon{width:40px;height:40px;color:var(--circle);stroke-width:1.4}.empty-state p{max-width:28ch;color:var(--muted);font-size:.8125rem;line-height:1.7}.empty-state.compact{min-height:200px;padding:24px 12px}.status-message{display:flex;align-items:flex-start;gap:8px}.status-message>svg{width:18px;height:18px;margin-top:1px}.bulk-bar{position:fixed;bottom:24px;left:calc(50% + 100px);transform:translate(-50%);display:flex;align-items:center;justify-content:center;gap:12px;padding:8px 16px;background:var(--bg);border:1px solid var(--line);border-radius:12px;z-index:10;min-width:340px}.bulk-bar>button{flex:1;flex-direction:column;min-width:56px;font-size:.75rem;color:var(--accent)}.bulk-bar>.danger{color:var(--danger)}.toast{position:fixed;bottom:108px;left:calc(50% + 100px);transform:translate(-50%);z-index:20;background:var(--text);color:var(--bg);display:flex;gap:16px;align-items:center;padding:6px 8px 6px 16px;border-radius:12px;font-size:.875rem;white-space:nowrap;max-width:calc(100vw - 24px)}.toast>button:not(.icon-button){text-decoration:underline;text-underline-offset:4px}.toast button:hover{background:transparent}.dialog{color:var(--text);background:var(--bg);border:none;padding:24px;border-radius:16px;width:min(480px,calc(100vw - 32px));max-height:calc(100dvh - 48px);overflow:auto;box-shadow:0 16px 64px #0003;overscroll-behavior:contain}.dialog.wide{width:min(560px,calc(100vw - 32px))}.dialog::backdrop{background:#111c1780}.dialog-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;gap:16px}.dialog-header h2{min-width:0;overflow-wrap:anywhere}.form{display:flex;flex-direction:column;gap:20px}.form label{display:flex;flex-direction:column;gap:8px;font-size:.875rem;font-weight:500}.form input,.form textarea,.form select{font-weight:400}.secret-control{display:flex;flex-direction:column;gap:8px}.secret-field{position:relative}.secret-field input{padding-right:52px}.secret-field .icon-button{position:absolute;right:0;top:0;height:100%;color:var(--muted)}.secret-field .icon-button:focus-visible{outline-offset:-3px}.form-actions{display:flex;align-items:center;justify-content:flex-end;gap:12px;margin-top:4px}.form-actions>.text-button:first-child{margin-right:auto}.muted{color:var(--muted);font-size:.875rem;line-height:1.7}.small{font-size:.75rem}.error{color:var(--danger)}.success{color:var(--accent);font-size:.875rem;line-height:1.6}.settings-content{display:flex;flex-direction:column;gap:28px}.settings-content section{display:flex;flex-direction:column;gap:16px}.settings-content section+section{border-top:1px solid var(--line);padding-top:24px}.backup-actions{display:flex;gap:12px}.backup-actions button{background:var(--fill);color:var(--accent);font-size:.875rem}.import-preview{padding:16px;border-radius:12px;background:var(--fill);font-size:.875rem;line-height:1.7}.import-preview p{margin:8px 0}.menu{display:flex;flex-direction:column;gap:4px}.menu>button{justify-content:flex-start;min-height:56px;text-align:left;overflow-wrap:anywhere}.menu>button>svg:last-child:not(:first-child){margin-left:auto;color:var(--muted);width:16px}.collection-section{margin-top:12px;padding-top:12px;border-top:1px solid var(--line)}.collection-label,.history-month{margin:20px 12px 6px;color:var(--muted);font-size:.75rem;font-weight:500}.menu-detail{display:block;margin-top:2px;color:var(--muted);font-size:.75rem;font-weight:400}.collection-menu>button{gap:12px}.collection-menu>button>span:not(.list-dot),.collection-tools>button>span{flex:1;min-width:0}.collection-menu .list-dot{margin:0 6px}.collection-menu>button.active{color:var(--accent);background:var(--fill);font-weight:550}.collection-menu>button>.current-mark{color:var(--accent);width:20px}.collection-tools{color:var(--muted);font-size:.875rem}.collection-tools>button{min-height:48px}.collection-back{margin:-12px 0 12px}.list-section{min-width:0;margin-top:12px}.list-section-heading{display:flex;align-items:center;justify-content:space-between;min-height:44px;gap:8px;padding-left:12px}.list-section-heading h3{color:var(--muted);font-size:.75rem;font-weight:500}.list-section-heading .text-button{font-size:.75rem}.collection-entry{display:flex;gap:4px;align-items:center;min-width:0}.collection-title,.collection-link{display:flex;align-items:center;justify-content:flex-start;gap:12px;flex:1;min-width:0;min-height:56px;padding:8px 12px;text-align:left}.collection-name{overflow-wrap:anywhere;min-width:0;flex:1}.collection-link.active{background:var(--fill);color:var(--accent);font-weight:550}.collection-link .current-mark{color:var(--accent);width:16px}.list-create{color:var(--accent)}.list-section button:focus-visible{outline-offset:-3px}.sidebar .list-section{display:flex;flex-direction:column;flex:1;min-height:0;margin:0;overflow:hidden}.sidebar .list-section nav{min-height:0;overflow-y:auto}.sidebar .collection-link,.sidebar .collection-title,.sidebar .list-create{min-height:44px;font-size:.9375rem}.sidebar .collection-entry{flex-wrap:wrap;justify-content:flex-end;gap:0}.sidebar .collection-title{flex-basis:100%}.sidebar .collection-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dialog-description{font-size:.9375rem;line-height:1.7;margin-bottom:24px}.error-banner{color:var(--danger);background:var(--bg);border:1px solid var(--line);display:flex;align-items:center;gap:12px;justify-content:space-between;padding:8px 12px;font-size:.8125rem;line-height:1.6;border-radius:8px;margin-bottom:20px;overflow-wrap:anywhere}.error-banner>button{flex-shrink:0;color:var(--danger)}.startup{max-width:600px;margin:20vh auto;padding:24px;display:flex;flex-direction:column;gap:20px;line-height:1.7}.startup>svg{width:32px;height:32px;color:var(--muted)}.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.spin{animation:spin 1.4s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}@media(hover:none){.row-delete{opacity:1}}@media(max-width:760px){.app-shell{position:fixed;top:var(--viewport-top, 0px);left:0;right:0;height:var(--viewport-height, 100dvh);min-height:0;display:flex;flex-direction:column;overflow:hidden}.sidebar{display:none}.main{flex:1;min-height:0;display:flex;flex-direction:column;padding:max(24px,env(safe-area-inset-top)) 20px 0}.main>:not(.content){flex-shrink:0}.main .content{order:1;flex:1;min-height:0;overflow-y:auto;overscroll-behavior-y:contain;padding:0 0 16px;scroll-padding:12px}.desktop-title{display:none}.mobile-title{display:inline-flex;max-width:100%;font:inherit;padding:0;gap:8px;text-align:left}.mobile-title>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.mobile-title>svg{width:16px;height:16px;color:var(--muted)}.mobile-title:hover{background:none}.page-header{margin-bottom:24px;gap:8px}h1{font-size:1.5rem}.header-actions .text-button{padding:8px}.search{order:2;padding:12px 20px max(12px,env(safe-area-inset-bottom));margin:0 -20px;background:var(--page)}.search input{font-size:1rem}.composer{order:2;gap:12px;padding:12px 20px max(12px,env(safe-area-inset-bottom));margin:0 -20px;background:var(--page)}.composer input{order:0;font-size:1rem}.composer-add{order:1;color:var(--bg);background:var(--accent);border-radius:12px}.composer-add:hover{background:var(--accent)}.is-selecting .composer,.is-selecting .search,.is-searching .composer{display:none}.app-shell[data-keyboard-open=true] .composer,.app-shell[data-keyboard-open=true] .search,.app-shell[data-keyboard-open=true] .bulk-bar{padding-bottom:8px}.task-row{padding:6px 0;gap:4px}.task-content{padding:8px 0;touch-action:pan-y;user-select:none;-webkit-touch-callout:none}.row-delete,.task-row-actions{display:none}.trash-row .task-row-actions{display:flex}.task-check{margin-left:-6px}.bulk-bar{position:static;flex-shrink:0;display:flex;justify-content:space-around;align-items:center;padding:8px 16px max(10px,env(safe-area-inset-bottom));background:var(--bg);border:0;border-top:1px solid var(--line);border-radius:0;transform:none;min-width:0;z-index:10;gap:8px}.bulk-bar button{min-width:0;min-height:56px;padding:6px}.bulk-bar p{min-height:56px}.toast{position:absolute;left:50%;bottom:max(16px,env(safe-area-inset-bottom));gap:8px}.has-bottom-bar .toast{bottom:calc(84px + env(safe-area-inset-bottom))}.dialog,.dialog.wide{position:fixed;inset:auto 0 calc(100dvh - var(--viewport-top, 0px) - var(--viewport-height, 100dvh));margin:0;width:100%;max-width:none;max-height:calc(var(--viewport-height, 100dvh) - 24px - env(safe-area-inset-top));padding:0;border-radius:20px 20px 0 0;box-shadow:0 -8px 32px #0001;overflow:hidden}.dialog[open]{display:flex;flex-direction:column}.dialog::backdrop{background:#111c174d}.dialog-header{flex-shrink:0;margin:0;padding:12px 20px 16px}.dialog-body{min-height:0;overflow-y:auto;overscroll-behavior:contain;padding:0 20px max(20px,env(safe-area-inset-bottom))}.dialog-body>.collection-back{margin:0 0 12px}.empty-state{min-height:240px}}@media(max-width:360px){.main{padding-left:16px;padding-right:16px}.composer,.search{margin-left:-16px;margin-right:-16px;padding-left:16px;padding-right:16px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;scroll-behavior:auto!important}}
