:root{--color-dark-walnut:#3d1900;--color-olive:#a08d17;--color-lavender:#cfdeff;--color-floral-white:#fffcf3;--color-tangerine:#ff6c39;--color-walnut-soft:#3d190099;--color-walnut-faint:#3d190014;--color-olive-soft:#a08d1724;--color-olive-strong:#857412;--color-lavender-line:#b9ccf2;--color-lavender-deep:#7c93d9;--color-lavender-soft:#cfdeff66;--color-tangerine-strong:#e85a2a;--font-body:"Inter", sans-serif;--font-display:"Instrument Serif", serif;--space-1:.25rem;--space-2:.5rem;--space-3:.75rem;--space-4:1rem;--space-5:1.5rem;--space-6:2rem;--space-7:3rem;--space-8:4rem;--radius-sm:8px;--radius-md:16px;--radius-lg:24px;--radius-pill:999px;--shadow-soft:0 8px 24px #3d190014;--shadow-lift:0 14px 32px #3d19001f;--content-max-width:1080px;--sidebar-width:320px;--planning-column-width:360px;--transition-fast:.15s ease;--transition-medium:.28s cubic-bezier(.4, 0, .2, 1)}*,:before,:after{box-sizing:border-box}body{background-color:var(--color-floral-white);color:var(--color-dark-walnut);font-family:var(--font-body);-webkit-font-smoothing:antialiased;margin:0;line-height:1.5}h1,h2,h3{font-family:var(--font-display);margin:0;font-weight:400}p{margin:0}ul{margin:0;padding:0;list-style:none}button{cursor:pointer;font-family:inherit}input,textarea{font-family:inherit;font-size:inherit;color:inherit}svg{display:block}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}.btn{justify-content:center;align-items:center;gap:var(--space-2);padding:var(--space-3) var(--space-5);border-radius:var(--radius-pill);white-space:nowrap;transition:transform var(--transition-fast), background-color var(--transition-fast), opacity var(--transition-fast);border:none;font-size:.9375rem;font-weight:600;display:inline-flex}.btn svg{width:18px;height:18px}.btn--primary{background-color:var(--color-tangerine);color:var(--color-floral-white)}.btn--primary:hover{background-color:var(--color-tangerine-strong)}.btn--primary:active{transform:scale(.97)}.btn--secondary{background-color:var(--color-olive);color:var(--color-floral-white)}.btn--secondary:hover{background-color:var(--color-olive-strong)}.btn--secondary:active{transform:scale(.97)}.btn--ghost{color:var(--color-dark-walnut);border:1.5px solid var(--color-lavender-line);background-color:#0000}.btn--ghost:hover{border-color:var(--color-dark-walnut)}.btn--danger{color:#b23a1e}.btn--danger:hover{background-color:#b23a1e0f;border-color:#b23a1e}.btn:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible{outline:2.5px solid var(--color-tangerine);outline-offset:2px}.menu-toggle{top:var(--space-4);left:var(--space-4);z-index:40;background-color:var(--color-floral-white);border:1.5px solid var(--color-lavender-line);border-radius:var(--radius-pill);width:44px;height:44px;box-shadow:var(--shadow-soft);color:var(--color-dark-walnut);transition:background-color var(--transition-fast);justify-content:center;align-items:center;display:flex;position:fixed}.menu-toggle:hover{background-color:var(--color-lavender-soft)}.overlay{z-index:45;opacity:0;pointer-events:none;transition:opacity var(--transition-medium);background-color:#3d190059;position:fixed;inset:0}.overlay:not([hidden]){opacity:1;pointer-events:auto}.app{max-width:var(--content-max-width);padding:var(--space-8) var(--space-4) var(--space-8);flex-direction:column;margin:0 auto;display:flex}.app-main{gap:var(--space-8);margin:0 auto;display:flex}.app-forms{gap:var(--space-6);flex-direction:column;display:flex}.section-title{margin-bottom:var(--space-4);color:var(--color-dark-walnut);font-size:1.375rem}.confirm-dialog{border-radius:var(--radius-lg);padding:var(--space-6);max-width:360px;width:calc(100% - var(--space-6));box-shadow:var(--shadow-lift);background-color:var(--color-floral-white);color:var(--color-dark-walnut);border:none}.confirm-dialog::backdrop{background-color:#3d190066}.confirm-dialog__content{gap:var(--space-5);flex-direction:column;display:flex}.confirm-dialog__message{font-size:1.0625rem;line-height:1.5}.confirm-dialog__actions{justify-content:flex-end;gap:var(--space-3);display:flex}@media (width>=640px){.app{padding:var(--space-8) var(--space-6)}.app-header__title{font-size:3.5rem}.category-picker{gap:var(--space-3)}.task-list__item{padding:var(--space-4) var(--space-5)}}@media (width>=1024px){.app-main{grid-template-columns:var(--planning-column-width) 1fr;grid-template-areas:"active list""form list"}}@media (width<=380px){.timer__time{font-size:2.25rem}.app-header__title{font-size:2.5rem}}.active-task{background-color:var(--color-dark-walnut);color:var(--color-floral-white);border-radius:var(--radius-lg);padding:var(--space-5);box-shadow:var(--shadow-lift);gap:var(--space-4);flex-direction:column;display:flex}.active-task__top{gap:var(--space-2);flex-direction:column;display:flex}.active-task__category{padding:var(--space-1) var(--space-3);border-radius:var(--radius-pill);background-color:var(--category-color,var(--color-tangerine));color:var(--color-floral-white);text-transform:uppercase;letter-spacing:.04em;align-self:flex-start;align-items:center;font-size:.75rem;font-weight:600;display:inline-flex}.active-task__name{color:var(--color-floral-white);font-size:1.375rem}.timer{align-items:center;gap:var(--space-4);padding:var(--space-4) 0;border-top:1px solid #cfdeff26;border-bottom:1px solid #cfdeff26;flex-direction:column;display:flex}.timer__display{align-items:center;gap:var(--space-1);flex-direction:column;display:flex}.timer__time{font-family:var(--font-display);color:var(--color-floral-white);font-variant-numeric:tabular-nums;font-size:2.75rem;line-height:1}.timer__label{text-transform:uppercase;letter-spacing:.06em;color:var(--color-tangerine);font-size:.75rem}.timer[data-timer-state=paused] .timer__label{color:var(--color-lavender)}.timer__controls{gap:var(--space-3);display:flex}.timer__btn{align-items:center;gap:var(--space-2);padding:var(--space-3) var(--space-5);border-radius:var(--radius-pill);color:var(--color-floral-white);transition:background-color var(--transition-fast);background-color:#0000;border:1.5px solid #fffcf340;font-size:.875rem;font-weight:600;display:inline-flex}.timer__btn svg{width:16px;height:16px}.timer__btn:hover{background-color:#fffcf31a}.timer__btn--stop:hover{border-color:var(--color-tangerine);background-color:#ff6c3933}.active-task__description{gap:var(--space-2);flex-direction:column;display:flex}.active-task__description-label{text-transform:uppercase;letter-spacing:.04em;color:#fffcf399;font-size:.75rem}.active-task__description-field{resize:vertical;border-radius:var(--radius-md);width:100%;padding:var(--space-3) var(--space-4);color:var(--color-floral-white);background-color:#fffcf30f;border:1.5px solid #fffcf326}.active-task__description-field::placeholder{color:#fffcf366}.active-task__description-field:focus-visible{border-color:var(--color-tangerine);outline:none}.active-task__actions{gap:var(--space-3);display:flex}.active-task__actions .btn--ghost{color:var(--color-floral-white);border-color:#fffcf340}.active-task__actions .btn--ghost:hover{border-color:var(--color-floral-white)}.active-task__actions .btn--danger{color:#ff8f72}.active-task__actions .btn--danger:hover{background-color:#ff6c391f;border-color:#ff8f72}.app-header{text-align:center;margin-bottom:var(--space-7);padding-top:var(--space-4);position:relative}.app-header__brand{justify-content:center;align-items:center;display:inline-flex;position:relative}.app-header__blob{position:absolute;top:50%;left:50%}.app-header__blob--tangerine{width:150px;height:150px;animation:8s ease-in-out infinite float-blob;transform:translate(-50%,-50%)}.app-header__blob--lavender{width:210px;height:210px;animation:9s ease-in-out infinite reverse float-blob;transform:translate(-50%,-50%)}@keyframes float-blob{0%,to{transform:translate(-50%,-50%)scale(1)rotate(0)}50%{transform:translate(-50%,-52%)scale(1.06)rotate(6deg)}}.app-header__title{color:var(--color-dark-walnut);font-size:3rem;position:relative}.app-header__subtitle{margin-top:var(--space-2);color:var(--color-walnut-soft);font-size:.9375rem;position:relative}.task-form-section{border:1px solid var(--color-lavender-line);border-radius:var(--radius-lg);padding:var(--space-5);background-color:#fff}.task-form{gap:var(--space-4);flex-direction:column;display:flex}.form-row{gap:var(--space-2);border:none;flex-direction:column;margin:0;padding:0;display:flex}.form-row__label,legend.form-row__label{text-transform:uppercase;letter-spacing:.04em;color:var(--color-walnut-soft);font-size:.75rem}.form-row__input{border:1.5px solid var(--color-lavender-line);border-radius:var(--radius-md);padding:var(--space-3) var(--space-4);background-color:var(--color-floral-white);font-size:1rem}.form-row__input:focus-visible{border-color:var(--color-tangerine);outline:none}.category-picker{align-items:center;gap:var(--space-2);border:none;flex-flow:wrap;margin:0;padding:0;display:flex}.category-picker legend{width:100%;margin-bottom:var(--space-1)}.category-picker__radio,.category-picker__option input[type=radio]{opacity:0;clip:rect(0, 0, 0, 0);pointer-events:none;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.category-picker__option{align-items:center;gap:var(--space-2);padding:var(--space-2) var(--space-4);border:1.5px solid var(--color-lavender-line);border-radius:var(--radius-pill);color:var(--color-dark-walnut);background-color:var(--color-floral-white);cursor:pointer;-webkit-user-select:none;user-select:none;transition:border-color var(--transition-fast), background-color var(--transition-fast), color var(--transition-fast), transform var(--transition-fast);font-size:.875rem;font-weight:500;display:inline-flex;position:relative}.category-picker__option:hover{background-color:var(--color-lavender-soft);border-color:var(--color-lavender-deep)}.category-picker__option:has(input:focus-visible){outline:2.5px solid var(--color-tangerine);outline-offset:2px}.category-picker__option:active{transform:scale(.97)}.category-picker__swatch{background-color:var(--category-color,var(--color-tangerine));width:12px;height:12px;transition:transform var(--transition-fast);border-radius:50%;flex-shrink:0}.category-picker>input[type=radio]:checked+.category-picker__option{border-color:var(--category-color,var(--color-tangerine));background-color:color-mix(in srgb, var(--category-color,var(--color-tangerine)) 16%, white);font-weight:600}.category-picker__option:has(input:checked){border-color:var(--category-color,var(--color-tangerine));background-color:color-mix(in srgb, var(--category-color,var(--color-tangerine)) 16%, white);font-weight:600}.category-picker__option:has(input:checked):hover{background-color:color-mix(in srgb, var(--category-color,var(--color-tangerine)) 22%, white)}.category-picker__option:has(input:checked) .category-picker__swatch{transform:scale(1.15)}.task-form__submit{align-self:flex-start}.task-list{gap:var(--space-3);flex-direction:column;display:flex}.task-list__header{gap:var(--space-1);margin-bottom:var(--space-4);flex-direction:column;display:flex}.task-list__filters{align-items:center;gap:var(--space-2);flex-wrap:wrap;display:flex}.task-list__filters label{display:contents}.task-list__filter{align-items:center;gap:var(--space-1);padding:var(--space-1) var(--space-3);border-radius:var(--radius-pill);border:1.5px solid var(--color-lavender-line);color:var(--color-walnut-soft);cursor:pointer;transition:background-color var(--transition-fast), border-color var(--transition-fast), color var(--transition-fast), transform var(--transition-fast);white-space:nowrap;-webkit-user-select:none;user-select:none;background-color:#0000;font-size:.8125rem;font-weight:500;display:inline-flex}.task-list__filter:hover{border-color:var(--color-lavender-deep);color:var(--color-dark-walnut);background-color:var(--color-lavender-soft)}.task-list__filter.is-active{border-color:var(--category-color,var(--color-tangerine));background-color:color-mix(in srgb, var(--category-color,var(--color-tangerine)) 14%, white);color:var(--color-dark-walnut);font-weight:600}.task-list__filter.is-active:hover{background-color:color-mix(in srgb, var(--category-color,var(--color-tangerine)) 22%, white)}.task-list__filter:active{transform:scale(.97)}.sidebar{width:min(var(--sidebar-width), 86vw);background-color:var(--color-floral-white);border-right:1px solid var(--color-lavender-line);padding:var(--space-6) var(--space-5);z-index:50;transition:transform var(--transition-medium);position:fixed;top:0;bottom:0;left:0;overflow-y:auto;transform:translate(-100%)}.sidebar.is-open{box-shadow:var(--shadow-lift);transform:translate(0)}.sidebar__header{margin-bottom:var(--space-4);justify-content:space-between;align-items:center;display:flex}.sidebar__title{font-size:1.75rem}.sidebar__close{width:36px;height:36px;color:var(--color-dark-walnut);border-radius:var(--radius-pill);background:0 0;border:none;justify-content:center;align-items:center;display:flex}.sidebar__close svg{width:18px;height:18px}.sidebar__close:hover{background-color:var(--color-lavender-soft)}.sidebar__hint{color:var(--color-walnut-soft);margin-bottom:var(--space-6);font-size:.875rem}.category-form{gap:var(--space-4);flex-direction:column;display:flex}.category-form__item{align-items:flex-end;gap:var(--space-3);padding-bottom:var(--space-4);display:flex}.category-form__fields{gap:var(--space-1);flex-direction:column;flex:1;display:flex}.category-form__label{text-transform:uppercase;letter-spacing:.04em;color:var(--color-walnut-soft);font-size:.75rem}.category-form__name{border:none;border-bottom:1.5px solid var(--color-lavender-line);padding:var(--space-2) 0;color:var(--color-dark-walnut);background:0 0;font-size:1rem}.category-form__name:focus-visible{border-color:var(--color-tangerine);outline:none}.category-form__color{border:1.5px solid var(--color-lavender-line);cursor:pointer;width:36px;height:36px;transition:transform var(--transition-fast), border-color var(--transition-fast);background:0 0;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;display:flex;overflow:hidden}.category-form__color:hover{border-color:var(--color-dark-walnut);transform:scale(1.06)}.category-form__color:focus-within{outline:2.5px solid var(--color-tangerine);outline-offset:2px}.category-form__color input[type=color]{appearance:none;cursor:pointer;background:0 0;border:none;width:100%;height:100%;margin:0;padding:0}.category-form__color input[type=color]::-webkit-color-swatch-wrapper{padding:0}.category-form__color input[type=color]::-webkit-color-swatch{border:none;border-radius:50%}.category-form__color input[type=color]::-moz-color-swatch{border:none;border-radius:50%}.category-form__submit{margin-top:var(--space-2);width:100%}.fab{top:var(--space-4);left:var(--space-4);z-index:40;background-color:var(--color-floral-white);border:1.5px solid var(--color-lavender-line);border-radius:var(--radius-pill);width:44px;height:44px;box-shadow:var(--shadow-soft);color:var(--color-dark-walnut);transition:background-color var(--transition-fast);justify-content:center;align-items:center;display:flex;position:fixed}.fab:hover{background-color:var(--color-lavender-soft)}.task-list__row{align-items:center;gap:var(--space-4);display:flex}.task-list__item{align-items:center;gap:var(--space-4);min-width:0;padding:var(--space-4);border:1.5px solid var(--color-lavender-line);border-radius:var(--radius-md);transition:border-color var(--transition-fast), background-color var(--transition-fast), transform var(--transition-fast);background-color:#fff;flex:1;display:flex}.task-list__row:hover .task-list__item{border-color:var(--color-tangerine);transform:translateY(-1px)}.task-list__row:not([data-status=active]) .task-list__item:has(input:checked){background-color:var(--color-olive-soft);border-color:#0000}.task-list__row:not([data-status=active]) .task-list__item:has(input:checked) .task-list__name{color:var(--color-walnut-soft);text-decoration:line-through}.task-list__row[data-status=active] .task-list__item{border-color:var(--color-tangerine);background-color:#ff6c390f}.task-list__checkbox{flex-shrink:0;width:22px;height:22px;display:inline-flex;position:relative}.task-list__checkbox input{opacity:0;appearance:none;width:100%;height:100%;margin:0;position:absolute;inset:0}.task-list__checkbox-mark{border:1.5px solid var(--color-walnut-soft);border-radius:var(--radius-sm);background-color:var(--color-floral-white);width:22px;height:22px;transition:background-color var(--transition-fast), border-color var(--transition-fast);justify-content:center;align-items:center;display:flex}.task-list__checkbox-mark:after{content:"";border-right:2px solid var(--color-floral-white);border-bottom:2px solid var(--color-floral-white);opacity:0;width:6px;height:11px;transition:opacity var(--transition-fast);display:block;transform:rotate(45deg)translate(-1px,-1px)}.task-list__checkbox input:checked~.task-list__checkbox-mark{background-color:var(--color-olive);border-color:var(--color-olive)}.task-list__checkbox input:checked~.task-list__checkbox-mark:after{opacity:1}.task-list__main{gap:var(--space-1);flex-direction:column;flex:1;min-width:0;display:flex}.task-list__main:hover{cursor:pointer}.task-list__name{color:var(--color-dark-walnut);text-overflow:ellipsis;white-space:nowrap;font-size:1rem;font-weight:500;overflow:hidden}.task-list__meta{align-items:center;gap:var(--space-3);color:var(--color-walnut-soft);font-size:.8125rem;display:flex}.task-list__category{align-items:center;gap:var(--space-1);display:inline-flex}.task-list__category:before{content:"";background-color:var(--category-color,var(--color-tangerine));border-radius:50%;width:8px;height:8px}.task-list__time{align-items:center;gap:var(--space-2);color:var(--color-walnut-soft);font-variant-numeric:tabular-nums;flex-shrink:0;font-size:.875rem;display:flex}.task-list__time svg{width:16px;height:16px}.task-list__actions{gap:var(--space-2);opacity:0;transition:opacity var(--transition-fast);flex-shrink:0;display:flex}.task-list__row:hover .task-list__actions,.task-list__row:focus-within .task-list__actions{opacity:1}.task-list__actions .btn{width:32px;height:32px;color:var(--color-walnut-soft);border:1px solid #0000;padding:0}.task-list__actions .btn:hover,.task-list__actions .btn:focus-visible{border-color:var(--color-lavender-line);color:var(--color-dark-walnut)}.task-list__actions .btn--danger:hover,.task-list__actions .btn--danger:focus-visible{color:#d94e2d;background-color:#ff6c3914;border-color:#ff8f72}.task-list__actions svg{width:17px;height:17px}.task-list__empty{text-align:center;color:var(--color-walnut-soft);padding:var(--space-7) var(--space-4);border:1.5px dashed var(--color-lavender-line);border-radius:var(--radius-lg)}
