/* ==========================================================================
   Kids Kingdom (v10.418) — /kids-kingdom/, Baby World, Participators,
   My Kids Kingdom. Loaded only on these pages (pageCss:'kingdom').
   Built on tokens.css: brand rose for actions, DM Sans body, Poppins for the
   playful Kids headings already used across Kids Kingdom, Noto Sans
   Devanagari for the Hindi lines. Each zone wears the colour of its painted
   signpost in the hero artwork, so the page and the picture speak together.
   ========================================================================== */
.kq{
  --kq-ink:#1F1633; --kq-muted:#5E5674; --kq-line:rgba(31,22,51,.10); --kq-card:#fff; --kq-page:#FBFAFF; --kq-sky:#EEF6FF;
  --z-studio:#E2457A; --z-learning:#3A9A4E; --z-weekly:#3474D6; --z-achievers:#E0A800; --z-participators:#7C4DEB; --z-baby:#E25D8A;
  --kq-hi:'Poppins','DM Sans','Noto Sans Devanagari',system-ui,sans-serif; --kq-fun:'Poppins','DM Sans',system-ui,sans-serif;
  background:var(--kq-page); color:var(--kq-ink);
}
html[data-theme="dark"] .kq{ --kq-ink:#F2EEFB; --kq-muted:#C4BBDA; --kq-line:rgba(255,255,255,.12); --kq-card:#1D1830; --kq-page:#130F20; --kq-sky:#18223A; }
.kq-wrap{ max-width:1240px; margin:0 auto; padding:0 var(--sp-4,16px); }
.kq-narrow{ max-width:820px; }
.kq a:not(.tn-btn){ color:inherit; }
html .kq a.tn-btn-primary{ color:#fff!important; -webkit-text-fill-color:#fff!important; }
html .kq a.tn-btn-outline{ color:var(--kq-ink)!important; -webkit-text-fill-color:var(--kq-ink)!important; }
.kq .kq-crumb{ display:flex; flex-wrap:wrap; gap:6px; align-items:center; font-size:13px; color:var(--kq-muted); padding:14px 0 12px; }
.kq .kq-crumb a{ text-decoration:none; } .kq .kq-crumb a:hover{ color:#D6005E; text-decoration:underline; }

/* ---------- headings (beat the site-wide dark heading rule on purpose) */
html .kq .kq-h1{ margin:0; font:800 clamp(30px,4.6vw,52px)/1.05 var(--kq-fun); letter-spacing:-.5px; color:var(--kq-ink)!important; -webkit-text-fill-color:currentColor!important; }
html .kq .kq-h1-page{ font-size:clamp(30px,4.2vw,46px); }
html .kq .kq-h2{ margin:0 0 8px; font:800 clamp(24px,3.2vw,36px)/1.25 var(--kq-hi); color:var(--kq-ink)!important; -webkit-text-fill-color:currentColor!important; }
html .kq .kq-h2:not([lang]){ font-family:var(--kq-fun); }
html .kq .kq-h3{ margin:0 0 8px; font:700 20px/1.3 var(--kq-fun); color:var(--kq-ink)!important; -webkit-text-fill-color:currentColor!important; }
.kq .kq-tag{ margin:6px 0 4px; font:700 clamp(21px,2.7vw,30px)/1.35 var(--kq-hi); color:#D6005E; }
.kq .kq-lead{ margin:0; font:500 clamp(16px,1.8vw,19px)/1.65 var(--kq-hi); color:var(--kq-muted); max-width:44ch; }
.kq .kq-sub{ margin:0 0 18px; font-size:16.5px; line-height:1.65; color:var(--kq-muted); max-width:62ch; }
.kq .kq-kicker{ display:inline-flex; align-items:center; gap:8px; margin:0 0 6px; font:700 14.5px/1.2 var(--kq-fun); color:var(--z, var(--tn-rose)); }
.kq .kq-kicker .kq-ic{ width:20px; height:20px; }
.kq .kq-note{ margin:0 0 14px; color:var(--kq-ink); }
.kq .kq-fine{ margin:10px 0 0; font-size:13.5px; color:var(--kq-muted); }
.kq .kq-empty{ margin:6px 0 0; padding:18px 20px; border-radius:var(--radius-lg,20px); background:var(--kq-card); border:1px dashed var(--kq-line); color:var(--kq-muted); }
.kq .kq-empty a{ color:#D6005E; font-weight:700; }
.kq .kq-acts{ display:flex; flex-wrap:wrap; gap:10px; margin-top:6px; }
.kq .kq-acts-c{ justify-content:center; }
.kq .kq-btn-lg{ min-height:52px; padding:14px 28px; font-size:16.5px; }
.kq .tn-btn{ text-decoration:none; }
html[data-theme="dark"] .kq .tn-btn-outline{ background:transparent; color:var(--kq-ink); border-color:rgba(255,255,255,.35); }

/* ---------- hero: the artwork, whole, with live signposts */
.kq-hero{ padding:0 0 var(--sp-10,40px); background:linear-gradient(180deg,var(--kq-sky) 0%,var(--kq-page) 100%); }
.kq-art{ position:relative; margin:0; border-radius:28px; overflow:hidden; aspect-ratio:1672/941; background:#BFE3FF;
  box-shadow:0 30px 70px -40px rgba(30,60,120,.55), 0 0 0 1px rgba(255,255,255,.6) inset; }
.kq-art img{ display:block; width:100%; height:100%; object-fit:cover; }
.kq-hot{ position:absolute; border-radius:14px; transition:box-shadow .2s ease, background-color .2s ease; }
.kq-hot:hover,.kq-hot:focus-visible{ outline:none; background:rgba(255,255,255,.14); box-shadow:0 0 0 3px #fff, 0 0 26px 6px rgba(255,214,107,.75); }
.kq-hot-studio{ left:6.2%; top:37.2%; width:14.8%; height:8.6%; }
.kq-hot-learning{ left:5.6%; top:46%; width:15.2%; height:9%; }
.kq-hot-weekly{ left:5%; top:55%; width:15.8%; height:9.4%; }
.kq-hot-achievers{ left:77.6%; top:39.3%; width:15.4%; height:7.6%; }
.kq-hot-participators{ left:78%; top:48.2%; width:15.8%; height:7.6%; }
.kq-hot-baby{ left:78.2%; top:57%; width:16%; height:8%; }
.kq-welcome{ display:grid; grid-template-columns:minmax(0,1.4fr) minmax(0,1fr); gap:24px 40px; align-items:end; margin-top:26px; }
.kq-welcome-acts{ display:flex; flex-wrap:wrap; gap:12px; justify-content:flex-end; align-items:center; }
.kq-mylink{ flex-basis:100%; text-align:right; font-weight:700; color:#D6005E!important; text-decoration:none; }
.kq-mylink:hover{ text-decoration:underline; }
@media (max-width:860px){
  .kq-art{ border-radius:20px; }
  .kq-welcome{ grid-template-columns:1fr; margin-top:18px; }
  .kq-welcome-acts{ justify-content:flex-start; }
  .kq-welcome-acts .tn-btn{ flex:1 1 220px; }
  .kq-mylink{ text-align:left; }
}
@media (max-width:560px){
  /* phones: the picture keeps its whole composition; it is simply full-bleed */
  .kq-hero .kq-wrap{ padding:0; }
  .kq-hero .kq-crumb,.kq-welcome{ padding:0 16px; }
  .kq-art{ border-radius:0; box-shadow:none; }
  .kq-hot{ border-radius:8px; }
}

/* ---------- six signposts */
.kq-zones{ padding:var(--sp-12,48px) 0; text-align:center; }
.kq-zones .kq-sub{ margin-left:auto; margin-right:auto; }
.kq-signs{ display:grid; grid-template-columns:1fr 1fr; gap:18px 64px; max-width:980px; margin:26px auto 0;
  background:linear-gradient(90deg,transparent calc(50% - 7px),#F9A8D4 calc(50% - 7px),#C084FC calc(50% + 7px),transparent calc(50% + 7px)); }
.kq-signcol{ display:flex; flex-direction:column; gap:16px; align-items:flex-end; }
.kq-signcol-r{ align-items:flex-start; }
.kq-sign{ --z:var(--tn-rose); position:relative; display:flex; align-items:center; gap:12px; width:min(100%,400px); min-height:76px; padding:12px 30px 12px 42px;
  background:var(--z); color:#fff!important; text-decoration:none; text-align:left;
  clip-path:polygon(9% 0,100% 0,100% 100%,9% 100%,0 50%);
  box-shadow:inset 0 -5px 0 rgba(0,0,0,.14), inset 0 3px 0 rgba(255,255,255,.25);
  transition:transform .18s ease, filter .18s ease; }
.kq-signcol-r .kq-sign{ padding:12px 42px 12px 30px; clip-path:polygon(0 0,91% 0,100% 50%,91% 100%,0 100%); }
.kq-sign:hover{ transform:translateX(-4px); filter:brightness(1.06); }
.kq-signcol-r .kq-sign:hover{ transform:translateX(4px); }
.kq-sign:focus-visible{ outline:none; filter:brightness(1.1); box-shadow:inset 0 0 0 3px #fff; }
.kq-sign-ic{ display:grid; place-items:center; width:44px; height:44px; flex:none; border-radius:12px; background:rgba(255,255,255,.22); }
.kq-sign-ic .kq-ic{ width:24px; height:24px; }
.kq-sign-t{ display:flex; flex-direction:column; gap:2px; }
.kq-sign-t b,
.kq-sign-t .kq-b{ font:800 19px/1.15 var(--kq-fun); color:#fff; }
.kq-sign-t small{ font:600 14px/1.3 var(--kq-hi); color:rgba(255,255,255,.92); }
.kq-z-studio{ --z:var(--z-studio); } .kq-z-learning{ --z:var(--z-learning); } .kq-z-weekly{ --z:var(--z-weekly); }
.kq-z-achievers{ --z:var(--z-achievers); } .kq-z-participators{ --z:var(--z-participators); } .kq-z-baby{ --z:var(--z-baby); }
.kq-sign.kq-z-achievers{ background:#F2B53A; color:#3D2400!important; }
.kq-sign.kq-z-achievers .kq-sign-t b,.kq-sign.kq-z-achievers .kq-sign-t small,
.kq-sign.kq-z-achievers .kq-sign-t .kq-b{ color:#3D2400; }
@media (max-width:760px){
  .kq-signs{ grid-template-columns:1fr; gap:12px; background:none; }
  .kq-signcol,.kq-signcol-r{ align-items:stretch; gap:12px; }
  .kq-sign,.kq-signcol-r .kq-sign{ width:100%; padding:12px 34px 12px 40px; clip-path:polygon(0 0,94% 0,100% 50%,94% 100%,0 100%); }
}

/* ---------- zone sections */
.kq-zone{ --z:var(--tn-rose); padding:var(--sp-12,48px) 0; border-top:1px solid var(--kq-line);
  background:linear-gradient(180deg, color-mix(in srgb, var(--z) 7%, var(--kq-page)) 0%, var(--kq-page) 70%); }
.kq-pagehead{ border-top:0; padding-top:0; }
.kq-split{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:28px 48px; align-items:center; }
.kq-split-rev > :first-child{ order:2; }
.kq-head-row{ display:flex; flex-wrap:wrap; gap:16px 28px; align-items:flex-end; justify-content:space-between; margin-bottom:18px; }
.kq-head-row > div:first-child{ flex:1 1 420px; }
@media (max-width:860px){ .kq-split{ grid-template-columns:1fr; } .kq-split-rev > :first-child{ order:0; } }

/* Learning: age picker */
.kq-ages{ padding:22px; border-radius:24px; background:var(--kq-card); border:1px solid var(--kq-line); box-shadow:var(--shadow,0 10px 30px -18px rgba(31,22,51,.3)); }
.kq-ages-h{ margin:0 0 12px; font:700 16px/1.3 var(--kq-fun); color:var(--kq-ink); }
.kq-ages-grid{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.kq-age{ display:flex; flex-direction:column; gap:2px; padding:14px 16px; border-radius:16px; text-decoration:none; border:2px solid color-mix(in srgb, var(--z-learning) 30%, transparent);
  background:color-mix(in srgb, var(--z-learning) 8%, var(--kq-card)); transition:border-color .15s ease, transform .15s ease; }
.kq-age b{ font:800 20px/1.1 var(--kq-fun); color:var(--z-learning); }
.kq-age span{ font-size:14px; color:var(--kq-muted); }
.kq-age:hover,.kq-age:focus-visible{ border-color:var(--z-learning); transform:translateY(-2px); outline:none; }
html[data-theme="dark"] .kq-age b{ color:#7BD88F; }

/* Weekly: this week */
.kq-subjects{ display:flex; flex-wrap:wrap; gap:8px; margin:0 0 16px; padding:0; list-style:none; }
.kq-subjects li{ padding:7px 12px; border-radius:999px; background:var(--kq-card); border:1px solid var(--kq-line); font-size:14px; font-weight:600; }
.kq-thisweek{ position:relative; display:flex; flex-direction:column; gap:6px; padding:28px 28px 24px; border-radius:24px; text-decoration:none; color:#fff!important;
  background:var(--z-weekly); box-shadow:0 24px 50px -30px color-mix(in srgb, var(--z-weekly) 80%, #000); overflow:hidden; }
.kq-thisweek::after{ content:""; position:absolute; right:-40px; top:-40px; width:160px; height:160px; border-radius:50%; background:rgba(255,255,255,.12); }
.kq-thisweek-l{ font-weight:700; font-size:14px; opacity:.9; }
.kq-thisweek-n{ font:800 clamp(40px,6vw,64px)/1 var(--kq-fun); }
.kq-thisweek-t{ font:700 22px/1.25 var(--kq-fun); }
.kq-thisweek-x{ font-size:14px; opacity:.9; }
.kq-thisweek-go{ align-self:flex-start; margin-top:10px; padding:10px 16px; border-radius:999px; background:#fff; color:var(--z-weekly); font-weight:800; font-size:14.5px; }
.kq-thisweek:hover .kq-thisweek-go{ text-decoration:underline; }

/* Studio: shelf */
.kq-shelf{ display:grid; grid-template-columns:repeat(auto-fill,minmax(180px,1fr)); gap:12px; margin:0; padding:0; list-style:none; }
.kq-shelf a{ display:flex; flex-direction:column; gap:4px; height:100%; padding:16px 16px 14px; border-radius:18px; text-decoration:none; background:var(--kq-card);
  border:1px solid var(--kq-line); border-left:5px solid var(--z-studio); transition:transform .15s ease; }
.kq-shelf a:hover{ transform:translateY(-2px); }
.kq-shelf b{ font:700 15.5px/1.3 var(--kq-fun); color:var(--kq-ink); }
.kq-shelf span{ font-size:13.5px; color:var(--kq-muted); }

/* Achievers: reuse the existing Young Achiever card */
.kq-ach-grid{ display:grid!important; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:18px; margin:0; padding:0; background:none!important; border:0!important; box-shadow:none!important; }

/* Participators */
.kq-stats{ display:flex; flex-wrap:wrap; gap:12px; margin:0 0 20px; padding:0; list-style:none; }
.kq-stats li{ display:flex; flex-direction:column; min-width:150px; padding:14px 18px; border-radius:18px; background:var(--kq-card); border:1px solid var(--kq-line); }
.kq-stats b{ font:800 26px/1.1 var(--kq-fun); color:var(--z-participators); }
html[data-theme="dark"] .kq-stats b{ color:#B9A2FF; }
.kq-stats span{ font-size:13.5px; color:var(--kq-muted); }
.kq-wall{ display:grid; grid-template-columns:repeat(auto-fill,minmax(240px,1fr)); gap:12px; margin:0 0 18px; padding:0; list-style:none; }
.kq-wall-i{ display:flex; gap:12px; align-items:flex-start; padding:14px 16px; border-radius:18px; background:var(--kq-card); border:1px solid var(--kq-line); }
.kq-wall-badge{ display:grid; place-items:center; width:44px; height:44px; flex:none; border-radius:50%; font-size:22px; background:color-mix(in srgb, var(--z-participators) 14%, var(--kq-card)); }
.kq-wall-i b{ display:block; font:700 16px/1.25 var(--kq-fun); }
.kq-wall-i em{ display:block; font-style:normal; font-size:14px; color:var(--z-participators); font-weight:700; }
html[data-theme="dark"] .kq-wall-i em{ color:#B9A2FF; }
.kq-wall-i i{ display:block; font-style:normal; font:500 13.5px/1.4 var(--kq-hi); color:var(--kq-muted); }
.kq-wall-i small{ display:block; margin-top:4px; font-size:13.5px; color:var(--kq-muted); }
.kq-part-links{ display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:12px; }
.kq-part-links a{ display:flex; flex-direction:column; gap:4px; padding:16px 18px; border-radius:18px; text-decoration:none; background:var(--kq-card); border:1px solid var(--kq-line); }
.kq-part-links a:hover{ border-color:var(--z-participators); }
.kq-part-links b{ font:700 16px/1.3 var(--kq-fun); color:var(--kq-ink); } .kq-part-links span{ font-size:14px; color:var(--kq-muted); }
.kq-badges{ display:grid; grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); gap:8px; margin:0 0 14px; padding:0; list-style:none; }
.kq-badges li{ display:flex; align-items:center; gap:8px; padding:10px 12px; border-radius:14px; background:var(--kq-card); border:1px solid var(--kq-line); font-size:14px; color:var(--kq-muted); }
.kq-badges li span{ font-size:20px; filter:grayscale(1); opacity:.55; }
.kq-badges li.is-earned{ color:var(--kq-ink); border-color:color-mix(in srgb, var(--z-participators) 45%, transparent); }
.kq-badges li.is-earned span{ filter:none; opacity:1; }
.kq-badges li em{ margin-left:auto; font-style:normal; font-size:12px; font-weight:800; color:var(--tn-success,#12A150); }

/* Baby World */
.kq-moments{ display:flex; flex-wrap:wrap; gap:8px; margin:0 0 20px; padding:0; list-style:none; }
.kq-moments a{ display:inline-flex; align-items:center; gap:6px; min-height:40px; padding:8px 14px; border-radius:999px; text-decoration:none; font-weight:600; font-size:14px;
  background:var(--kq-card); border:1px solid color-mix(in srgb, var(--z-baby) 30%, transparent); color:var(--kq-ink); }
.kq-moments a:hover,.kq-moments a.on{ background:var(--z-baby); border-color:var(--z-baby); color:#fff; }
.kq-stars{ display:grid; grid-template-columns:repeat(auto-fill,minmax(200px,1fr)); gap:16px; }
.kq-star{ margin:0; border-radius:22px; overflow:hidden; background:var(--kq-card); border:1px solid var(--kq-line); }
.kq-star-ph{ display:block; aspect-ratio:4/5; background:color-mix(in srgb, var(--z-baby) 12%, var(--kq-card)); }
.kq-star-ph img{ display:block; width:100%; height:100%; object-fit:cover; }
.kq-star figcaption{ display:flex; flex-direction:column; gap:2px; padding:12px 14px 14px; }
.kq-star-cat{ font-size:12.5px; font-weight:800; color:var(--z-baby); }
html[data-theme="dark"] .kq-star-cat{ color:#FF9DBE; }
.kq-star b{ font:700 17px/1.25 var(--kq-fun); }
.kq-star-age{ font-size:13px; color:var(--kq-muted); }
.kq-star-cap{ margin-top:4px; font-size:14px; color:var(--kq-ink); }

/* Parents + safety + FAQ + final */
.kq-parents{ padding:var(--sp-12,48px) 0; border-top:1px solid var(--kq-line); }
.kq-par-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:14px; }
.kq-par{ display:flex; flex-direction:column; gap:6px; padding:20px; border-radius:20px; text-decoration:none; background:var(--kq-card); border:1px solid var(--kq-line); transition:border-color .15s ease; }
.kq-par:hover{ border-color:var(--tn-rose); }
.kq-par b{ font:700 17px/1.3 var(--kq-fun); color:var(--kq-ink); } .kq-par span{ font-size:14.5px; line-height:1.55; color:var(--kq-muted); }
.kq-safe{ padding:var(--sp-10,40px) 0; background:color-mix(in srgb, var(--tn-success,#12A150) 7%, var(--kq-page)); border-top:1px solid var(--kq-line); }
.kq-safe-in{ display:flex; gap:20px; align-items:flex-start; }
.kq-safe-ic{ display:grid; place-items:center; width:56px; height:56px; flex:none; border-radius:16px; background:var(--tn-success,#12A150); color:#fff; }
.kq-safe-ic .kq-ic{ width:30px; height:30px; }
.kq-safe-list{ margin:0; padding-left:18px; color:var(--kq-ink); line-height:1.75; }
.kq-faq{ padding:var(--sp-12,48px) 0; border-top:1px solid var(--kq-line); }
.kq-q{ margin:0 0 10px; padding:14px 18px; border-radius:16px; background:var(--kq-card); border:1px solid var(--kq-line); }
.kq-q summary{ cursor:pointer; font-weight:700; color:var(--kq-ink); }
.kq-q p{ margin:10px 0 0; line-height:1.65; color:var(--kq-muted); }
.kq-final{ padding:var(--sp-12,48px) 0 var(--sp-16,64px); text-align:center; background:linear-gradient(180deg,var(--kq-page),var(--kq-sky)); }
.kq-pager{ display:flex; gap:16px; justify-content:center; align-items:center; margin-top:22px; }
.kq-pager a{ font-weight:700; color:#D6005E; }

/* Forms (Baby World / Participators) */
.kq-form{ display:flex; flex-direction:column; gap:16px; margin-top:12px; }
.kq-form fieldset{ margin:0; padding:18px; border-radius:20px; border:1px solid var(--kq-line); background:var(--kq-card); }
.kq-form legend{ padding:4px 12px; border-radius:999px; background:color-mix(in srgb, var(--z-baby) 12%, var(--kq-card)); font:700 15px/1.2 var(--kq-fun); color:var(--kq-ink); }
.kq-form label{ display:flex; flex-direction:column; gap:6px; margin-top:10px; font-weight:700; font-size:14px; color:var(--kq-ink); }
.kq-form label small{ font-weight:500; color:var(--kq-muted); font-size:12.5px; }
.kq-form input:not([type=checkbox]):not([type=radio]),.kq-form select{ width:100%; min-height:46px; padding:10px 14px; border-radius:14px; border:1.5px solid var(--kq-line); background:var(--kq-page); color:var(--kq-ink); font:16px/1.4 'DM Sans',system-ui,sans-serif; }
.kq-form input:focus,.kq-form select:focus{ outline:none; border-color:var(--tn-rose); box-shadow:0 0 0 4px rgba(240,0,107,.12); }
.kq-grid2{ display:grid; grid-template-columns:1fr 1fr; gap:0 14px; }
@media (max-width:560px){ .kq-grid2{ grid-template-columns:1fr; } }
.kq-pick{ display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:8px; }
.kq-pick label{ margin:0; position:relative; cursor:pointer; }
.kq-pick input{ position:absolute; opacity:0; pointer-events:none; }
.kq-pick label > span{ display:flex; flex-direction:column; gap:2px; height:100%; padding:10px 12px; border-radius:14px; border:2px solid var(--kq-line); font-weight:700; font-size:14px; color:var(--kq-ink); }
.kq-pick b{ font-size:22px; } .kq-pick small{ font:500 12.5px/1.3 var(--kq-hi); color:var(--kq-muted); }
.kq-pick input:checked + span{ border-color:var(--z-baby); background:color-mix(in srgb, var(--z-baby) 10%, var(--kq-card)); }
.kq-pick input:focus-visible + span{ outline:3px solid rgba(240,0,107,.35); outline-offset:2px; }
.kq-form .kq-radio,.kq-form .kq-check{ flex-direction:row; align-items:flex-start; gap:10px; font-weight:500; line-height:1.5; cursor:pointer; }
.kq-form .kq-radio input,.kq-form .kq-check input{ width:20px; height:20px; flex:none; margin-top:2px; accent-color:#F0006B; }
.kq-prev img{ width:160px; height:200px; object-fit:cover; border-radius:16px; }
.kq-msg{ min-height:20px; margin:0; font-weight:700; color:#D6005E; }
.kq-done{ margin-top:16px; padding:24px; border-radius:22px; background:var(--kq-card); border:1px solid var(--kq-line); }

/* My Kids Kingdom */
.kq-mytiles{ display:grid; grid-template-columns:repeat(auto-fit,minmax(170px,1fr)); gap:12px; margin:8px 0 14px; }
.kq-tile{ display:flex; flex-direction:column; padding:16px 18px; border-radius:18px; background:var(--kq-card); border:1px solid var(--kq-line); }
.kq-tile b{ font:800 26px/1.1 var(--kq-fun); color:#D6005E; } .kq-tile span{ font-size:14px; color:var(--kq-muted); }
.kq-mygrid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:16px; }
.kq-panel{ padding:20px; border-radius:22px; background:var(--kq-card); border:1px solid var(--kq-line); }
.kq-panel p{ color:var(--kq-ink); } .kq-panel a{ color:#D6005E; font-weight:700; }
.kq-panel .tn-btn-primary{ color:#fff!important; }
.kq-medals{ display:grid; grid-template-columns:repeat(auto-fill,minmax(64px,1fr)); gap:8px; margin:6px 0 14px; padding:0; list-style:none; }
.kq-medals li{ display:flex; flex-direction:column; align-items:center; gap:2px; padding:8px 4px; border-radius:12px; border:1px solid var(--kq-line); opacity:.45; filter:grayscale(1); text-align:center; }
.kq-medals li.is-on{ opacity:1; filter:none; border-color:#F2B53A; background:color-mix(in srgb, #F2B53A 12%, var(--kq-card)); }
.kq-medals span{ font-size:22px; } .kq-medals small{ font-size:10.5px; line-height:1.2; color:var(--kq-muted); }
.kq-list{ margin:0; padding:0; list-style:none; }
.kq-list li{ display:flex; justify-content:space-between; gap:10px; padding:10px 0; border-bottom:1px solid var(--kq-line); font-size:14.5px; }
.kq-st{ flex:none; padding:3px 10px; border-radius:999px; font-size:12px; font-weight:800; background:#EEE; color:#444; }
.kq-st-pending{ background:#FFF3D6; color:#6B21A8; } .kq-st-approved,.kq-st-published{ background:#DFF5E1; color:#1C6B2E; } .kq-st-rejected{ background:#FFE1E8; color:#B0004F; }
.kq-mymoments{ display:grid; grid-template-columns:repeat(auto-fill,minmax(320px,1fr)); gap:14px; }
.kq-mymom{ display:flex; gap:14px; padding:14px; border-radius:20px; background:var(--kq-card); border:1px solid var(--kq-line); }
.kq-mymom img{ width:110px; height:138px; object-fit:cover; border-radius:14px; flex:none; }
.kq-mymom p{ margin:6px 0; font-size:14px; color:var(--kq-muted); }
.kq-mymom .tn-btn{ min-height:40px; padding:8px 14px; font-size:13.5px; }

@media (prefers-reduced-motion: reduce){
  .kq-sign,.kq-age,.kq-shelf a,.kq-hot{ transition:none; }
  .kq-sign:hover,.kq-signcol-r .kq-sign:hover,.kq-age:hover,.kq-shelf a:hover{ transform:none; }
}

/* zone colours win over the section default (same specificity, so stated last) */
.kq-zone.kq-z-studio{ --z:var(--z-studio); } .kq-zone.kq-z-learning{ --z:var(--z-learning); } .kq-zone.kq-z-weekly{ --z:var(--z-weekly); }
.kq-zone.kq-z-achievers{ --z:#C026D3; } .kq-zone.kq-z-participators{ --z:var(--z-participators); } .kq-zone.kq-z-baby{ --z:var(--z-baby); }
html[data-theme="dark"] .kq-zone.kq-z-achievers{ --z:#F2B53A; }
html[data-theme="dark"] .kq-zone.kq-z-learning .kq-kicker{ color:#7BD88F; }
html[data-theme="dark"] .kq-zone.kq-z-weekly .kq-kicker{ color:#8DB6FF; }
html[data-theme="dark"] .kq-zone.kq-z-participators .kq-kicker{ color:#B9A2FF; }
html[data-theme="dark"] .kq-zone.kq-z-studio .kq-kicker,html[data-theme="dark"] .kq-zone.kq-z-baby .kq-kicker{ color:#FF9DBE; }

/* v10.419 the welcome + signposts also sit under the artwork on the home page */
.kq.kq-onhome{ background:transparent; }
.kq-onhome .kq-welcome{ margin-top:22px; padding:0; }
.kq-onhome .kq-zones{ padding:34px 0 8px; }
.kq-onhome .kq-wrap{ padding:0; }
html .kq-onhome .kq-h1 a{ color:inherit!important; -webkit-text-fill-color:currentColor!important; text-decoration:none; }
html .kq-onhome .kq-h1 a:hover{ color:#D6005E!important; }

/* v10.420 Baby World — play ideas by age (no scores, parent + child) */
.kq-together{ margin-top:22px; padding:18px; border-radius:18px; background:var(--kq-card); box-shadow:inset 0 0 0 1px var(--kq-line); }
.kq-together-grid{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; }
.kq-together-grid b{ display:block; margin:0 0 6px; font:700 15px/1.3 var(--kq-fun); color:var(--z-baby,#E25D8A); }
.kq-together-grid ul{ margin:0; padding-left:18px; color:var(--kq-muted); font-size:14px; line-height:1.55; }
html[data-theme="dark"] .kq-together-grid b{ color:#FF9CC0; }
@media (max-width:760px){ .kq-together-grid{ grid-template-columns:1fr; } }