:root{--paper: #fbf7ec;--paper-2: #f4eddb;--card: #fffdf6;--ink: #2b302e;--ink-soft: #5a615e;--ink-faint: #9aa19d;--line: #d9d2c0;--teal: #2ba597;--teal-tint: #d7efea;--green: #86b53a;--green-tint: #e6efd2;--yellow: #f0cf3a;--yellow-tint: #fbf3cc;--orange: #e5713b;--orange-tint: #fbe2d4;--blue: #4a9fd3;--blue-tint: #dbecf7;--pink: #e0687f;--pink-tint: #f9dde3;--bg: var(--paper);--surface: var(--card);--text: var(--ink);--text-soft: var(--ink-soft);--border: var(--line);--accent: var(--teal);--accent-tint: var(--teal-tint);--danger: #b8452f;--font-display: "Avenir Next Rounded", "Nunito", "Segoe UI", system-ui, sans-serif;--font-body: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;--radius: 14px;--radius-sm: 8px;--shadow: 0 1px 0 var(--line), 0 6px 18px rgba(43, 48, 46, .06);--size-xs: .85rem;--size-sm: .95rem;--size-md: 1.05rem;--size-lg: 1.3rem;--size-xl: 1.7rem;--size-2xl: 2.2rem;--stroke: 2.5px}*{box-sizing:border-box}html,body,#root{min-height:100%}body{margin:0;background:var(--bg);color:var(--text);font-family:var(--font-body);font-size:var(--size-md);line-height:1.45;-webkit-font-smoothing:antialiased}h1,h2,h3{font-family:var(--font-display);line-height:1.15;margin:0}h1{font-size:var(--size-2xl)}h2{font-size:var(--size-xl)}h3{font-size:var(--size-lg)}p{margin:0}a{color:inherit}button,input,select,textarea{font:inherit;color:inherit}.app{max-width:720px;margin:0 auto;padding:16px 16px 96px}.topbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:20px}.topbar .brand{font-family:var(--font-display);font-weight:800;font-size:var(--size-lg);letter-spacing:-.01em;display:inline-flex;align-items:center;gap:8px;text-decoration:none}.topbar nav{display:flex;gap:8px}.stack{display:grid;gap:12px}.row{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.spread{display:flex;align-items:center;justify-content:space-between;gap:10px}.muted{color:var(--text-soft)}.small{font-size:var(--size-sm)}.eyebrow{font-size:var(--size-xs);text-transform:uppercase;letter-spacing:.08em;color:var(--text-soft);font-weight:700}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:var(--stroke) solid var(--ink);border-radius:999px;background:var(--surface);color:var(--ink);padding:10px 18px;font-weight:700;cursor:pointer;transition:transform .12s ease,background .12s ease;text-decoration:none;min-height:44px}.btn:active{transform:scale(.96)}.btn.primary{background:var(--ink);color:var(--paper)}.btn.accent{background:var(--accent);border-color:var(--accent);color:#fff}.btn.quiet{border-color:transparent;background:transparent}.btn.small{padding:6px 12px;min-height:36px;font-size:var(--size-sm)}.btn:disabled{opacity:.45;cursor:default;transform:none}.btn.block{width:100%}.card{background:var(--surface);border:var(--stroke) solid var(--ink);border-radius:var(--radius);padding:16px;box-shadow:var(--shadow)}.card.soft{border-color:var(--border);box-shadow:none}.card.tint-teal{background:var(--teal-tint)}.card.tint-green{background:var(--green-tint)}.card.tint-yellow{background:var(--yellow-tint)}.card.tint-orange{background:var(--orange-tint)}.card.tint-blue{background:var(--blue-tint)}.card.tint-pink{background:var(--pink-tint)}.field{display:grid;gap:6px}.field label{font-weight:700;font-size:var(--size-sm)}.input{border:var(--stroke) solid var(--ink);border-radius:var(--radius-sm);background:var(--surface);padding:10px 12px;min-height:44px;width:100%}.input:focus{outline:3px solid var(--accent-tint)}.hint{color:var(--text-soft);font-size:var(--size-xs)}.branch{margin-top:28px}.branch-head{display:flex;align-items:baseline;gap:10px;margin-bottom:10px}.branch-head .swatch{width:14px;height:14px;border-radius:4px;border:var(--stroke) solid var(--ink);transform:rotate(-6deg)}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}.skill-card{display:grid;gap:8px;align-content:start;min-height:118px;padding:12px;border-radius:var(--radius);border:var(--stroke) dashed var(--ink-faint);background:transparent;color:inherit;text-decoration:none;cursor:pointer;text-align:left;transition:transform .12s ease}.skill-card:active{transform:scale(.97)}.skill-card .title{font-family:var(--font-display);font-weight:800;font-size:var(--size-md)}.skill-card.started{border-style:solid;border-color:var(--ink);background:var(--surface);box-shadow:var(--shadow)}.skill-card.owned{border-style:solid;border-color:var(--ink)}.skill-card.owned.c-teal{background:var(--teal-tint)}.skill-card.owned.c-green{background:var(--green-tint)}.skill-card.owned.c-yellow{background:var(--yellow-tint)}.skill-card.owned.c-orange{background:var(--orange-tint)}.skill-card.owned.c-blue{background:var(--blue-tint)}.skill-card.owned.c-pink{background:var(--pink-tint)}.skill-card.adult:after{content:"with a grown-up";font-size:var(--size-xs);color:var(--text-soft)}.chip{display:inline-flex;align-items:center;gap:6px;font-size:var(--size-xs);font-weight:700;padding:3px 9px;border-radius:999px;border:2px solid var(--ink);background:var(--surface);width:fit-content}.chip.s-not_started{border-color:var(--ink-faint);color:var(--text-soft)}.chip.s-learning{background:var(--yellow-tint)}.chip.s-with_help{background:var(--blue-tint)}.chip.s-mostly{background:var(--orange-tint)}.chip.s-independent{background:var(--ink);color:var(--paper)}.chip.s-can_teach{background:var(--teal);border-color:var(--teal);color:#fff}.ladder{display:grid;grid-template-columns:repeat(6,1fr);gap:4px}.ladder .rung{height:10px;border:2px solid var(--ink);border-radius:4px;background:var(--surface)}.ladder .rung.on{background:var(--ink)}.ladder-labels{display:flex;justify-content:space-between;font-size:var(--size-xs);color:var(--text-soft);margin-top:4px}.cando{font-family:var(--font-display);font-weight:800;font-size:var(--size-xl)}.steps{list-style:none;padding:0;margin:0;display:grid;gap:10px;counter-reset:step}.steps li{display:grid;grid-template-columns:34px 1fr;gap:10px;align-items:start}.steps li:before{counter-increment:step;content:counter(step);width:30px;height:30px;border-radius:50%;border:var(--stroke) solid var(--ink);display:grid;place-items:center;font-weight:800;font-family:var(--font-display);background:var(--surface)}.banner{border:var(--stroke) solid var(--orange);background:var(--orange-tint);border-radius:var(--radius-sm);padding:10px 12px;font-weight:700}.privilege{border-left:6px solid var(--yellow);background:var(--yellow-tint);padding:10px 12px;border-radius:var(--radius-sm)}.actions{display:grid;grid-template-columns:1fr 1fr;gap:10px}@media(max-width:420px){.actions{grid-template-columns:1fr}}.avatar{width:44px;height:44px;border-radius:50%;border:var(--stroke) solid var(--ink);display:grid;place-items:center;font-family:var(--font-display);font-weight:800;font-size:var(--size-lg)}.avatar.c-teal{background:var(--teal);color:#fff}.avatar.c-green{background:var(--green);color:#fff}.avatar.c-orange{background:var(--orange);color:#fff}.avatar.c-blue{background:var(--blue);color:#fff}.avatar.c-yellow{background:var(--yellow);color:var(--ink)}.avatar.c-pink{background:var(--pink);color:#fff}.avatar.big{width:72px;height:72px;font-size:var(--size-2xl)}.profile-row{display:flex;align-items:center;gap:12px;padding:12px;border-radius:var(--radius);border:var(--stroke) solid var(--ink);background:var(--surface);text-decoration:none;cursor:pointer;width:100%;text-align:left}.profile-row.active{background:var(--accent-tint)}.stat{display:grid;gap:2px}.stat .num{font-family:var(--font-display);font-weight:800;font-size:var(--size-2xl);line-height:1}.check-row{display:grid;grid-template-columns:28px 1fr auto;gap:10px;align-items:center;padding:8px 0;border-bottom:1px solid var(--border)}.check-row input[type=checkbox]{width:22px;height:22px;accent-color:var(--ink)}.check-row .privilege-input{grid-column:2 / -1}.pin{letter-spacing:.5em;text-align:center;font-size:var(--size-xl)}.tabbar{position:fixed;left:0;right:0;bottom:0;background:var(--surface);border-top:var(--stroke) solid var(--ink);display:flex;justify-content:space-around;padding:8px 8px calc(8px + env(safe-area-inset-bottom))}.tabbar a{display:grid;justify-items:center;gap:2px;text-decoration:none;font-size:var(--size-xs);font-weight:700;color:var(--text-soft);padding:4px 10px;border-radius:var(--radius-sm)}.tabbar a.active{color:var(--ink);background:var(--accent-tint)}.tabbar svg{width:24px;height:24px}.empty{text-align:center;padding:40px 16px;display:grid;gap:12px;justify-items:center}.door{width:120px;height:120px}@media(prefers-reduced-motion:reduce){.btn,.skill-card{transition:none}.btn:active,.skill-card:active{transform:none}}.steps li:before{content:none}.step-tick{width:30px;height:30px;border-radius:50%;border:var(--stroke) solid var(--ink);display:grid;place-items:center;font-weight:800;font-family:var(--font-display);background:var(--surface);cursor:pointer;padding:0}.steps li.done .step-tick{background:var(--ink);color:var(--paper)}.steps li.done span{color:var(--text-soft);text-decoration:line-through}details.card>summary{cursor:pointer;font-weight:800;font-family:var(--font-display);list-style:none}details.card>summary::-webkit-details-marker{display:none}details.card[open]>summary{margin-bottom:12px}.chip.new{background:var(--yellow);border-color:var(--ink)}.danger{color:var(--danger);border-color:var(--danger)}
