:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;font-synthesis:none;--ink:#17233b;--muted:#677084;--paper:#f3f0e8;--surface:#fffdf8;--subtle:#eeece5;--field:#fffdf8;--hover:#faf8f2;--line:#d8d5cd;--accent:#c94724;--accent-hover:#ad3519;--success:#437b69;--priority:#b36d12;--danger:#bd432d;--focus:color-mix(in srgb, var(--accent) 48%, transparent);--shadow:0 .75rem 2rem #1a22350f;--shadow-modal:0 1.5rem 4.5rem #11192a47;--radius-sm:.5rem;--radius-md:.75rem;--radius-lg:.9rem;--space-1:clamp(.45rem, .4rem + .2vw, .6rem);--space-2:clamp(.75rem, .65rem + .35vw, 1rem);--space-3:clamp(1rem, .8rem + .7vw, 1.5rem);--space-4:clamp(1.25rem, 1rem + 1vw, 2rem);--control-size:2.75rem;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}[data-theme=dark]{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--ink:#edf0f5;--muted:#aeb6c5;--paper:#11161e;--surface:#1a212c;--subtle:#252e3b;--field:#141a23;--hover:#202833;--line:#343d4b;--shadow:0 .75rem 2rem #0000002e}@media (prefers-color-scheme:dark){[data-theme=system]{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--ink:#edf0f5;--muted:#aeb6c5;--paper:#11161e;--surface:#1a212c;--subtle:#252e3b;--field:#141a23;--hover:#202833;--line:#343d4b;--shadow:0 .75rem 2rem #0000002e}}*,:before,:after{box-sizing:border-box}html{background:var(--paper);touch-action:manipulation}body{min-block-size:100dvh;color:var(--ink);background:var(--paper);-webkit-user-select:none;user-select:none;margin:0}button,input,select{font:inherit}button{color:inherit}input,textarea{-webkit-user-select:text;user-select:text}button:focus-visible,input:focus-visible,select:focus-visible,.todo-item:focus-visible{outline:.2rem solid var(--focus);outline-offset:.15rem}.sr-only{clip-path:inset(50%);white-space:nowrap;border:0;block-size:0;inline-size:0;padding:0;position:absolute;overflow:hidden}.icon{flex:none;block-size:1em;inline-size:1em}.icon--small{font-size:.875em}.icon--large{font-size:1.625em}.app-shell{min-block-size:100dvh}.app-shell.is-loading{visibility:hidden}main{inline-size:min(100% - clamp(1rem,4vw,3rem),66rem);padding-block:max(clamp(1rem, 5vw, 3rem), env(safe-area-inset-top)) max(clamp(1rem, 5vw, 3rem), env(safe-area-inset-bottom));margin-inline:auto}.fatal-error{place-content:center;justify-items:start;gap:var(--space-1);min-block-size:100dvh;max-inline-size:40rem;display:grid}.fatal-error strong{font-family:Georgia,Times New Roman,serif;font-size:clamp(1.5rem,1.2rem + 1vw,2rem)}.fatal-error p{color:var(--muted);margin:0;line-height:1.6}.fatal-error button{min-block-size:var(--control-size);padding-inline:var(--space-2);color:#fff;background:var(--accent);border-radius:var(--radius-sm);cursor:pointer;border:0;margin-block-start:var(--space-1)}.list-section{background:var(--surface);border:.0625rem solid var(--line);border-radius:var(--radius-md);box-shadow:var(--shadow);overflow:clip;container:todo-list/inline-size}.filter-tabs,.modal-header,.todo-meta,.modal-action{align-items:center;display:flex}.filter-row{align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-3);border-block-end:.0625rem solid var(--line);grid-template-columns:auto minmax(0,1fr) auto auto auto;display:grid}.filter-tabs{gap:var(--space-1)}.sort-control{grid-column:3;min-inline-size:0}.sort-control select{min-block-size:var(--control-size);max-inline-size:9rem;color:var(--muted);background:var(--field);border:.0625rem solid var(--line);border-radius:var(--radius-sm);cursor:pointer;padding-inline:.75rem 2rem;font-size:.75rem;font-weight:700}.filter-tabs button{min-block-size:var(--control-size);color:var(--muted);border-radius:var(--radius-sm);cursor:pointer;background:0 0;border:0;justify-content:center;align-items:center;gap:.5em;padding-inline:clamp(.65rem,1.5cqi,.9rem);font-size:clamp(.75rem,.7rem + .2cqi,.825rem);font-weight:700;display:inline-flex;position:relative}.filter-tabs button.active{color:var(--ink);background:var(--subtle)}.filter-tabs button span{background:color-mix(in srgb, var(--ink) 8%, transparent);border-radius:999rem;min-inline-size:1.25rem;padding:.1rem .35rem;font-size:.65rem}.filter-tabs button.active:after{content:"";background:var(--accent);block-size:.125rem;position:absolute;inset-block-end:calc(var(--space-2) * -1 - .0625rem);inset-inline:.75rem}.add-button,.category-form button{border-radius:var(--radius-sm);cursor:pointer;border:0}.add-button{min-block-size:var(--control-size);color:#fff;background:var(--accent);box-shadow:0 .45rem 1rem color-mix(in srgb, var(--accent) 24%, transparent);justify-content:center;align-items:center;gap:.5rem;padding-inline:clamp(.9rem,2cqi,1.15rem);font-weight:750;transition:transform .18s,background .18s,box-shadow .18s;display:inline-flex}.add-button:hover{background:var(--accent-hover);box-shadow:0 .65rem 1.25rem color-mix(in srgb, var(--accent) 30%, transparent);transform:translateY(-.125rem)}.add-button:disabled,.settings-button:disabled{opacity:.45;cursor:not-allowed;box-shadow:none;transform:none}.settings-button{flex:0 0 var(--control-size);inline-size:var(--control-size);block-size:var(--control-size);color:var(--muted);cursor:pointer;background:0 0;border:0;place-items:center;transition:color .18s;display:grid;position:relative}.settings-button:hover{color:var(--accent-hover)}.settings-button:focus-visible{color:var(--accent);outline:0}.settings-button:focus-visible:after{content:"";background:var(--accent);border-radius:999rem;block-size:.125rem;position:absolute;inset-block-end:.3rem;inset-inline:32%}.todo-list{min-block-size:9.5rem;padding:.25rem var(--space-3) var(--space-3)}.todo-swipe-shell{background:color-mix(in srgb, var(--success) 88%, var(--surface));border-block-end:.0625rem solid var(--line);animation:.32s both reveal;position:relative;overflow:clip}.todo-swipe-shell:last-child{border-block-end:0}.swipe-complete{color:#fff;align-items:center;gap:.4rem;font-size:.75rem;font-weight:800;display:flex;position:absolute;inset-block:0;inset-inline-start:var(--space-2)}.todo-item{align-items:center;gap:var(--space-2);min-block-size:clamp(5.5rem,4.9rem + 1.2cqi,6.25rem);padding:var(--space-2) clamp(.35rem, 1.4cqi, .75rem);background:var(--surface);cursor:pointer;touch-action:pan-y pinch-zoom;transform:translateX(var(--swipe-offset,0));grid-template-columns:auto minmax(0,1fr) auto;transition:background .18s,transform .18s;display:grid}.todo-item.is-swiping{transition:none}.todo-item:hover{background:var(--hover)}.check-button{color:#fff;border:.1rem solid color-mix(in srgb, var(--muted) 70%, transparent);cursor:pointer;background:0 0;border-radius:50%;place-items:center;block-size:1.65rem;inline-size:1.65rem;padding:0;transition:border-color .18s,background .18s,transform .18s;display:grid}.check-button:hover{border-color:var(--accent);transform:scale(1.08)}.is-completed .check-button{background:var(--success);border-color:var(--success)}.todo-copy{-webkit-user-select:text;user-select:text;min-inline-size:0}.todo-copy *{-webkit-user-select:text;user-select:text}.todo-copy h3{overflow-wrap:anywhere;margin:0 0 .55rem;font-size:clamp(.95rem,.88rem + .28cqi,1.075rem);font-weight:700;transition:color .18s}.is-completed .todo-copy h3{color:var(--muted);text-decoration:line-through;text-decoration-thickness:.0625rem}.todo-meta{flex-wrap:wrap;gap:.45rem .85rem}.priority-stars{color:color-mix(in srgb, var(--muted) 28%, transparent);letter-spacing:.02em;-webkit-user-select:none;user-select:none;gap:.05em;font-size:.75rem;display:inline-flex}.priority-stars .is-filled{color:var(--priority)}.category{color:hsl(var(--category-hue) 44% 32%);background:hsl(var(--category-hue) 48% 90%);letter-spacing:.05em;text-transform:uppercase;border-radius:.3rem;padding:.25rem .5rem;font-size:.625rem;font-weight:800;display:inline-flex}.due-date,.created-at{color:var(--muted);align-items:center;gap:.3rem;font-size:.75rem;display:inline-flex}.delete-button,.modal-header>button,.modal-header .close-button,.feedback-toast button,.category-setting button{color:var(--muted);cursor:pointer;background:0 0;border:0;border-radius:50%;place-items:center;padding:0;display:grid}.delete-button{opacity:0;block-size:2.5rem;inline-size:2.5rem;transition:color .18s,background .18s,opacity .18s,transform .18s;transform:translate(.3rem)}.todo-item:hover .delete-button,.delete-button:focus-visible{opacity:1;transform:none}.delete-button:hover{color:var(--danger);background:color-mix(in srgb, var(--danger) 10%, transparent)}.empty-state{min-block-size:11rem;color:var(--muted);text-align:center;place-content:center;justify-items:center;display:grid}.empty-state>span{block-size:3.25rem;inline-size:3.25rem;color:var(--success);background:color-mix(in srgb, var(--success) 14%, transparent);border-radius:50%;place-items:center;margin-block-end:.75rem;display:grid}.empty-state strong{color:var(--ink)}.empty-state p{max-inline-size:36ch;margin:.3rem 0 0;font-size:.8rem}.retry-button{min-block-size:2.5rem;color:var(--ink);background:var(--subtle);border:.0625rem solid var(--line);border-radius:var(--radius-sm);cursor:pointer;margin-block-start:var(--space-2);padding-inline:1rem;font-weight:750}.retry-button:hover{border-color:color-mix(in srgb, var(--accent) 50%, var(--line))}.modal-backdrop{z-index:20;padding:max(var(--space-2), env(safe-area-inset-top)) max(var(--space-2), env(safe-area-inset-right)) max(var(--space-2), env(safe-area-inset-bottom)) max(var(--space-2), env(safe-area-inset-left));-webkit-backdrop-filter:blur(.2rem);backdrop-filter:blur(.2rem);background:#17233b7a;place-items:center;animation:.18s both fade-in;display:grid;position:fixed;inset:0}.modal-panel{inline-size:min(100%,35rem);max-block-size:calc(100dvh - 2 * var(--space-2));overscroll-behavior:contain;padding:var(--space-4);color:var(--ink);background:var(--surface);border:.0625rem solid var(--line);border-radius:var(--radius-lg);box-shadow:var(--shadow-modal);animation:.22s both modal-in;overflow:clip auto;container-type:inline-size}.modal-header{justify-content:space-between;align-items:center;gap:var(--space-2);margin-block-end:var(--space-3)}.modal-header h2{min-inline-size:0;margin:0;font-family:Georgia,Times New Roman,serif;font-size:clamp(1.5rem,1.25rem + 1.2cqi,1.75rem);font-weight:500}.modal-header>button,.modal-header .close-button{block-size:2rem;inline-size:2rem;color:var(--ink);flex:0 0 2rem;font-size:1.5rem;line-height:1}.modal-header>button:hover,.modal-header .close-button:hover{background:var(--subtle)}.todo-form input,.todo-form select,.category-form input{inline-size:100%;min-inline-size:0;min-block-size:var(--control-size);color:var(--ink);background:var(--field);border:.0625rem solid var(--line);border-radius:var(--radius-sm);padding-inline:.75rem}.form-options{align-items:end;gap:var(--space-2);grid-template-columns:repeat(auto-fit,minmax(min(100%,12rem),1fr));margin-block-start:var(--space-2);display:grid}.priority-picker{gap:var(--space-1);grid-template-columns:repeat(5,minmax(0,1fr));margin-block-start:var(--space-1);display:grid}.priority-picker button{min-block-size:var(--control-size);color:color-mix(in srgb, var(--muted) 30%, transparent);background:var(--field);border:.0625rem solid var(--line);border-radius:var(--radius-sm);cursor:pointer;padding:0;font-size:1.15rem}.priority-picker button.is-filled{color:var(--priority);background:color-mix(in srgb, var(--priority) 9%, var(--field));border-color:color-mix(in srgb, var(--priority) 45%, var(--line))}.created-log{margin:var(--space-2) 0 0;color:var(--muted);font-size:.7rem}.modal-section{padding-block:var(--space-3);border-block-start:.0625rem solid var(--line)}.modal-section--last{padding-block-end:0}.modal-header-actions{align-items:center;gap:var(--space-1);min-inline-size:0;display:flex}.modal-header-actions .close-button{flex:0 0 2rem}.category-list{gap:var(--space-1);grid-template-columns:repeat(auto-fit,minmax(min(100%,13rem),1fr));display:grid}.category-setting{background:var(--subtle);border-radius:var(--radius-sm);grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:.55rem;min-block-size:2.6rem;min-inline-size:0;padding:.4rem .5rem .4rem .7rem;font-size:.8rem;font-weight:700;display:grid}.category-setting>span:nth-child(2){text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.category-dot{background:hsl(var(--category-hue) 52% 52%);border-radius:50%;block-size:.55rem;inline-size:.55rem}.category-setting button{border-radius:.4rem;block-size:1.9rem;inline-size:1.9rem}.category-setting button:hover:not(:disabled){color:var(--danger);background:color-mix(in srgb, var(--danger) 10%, transparent)}.category-setting button:disabled{opacity:.28;cursor:not-allowed}.category-form{grid-template-columns:minmax(0, 1fr) var(--control-size);gap:var(--space-1);margin-block-start:var(--space-1);display:grid}.category-form input{border-style:dashed}.category-form button{color:#fff;background:var(--accent);place-items:center;display:grid}.category-form button:disabled{opacity:.42;cursor:not-allowed}.modal-action{min-block-size:2.4rem;color:var(--ink);background:var(--subtle);border:.0625rem solid var(--line);border-radius:var(--radius-sm);cursor:pointer;flex:none;justify-content:center;gap:.4rem;padding-inline:.8rem;font-size:.75rem;font-weight:800}.modal-action span{white-space:nowrap}.modal-action--primary{color:#fff;background:var(--accent);border-color:var(--accent)}.modal-action:disabled{opacity:.42;cursor:not-allowed}.notification-toggle.is-enabled{color:var(--success);border-color:color-mix(in srgb, var(--success) 65%, var(--line))}.theme-options{gap:var(--space-1);grid-template-columns:repeat(auto-fit,minmax(min(100%,8rem),1fr));display:grid}.theme-options button{min-block-size:var(--control-size);color:var(--muted);border:.0625rem solid var(--line);border-radius:var(--radius-sm);cursor:pointer;background:0 0;grid-template-columns:1.65rem minmax(0,1fr);align-items:center;gap:.5rem;padding:.5rem;font-size:.75rem;font-weight:750;display:grid}.theme-options button.active{color:var(--ink);border-color:var(--accent);box-shadow:inset 0 0 0 .0625rem var(--accent)}.theme-preview{aspect-ratio:1;background:#f7f4ec;border:.0625rem solid #c8c5bd;border-radius:50%;inline-size:1.65rem}.theme-preview--dark{background:#151b24;border-color:#3c4655}.theme-preview--system{background:linear-gradient(90deg,#f7f4ec 50%,#151b24 50%)}.feedback-toast{z-index:30;inline-size:min(24rem, calc(100% - 2 * var(--space-2)));align-items:center;gap:var(--space-1);color:var(--surface);background:var(--ink);border-radius:var(--radius-sm);grid-template-columns:auto minmax(0,1fr) auto;padding:.85rem .95rem;font-size:.8rem;line-height:1.45;animation:.22s both modal-in;display:grid;position:fixed;inset-block-end:max(var(--space-2), env(safe-area-inset-bottom));inset-inline-end:max(var(--space-2), env(safe-area-inset-right));box-shadow:0 1rem 2.5rem #11192a40}.feedback-toast>svg{color:#ff9a79}.feedback-toast button{block-size:1.8rem;inline-size:1.8rem;color:inherit;font-size:1.25rem}.feedback-toast button:hover{background:#ffffff1f}@container todo-list (inline-size<34rem){.filter-row{grid-template-columns:minmax(0,1fr) auto auto}.filter-tabs{grid-area:1/1}.sort-control{grid-area:2/1/auto/-1}.sort-control select{inline-size:100%;max-inline-size:none}.settings-button{grid-area:1/2}.add-button{inline-size:var(--control-size);grid-area:1/3;padding:0}.add-button span{display:none}.todo-list{align-content:start;gap:var(--space-2);min-block-size:0;padding:var(--space-1);background:var(--paper);display:grid}.todo-swipe-shell,.todo-swipe-shell:last-child{border:.0625rem solid var(--line);border-radius:var(--radius-md);box-shadow:0 .35rem 1rem #1a223512}.todo-item{border-radius:inherit}.delete-button{opacity:1;transform:none}}@container todo-list (inline-size<25rem){.filter-row{gap:.4rem;padding-inline:.6rem}.filter-tabs{gap:.3rem}.filter-tabs button{padding-inline:.55rem}.todo-item{gap:.7rem}}@container (inline-size<24rem){.modal-header{align-items:flex-start;gap:.25rem}.modal-header-actions{gap:.25rem}.notification-toggle{inline-size:2.4rem;padding-inline:0}.notification-toggle span{display:none}}@media (hover:none){.delete-button{opacity:1;transform:none}.add-button:hover{transform:none}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important}}@keyframes reveal{0%{opacity:0;translate:0 .5rem}to{opacity:1;translate:0}}@keyframes fade-in{0%{opacity:0}to{opacity:1}}@keyframes modal-in{0%{opacity:0;transform:translateY(.65rem)scale(.98)}to{opacity:1;transform:translateY(0)scale(1)}}
