.routine-board{flex-direction:column;gap:clamp(1rem,3vw,1.75rem);width:min(100%,68rem);min-height:100svh;margin:0 auto;padding:clamp(1.25rem,4vw,2.5rem);display:flex}.routine-header{flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:.75rem 1.5rem;display:flex}.routine-header h1{letter-spacing:-.03em;text-wrap:balance;margin:0;font-size:clamp(1.75rem,5vw,2.75rem);line-height:1.1}.routine-header .routine-progress{color:var(--muted);text-wrap:balance;margin:0;font-size:clamp(1.125rem,3.5vw,1.5rem);font-weight:700}.routine-header__controls{flex-wrap:wrap;align-items:center;gap:.75rem 1.25rem;display:flex}.settings-button{border:1px solid var(--border);color:var(--muted);font:inherit;cursor:pointer;touch-action:manipulation;-webkit-user-select:none;user-select:none;background:0 0;border-radius:999px;align-items:center;gap:.375rem;padding:.5rem .875rem;font-size:.875rem;font-weight:600;display:inline-flex}.settings-button svg{width:1.125rem;height:1.125rem;display:block}.settings-button:hover{border-color:var(--muted);color:var(--text);background:var(--surface)}.settings-button:focus-visible{outline:3px solid var(--accent);outline-offset:2px}.progress-bar{background:var(--border);border-radius:999px;height:1rem;overflow:hidden}.progress-bar__fill{border-radius:inherit;background:var(--success);height:100%;transition:width .3s}.task-grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,9.5rem),1fr));gap:clamp(1.25rem,3vw,1.75rem);margin:0;padding:0;list-style:none;display:grid}.task-item{min-width:0}.task-card{border:3px solid var(--border);background:var(--surface);cursor:pointer;touch-action:manipulation;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;border-radius:1.25rem;flex-direction:column;justify-content:center;align-items:center;gap:.75rem;width:100%;min-height:11.5rem;padding:clamp(1rem,3vw,1.5rem) clamp(.75rem,2vw,1.25rem);transition:transform .15s,border-color .15s,background .15s;display:flex;position:relative}.task-card:hover{transform:translateY(-2px);box-shadow:0 8px 24px #0f172a1a}.task-card:active{transform:translateY(1px)scale(.99)}.task-card:focus-visible{outline:4px solid var(--accent);outline-offset:3px}.task-card__art{place-items:center;width:100%;max-width:9.5rem;display:grid}.task-card__art svg{width:100%;height:auto;max-height:8.5rem;display:block}.task-card__label{text-align:center;color:var(--text);font-size:clamp(1.05rem,2.75vw,1.35rem);font-weight:700}.task-card__check{color:#fff;background:var(--success);opacity:0;border-radius:999px;place-items:center;width:2.5rem;height:2.5rem;transition:opacity .15s,transform .15s;display:grid;position:absolute;top:.75rem;right:.75rem;transform:scale(0)}.task-card__check svg{width:1.5rem;height:1.5rem}.task-card--done{border-color:var(--success);background:var(--success-soft)}.task-card--done .task-card__art{filter:grayscale(.85);opacity:.55}.task-card--done .task-card__label{color:var(--success-dark)}.task-card--done .task-card__check{opacity:1;transform:scale(1)}.celebration{color:#fff;text-align:center;background:linear-gradient(135deg, var(--accent), #7c3aed);border-radius:1.5rem;padding:clamp(1.75rem,5vw,3rem);position:relative;overflow:hidden;box-shadow:0 12px 32px #0f172a2e}.celebration__title{text-wrap:balance;margin:0;font-size:clamp(2rem,7vw,3.25rem);line-height:1.1}.celebration__message{opacity:.92;margin:.5rem 0 0;font-size:clamp(1.1rem,3vw,1.5rem)}.celebration__confetti{pointer-events:none;position:absolute;inset:0}.confetti{opacity:0;border-radius:.15rem;width:.6rem;height:.6rem;animation:3.5s ease-in-out infinite confetti-float;position:absolute}@keyframes confetti-float{0%{opacity:0;transform:translateY(1.5rem)rotate(0)}15%{opacity:1}to{opacity:0;transform:translateY(-7rem)rotate(360deg)}}.routine-footer{justify-content:center;display:flex}.reset-button{border:2px solid var(--border);color:var(--muted);font:inherit;cursor:pointer;touch-action:manipulation;-webkit-user-select:none;user-select:none;background:0 0;border-radius:999px;padding:.75rem 1.5rem;font-size:1rem;font-weight:600}.reset-button:hover{border-color:var(--muted);color:var(--text)}.reset-button:focus-visible{outline:3px solid var(--accent);outline-offset:2px}@media (prefers-reduced-motion:reduce){.task-card,.task-card__check,.progress-bar__fill,.confetti{transition:none;animation:none}.task-card:hover,.task-card:active{transform:none}.confetti{display:none}}.settings{flex-direction:column;gap:1.5rem;width:min(100%,46rem);min-height:100svh;margin:0 auto;padding:clamp(1.25rem,4vw,2rem);display:flex}.settings__header{flex-wrap:wrap;align-items:center;gap:1rem;display:flex}.settings__header h1{text-wrap:balance;margin:0;font-size:clamp(1.5rem,4vw,2rem)}.settings__back{color:var(--muted);font:inherit;cursor:pointer;background:0 0;border:none;padding:.5rem 0;font-size:1rem;font-weight:600}.settings__back:hover{color:var(--text);text-decoration:underline}.settings__back:focus-visible,.settings__save:focus-visible,.settings__cancel:focus-visible,.settings__remove:focus-visible,.settings__remove-confirm:focus-visible,.settings__remove-cancel:focus-visible,.settings__add-task input:focus-visible,.settings__add-task button:focus-visible,.settings__title-field input:focus-visible,.settings__task-label input:focus-visible,.settings__icon-option:focus-visible{outline:3px solid var(--accent);outline-offset:2px}.settings__title-field{flex-direction:column;gap:.375rem;display:flex}.settings__title-field label,.settings__task-label label,.settings__add-task label{font-weight:600}.settings__title-field input,.settings__task-label input,.settings__add-task input{border:1px solid var(--border);background:var(--surface);width:100%;color:var(--text);font:inherit;border-radius:.5rem;padding:.6rem .75rem}.settings__title-field input[aria-invalid=true],.settings__task-label input[aria-invalid=true],.settings__add-task input:focus-visible{border-color:var(--accent)}.settings__error{color:#b91c1c;margin:0;font-size:.875rem;font-weight:600}.settings__tasks{flex-direction:column;gap:.75rem;display:flex}.settings__tasks h2{margin:0;font-size:1.125rem}.settings__task-list{flex-direction:column;gap:1rem;margin:0;padding:0;list-style:none;display:flex}.settings__task-row{border:1px solid var(--border);background:var(--surface);border-radius:1rem;grid-template-columns:1fr;gap:.75rem;padding:1rem;display:grid}@media (width>=40rem){.settings__task-row{grid-template-columns:minmax(0,1fr) auto;align-items:start}.settings__task-actions{grid-column:1/-1}}.settings__task-label{flex-direction:column;gap:.375rem;display:flex}.settings__icon-picker{border:none;flex-direction:column;gap:.5rem;margin:0;padding:0;display:flex}.settings__icon-picker legend{padding:0;font-weight:600}.settings__icon-options{flex-wrap:wrap;align-items:center;gap:.375rem;display:flex}.settings__icon-option{border:2px solid var(--border);background:var(--surface);cursor:pointer;border-radius:.75rem;place-items:center;width:3.25rem;height:3.25rem;padding:.25rem;display:grid}.settings__icon-option svg{width:100%;height:100%;display:block}.settings__icon-option:hover{border-color:var(--muted)}.settings__icon-option--selected{border-color:var(--accent);background:#2563eb14}.settings__task-actions{flex-wrap:wrap;align-items:center;gap:.625rem;display:flex}.settings__confirm-text{color:var(--muted);font-weight:600}.settings__remove,.settings__remove-confirm,.settings__remove-cancel{font:inherit;cursor:pointer;border-radius:999px;padding:.5rem .875rem;font-size:.875rem;font-weight:600}.settings__remove,.settings__remove-cancel{border:1px solid var(--border);color:var(--muted);background:0 0}.settings__remove:hover:not(:disabled){color:#b91c1c;border-color:#b91c1c}.settings__remove:disabled{cursor:not-allowed;opacity:.55}.settings__remove-confirm{color:#991b1b;background:#fee2e2;border:1px solid #b91c1c}.settings__note{color:var(--muted);margin:0;font-size:.875rem}.settings__add-task{flex-direction:column;gap:.5rem;display:flex}.settings__add-task-controls{flex-wrap:wrap;gap:.625rem;display:flex}.settings__add-task-controls input{flex:12rem}.settings__add-task button{border:1px solid var(--border);color:var(--text);font:inherit;cursor:pointer;background:0 0;border-radius:.5rem;padding:.6rem 1rem;font-weight:600}.settings__add-task button:hover:not(:disabled){border-color:var(--muted)}.settings__add-task button:disabled,.settings__save:disabled,.settings__cancel:disabled{cursor:not-allowed;opacity:.55}.settings__add-task-hint{color:var(--muted);margin:0;font-size:.875rem}.settings__footer{flex-wrap:wrap;align-items:center;gap:.75rem;display:flex}.settings__save,.settings__cancel{font:inherit;cursor:pointer;border-radius:999px;padding:.65rem 1.25rem;font-weight:700}.settings__save{background:var(--accent);color:#fff;border:none}.settings__save:hover:not(:disabled){background:#1d4ed8}.settings__cancel{border:1px solid var(--border);color:var(--muted);background:0 0}.settings__cancel:hover{border-color:var(--muted);color:var(--text)}@media (prefers-reduced-motion:reduce){.settings__back,.settings__icon-option,.settings__save,.settings__cancel,.settings__remove,.settings__remove-confirm,.settings__remove-cancel{transition:none}}:root{color:#1f2937;font-synthesis:none;text-rendering:optimizelegibility;--text:#1f2937;--muted:#64748b;--accent:#2563eb;--surface:#fff;--border:#dbe3ec;--success:#16a34a;--success-soft:#f0fdf4;--success-dark:#14532d;background:#f8fafc;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{min-width:20rem;min-height:100vh;margin:0}button,a{font:inherit}a:focus-visible{outline:3px solid color-mix(in srgb, var(--accent) 30%, transparent);outline-offset:3px;border-radius:.2rem}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
