:root{--green-50:#f4fdea;--green-100:#dff5c8;--green-200:#c3ec9b;--green-300:#9adf5c;--green-500:#58cc02;--green-700:#46a302;--green-900:#2f6d02;--n-0:#fff;--n-50:#f7f7f7;--n-100:#efefef;--n-200:#e5e5e5;--n-400:#9a9a9a;--n-600:#6f6f6f;--n-900:#3c3c3c;--blue:#1cb0f6;--blue-ink:#0d7fb5;--blue-bg:#e6f6fe;--red:#e63535;--red-bg:#ffe9e9;--orange:#d97a00;--orange-bg:#fff3dd;--gold:#ffc800;--gold-ink:#6b5200;--text:var(--n-900);--muted:var(--n-600);--border:var(--n-200);--bg:var(--n-50);--surface:var(--n-0);--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:24px;--space-6:32px;--radius:16px;--radius-sm:12px;--radius-pill:999px;--ease-out:cubic-bezier(.23, 1, .32, 1);--ease-in-out:cubic-bezier(.77, 0, .175, 1);--ease-drawer:cubic-bezier(.32, .72, 0, 1)}*{box-sizing:border-box}body{color:var(--text);background:var(--bg);margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Nunito,sans-serif}h1{margin:var(--space-1) 0 var(--space-2);font-size:1.6rem}h2{margin:var(--space-5) 0 var(--space-2);font-size:1.1rem}.app-shell{max-width:560px;min-height:100vh;margin:0 auto}.topbar{padding:var(--space-3) var(--space-4);background:var(--surface);border-bottom:2px solid var(--border);z-index:10;justify-content:space-between;align-items:center;display:flex;position:sticky;top:0}.brand{color:var(--green-700);font-size:1.1rem;font-weight:800;text-decoration:none}.topbar nav{gap:var(--space-2);display:flex}.topbar nav a{color:var(--muted);padding:var(--space-1) var(--space-3);border-radius:var(--radius-sm);font-weight:700;text-decoration:none}.topbar nav a.active{color:var(--green-700);background:var(--green-100)}.content{padding:var(--space-4)}.page{gap:var(--space-5);flex-direction:column;display:flex}.center-screen{min-height:100vh;padding:var(--space-4);justify-content:center;align-items:center;display:flex}.login-card{background:var(--surface);border:2px solid var(--border);border-radius:var(--radius);padding:var(--space-6) var(--space-5);text-align:center;gap:var(--space-3);flex-direction:column;width:100%;max-width:380px;display:flex}.login-mascot{font-size:64px}.btn{padding:var(--space-3) var(--space-5);cursor:pointer;text-align:center;transition:transform .14s var(--ease-out), box-shadow .14s var(--ease-out);color:var(--text);background:var(--surface);white-space:nowrap;border:none;border-radius:14px;font-size:.95rem;font-weight:800;text-decoration:none;display:inline-block}.btn:active{transform:translateY(2px)}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background:var(--green-500);color:var(--n-0);box-shadow:0 4px 0 var(--green-700)}.btn-primary:active{box-shadow:0 2px 0 var(--green-700)}.btn-secondary{background:var(--surface);color:var(--blue-ink);border:2px solid var(--border);box-shadow:0 4px 0 var(--border)}.btn-secondary:active{box-shadow:0 2px 0 var(--border)}.btn-ghost{color:var(--muted);background:0 0}.btn-ghost.danger{color:var(--red)}.btn-big{padding:var(--space-4) var(--space-5);width:100%;font-size:1.05rem}.btn-small{padding:var(--space-2) var(--space-3);font-size:.85rem}input,textarea,select{font:inherit;padding:var(--space-3);border:2px solid var(--border);border-radius:var(--radius-sm);background:var(--surface);width:100%;color:var(--text)}input:focus,textarea:focus,select:focus{border-color:var(--blue);outline:none}input[type=number]{width:auto}input[type=checkbox]{width:22px;height:22px;accent-color:var(--green-500)}label{gap:var(--space-1);flex-direction:column;font-size:.9rem;font-weight:700;display:flex}.label-text{margin-bottom:var(--space-1);font-size:.9rem;font-weight:700}.stack{gap:var(--space-4);flex-direction:column;display:flex}.row{gap:var(--space-2);align-items:center;display:flex}.row.wrap{flex-wrap:wrap}.row-between{justify-content:space-between;align-items:center;gap:var(--space-3);display:flex}.divider{color:var(--muted);margin:var(--space-1) 0;font-size:.85rem}.muted{color:var(--muted)}.small{font-size:.82rem}.error{color:var(--red);font-weight:700}.page h1,.page h2,.page>p{margin:0}.chores-section{gap:var(--space-3);flex-direction:column;display:flex}.chores-section>.row-between{flex-wrap:wrap}.chores-section>.row-between>.row{margin-left:auto}.select-inline{width:auto;padding:var(--space-2) var(--space-3);border-radius:var(--radius-pill);color:var(--muted);font-size:.85rem;font-weight:700}.challenge-card{background:linear-gradient(135deg, var(--green-500) 0%, var(--green-300) 100%);color:var(--n-0);border-radius:var(--radius);padding:var(--space-5);box-shadow:0 5px 0 var(--green-700);text-decoration:none;display:block}.challenge-card.done{background:linear-gradient(135deg, var(--gold) 0%, #ffde59 100%);color:var(--gold-ink);box-shadow:0 5px #e5a600}.challenge-label{text-transform:uppercase;letter-spacing:.05em;opacity:.9;font-size:.85rem;font-weight:800}.challenge-name{margin:var(--space-1) 0;font-size:1.5rem;font-weight:800}.challenge-sub{opacity:.9;font-size:.9rem}.stat{text-transform:uppercase;letter-spacing:.04em;border-radius:var(--radius-pill);padding:var(--space-1) var(--space-3);background:var(--n-100);color:var(--muted);white-space:nowrap;font-size:.8rem;font-weight:800}.stat-streak{background:var(--orange-bg);color:var(--orange)}.stat-streak.broken{background:var(--red-bg);color:var(--red)}.stat-pass{background:var(--blue-bg);color:var(--blue-ink)}.stat-pass.spent{background:var(--n-100);color:var(--muted)}.chore-list{gap:var(--space-2);flex-direction:column;display:flex}.chore-card{align-items:center;gap:var(--space-3);background:var(--surface);border:2px solid var(--border);border-radius:var(--radius);padding:var(--space-3) var(--space-4);color:inherit;transition:transform .14s var(--ease-out), border-color .15s ease;justify-content:space-between;text-decoration:none;display:flex}.chore-card:active{transform:scale(.98)}@media (hover:hover) and (pointer:fine){.chore-card:hover{border-color:var(--green-300)}}.chore-name{font-weight:800}.chore-card-reveal{animation:card-in .24s var(--ease-out) backwards;animation-delay:calc(min(var(--reveal-i), 6) * 40ms)}@keyframes card-in{0%{opacity:0;transform:translateY(6px)}}.chore-meta{gap:var(--space-2);margin-top:var(--space-1);flex-wrap:wrap;align-items:center;display:flex}.show-all{font:inherit;color:var(--blue-ink);cursor:pointer;padding:var(--space-2) 0 0;background:0 0;border:none;align-self:flex-start;font-size:.85rem;font-weight:800}.badge{padding:3px var(--space-2);border-radius:var(--radius-pill);text-transform:uppercase;font-size:.72rem;font-weight:800}.badge-overdue{background:var(--red-bg);color:var(--red)}.badge-due{background:var(--orange-bg);color:var(--orange)}.badge-ok{background:var(--green-100);color:var(--green-900)}.diff{letter-spacing:.06em;padding:2px var(--space-2);border-radius:var(--radius-pill);border:1.5px solid;font-size:.68rem;font-weight:800}.diff-low{color:var(--green-700)}.diff-medium{color:var(--orange)}.diff-high{color:var(--red)}.checklist{gap:var(--space-2);flex-direction:column;display:flex}.check-item{align-items:center;gap:var(--space-3);background:var(--surface);border:2px solid var(--border);border-radius:var(--radius-sm);padding:var(--space-3);cursor:pointer;flex-direction:row;font-weight:600;transition:background-color .18s,border-color .18s,color .18s;display:flex}.check-item:active{transform:scale(.99)}.check-item.checked{background:var(--green-100);border-color:var(--green-300);color:var(--green-900);text-decoration:line-through}.chip{border:2px solid var(--border);background:var(--surface);border-radius:var(--radius-pill);padding:var(--space-2) var(--space-3);cursor:pointer;font-size:.85rem;font-weight:700}.chip-on{background:var(--green-100);border-color:var(--green-300);color:var(--green-900)}.avatar{border-radius:50%;width:40px;height:40px}.panel{background:var(--surface);border:2px solid var(--border);border-radius:var(--radius);padding:var(--space-4);gap:var(--space-2);flex-direction:column;display:flex}.invite-box{background:var(--surface);border:2px dashed var(--blue);border-radius:var(--radius);padding:var(--space-4);gap:var(--space-2);flex-direction:column;display:flex}.invite-code{letter-spacing:.15em;color:var(--blue-ink);font-size:1.4rem;font-weight:800}.celebrate{text-align:center}.celebrate-emoji{animation:pop .5s var(--ease-out);font-size:80px}@keyframes pop{0%{opacity:0;transform:scale(.4)}60%{opacity:1;transform:scale(1.25)}to{transform:scale(1)}}.spinner{border:4px solid var(--border);border-top-color:var(--green-500);border-radius:50%;width:40px;height:40px;animation:.6s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.check-row{align-items:center;gap:var(--space-2);flex-direction:row}.check-row input[type=checkbox]{width:20px;height:20px;accent-color:var(--green-500);margin:0}.check-row span{font-weight:600}.composer{background:var(--surface);border:2px solid var(--border);border-radius:var(--radius);padding:var(--space-2) var(--space-3);transition:border-color .15s,box-shadow .15s}.composer.active{border-color:var(--green-300);box-shadow:0 4px 0 var(--border)}.composer-main{align-items:center;gap:var(--space-2);display:flex}.composer-plus{color:var(--muted);font-size:1.3rem;font-weight:800;line-height:1}.composer-main input{padding:var(--space-2) 0;border:none;font-weight:600}.composer-main input:focus{border:none}.composer-opts{gap:var(--space-1);padding:var(--space-2) 0 2px var(--space-5);border-top:1px dashed var(--border);margin-top:var(--space-1);flex-direction:column;display:flex}.tabs{gap:var(--space-1);display:flex}.tab{font:inherit;color:var(--muted);padding:var(--space-1) var(--space-3);border-radius:var(--radius-pill);cursor:pointer;background:0 0;border:none;font-size:.85rem;font-weight:800}.tab.active{background:var(--green-100);color:var(--green-900)}.task-group{gap:var(--space-2);flex-direction:column;display:flex}.task-group-head{text-transform:uppercase;letter-spacing:.06em;color:var(--muted);padding:0 var(--space-1);font-size:.75rem;font-weight:800}.task-group-head.toggle{width:100%;font:inherit;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);cursor:pointer;background:0 0;border:none;justify-content:space-between;align-items:center;font-size:.75rem;font-weight:800;display:flex}.link-danger{color:var(--red);cursor:pointer;font-weight:800}.task-list{background:var(--surface);border:2px solid var(--border);border-radius:var(--radius);overflow:hidden}.task-item+.task-item{border-top:1px solid var(--border)}.swipe-row{position:relative;overflow:hidden}.swipe-bg{align-items:center;gap:var(--space-2);padding:0 var(--space-4);color:var(--n-0);font-size:.9rem;font-weight:800;display:flex;position:absolute;inset:0}.swipe-bg.left-align{justify-content:flex-start}.swipe-bg.right-align{justify-content:flex-end}.swipe-bg .swipe-icon{font-size:1.1rem}.swipe-bg .swipe-label{opacity:.55;transition:opacity .15s}.swipe-bg.armed .swipe-label{opacity:1}.swipe-fg{background:var(--surface);position:relative}.task-row{align-items:center;gap:var(--space-3);padding:var(--space-3);background:var(--surface);display:flex}.task-row.open{background:var(--green-50)}.task-check{border:2px solid var(--border);background:var(--surface);width:26px;height:26px;color:var(--n-0);cursor:pointer;transition:background-color .15s ease, border-color .15s ease, transform .14s var(--ease-out);border-radius:50%;flex:none;font-size:.85rem;font-weight:900;line-height:1}.task-check:active{transform:scale(.94)}.task-check.on{background:var(--green-500);border-color:var(--green-500)}.task-main{text-align:left;font:inherit;cursor:pointer;background:0 0;border:none;flex-direction:column;flex:auto;align-items:flex-start;gap:3px;min-width:0;padding:0;display:flex}.task-title{font-weight:700}.task-row.done .task-title{color:var(--muted);font-weight:600;text-decoration:line-through}.task-meta{gap:var(--space-2);color:var(--muted);flex-wrap:wrap;align-items:center;font-size:.76rem;display:flex}.task-due{color:var(--blue-ink);font-weight:800}.task-due.late{color:var(--red)}.task-who{background:var(--bg);border-radius:var(--radius-pill);padding:1px var(--space-2);font-weight:700}.task-star{color:var(--border);cursor:pointer;padding:var(--space-1);background:0 0;border:none;flex:none;font-size:1.1rem}.task-star.on{color:var(--orange)}.task-detail{gap:var(--space-2);padding:var(--space-1) var(--space-3) var(--space-3) 48px;background:var(--green-50);opacity:1;transition:opacity .18s var(--ease-out), transform .18s var(--ease-out);flex-direction:column;display:flex;transform:translateY(0)}@starting-style{.task-detail{opacity:0;transform:translateY(-4px)}}.task-detail textarea{border-radius:var(--radius-sm)}.task-detail-row{gap:var(--space-1);flex-direction:column;display:flex}.empty-inbox{text-align:center;padding:var(--space-6) var(--space-4)}.empty-emoji{font-size:44px}.empty-title{margin-top:var(--space-1);font-weight:800}.undo-bar{left:50%;bottom:var(--space-5);z-index:50;align-items:center;gap:var(--space-4);color:var(--n-0);padding:var(--space-3) var(--space-4);border-radius:var(--radius-sm);opacity:1;max-width:calc(100% - 32px);transition:opacity .22s var(--ease-out), transform .22s var(--ease-out);background:#202020;font-size:.88rem;font-weight:600;display:flex;position:fixed;transform:translate(-50%);box-shadow:0 6px 20px #00000040}.undo-bar[data-state=closed]{opacity:0;transition-duration:.15s;transform:translate(-50%,8px)}@starting-style{.undo-bar{opacity:0;transform:translate(-50%,12px)}}.undo-btn{color:var(--green-300);font:inherit;text-transform:uppercase;cursor:pointer;background:0 0;border:none;font-weight:800}.tasks-strip{justify-content:space-between;align-items:center;gap:var(--space-3);background:var(--surface);border:2px solid var(--border);border-radius:var(--radius);padding:var(--space-3) var(--space-4);color:inherit;transition:transform .14s var(--ease-out), border-color .15s ease;text-decoration:none;display:flex}.tasks-strip:active{transform:scale(.98)}@media (hover:hover) and (pointer:fine){.tasks-strip:hover{border-color:var(--blue)}}.tasks-strip-title{font-weight:800}.tasks-strip-arrow{color:var(--muted);font-size:1.4rem;font-weight:800}.task-group-head .head-btn,.task-group-head .link-danger{font:inherit;cursor:pointer;color:inherit;background:0 0;border:none;padding:0}.task-group-head .link-danger{color:var(--red);font-weight:800}.pass-trigger{color:var(--blue-ink);align-self:center;font-size:.9rem;font-weight:700}.challenge-card.passed{background:linear-gradient(135deg, var(--blue) 0%, #6fd0ff 100%);box-shadow:0 5px 0 var(--blue-ink);color:var(--n-0)}.debt-banner{background:var(--orange-bg);border:2px solid var(--orange);border-radius:var(--radius);padding:var(--space-3) var(--space-4);font-size:.9rem;font-weight:600}.debt-banner.overdue{background:var(--red-bg);border-color:var(--red)}.makeup-list{gap:var(--space-2);flex-direction:column;display:flex}.makeup-card{border-left:6px solid var(--orange)}.sheet-backdrop{z-index:50;opacity:1;transition:opacity .26s var(--ease-out);background:#0006;justify-content:center;align-items:flex-end;display:flex;position:fixed;inset:0}.sheet-backdrop[data-state=closed]{opacity:0;transition-duration:.2s}@starting-style{.sheet-backdrop{opacity:0}}.sheet{background:var(--bg);border-radius:var(--radius) var(--radius) 0 0;width:100%;max-width:560px;padding:var(--space-2) var(--space-4) calc(var(--space-5) + env(safe-area-inset-bottom));gap:var(--space-3);max-height:88vh;transition:transform .26s var(--ease-drawer);flex-direction:column;display:flex;overflow-y:auto;transform:translateY(0)}.sheet[data-state=closed]{transition-duration:.2s;transform:translateY(100%)}@starting-style{.sheet{transform:translateY(100%)}}.sheet-handle{border-radius:var(--radius-pill);background:var(--border);width:44px;height:5px;margin-bottom:var(--space-1);align-self:center}.sheet-title{margin:0;font-size:1.25rem}.pass-options{gap:var(--space-2);flex-direction:column;display:flex}.pass-option{align-items:flex-start;gap:var(--space-3);text-align:left;background:var(--surface);border:2px solid var(--border);padding:var(--space-3) var(--space-4);font:inherit;color:inherit;cursor:pointer;border-radius:14px;display:flex}.pass-option.on{border-color:var(--blue);background:var(--blue-bg)}.pass-option:disabled{opacity:.5;cursor:not-allowed}.pass-option>span:last-child{flex-direction:column;gap:2px;display:flex}.pass-emoji{font-size:1.4rem;line-height:1.2}.pass-detail{background:var(--surface);border:2px solid var(--border);padding:var(--space-3) var(--space-4);gap:var(--space-2);border-radius:14px;flex-direction:column;display:flex}.swap-list{gap:var(--space-2);flex-direction:column;display:flex}.swap-item{justify-content:space-between;align-items:center;gap:var(--space-3);background:var(--surface);border:2px solid var(--border);border-radius:var(--radius-sm);padding:var(--space-3) var(--space-4);font:inherit;color:inherit;cursor:pointer;text-align:left;font-weight:700;display:flex}.swap-item.on{background:var(--green-100);border-color:var(--green-300);color:var(--green-900)}.pass-owed{background:var(--orange-bg);border-radius:var(--radius-sm);padding:var(--space-2) var(--space-3);font-size:.85rem;font-weight:600}.crash{align-items:center;gap:var(--space-4);text-align:center;flex-direction:column;max-width:340px;display:flex}.crash-emoji{font-size:44px}.crash h1{margin:0;font-size:1.4rem}.crash p{margin:0}.crash details{text-align:left;width:100%}.crash summary{cursor:pointer}.crash pre{white-space:pre-wrap;word-break:break-word;color:var(--muted);background:var(--n-100);padding:var(--space-3);border-radius:var(--radius-sm);margin:var(--space-2) 0 0;font-size:.72rem}.btn-danger{background:var(--red);color:var(--n-0);box-shadow:0 4px #b32020}.btn-danger:active{box-shadow:0 2px #b32020}.link-retry{font:inherit;color:var(--blue-ink);cursor:pointer;background:0 0;border:none;padding:0;text-decoration:underline}.offline-bar{background:var(--orange-bg);color:var(--orange);text-align:center;padding:var(--space-2) var(--space-4);border-bottom:2px solid var(--orange);font-size:.82rem;font-weight:700}.offline-note{background:var(--orange-bg);color:var(--orange);padding:var(--space-3);border-radius:var(--radius-sm);margin:0;font-size:.82rem;font-weight:700}.toast-error{background:var(--red)}.toast-error .undo-btn{color:var(--n-0)}.dialog{z-index:60;gap:var(--space-3);background:var(--surface);border-radius:var(--radius);width:calc(100% - 48px);max-width:340px;padding:var(--space-5);opacity:1;transition:opacity .2s var(--ease-out), transform .2s var(--ease-out);flex-direction:column;display:flex;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%)scale(1);box-shadow:0 12px 40px #00000040}.dialog[data-state=closed]{opacity:0;transition-duration:.15s;transform:translate(-50%,-50%)scale(.96)}@starting-style{.dialog{opacity:0;transform:translate(-50%,-50%)scale(.96)}}.dialog p{margin:0}.dialog-actions{gap:var(--space-2);margin-top:var(--space-2);display:flex}.dialog-actions .btn{flex:1}@media (prefers-reduced-motion:reduce){.btn:active,.chore-card:active,.tasks-strip:active,.check-item:active,.task-check:active{transform:none}.sheet,.sheet[data-state=closed]{transition:opacity .15s;transform:none}.sheet[data-state=closed]{opacity:0}@starting-style{.sheet{opacity:0}}.undo-bar,.undo-bar[data-state=closed]{transition:opacity .15s;transform:translate(-50%)}@starting-style{.undo-bar{transform:translate(-50%)}}.dialog,.dialog[data-state=closed]{transition:opacity .15s;transform:translate(-50%,-50%)}@starting-style{.dialog{transform:translate(-50%,-50%)}}.task-detail,.chore-card-reveal{transition:opacity .15s;animation:none;transform:none}@starting-style{.task-detail{transform:none}}.celebrate-emoji{animation:.2s fade-in}.spinner{animation-duration:1.2s}}@keyframes fade-in{0%{opacity:0}}
