/* MatchApp Ai KIDS — playful layer (2026-10-24). Additive only.
   Safety: purely visual. No allowlist, age band, guardian or filtering logic here.
   Motion: compositor-only (transform/opacity), a handful of elements, and ONLY when
   prefers-reduced-motion is no-preference, the Pause magic toggle is off and no
   .reduce-motion class is set. Everything else keeps the 2026-09-21 stability lock. */
:root{--kp-yellow:#ffd65c;--kp-pink:#ff8fc8;--kp-cyan:#6ff0ec;--kp-lime:#a8f06b;--kp-orange:#ffad5c;--kp-violet:#b79bff;--kp-tap:56px}

/* Brighter sky */
body.page-kids{background:radial-gradient(ellipse at 80% 0%,#7b3fb099,transparent 55%),radial-gradient(ellipse at 5% 30%,#1e7fa055,transparent 50%),radial-gradient(ellipse at 60% 90%,#c2457a44,transparent 55%),linear-gradient(180deg,#1d0f3d,#160c2e 60%,#1a0f36)}
.page-kids .kids-universe span{width:.32rem;height:.32rem;background:#fff6c9}

/* Hierarchy: big bouncy headline + rainbow accent word */
.page-kids .kids-hero h1>span:not(.kids-title-color){color:#fffaf0;text-shadow:0 .25rem 0 #3a1e63}
.page-kids .kids-title-color{background:linear-gradient(90deg,var(--kp-yellow),var(--kp-pink) 45%,var(--kp-cyan));-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
.page-kids .kids-section h2,.page-kids .kids-featured h2{font-family:'Baloo 2',system-ui,sans-serif;font-weight:800;letter-spacing:.01em}
.page-kids .kids-eyebrow{color:var(--kp-yellow);letter-spacing:.06em}

/* Lumi: glowing halo + rainbow orbits */
.page-kids .kids-hero-art{background:radial-gradient(circle,#ffd65c33 0,#b79bff33 35%,transparent 66%)}
.page-kids .kids-mascot{filter:drop-shadow(0 0 1.6rem #ffd65c55) drop-shadow(0 1rem 2rem #0006)}
.page-kids .kids-orbit{border:2px dashed #ffd65c66}
.page-kids .kids-orbit.orbit-two{border-color:#6ff0ec66}
.page-kids .kids-space-star{color:var(--kp-yellow);text-shadow:0 0 .8rem #ffd65caa}
.page-kids .kids-space-star.star-two{color:var(--kp-pink)}.page-kids .kids-space-star.star-three{color:var(--kp-cyan)}
.page-kids .kids-art-label{background:linear-gradient(90deg,var(--kp-yellow),var(--kp-orange));color:#2a1440;font-weight:900;border:0;box-shadow:0 .3rem 0 #b8782f}

/* Big, friendly touch targets (>=56px) */
.page-kids :is(.kids-primary,.kids-secondary,.kids-chip,.kids-pill,.kids-hear,.kids-result-actions button,.kids-result-sharing button,.kids-source-controls button,.kids-grid-more>.kids-chip,#kids-match-submit,#kids-surprise){min-height:var(--kp-tap)}
.page-kids :is(.kids-match-form select,#kids-age,#kids-search,.kids-source-controls input,.kids-source-controls select){min-height:var(--kp-tap);font-size:1rem;border-radius:1rem}
.page-kids .kids-chip{padding:.8rem 1.25rem;font-size:.95rem;border-width:2px}
.page-kids .kids-card button[aria-label],.page-kids .kids-card .kids-heart{min-width:var(--kp-tap);min-height:var(--kp-tap)}
.page-kids .kids-primary{background:linear-gradient(180deg,#ffe27a,var(--kp-yellow));box-shadow:0 .35rem 0 #c0812f,0 .8rem 1.8rem #ffd65c33;border-radius:1.4rem;font-size:1.05rem}
.page-kids .kids-secondary{border:2px solid #ffffff55;border-radius:1.4rem;background:#ffffff14}

/* Rainbow chips: each category gets its own color */
.page-kids .kids-chips .kids-chip:nth-child(6n+1){--kp-c:var(--kp-yellow)}
.page-kids .kids-chips .kids-chip:nth-child(6n+2){--kp-c:var(--kp-lime)}
.page-kids .kids-chips .kids-chip:nth-child(6n+3){--kp-c:var(--kp-pink)}
.page-kids .kids-chips .kids-chip:nth-child(6n+4){--kp-c:var(--kp-cyan)}
.page-kids .kids-chips .kids-chip:nth-child(6n+5){--kp-c:var(--kp-orange)}
.page-kids .kids-chips .kids-chip:nth-child(6n+6){--kp-c:var(--kp-violet)}
.page-kids .kids-chips .kids-chip{border-color:color-mix(in srgb,var(--kp-c,#fff) 55%,transparent);background:color-mix(in srgb,var(--kp-c,#fff) 14%,transparent);color:#fff}
.page-kids .kids-chips .kids-chip.active{background:var(--kp-c,var(--kids-cyan));color:#22103a;border-color:var(--kp-c,var(--kids-cyan));box-shadow:0 .3rem 0 #0005}

/* Joyful cards: colored frames that rotate through the rainbow */
.page-kids .kids-grid .kids-card:nth-child(5n+1){--kp-c:var(--kp-yellow)}
.page-kids .kids-grid .kids-card:nth-child(5n+2){--kp-c:var(--kp-pink)}
.page-kids .kids-grid .kids-card:nth-child(5n+3){--kp-c:var(--kp-cyan)}
.page-kids .kids-grid .kids-card:nth-child(5n+4){--kp-c:var(--kp-lime)}
.page-kids .kids-grid .kids-card:nth-child(5n+5){--kp-c:var(--kp-orange)}
.page-kids .kids-card{border:3px solid color-mix(in srgb,var(--kp-c,#b79bff) 70%,transparent);border-radius:1.5rem;background:linear-gradient(180deg,color-mix(in srgb,var(--kp-c,#b79bff) 18%,#2a1945),#241540 60%)}
.page-kids .kids-card:focus-within{border-color:var(--kp-c,var(--kids-yellow));box-shadow:0 0 0 .25rem var(--kp-c,var(--kids-yellow))}
.page-kids .kids-card h3,.page-kids .kids-card strong{font-family:'Baloo 2',system-ui,sans-serif}
.page-kids .kids-feature{border:2px solid #ffffff33;border-radius:1.6rem}
.page-kids .kids-feature:nth-child(1){background:linear-gradient(120deg,#7a3fa8,#2b1850)}
.page-kids .kids-feature:nth-child(2){background:linear-gradient(120deg,#1f7c8f,#21204a)}
.page-kids .kids-feature:nth-child(3){background:linear-gradient(120deg,#b04a78,#2d1648)}

/* Match panel stands out as the main game */
.page-kids .kids-match{border:3px solid #ffd65c88;border-radius:1.8rem;background:linear-gradient(140deg,#3b1f6b,#1f3b63);box-shadow:0 1rem 2.4rem #0005,inset 0 0 0 1px #ffffff14}
.page-kids .kids-match h3{font:800 clamp(1.5rem,3.4vw,2.1rem)/1.1 'Baloo 2',system-ui,sans-serif;color:var(--kp-yellow)}

/* Focus that kids and grown-ups can see */
.page-kids :is(a,button,select,input,summary):focus-visible{outline:4px solid var(--kp-cyan);outline-offset:3px}

/* Sparkle burst (created by kids-playful JS only when motion is allowed) */
.kp-spark{position:fixed;z-index:9999;pointer-events:none;width:12px;height:12px;margin:-6px 0 0 -6px;opacity:0}
.kp-spark svg{display:block;width:100%;height:100%}

/* ---- Motion: opt-in, compositor-only, overrides the global lock for these elements only ---- */
@media (prefers-reduced-motion:no-preference){
  html:not(.reduce-motion) body.page-kids:not(.kids-paused) .kids-mascot{animation:kp-float 5s ease-in-out infinite!important}
  html:not(.reduce-motion) body.page-kids:not(.kids-paused) .kids-orbit.orbit-one{animation:kp-spin 40s linear infinite!important}
  html:not(.reduce-motion) body.page-kids:not(.kids-paused) .kids-orbit.orbit-two{animation:kp-spin 55s linear infinite reverse!important}
  html:not(.reduce-motion) body.page-kids:not(.kids-paused) .kids-space-star{animation:kp-twinkle 3.2s ease-in-out infinite!important}
  html:not(.reduce-motion) body.page-kids:not(.kids-paused) .kids-space-star.star-two{animation-delay:-1.1s!important}
  html:not(.reduce-motion) body.page-kids:not(.kids-paused) .kids-space-star.star-three{animation-delay:-2.2s!important}
  html:not(.reduce-motion) body.page-kids:not(.kids-paused) :is(.kids-card,.kids-chip,.kids-primary,.kids-secondary,.kids-feature){transition:transform .18s cubic-bezier(.3,1.6,.5,1)!important}
  html:not(.reduce-motion) body.page-kids:not(.kids-paused) :is(.kids-chip,.kids-primary,.kids-secondary,.kids-card-poster):active{transform:scale(.95)}
  html:not(.reduce-motion) body.page-kids:not(.kids-paused) .kp-pop{animation:kp-pop .45s cubic-bezier(.3,1.6,.5,1) both!important}
  html:not(.reduce-motion) body.page-kids:not(.kids-paused) .kp-spark{animation:kp-spark .7s ease-out forwards!important}
  @media (hover:hover){html:not(.reduce-motion) body.page-kids:not(.kids-paused) .kids-card:hover{transform:translateY(-.35rem) rotate(-.6deg)}}
}
@keyframes kp-float{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-.8rem) rotate(2deg)}}
@keyframes kp-spin{from{transform:rotate(-28deg)}to{transform:rotate(332deg)}}
@keyframes kp-twinkle{0%,100%{opacity:.55;transform:scale(.85)}50%{opacity:1;transform:scale(1.15)}}
@keyframes kp-pop{0%{transform:scale(.9);opacity:.4}60%{transform:scale(1.04);opacity:1}100%{transform:scale(1)}}
@keyframes kp-spark{0%{opacity:1;transform:translate(0,0) scale(.6)}100%{opacity:0;transform:translate(var(--kx),var(--ky)) scale(1.1) rotate(90deg)}}

@media (forced-colors:active){.page-kids .kids-title-color{-webkit-text-fill-color:CanvasText;background:none}.kp-spark{display:none}}
@media (prefers-contrast:more){.page-kids .kids-card,.page-kids .kids-chips .kids-chip{border-color:#fff}}

/* ---- Polish 2026-10-24b ---- */
/* Top bar: pills never shrink or squash (Grown-ups pill was crushed to 32px at 700-899px) */
.page-kids .kids-header .kids-nav{width:auto!important;max-width:100%;flex-wrap:wrap;justify-content:center;row-gap:.5rem}
.page-kids .kids-header .kids-nav>.kids-pill{flex:0 0 auto!important;white-space:nowrap;min-width:max-content}
.page-kids .kids-header .kids-nav>.kids-pill>span{white-space:nowrap}
html body.page-kids .kids-header .kids-header-actions .kids-nav>a.kids-pill,html body.page-kids .kids-header .kids-header-actions a#kids-exit{width:auto!important;min-width:max-content!important;white-space:nowrap!important;padding:0 .8rem!important}

/* Shared playful look for every Kids guide page (titles, classics, desktop downloads) */
body.kids-guide-page{background:radial-gradient(ellipse at 80% 0%,#7b3fb099,transparent 55%),radial-gradient(ellipse at 5% 30%,#1e7fa055,transparent 50%),radial-gradient(ellipse at 60% 90%,#c2457a44,transparent 55%),linear-gradient(180deg,#1d0f3d,#160c2e 60%,#1a0f36)!important;background-attachment:fixed!important;color:#fffaf0}
.kids-guide-page header .matchapp-brand-link:has(img)::before{display:none!important}
.kids-guide-page header .matchapp-brand-link img{box-shadow:0 0 0 3px var(--kp-yellow),0 0 1.4rem #ffd65c66}
.kids-guide-page .kp-guide-nav{display:flex!important;flex-wrap:wrap;gap:.6rem;align-items:center;width:auto!important;max-width:100%}
.kids-guide-page .kp-guide-nav a{display:inline-flex;align-items:center;gap:.4rem;flex:0 0 auto;white-space:nowrap;min-height:var(--kp-tap);padding:0 1.1rem;border-radius:999px;border:2px solid #ffffff40;background:#ffffff14;color:#fffaf0;font-weight:900;text-decoration:none}
.kids-guide-page .kp-guide-nav a:nth-child(1){border-color:var(--kp-yellow)}.kids-guide-page .kp-guide-nav a:nth-child(2){border-color:var(--kp-pink)}
.kids-guide-page .kp-guide-nav a:nth-child(3){border-color:var(--kp-cyan)}.kids-guide-page .kp-guide-nav a:nth-child(4){border-color:var(--kp-lime)}
.kids-guide-page .kp-guide-nav a[aria-current]{background:var(--kp-yellow);color:#2a1440;border-color:var(--kp-yellow)}
.kids-guide-page h1{font-family:'Baloo 2',system-ui,sans-serif;font-weight:800;text-shadow:0 .25rem 0 #3a1e63}
.kids-guide-page h2{font-family:'Baloo 2',system-ui,sans-serif;font-weight:800;color:var(--kp-yellow)}
.kids-guide-page .title-hero img,.kids-guide-page .list img{border:4px solid transparent;background:linear-gradient(#2a1650,#2a1650) padding-box,linear-gradient(135deg,var(--kp-yellow),var(--kp-pink),var(--kp-cyan)) border-box}
.kids-guide-page .list article{border:2px solid #ffffff22;box-shadow:0 .6rem 1.6rem #0005}
.kids-guide-page .list article:nth-child(4n+1){border-color:#ffd65c66}.kids-guide-page .list article:nth-child(4n+2){border-color:#ff8fc866}
.kids-guide-page .list article:nth-child(4n+3){border-color:#6ff0ec66}.kids-guide-page .list article:nth-child(4n+4){border-color:#a8f06b66}
.kids-guide-page :is(.watch,.matcher-link,.btn){min-height:var(--kp-tap);padding-inline:1.25rem;border-radius:1.4rem;font-weight:900}
.kids-guide-page .matcher-link{background:linear-gradient(180deg,#ffe27a,var(--kp-yellow));color:#2a1440;border:0;box-shadow:0 .35rem 0 #c0812f}
.kids-guide-page main ul{display:flex;flex-wrap:wrap;gap:.6rem;padding:0;list-style:none}
.kids-guide-page main ul li a{display:inline-flex;align-items:center;min-height:48px;padding:0 1rem;border-radius:999px;background:#ffffff12;border:2px solid #ffffff30;text-decoration:none;font-weight:800}
.kids-guide-page :is(a,button):focus-visible{outline:4px solid var(--kp-cyan)!important;outline-offset:4px}
.kids-desktop-page main{border-color:var(--kp-yellow)!important;background:#2a1650cc!important;border-radius:2rem!important}
.kids-desktop-page h1{color:var(--kp-yellow)!important}
.kids-desktop-page .btn{background:linear-gradient(180deg,#ffe27a,var(--kp-yellow))!important;color:#2a1440!important;box-shadow:0 .35rem 0 #c0812f}
.kids-desktop-page .kp-guide-nav{justify-content:center;margin:.6rem auto 0}
@media (prefers-reduced-motion:no-preference){
  html:not(.reduce-motion) body.kids-guide-page:not(.kids-paused) :is(.watch,.matcher-link,.btn,.kp-guide-nav a,main ul li a){transition:transform .18s ease}
  html:not(.reduce-motion) body.kids-guide-page:not(.kids-paused) :is(.watch,.matcher-link,.btn,.kp-guide-nav a,main ul li a):hover{transform:translateY(-2px) scale(1.03)}
  html:not(.reduce-motion) body.kids-guide-page:not(.kids-paused) :is(.watch,.matcher-link,.btn,.kp-guide-nav a,main ul li a):active{transform:scale(.96)}
}
@media (max-width:600px){.kids-guide-page header{flex-wrap:wrap;gap:.8rem}.kids-guide-page .kp-guide-nav a{padding:0 .85rem;font-size:.92rem}}

/* ---- Spacing pass 2026-10-24c: nothing glued to walls or to each other ---- */
:root{--kp-gap:10px;--kp-pad-l:max(16px,env(safe-area-inset-left));--kp-pad-r:max(16px,env(safe-area-inset-right))}
.page-kids .kids-header-inner{padding-left:var(--kp-pad-l)!important;padding-right:var(--kp-pad-r)!important;box-sizing:border-box}
.page-kids .kids-header :is(.kids-header-actions,.kids-nav,.kids-tools){gap:var(--kp-gap)!important;row-gap:var(--kp-gap)!important}
.page-kids .kids-card-body{padding:14px 16px 16px!important;gap:10px}
.page-kids .kids-card-body>*{margin-left:0;margin-right:0;max-width:100%}
.page-kids .kids-card .kids-heart{margin-right:0}
.page-kids .kids-card .kids-watch{padding:8px 14px!important}
.page-kids .kids-footer a,.kids-guide-page footer a{display:inline-block;margin:6px 4px;line-height:1.4}
.kids-guide-page :is(header,main,footer){padding-left:var(--kp-pad-l);padding-right:var(--kp-pad-r);box-sizing:border-box}
.kids-guide-page .watch{margin:6px 10px 6px 0}
.page-kids .kids-feature{padding:14px!important}
.page-kids .kids-feature>*{min-width:0}
.page-kids .kids-feature :is(h3,strong,span,p){overflow-wrap:anywhere;hyphens:auto}
.page-kids .kids-hero-copy{padding:20px!important;box-sizing:border-box}
.page-kids .kids-hero-copy::before{inset:0!important}
.page-kids .kids-steps{flex-wrap:wrap;gap:var(--kp-gap)!important}
body.page-kids{padding-bottom:max(88px,env(safe-area-inset-bottom))}

/* ---- Pill system 2026-10-24d: three size tiers, tidy rows ----
   sm  = header/nav/tool/filter chips  48px, 13.6px/800, pad 0 16px, icon 18px
   md  = secondary actions             56px, 15px/800,   pad 0 22px, icon 20px
   lg  = primary CTA                   64px, 17px/900,   pad 0 28px, icon 22px
   All: radius 999px, gap 8px icon/label, rows wrap with --kp-gap both axes. */
:root{--kp-pill-sm:48px;--kp-pill-md:56px;--kp-pill-lg:64px;--kp-pill-r:999px}
.page-kids .kids-header :is(.kids-nav,.kids-tools){display:grid!important;grid-template-columns:repeat(auto-fill,minmax(112px,1fr));gap:var(--kp-gap)!important;align-items:stretch;width:100%}
.page-kids .kids-header-actions{display:flex!important;flex-direction:column;align-items:stretch;gap:var(--kp-gap)!important;width:100%}
.page-kids .kids-header :is(.kids-nav,.kids-tools)>*{min-height:var(--kp-pill-sm)!important;height:var(--kp-pill-sm)!important;width:auto!important;min-width:0!important;padding:0 16px!important;margin:0!important;font-size:.85rem!important;font-weight:800!important;line-height:1.1!important;border-radius:var(--kp-pill-r)!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;gap:8px!important;box-sizing:border-box!important;white-space:nowrap}
.page-kids .kids-header :is(.kids-nav,.kids-tools)>[style*="display:none"],.page-kids .kids-header :is(.kids-nav,.kids-tools)>[hidden]{display:none!important}
.page-kids .kids-header a#kids-exit.kids-pill-exit{width:auto!important}
.page-kids .kids-header .kids-lang-wrap select{height:36px;min-height:0!important;padding-block:0!important;font-size:.85rem!important}
.page-kids .kids-header .kids-lang-wrap :is(.kids-lang-label,span:not(:only-child)){display:none}
@media(min-width:900px){.page-kids .kids-header :is(.kids-nav,.kids-tools){display:flex!important;flex-wrap:wrap;justify-content:center}.page-kids .kids-header-actions{flex-direction:row;flex-wrap:wrap;justify-content:center}.page-kids .kids-header :is(.kids-nav,.kids-tools){width:auto}}
/* action rows: primary first, all same height within row */
.page-kids :is(.kids-hero-actions,.kids-source-controls){display:flex!important;flex-wrap:wrap;gap:var(--kp-gap)!important;align-items:stretch}
.page-kids :is(.kids-hero-actions,.kids-source-controls)>:is(a,button){min-height:var(--kp-pill-md)!important;padding:0 22px!important;font-size:.94rem!important;font-weight:800!important;border-radius:var(--kp-pill-r)!important;display:inline-flex!important;align-items:center;justify-content:center;gap:8px;margin:0!important;box-sizing:border-box;flex:1 1 180px}
.page-kids :is(.kids-hero-actions,.kids-source-controls)>:is(a,button):first-child{min-height:var(--kp-pill-md)!important;font-size:1.02rem!important;font-weight:900!important}
.page-kids #kids-match-submit,.page-kids .kids-match-submit{min-height:var(--kp-pill-lg)!important;font-size:1.06rem!important;font-weight:900!important;border-radius:var(--kp-pill-r)!important}
/* filter / step chips */
.page-kids :is(.kids-steps,.kids-wallet-chips,.kids-chips,.kids-mood-chips)>*{min-height:40px;padding:0 14px;font-size:.8rem;font-weight:800;border-radius:var(--kp-pill-r);display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;margin:0}
/* guide/title pages: watch-where and match links share one tier */
.kids-guide-page :is(.watch,.kp-guide-nav a,main a.button,main .cta){min-height:var(--kp-pill-md)!important;padding:0 22px!important;font-size:.94rem!important;font-weight:800!important;border-radius:var(--kp-pill-r)!important;display:inline-flex!important;align-items:center;justify-content:center;gap:8px;box-sizing:border-box;line-height:1.15;text-align:center}
.kids-guide-page .kp-guide-nav a{min-height:var(--kp-pill-sm)!important;padding:0 16px!important;font-size:.85rem!important}
.kids-guide-page .kp-guide-nav{display:grid!important;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:var(--kp-gap)!important}
@media(min-width:700px){.kids-guide-page .kp-guide-nav{display:flex!important;flex-wrap:wrap;justify-content:center}}
.page-kids .kids-header :is(.kids-nav,.kids-tools)>*{grid-column:auto!important;white-space:nowrap!important}
.page-kids .kids-header :is(.kids-nav,.kids-tools)>* *{white-space:nowrap!important}
.page-kids .kids-header .kids-nav{grid-template-columns:repeat(6,minmax(0,1fr))!important}
.page-kids .kids-header .kids-nav>*{grid-column:span 2!important}
.page-kids .kids-header .kids-nav>:nth-child(n+4){grid-column:span 3!important}
.page-kids .kids-header .kids-tools{grid-template-columns:repeat(2,minmax(0,1fr))!important}
@media(min-width:600px) and (max-width:899px){.page-kids .kids-header .kids-nav{grid-template-columns:repeat(5,minmax(0,1fr))!important}.page-kids .kids-header .kids-nav>*,.page-kids .kids-header .kids-nav>:nth-child(n+4){grid-column:auto!important}.page-kids .kids-header .kids-tools{grid-template-columns:repeat(4,minmax(0,1fr))!important}}
@media(min-width:900px){.page-kids .kids-header .kids-nav>*,.page-kids .kids-header .kids-nav>:nth-child(n+4){grid-column:auto!important}}
.kids-guide-page .matcher-link{display:flex!important;width:100%;min-height:var(--kp-pill-lg)!important;padding:10px 28px!important;margin:12px 0 18px!important;font-size:1.02rem!important;font-weight:900!important;border-radius:var(--kp-pill-r)!important;align-items:center;justify-content:center;text-align:center;box-sizing:border-box;line-height:1.2}
.kids-guide-page .seo-facts{display:flex!important;flex-wrap:wrap;gap:8px!important}
.kids-guide-page .seo-facts>span{min-height:36px;padding:0 14px!important;margin:0!important;display:inline-flex!important;align-items:center;font-size:.8rem!important;font-weight:800;border-radius:var(--kp-pill-r)!important;box-sizing:border-box}
.kids-guide-page .watch{min-width:min(100%,220px)}
@media(max-width:699px){html body.kids-guide-page header nav.kp-guide-nav{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;width:100%!important;flex:1 1 100%}html body.kids-guide-page header nav.kp-guide-nav a{justify-content:center;width:auto}}
