.kid-view{--teal-50: #e1f5ee;--teal-100: #9fe1cb;--teal-400: #1d9e75;--teal-600: #0f6e56;--teal-800: #085041;--coral-50: #faece7;--coral-400: #d85a30;--coral-800: #712b13;--status-todo: #b4b2a9;--status-todo-bg: #f1efe8;--status-waiting: #ba7517;--status-waiting-bg: #faeeda;--status-done: #639922;--status-done-bg: #eaf3de;--jar-spending: #1d9e75;--jar-goal: #7f77dd;--jar-investment: #378add;--ink: #1b1b19;--ink-muted: #5f5e5a;--ink-faint: #888780;--line: #e4e2db;--error: #b3261e;--page: #f6faf8;--surface: #ffffff;--radius: 1rem;--radius-sm: .6rem;--shadow: 0 1px 2px rgba(16, 40, 34, .06), 0 4px 12px rgba(16, 40, 34, .05);--shadow-lift: 0 2px 4px rgba(16, 40, 34, .08), 0 8px 20px rgba(16, 40, 34, .08);--speed: .14s;font-family:system-ui,-apple-system,Segoe UI,sans-serif;color:var(--ink);background:var(--page);min-height:100vh;padding:1.25rem 1rem 3rem;margin:0 auto;max-width:26rem;box-sizing:border-box}.kid-view *,.kid-view *:before,.kid-view *:after{box-sizing:inherit}.kid-view h1{font-size:1.5rem;margin:0 0 .25rem}.kid-view h2{font-size:1rem;margin:0 0 .6rem}.kid-view p{margin:0}.kid-header{display:flex;align-items:center;justify-content:space-between;gap:.75rem;margin-bottom:1rem}.kid-tabs{display:flex;gap:.25rem;background:var(--teal-50);border-radius:999px;padding:.25rem;margin-bottom:1.25rem}.kid-tab{flex:1;border:0;background:transparent;color:var(--teal-800);font:inherit;font-size:.9rem;padding:.55rem .75rem;border-radius:999px;cursor:pointer;transition:background var(--speed),color var(--speed)}.kid-tab[aria-selected=true]{background:var(--surface);color:var(--teal-800);font-weight:600;box-shadow:var(--shadow)}.card{position:relative;display:block;width:100%;text-align:left;font:inherit;color:inherit;background:var(--surface);border:0;border-radius:var(--radius);padding:.85rem 1rem;box-shadow:var(--shadow);transition:box-shadow var(--speed),transform var(--speed),opacity var(--speed)}.card--todo{box-shadow:inset 4px 0 0 var(--status-todo),var(--shadow)}.card--waiting{box-shadow:inset 4px 0 0 var(--status-waiting),var(--shadow)}.card--done{box-shadow:inset 4px 0 0 var(--status-done),var(--shadow);opacity:.72}button.card{cursor:pointer}button.card:hover{box-shadow:inset 4px 0 0 var(--status-todo),var(--shadow-lift)}button.card:active{transform:scale(.985)}button.card:focus-visible{outline:2px solid var(--teal-400);outline-offset:2px}.card-row{display:flex;align-items:flex-start;justify-content:space-between;gap:.6rem}.card-title{font-weight:600;font-size:.98rem;line-height:1.3}.card--done .card-title{text-decoration:line-through;text-decoration-color:var(--status-todo)}.card-meta{font-size:.8rem;color:var(--ink-muted);margin-top:.3rem}.badge{flex:none;width:2rem;height:2rem;border-radius:50%;display:grid;place-items:center;font-size:1rem;line-height:1;background:var(--status-todo-bg)}.badge--waiting{background:var(--status-waiting-bg)}.badge--done{background:var(--status-done-bg)}.badge--todo:after{content:"";width:1.05rem;height:1.05rem;border-radius:50%;border:2px solid var(--status-todo)}.chip{display:inline-flex;align-items:center;gap:.3rem;font-size:.75rem;padding:.2rem .55rem;border-radius:999px;background:var(--teal-50);color:var(--teal-800);white-space:nowrap}.chip--money{background:var(--status-done-bg);color:#3b6d11;font-variant-numeric:tabular-nums}.card--group:before,.card--group:after{content:"";position:absolute;left:.5rem;right:.5rem;bottom:-4px;height:var(--radius);border-radius:var(--radius);background:var(--surface);box-shadow:var(--shadow);z-index:-1}.card--group:after{left:1rem;right:1rem;bottom:-8px}.card--group{z-index:0;margin-bottom:8px}.progress-bar{height:.5rem;border-radius:999px;background:var(--teal-50);overflow:hidden;margin-top:.5rem}.progress-fill{height:100%;border-radius:999px;background:var(--teal-400);transition:width .4s ease}.progress-fill--done{background:var(--status-done)}.ring{flex:none;width:2.75rem;height:2.75rem;border-radius:50%;display:grid;place-items:center;font-size:.72rem;font-weight:600;color:var(--teal-800);background:conic-gradient(var(--teal-400) var(--ring-turn, 0turn),var(--teal-50) 0)}.ring:after{content:attr(data-label);width:2.05rem;height:2.05rem;border-radius:50%;background:var(--surface);display:grid;place-items:center}.week-summary{background:var(--surface);border-radius:var(--radius);padding:1rem;box-shadow:var(--shadow);margin-bottom:1.25rem}.week-headline{display:flex;align-items:baseline;justify-content:space-between;gap:.5rem}.week-count{font-size:1.6rem;font-weight:600;font-variant-numeric:tabular-nums}.day-strip{display:grid;grid-template-columns:repeat(7,1fr);gap:.35rem;margin-top:.9rem;list-style:none;padding:0}.day-dot{display:grid;gap:.3rem;justify-items:center;font-size:.68rem;color:var(--ink-faint)}.day-dot span{width:100%;aspect-ratio:1;max-width:2rem;border-radius:.5rem;background:var(--status-todo-bg)}.day-dot--partial span{background:var(--status-waiting-bg)}.day-dot--done span{background:var(--status-done)}.day-dot--none span{background:transparent;border:1px dashed var(--line)}.day-dot--today{color:var(--teal-800);font-weight:700}.day-dot--today span{outline:2px solid var(--teal-400);outline-offset:2px}.streak-badge{display:inline-flex;align-items:center;gap:.35rem;background:var(--coral-50);color:var(--coral-800);border-radius:999px;padding:.35rem .7rem;font-size:.85rem;font-weight:600;white-space:nowrap}.streak-badge--quiet{background:var(--status-todo-bg);color:var(--ink-muted);font-weight:400}.week-grid{display:grid;grid-template-columns:repeat(13,minmax(0,1fr));gap:.3rem;list-style:none;padding:0;margin:0}.week-cell{aspect-ratio:1;border-radius:.3rem;background:var(--status-todo-bg);position:relative}.week-cell--complete{background:var(--status-done)}.week-cell--forced{background:var(--status-done-bg);box-shadow:inset 0 0 0 2px var(--coral-400)}.week-cell--incomplete{background:var(--status-todo-bg)}.week-cell--empty{background:transparent;box-shadow:inset 0 0 0 1px var(--line)}.week-cell--current{outline:2px solid var(--teal-400);outline-offset:1px}.legend{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:.75rem;font-size:.75rem;color:var(--ink-muted)}.legend-item{display:inline-flex;align-items:center;gap:.3rem}.legend-swatch{width:.75rem;height:.75rem;border-radius:.25rem}.jar{position:relative;overflow:hidden;isolation:isolate}.jar-fill{position:absolute;left:0;right:0;bottom:0;background:var(--jar-tint, var(--teal-50));transition:height .4s ease;z-index:-1}.jar--spending{--jar-accent: var(--jar-spending);--jar-tint: #e1f5ee}.jar--goal{--jar-accent: var(--jar-goal);--jar-tint: #eeedfe}.jar--investment{--jar-accent: var(--jar-investment);--jar-tint: #e6f1fb}.jar-amount{font-weight:600;font-variant-numeric:tabular-nums}.jar-dot{display:inline-block;width:.6rem;height:.6rem;border-radius:50%;background:var(--jar-accent, var(--teal-400));margin-right:.4rem;vertical-align:middle}.stack{display:grid;gap:.6rem;list-style:none;padding:0;margin:0}.section{margin-top:1.5rem}.kid-layout{display:grid;gap:1.5rem}.kid-layout>aside{order:-1}.section-heading{display:flex;align-items:baseline;justify-content:space-between;gap:.5rem;margin-bottom:.6rem}.muted{color:var(--ink-muted);font-size:.88rem}.error{color:var(--error);font-size:.85rem}.kid-view button.plain{font:inherit;font-size:.85rem;border:1px solid var(--line);background:var(--surface);color:var(--ink);border-radius:999px;padding:.45rem .9rem;cursor:pointer;transition:background var(--speed)}.kid-view button.plain:hover{background:var(--teal-50)}@keyframes pop{0%{transform:scale(1)}45%{transform:scale(1.04)}to{transform:scale(1)}}.celebrate{animation:pop .38s ease}@media (min-width: 640px){.kid-view{max-width:44rem;padding:2rem 1.5rem 3rem}.stack{grid-template-columns:repeat(auto-fill,minmax(15rem,1fr));gap:.75rem}.week-grid{grid-template-columns:repeat(26,minmax(0,1fr))}}@media (min-width: 1024px){.kid-view{max-width:64rem}.kid-layout{grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:2rem;align-items:start}.kid-layout>main{grid-column:1;grid-row:1}.kid-layout>aside{grid-column:2;grid-row:1;order:0;position:sticky;top:2rem}.kid-layout .stack{grid-template-columns:repeat(auto-fill,minmax(14rem,1fr))}.kid-layout>aside .stack{grid-template-columns:1fr}}@media (prefers-reduced-motion: reduce){.kid-view *,.kid-view *:before,.kid-view *:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}
