/* Task Treats v12 · Kids mode. Everything is scoped under #kids (and .kids-entry), so the adult app's styles never change. */
html.kids-on, html.kids-on body{overflow:hidden}
html.kids-on #app{visibility:hidden}
#kids{position:fixed;inset:0;z-index:9000;background:#F7F3EC;color:#2C2A26;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;
  font-family:-apple-system,"SF Pro Rounded",ui-rounded,BlinkMacSystemFont,system-ui,sans-serif,"Noto Color Emoji";-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
#kids input{-webkit-user-select:text;user-select:text}
#kids button{font-family:inherit;color:inherit;border:0;background:none;cursor:pointer;-webkit-tap-highlight-color:transparent}
#kids img{-webkit-user-drag:none;pointer-events:none}
.kd-screen{min-height:100%;max-width:560px;margin:0 auto;padding:calc(12px + env(safe-area-inset-top,0px)) 20px calc(130px + env(safe-area-inset-bottom,0px));position:relative}

/* top bar */
.kd-top{display:flex;align-items:center;gap:12px;margin:4px 0 6px}
.kd-av{width:56px;height:56px;border-radius:50%;background:#F6E3D9;display:grid;place-items:center;font-size:32px;flex:none}
.kd-hi{font-weight:800;font-size:24px;letter-spacing:-.4px;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.kd-chip{min-height:44px;padding:0 14px;border-radius:22px!important;background:#E3EDE6!important;font-size:16px;color:#3E5E4C!important}
.kd-lock{width:48px;height:48px;border-radius:50%;background:#FFFCF7!important;display:grid;place-items:center;position:relative;opacity:.55;box-shadow:0 1px 3px #0000000f}
.kd-lock img{width:24px;height:24px}

/* hold ring (❤️ 🎁 🔒): --p sweeps 0→100% while held */
@property --p{syntax:'<percentage>';inherits:false;initial-value:0%}
@keyframes kd-ringc{from{--p:0%}to{--p:100%}}
.ring{position:absolute;inset:-8px;border-radius:50%;pointer-events:none;--p:0%;background:conic-gradient(#fff var(--p),#ffffff33 0);
  -webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 7px),#000 calc(100% - 6px));mask:radial-gradient(farthest-side,transparent calc(100% - 7px),#000 calc(100% - 6px))}
.holding .ring{animation:kd-ringc var(--hold,1200ms) linear forwards}
.kd-lock .ring{inset:-3px;background:conic-gradient(#B96A4C var(--p),transparent 0)}
.kd-lock.holding{opacity:1}

/* Treat Jar */
.kd-jar{position:relative;width:212px;height:268px;margin:10px auto 0}
.kd-lid{position:absolute;top:0;left:26px;width:160px;height:64px;border-radius:18px;background:#FFFCF7;box-shadow:0 4px 14px #2C2A2614;display:grid;place-items:center;overflow:hidden;z-index:2}
.kd-lidpic{width:100%;height:100%;object-fit:cover;object-position:50% 55%}
.kd-lidpic.emo,.kd-goalpic.emo,.kd-tpic.emo,.kp-mini.emo{display:grid;place-items:center;font-size:40px;width:auto;height:auto}
.kd-glass{position:absolute;top:56px;left:0;width:212px;height:212px;border-radius:40px 40px 58px 58px;background:#ffffffa6;border:4px solid #ECE5DA;overflow:hidden}
.kd-fill{position:absolute;left:0;right:0;bottom:0;background:linear-gradient(#F6E3D900,#F6E3D9);transition:height .6s cubic-bezier(.2,.8,.2,1)}
.kd-shine{position:absolute;top:18px;left:16px;width:14px;height:110px;border-radius:8px;background:#ffffffb0}
.kd-st{position:absolute;font-size:34px;line-height:1;transform:rotate(var(--r))}
.kd-st.drop{animation:kd-drop .9s cubic-bezier(.3,1.4,.5,1) both}
@keyframes kd-drop{0%{transform:translateY(-240px) rotate(0) scale(1.5);opacity:0}25%{opacity:1}70%{transform:translateY(6px) rotate(var(--r)) scale(1)}100%{transform:translateY(0) rotate(var(--r))}}
.kd-dots{display:flex;justify-content:center;gap:8px;margin:14px 0 16px}
.kd-dots i{width:12px;height:12px;border-radius:50%;background:#ECE5DA;transition:background .3s}.kd-dots i.on{background:#B96A4C}

/* Little Path */
.kd-path{position:relative;width:340px;margin:8px auto 0}
.kd-path svg{position:absolute;inset:0}
.kd-stone{position:absolute;width:52px;height:52px;border-radius:50%;background:#FFFCF7;box-shadow:0 2px 8px #2C2A2614;display:grid;place-items:center;font-size:28px}
.kd-stone img{width:32px;height:32px;opacity:.55}.kd-stone.on{background:#F6E3D9}
.kd-goal{position:absolute;width:80px;height:80px;border-radius:24px;background:#FFFCF7;box-shadow:0 6px 18px #2C2A261f;overflow:hidden;display:grid;place-items:center}
.kd-goalpic{width:100%;height:100%;object-fit:cover}
.kd-me{position:absolute;font-size:40px;animation:kd-bob 1.6s ease-in-out infinite}
@keyframes kd-bob{50%{transform:translateY(-6px)}}

/* chore tiles */
.kd-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.kd-tile{position:relative;background:#FFFCF7!important;border-radius:24px!important;min-height:112px;padding:14px 8px 12px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;
  box-shadow:0 1px 2px #0000000d,0 8px 24px #2C2A260f;transition:transform .15s}
.kd-tile:active{transform:scale(.96)}
.kd-tile img{width:58px;height:58px}
.kd-tile span{font-weight:650;font-size:15px;color:#4A4540}
.kd-tile.done{background:#EEF4F0!important}.kd-tile.done img{opacity:.35;filter:grayscale(.6)}
.kd-tile em{position:absolute;top:8px;right:10px;font-style:normal;font-size:28px}

/* mic */
.kd-micbar{position:fixed;left:0;right:0;bottom:calc(18px + env(safe-area-inset-bottom,0px));display:flex;flex-direction:column;align-items:center;gap:6px;pointer-events:none}
.kd-mic{pointer-events:auto;width:76px;height:76px;border-radius:50%!important;background:#2C2A26!important;display:grid;place-items:center;box-shadow:0 8px 24px #2C2A2640}
.kd-mic img{width:36px;height:36px;filter:brightness(10)}
.kd-mic.on{background:#B96A4C!important;animation:kd-pulse 1s ease-in-out infinite}
@keyframes kd-pulse{50%{box-shadow:0 0 0 14px #B96A4C33}}
.kd-miclbl{font-weight:700;font-size:14px;color:#6E675F;background:#F7F3ECdd;padding:2px 10px;border-radius:10px}
.kd-toast{position:fixed;left:50%;bottom:calc(120px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);z-index:5;animation:kd-up .25s ease-out}
.kd-toast.undo{left:calc(50% + 92px);bottom:calc(28px + env(safe-area-inset-bottom,0px))}
.kd-undo{width:64px;height:64px;border-radius:50%!important;background:#FFFCF7!important;font-size:32px;box-shadow:0 6px 18px #2C2A2626}
.kd-ear{display:block;font-size:40px;background:#FFFCF7;border-radius:24px;padding:8px 18px;box-shadow:0 6px 18px #2C2A2626;animation:kd-shake .5s}
@keyframes kd-up{from{transform:translate(-50%,16px);opacity:0}}
@keyframes kd-shake{25%{transform:translateX(-6px)}75%{transform:translateX(6px)}}

/* Show & Glow */
.kd-glow{background:radial-gradient(circle at 50% 36%,#F6D3BF 0,#E8A985 70%,#D98E6E 100%);min-height:100vh;min-height:100dvh;max-width:none;display:flex;flex-direction:column;align-items:center;color:#fff;padding-bottom:40px}
.kd-x{position:absolute;top:calc(12px + env(safe-area-inset-top,0px));left:14px;width:48px;height:48px;border-radius:50%!important;background:#ffffff33!important;color:#fff!important;font-size:22px;font-weight:700}
.kd-garden .kd-x,.kd-pin .kd-x{background:#2C2A260d!important;color:#2C2A26!important;font-size:28px}
.kd-show{margin-top:12vh;font-weight:800;font-size:28px;text-shadow:0 1px 8px #B96A4C55}
.kd-halo{margin-top:22px;width:300px;height:300px;border-radius:50%;background:#ffffff26;display:grid;place-items:center;box-shadow:0 0 0 22px #ffffff1a;animation:kd-glow 2.2s ease-in-out infinite}
@keyframes kd-glow{50%{box-shadow:0 0 0 34px #ffffff10,0 0 80px #fff6}}
.kd-orb{width:236px;height:236px;border-radius:50%;background:#FFFCF7;display:grid;place-items:center}
.kd-orb img{width:140px;height:140px}
.kd-what{margin-top:28px;font-weight:800;font-size:32px;letter-spacing:-.3px;text-align:center}
.kd-heartwrap{margin-top:auto;padding-top:28px;display:flex;flex-direction:column;align-items:center;gap:10px}
.kd-heart{position:relative;width:116px;height:116px;border-radius:50%!important;background:#FFFCF7!important;display:grid;place-items:center;box-shadow:0 0 0 10px #ffffff40;transition:transform .2s}
.kd-heart.holding{transform:scale(1.08)}
.kd-hint{font-weight:700;font-size:15px;opacity:.95}

/* treat earned */
.kd-treat{display:flex;flex-direction:column;align-items:center;text-align:center;background:radial-gradient(circle at 50% 20%,#FFF6E8,#F7F3EC 60%)}
.kd-burst{font-size:52px;margin-top:4px;animation:kd-bob 1.4s ease-in-out infinite}
.kd-tframe{width:220px;height:220px;border-radius:44px;overflow:hidden;background:#FFFCF7;box-shadow:0 18px 40px #B96A4C33;display:grid;place-items:center;animation:kd-pop .6s cubic-bezier(.3,1.5,.5,1) both}
.kd-tpic{width:100%;height:100%;object-fit:cover}.kd-tpic.emo{font-size:120px}
@keyframes kd-pop{from{transform:scale(.4);opacity:0}}
.kd-tname{font-weight:800;font-size:30px;margin:14px 0 0}
.kd-treat .kd-jar{transform:scale(.55);margin:-50px auto -70px}
.kd-treat .kd-hint{color:#6E675F}
.kd-heart.gift{background:#B96A4C!important;box-shadow:0 0 0 10px #B96A4C26}
.kd-heart.gift .ring{background:conic-gradient(#B96A4C var(--p),#B96A4C22 0)}
.kd-treat .kd-heart.gift{font-size:52px}

/* garden */
.kd-garden{text-align:center;display:flex;flex-direction:column;align-items:center;background:linear-gradient(#EAF2F6,#F7F3EC 55%)}
.kd-gtitle{margin-top:20px;width:96px;height:96px;border-radius:30px;background:#FFFCF7;display:grid;place-items:center;font-size:56px;box-shadow:0 8px 22px #2C2A2614}
.kd-plant{margin-top:24px;line-height:1;transition:font-size .5s}
.kd-plant.s0{font-size:40px}.kd-plant.s1{font-size:80px}.kd-plant.s2{font-size:110px}.kd-plant.s3{font-size:140px}.kd-plant.s4{font-size:170px;animation:kd-pop .7s both}
.kd-soil{width:220px;height:28px;border-radius:50%;background:#C9A88A;margin-top:-6px}
.kd-drops{display:flex;flex-wrap:wrap;justify-content:center;gap:4px;max-width:320px;margin-top:22px}
.kd-drops i{font-style:normal;font-size:24px;opacity:.18;filter:grayscale(1)}.kd-drops i.on{opacity:1;filter:none}
.kd-who{display:flex;gap:14px;justify-content:center;margin-top:18px;font-size:22px;font-weight:700}
.kd-bloom{margin-top:16px;font-size:44px}

/* PIN */
.kd-pin{display:flex;flex-direction:column;align-items:center}
.kd-pinlock{width:48px;height:48px;margin-top:10vh}
.kd-pindots{display:flex;gap:16px;margin:24px 0 30px}.kd-pindots i{width:16px;height:16px;border-radius:50%;border:2px solid #2C2A26}.kd-pindots i.on{background:#2C2A26}
.kd-pindots.bad{animation:kd-shake .4s}
.kd-pad{display:grid;grid-template-columns:repeat(3,76px);gap:16px}
.kd-pad button{width:76px;height:76px;border-radius:50%!important;background:#FFFCF7!important;font-size:28px;font-weight:600;box-shadow:0 1px 3px #0000000f}

/* confetti */
.kd-conf{position:fixed;top:-12px;width:9px;height:14px;border-radius:3px;z-index:20;pointer-events:none;animation:kd-fall 1.6s cubic-bezier(.3,.6,.5,1) forwards}
@keyframes kd-fall{to{transform:translate(var(--dx),105vh) rotate(540deg)}}
@media (prefers-reduced-motion: reduce){#kids *{animation:none!important;transition:none!important}}

/* ---------- parent hub + setup ---------- */
.kd-hub,.kd-setup{padding-bottom:calc(110px + env(safe-area-inset-bottom,0px))}
.kp-head{display:flex;align-items:center;gap:6px;margin:0 0 14px}
.kp-back{width:44px;height:44px;font-size:32px!important;line-height:1;margin-left:-10px;color:#6E675F!important}
.kp-h{font-family:Fraunces,Georgia,serif;font-size:30px;flex:1}
.kp-steps{display:flex;gap:6px}.kp-steps i{width:22px;height:5px;border-radius:3px;background:#ECE5DA}.kp-steps i.on{background:#B96A4C}
.kp-sec{font-weight:700;font-size:13px;letter-spacing:.4px;text-transform:uppercase;color:#857E76;margin:22px 4px 8px}
.kp-card,.kp-kid{background:#FFFCF7;border-radius:20px;padding:14px;box-shadow:0 2px 12px #2C2A260f}
.kp-kids{display:flex;flex-direction:column;gap:10px}
.kp-kid,.kp-garden{display:flex;align-items:center;gap:12px}
.kp-av{width:52px;height:52px;border-radius:50%;background:#F6E3D9;display:grid;place-items:center;font-size:30px;flex:none}
.kp-meta{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}.kp-meta b{font-size:18px}.kp-meta span{font-size:14px;color:#6E675F;display:flex;align-items:center;gap:6px}
.kp-mini{width:22px;height:22px;border-radius:6px;object-fit:cover}.kp-mini.emo{font-size:18px}
.kp-edit{width:44px;height:44px;border-radius:50%!important;font-size:20px;color:#857E76!important}
.kp-go{min-height:44px;padding:0 18px;border-radius:22px!important;background:#2C2A26!important;color:#fff!important;font-weight:700;white-space:nowrap}
.kp-go.soft{background:#F3E0D6!important;color:#2C2A26!important;padding:0 14px}
.kp-add{min-height:64px;border-radius:20px!important;border:2px dashed #E0D6C8!important;color:#857E76!important;font-weight:700;font-size:17px}
.kp-small{font-size:14px;color:#6E675F;line-height:1.4}.grow{flex:1}
.kp-gemo{font-size:34px}
.kp-goals{display:flex;gap:8px;margin-top:12px;flex-wrap:wrap}
.kp-goal{width:48px;height:48px;border-radius:14px!important;background:#F7F3EC!important;font-size:26px}.kp-goal.on{background:#E3EDE6!important;box-shadow:inset 0 0 0 2px #557A66}
.kp-row{display:flex;align-items:center;gap:8px;margin-top:10px}
.kp-in{min-height:44px;border:1.5px solid #E8E0D4;border-radius:14px;padding:0 12px;background:#fff;font-size:16px;min-width:0;width:130px}
.kp-in.big{width:100%;min-height:58px;font-size:22px;font-weight:700;border-radius:18px}
.kp-body .kp-in:not(.big){width:100%;margin-top:14px}
.kp-av-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:16px}
.kp-avb{aspect-ratio:1;border-radius:22px!important;background:#FFFCF7!important;font-size:38px;box-shadow:0 1px 3px #0000000d}
.kp-avb.on,.kp-treat.on,.kp-ch.on,.kp-mode.on{box-shadow:inset 0 0 0 3px #B96A4C,0 4px 14px #B96A4C22!important;background:#FFF6F0!important}
.kp-treats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.kp-treat{aspect-ratio:1;border-radius:22px!important;background:#FFFCF7!important;overflow:hidden;display:grid;place-items:center;font-size:44px;box-shadow:0 1px 3px #0000000d;position:relative;cursor:pointer}
.kp-treat img{width:100%;height:100%;object-fit:cover}
.kp-treat.photo{border:2px dashed #E0D6C8}
.kp-count{font-size:40px;font-weight:800;text-align:center;color:#B96A4C;margin-bottom:10px}.kp-count span{font-size:18px;color:#857E76;font-weight:600}.kp-count.ok{color:#557A66}
.kp-chores{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.kp-ch{border-radius:20px!important;background:#FFFCF7!important;padding:12px 4px 10px;display:flex;flex-direction:column;align-items:center;gap:6px;box-shadow:0 1px 3px #0000000d;min-height:96px}
.kp-ch img{width:44px;height:44px}.kp-ch span{font-size:13px;font-weight:600;color:#4A4540;text-align:center}
.kp-modes{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.kp-mode{border-radius:22px!important;background:#FFFCF7!important;padding:18px 12px;display:flex;flex-direction:column;align-items:center;gap:6px;text-align:center;box-shadow:0 1px 3px #0000000d;min-height:120px}
.kp-mode b{font-size:16px}.kp-mode span{font-size:13px;color:#6E675F}.kp-mode .kp-mi{font-size:36px;color:inherit}
.kp-foot{position:fixed;left:0;right:0;bottom:0;padding:12px 20px calc(16px + env(safe-area-inset-bottom,0px));background:linear-gradient(#F7F3EC00,#F7F3EC 30%);display:flex;gap:10px;justify-content:center}
.kp-next{flex:1;max-width:520px;min-height:58px;border-radius:29px!important;background:#B96A4C!important;color:#fff!important;font-weight:800;font-size:19px}
.kp-next:disabled{opacity:.35}
.kp-del{min-height:58px;padding:0 20px;border-radius:29px!important;background:#EFE8DC!important;color:#9A4A3A!important;font-weight:700}
.kd-hub .kd-toast{background:#2C2A26;color:#fff;padding:10px 18px;border-radius:20px;font-weight:700}
.kd-heart svg{width:58px;height:58px;filter:drop-shadow(0 3px 6px #E2504A44)}.kd-heart img{width:60px;height:60px}
.kp-edit{font-size:20px}