/* ==========================================================================
   SagaSphere theme (2026-10-06): "morning garden" for grown-ups, "sunny hills" for kids,
   galaxy logo. Loaded after main.css; art lives in /static/css/art/ (make_art.py).
   ========================================================================== */

/* ---------- galaxy logo (every page with a header) ---------- */
html body .top .brand,html body .login-card .login-brand,html body .foot .foot-brand{
  font-size:1.45rem;font-weight:900;letter-spacing:.5px;line-height:1;
  display:inline-flex;align-items:center;gap:.45rem;
  color:transparent !important;-webkit-text-fill-color:transparent;
  background:
    radial-gradient(1px 1px at 12% 30%,#fff 60%,transparent 70%),
    radial-gradient(1px 1px at 38% 70%,#fff 60%,transparent 70%),
    radial-gradient(1.4px 1.4px at 61% 25%,#fff 60%,transparent 70%),
    radial-gradient(1px 1px at 83% 62%,#fff 60%,transparent 70%),
    radial-gradient(1.2px 1.2px at 27% 85%,#fff 60%,transparent 70%),
    radial-gradient(1px 1px at 92% 18%,#fff 60%,transparent 70%),
    radial-gradient(60% 120% at 20% 40%,#ff5fc8 0%,transparent 60%),
    radial-gradient(55% 120% at 55% 60%,#6a5cff 0%,transparent 62%),
    radial-gradient(50% 110% at 85% 35%,#21d4fd 0%,transparent 60%),
    linear-gradient(90deg,#2b0f5c,#4b1d8f 30%,#1d3fa8 60%,#0e6c9e 85%,#3a1572);
  background-size:100% 100%,100% 100%,100% 100%,100% 100%,100% 100%,100% 100%,200% 100%,200% 100%,200% 100%,200% 100%;
  -webkit-background-clip:text;background-clip:text;
  animation:galaxy 14s ease-in-out infinite alternate;
  filter:drop-shadow(0 0 6px rgba(140,110,255,.55)) drop-shadow(0 1px 0 rgba(0,0,0,.35));
}
@keyframes galaxy{
  from{background-position:0 0,0 0,0 0,0 0,0 0,0 0,0% 50%,100% 50%,0% 50%,0% 50%}
  to  {background-position:0 0,0 0,0 0,0 0,0 0,0 0,100% 50%,0% 50%,100% 50%,100% 50%}
}

/* ---------- grown-ups: morning garden (soft blush sky, sage hills, eucalyptus) ---------- */
html body:not(.kids-body){
  --bg:#fbf6f1; --bg2:#f5eee7; --card:rgba(255,255,255,.74); --card2:rgba(250,244,238,.92);
  --ink:#3e3a35; --mut:#7d756c; --line:rgba(122,110,96,.16);
  --acc:#6f9a80; --acc2:#e2a5a3; --ok:#4f9468; --no:#cf6f78; --wait:#b98d3e;
  color:var(--ink);background:#fbf3ee;
}
html body:not(.kids-body)::before{
  content:"";position:fixed;inset:0;z-index:-2;pointer-events:none;
  background:url(/static/css/art/garden.svg) center bottom/cover no-repeat,#fbf3ee;
}
html body:not(.kids-body)::after{
  content:"";position:fixed;inset:auto 0 0 0;height:min(56vh,520px);z-index:-1;pointer-events:none;
  background:url(/static/css/art/botanical-left.svg) left bottom/auto 100% no-repeat,
             url(/static/css/art/botanical-right.svg) right bottom/auto 100% no-repeat;
}
/* drifting petals (the .fireflies layer) */
.fireflies{position:fixed;inset:0;z-index:-1;pointer-events:none;overflow:hidden}
.kids-body.sky-day .fireflies{display:none}
.fireflies i{position:absolute;top:-4%;width:10px;height:7px;border-radius:70% 0 70% 0;background:#f2c4c8;opacity:0;
  box-shadow:inset -2px -1px 0 rgba(214,140,150,.35);animation:petal 18s linear infinite}
.fireflies i:nth-child(3n){background:#f7dccf}.fireflies i:nth-child(4n){background:#fff;box-shadow:none}
@keyframes petal{0%{opacity:0;transform:translate(0,0) rotate(0)}8%{opacity:.85}
  50%{transform:translate(40px,55vh) rotate(200deg)}92%{opacity:.7}100%{opacity:0;transform:translate(-20px,108vh) rotate(380deg)}}
@media (prefers-reduced-motion:reduce){.fireflies{display:none}.top .brand{animation:none}}

html body:not(.kids-body) .top{background:rgba(255,252,249,.72);backdrop-filter:blur(14px) saturate(1.2);-webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid rgba(122,110,96,.12);box-shadow:0 4px 24px rgba(150,120,100,.08)}
html body:not(.kids-body) .navlink{color:#5f5a52;border-radius:999px;font-weight:600}
html body:not(.kids-body) .navlink.on,html body:not(.kids-body) .navlink:hover{background:#e6efe6;color:#2f4f3c}
html body:not(.kids-body) .nav-kids{background:none;color:#5f5a52;padding:.42rem .8rem}
html body:not(.kids-body) .nav-kids:hover{background:#e6efe6;color:#2f4f3c}
html body:not(.kids-body) .badge{background:#e2a5a3;color:#fff}

html body:not(.kids-body) .card,html body:not(.kids-body) .login-card{
  background:rgba(255,255,255,.72);backdrop-filter:blur(16px) saturate(1.15);-webkit-backdrop-filter:blur(16px);
  border:1px solid rgba(255,255,255,.9);border-radius:24px;color:var(--ink);
  box-shadow:0 14px 40px rgba(140,110,90,.12),0 1px 0 rgba(255,255,255,.8) inset}
html body:not(.kids-body) .login-card{padding:1.8rem}
html body:not(.kids-body) h1,html body:not(.kids-body) h2{font-family:Georgia,"Times New Roman",serif;font-weight:600;color:#3a4a3e;letter-spacing:.2px}
html body:not(.kids-body) .sub{color:var(--mut)}
html body:not(.kids-body) a:not(.btn):not(.navlink):not(.brand):not(.chip){color:#4f7d62}

html body:not(.kids-body) .btn{background:#7fa58c;color:#fff;box-shadow:0 4px 12px rgba(95,140,110,.25);border-radius:999px;font-weight:700}
html body:not(.kids-body) .btn:hover{background:#6f9a80;filter:none}
html body:not(.kids-body) .btn.ghost{background:#fff;color:#4a5a4e;border:1px solid #dfe7dc;box-shadow:none}
html body:not(.kids-body) .btn.ghost:hover{background:#f3f7f1}
html body:not(.kids-body) .btn.ok{background:#7fb38f;color:#fff}
html body:not(.kids-body) .btn.no{background:#e7a3a8;color:#fff}
html body:not(.kids-body) input,html body:not(.kids-body) select,html body:not(.kids-body) textarea,html body:not(.kids-body) .deny-note{
  background:#fff;color:var(--ink);border:1px solid #e3dcd3;border-radius:12px}
html body:not(.kids-body) input:focus,html body:not(.kids-body) select:focus,html body:not(.kids-body) textarea:focus{outline:2px solid rgba(127,165,140,.55);outline-offset:1px}
html body:not(.kids-body) input[type=checkbox]{accent-color:#7fa58c}
html body:not(.kids-body) .bar{background:#f1ebe4}
html body:not(.kids-body) .chip{background:#f3eee8;color:#5f5a52}
html body:not(.kids-body) .chip.ok{background:#e3efe5;color:#3f7a54}
html body:not(.kids-body) .chip.wait{background:#f7ecd9;color:#93702d}
html body:not(.kids-body) .chip.no{background:#f8e1e3;color:#b5525d}

/* today / meals / recipes on light glass */
html body:not(.kids-body) .allday{background:#fbe9e6;border:1px solid #f2cfcb;color:#7a3a40}
html body:not(.kids-body) .sch{background:rgba(247,242,236,.9)}
html body:not(.kids-body) .sch-t{color:#7d756c}
html body:not(.kids-body) .sch.ev{background:#fbece9;border:1px solid #f2d2ce}
html body:not(.kids-body) .sch.bumped .sch-x{text-decoration-color:rgba(60,50,40,.35)}
html body:not(.kids-body) .days span.on{color:#5f9070}
html body:not(.kids-body) .who{background:#e6efe6;color:#3f7a54}
html body:not(.kids-body) .meal-chip{background:#f5efe8}
html body:not(.kids-body) .mday{background:rgba(250,246,241,.9)}
html body:not(.kids-body) .mday.today{border-color:#9fc2a9}
html body:not(.kids-body) .mslot{border-top:1px solid rgba(122,110,96,.12)}
html body:not(.kids-body) .rcard img,html body:not(.kids-body) .rph{background:#f3ede6}
html body:not(.kids-body) .ing li{border-bottom:1px solid rgba(122,110,96,.12)}
html body:not(.kids-body) .dow-pick label{background:#f5efe8}
html body:not(.kids-body) .foot{color:#6f6a62}
html body:not(.kids-body) table{color:var(--ink)}

/* ---------- day bar: date, live time, weather ---------- */
.daybar{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;
  padding:1rem 1.4rem !important}
.db-when{display:flex;align-items:baseline;gap:.9rem;flex-wrap:wrap}
.db-time{font-family:Georgia,"Times New Roman",serif;font-size:clamp(2rem,5vw,2.7rem);line-height:1;color:#3a4a3e;font-variant-numeric:tabular-nums}
.db-date{font-size:1.05rem;color:#6f675e;font-weight:600}
.db-wx{display:flex;align-items:center;gap:.8rem}
.db-icon{font-size:2.3rem;line-height:1}
.db-temp{font-size:1.9rem;font-weight:700;color:#3e3a35;line-height:1}
.db-more{font-size:.9rem;color:#7d756c;line-height:1.35}
.db-more b{color:#b8666d;font-weight:700}

/* ---------- daily scripture ---------- */
.verse{position:relative;overflow:hidden;text-align:center;padding:1.7rem 1.4rem 1.4rem !important;
  animation:verse-in .9s cubic-bezier(.2,.8,.2,1) both;background:linear-gradient(180deg,rgba(255,250,246,.88),rgba(255,255,255,.74)) !important}
.verse::before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(90% 70% at 50% -10%,rgba(247,214,208,.45),transparent 65%)}
.verse-k{position:relative;font-size:.76rem;letter-spacing:.2em;text-transform:uppercase;color:#9a8f84;margin:0 0 .55rem}
.verse-t{position:relative;font-family:Georgia,"Times New Roman",serif;font-style:italic;font-size:clamp(1.15rem,2.6vw,1.5rem);line-height:1.55;margin:0 auto;max-width:46ch;color:#3e3a35}
.verse-r{position:relative;margin:.75rem 0 0;font-weight:700;color:#c07a7e;letter-spacing:.05em}
.verse-x{position:absolute;top:.55rem;right:.8rem;z-index:1;background:none;border:0;color:#a59a8f;font-size:1.3rem;cursor:pointer}
.verse-x:hover{color:#6f675e}
.verse.hide{display:none}
@keyframes verse-in{from{opacity:0;transform:translateY(14px) scale(.98)}to{opacity:1;transform:none}}

/* ---------- lofi button ---------- */
.lofi{position:fixed;left:14px;bottom:14px;z-index:40;display:flex;align-items:center;gap:.5rem;
  padding:.45rem .85rem .45rem .6rem;border-radius:999px;border:1px solid rgba(255,255,255,.9);
  background:rgba(255,252,249,.85);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  color:#5f5a52;font:600 .85rem/1 "Segoe UI",system-ui,sans-serif;cursor:pointer;box-shadow:0 6px 18px rgba(140,110,90,.15)}
.lofi:hover{background:#fff}
.lofi .eq{display:inline-flex;gap:2px;align-items:flex-end;height:14px;width:16px}
.lofi .eq b{display:block;width:3px;background:#7fa58c;border-radius:2px;height:4px}
.lofi.on .eq b{animation:eq 1.1s ease-in-out infinite}
.lofi.on .eq b:nth-child(2){animation-delay:.25s;background:#e2a5a3}.lofi.on .eq b:nth-child(3){animation-delay:.5s}
@keyframes eq{0%,100%{height:4px}50%{height:14px}}

/* ==========================================================================
   kids: storybook meadow (soft watercolor, classic picture-book palette)
   ========================================================================== */
body.kids-body{
  --ink:#4a3a2b; --mut:#6e5b48; --line:#eadfc8; --card:#fffaf0; --card2:#fbf4e6;
  --acc:#d9a441; --acc2:#b8664d;
  color:var(--ink);
  background:linear-gradient(180deg,#c9dde2 0%,#dfe8e0 34%,#efeedd 62%,#f4ecd8 100%) fixed;
}
body.kids-body::before{ /* painted storybook meadow, one picture per sky (made on the Veriton with Qwen-Image) */
  content:"";position:fixed;inset:0;z-index:-2;pointer-events:none;
  background:url(/static/css/art/kids/day.jpg?v=2) center 70%/cover no-repeat,#cfe0c4;transition:opacity 1s}
body.kids-body.sky-rain::before{background:url(/static/css/art/kids/rain.jpg?v=2) center 70%/cover no-repeat,#b9c3c4}
body.kids-body.sky-night::before{background:url(/static/css/art/kids/night.jpg?v=4) center 70%/cover no-repeat,#13203d}
body.kids-body.sky-storm::before{background:url(/static/css/art/kids/storm.jpg?v=4) center 70%/cover no-repeat,#0f1828}
body.kids-body::after{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;
  background:linear-gradient(180deg,rgba(255,250,238,.0) 40%,rgba(255,250,238,.0))}
@keyframes clouds{from{background-position:0 0,0 10px}to{background-position:0 0,-2000px 10px}}
@media (prefers-reduced-motion:reduce){body.kids-body::before{animation:none}}
body.kids-body:has(.tv)::before,body.kids-body:has(.tv)::after{display:none}

.kids-body .kids-hero{border:7px solid #fbf6ea;border-radius:22px;box-shadow:0 2px 0 #e3d7bd,0 16px 34px rgba(90,70,40,.22)}
.kids-body .kids-title2{color:#fffaf0;font-family:Georgia,"Times New Roman",serif;font-size:1.9rem;font-weight:700;font-style:italic;
  text-shadow:0 2px 0 rgba(60,40,20,.6),0 0 16px rgba(0,0,0,.4)}
.kids-body .tile{border:6px solid #fbf6ea;border-radius:20px;background:#fbf6ea;
  box-shadow:0 2px 0 #e3d7bd,0 12px 24px rgba(90,70,40,.2);transition:transform .2s}
.kids-body .tile:nth-child(odd):hover{transform:translateY(-5px) rotate(-1.2deg)}
.kids-body .tile:nth-child(even):hover{transform:translateY(-5px) rotate(1.2deg)}
.kids-body .tile-name{color:#fffaf0;text-shadow:0 2px 2px rgba(0,0,0,.55)}
.kids-body .tile-text{background:linear-gradient(135deg,#a9b98a,#7f9466);color:#fffaf0}
.kids-body .tile-song{background:#e8c26a;color:#4a3a2b;border-color:#fbf6ea}
.kids-body .juke-link{background:#4f79a3;color:#fff;font-family:Georgia,"Times New Roman",serif;font-style:italic;letter-spacing:.3px;
  box-shadow:0 6px 0 #375b80,0 12px 22px rgba(55,91,128,.3);text-shadow:0 1px 0 rgba(0,0,0,.25)}
.kids-body .juke-link:active{transform:translateY(4px);box-shadow:0 2px 0 #375b80}

.kids-body h1,.kids-body h2,.kids-body .juke-title{color:#4a3a2b;font-family:Georgia,"Times New Roman",serif;text-shadow:0 1px 0 rgba(255,250,240,.8)}
.kids-body .sub{color:#6e5b48}
.kids-body .show-head{background:rgba(255,250,240,.9);border-radius:22px;padding:1rem;box-shadow:0 2px 0 #e3d7bd,0 12px 26px rgba(90,70,40,.16)}
.kids-body .show-poster{border:5px solid #fbf6ea;box-shadow:0 6px 16px rgba(90,70,40,.25)}
.kids-body .season-h{color:#4a3a2b;opacity:1;background:rgba(255,250,240,.85);display:inline-block;padding:.15rem .8rem;border-radius:999px}
.kids-body .ep{background:#fffaf0;border:2px solid #efe4cd;border-radius:14px;color:#4a3a2b;box-shadow:0 2px 0 #e3d7bd}
.kids-body .ep:hover{border-color:#d9a441;transform:translateX(3px)}
.kids-body .ep-num,.kids-body .ep-play{color:#b8664d}
.kids-body .btn{background:#e2b55a;color:#3e2f1f;border-radius:999px;box-shadow:0 4px 0 #b98f3a}
.kids-body .btn.ghost{background:#fffaf0;color:#4a3a2b;border:2px solid #eadfc8;box-shadow:0 3px 0 #e3d7bd}
.kids-body .track{background:#fffaf0;color:#4a3a2b;box-shadow:0 2px 0 #e3d7bd}
.kids-body .track:hover{background:#fbf0d8}
.kids-body .track.playing{background:#e8c26a;color:#3e2f1f}
.kids-body .juke-show{background:rgba(255,250,240,.6);border-radius:22px;padding:.8rem 1rem}
.kids-body .juke-btns .btn{background:#4f79a3;color:#fff;box-shadow:0 4px 0 #375b80}
.kids-body .door-smooth,.kids-body .kids-back{color:#4a3a2b;font-weight:700;opacity:1;background:rgba(255,250,240,.8);
  padding:.35rem .9rem;border-radius:999px;align-self:flex-start}
.kids-body .door-hint{color:#4a3a2b;font-family:Georgia,"Times New Roman",serif;font-style:italic;font-size:1.6rem;text-shadow:0 1px 0 #fffaf0}
.kids-body .door-btn{background:radial-gradient(circle at 35% 30%,#fff3cf,#f1cf7c 50%,#d9a441 100%);
  box-shadow:0 0 0 16px rgba(255,250,235,.45),0 0 70px rgba(240,200,110,.6),inset 0 -12px 26px rgba(150,100,30,.25)}
.kids-body .door-spark{color:#8a5a1c}

/* ---------- home screen ---------- */
.db-hi{display:block;width:100%;font-family:Georgia,"Times New Roman",serif;font-size:1.25rem;color:#6f675e;margin-bottom:.15rem}
.home-tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:.8rem}
.home-tiles a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.35rem;padding:1.1rem .6rem;
  border-radius:20px;background:rgba(255,255,255,.72);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);
  border:1px solid rgba(255,255,255,.9);box-shadow:0 10px 28px rgba(140,110,90,.12);color:#3e3a35 !important;font-weight:700;
  transition:transform .15s,box-shadow .15s}
.home-tiles a:hover,.home-tiles a:focus{transform:translateY(-3px);box-shadow:0 14px 32px rgba(140,110,90,.18)}
.home-tiles .ht-i{width:52px;height:52px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.6rem;background:#eef4ec}
.home-tiles a:nth-child(3n+2) .ht-i{background:#fbeae7}.home-tiles a:nth-child(3n) .ht-i{background:#f7f0e2}
details.rt-card>summary{list-style:none;cursor:pointer;display:flex;align-items:baseline;gap:.8rem}
details.rt-card>summary::-webkit-details-marker{display:none}
details.rt-card>summary h2{margin:0}
details.rt-card[open]>summary{margin-bottom:.6rem}

/* ---------- kids: storybook show cards (title above the picture, cream frame) ---------- */
.kids-body .shelf-h{display:flex;flex-direction:column;align-items:center;gap:.1rem;margin:.6rem 0 .2rem;text-align:center;
  font-family:Georgia,"Times New Roman",serif;font-weight:400;font-size:clamp(1.9rem,4.5vw,2.6rem);letter-spacing:.06em;color:#4a3a2b;position:relative}
.kids-body .shelf-h small{font-family:"Segoe UI",system-ui,sans-serif;font-size:.8rem;letter-spacing:.35em;text-transform:uppercase;color:#7a6650}
.kids-body .shelf-h::before,.kids-body .shelf-h::after{content:"";position:absolute;top:50%;width:46px;height:62px;transform:translateY(-50%);
  background:url(/static/css/art/laurel.svg) center/contain no-repeat}
.kids-body .shelf-h::before{left:calc(50% - 170px)}
.kids-body .shelf-h::after{right:calc(50% - 170px);transform:translateY(-50%) scaleX(-1)}
.kids-body .tiles{grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:1.1rem}
.kids-body .tile{display:flex;flex-direction:column;aspect-ratio:auto;padding:.55rem .55rem .6rem;border:1px solid #e6dcc6;border-radius:14px;
  background:#fbf6ea;box-shadow:0 1px 0 #fff inset,0 8px 20px rgba(90,70,40,.16)}
.kids-body .tile img,.kids-body .tile .tile-text{width:100%;aspect-ratio:4/3.1;height:auto;object-fit:cover;border-radius:10px;
  border:1px solid #e2d6bd;filter:saturate(.82) sepia(.08)}
.kids-body .tile-name{position:static;order:-1;background:none !important;color:#4a3a2b;text-shadow:none;text-align:center;
  font-family:Georgia,"Times New Roman",serif;font-weight:400;font-size:1.15rem;padding:.15rem .3rem .45rem;line-height:1.2}
.kids-body .tile-song{right:14px;bottom:16px;width:46px;height:46px;font-size:1.35rem;border-width:2px;box-shadow:0 3px 8px rgba(60,40,20,.3)}
.kids-body .tile:nth-child(odd):hover,.kids-body .tile:nth-child(even):hover{transform:translateY(-4px)}
.kids-body .tile:hover img{filter:none}

/* kids title sits on a soft parchment ribbon so it reads on any sky */
.kids-body .shelf-h{background:rgba(251,246,234,.86);border-radius:999px;padding:.5rem 4.6rem .55rem;align-self:center;width:max-content;max-width:100%;
  box-shadow:0 8px 24px rgba(60,40,20,.18);margin:.4rem auto .6rem}
.kids-body .shelf-h::before{left:1.2rem}.kids-body .shelf-h::after{right:1.2rem}
.kids-body.sky-dark .tile{box-shadow:0 0 0 1px rgba(255,236,190,.25),0 10px 28px rgba(0,0,0,.45)}
.kids-body.sky-dark .door-smooth,.kids-body.sky-dark .kids-back{background:rgba(251,246,234,.9)}

.kids-body .s-speed-racer img{object-position:center 8%}

/* ---------- kids: see-through cards, ribbon and jukebox so the painting shows (2026-10-07) ---------- */
.kids-body .tile{background:transparent;border:0;box-shadow:none;padding:.2rem .2rem .3rem;border-radius:22px}
.kids-body .tile img,.kids-body .tile .tile-text{border-radius:22px;border:2px solid rgba(255,248,230,.55);
  box-shadow:0 10px 26px rgba(10,15,30,.38);filter:none}
.kids-body .tile-name{color:#fffaf0;font-size:1.22rem;
  text-shadow:0 0 6px rgba(10,15,30,.85),0 0 14px rgba(10,15,30,.55),0 1px 2px rgba(0,0,0,.9)}
.kids-body .tile:hover img,.kids-body .tile:focus img,.kids-body .tile.ss-focus img{border-color:#ffe7a8;box-shadow:0 0 0 3px rgba(255,231,168,.5),0 12px 30px rgba(10,15,30,.45)}
.kids-body .tile-song{bottom:20px;right:18px}
.kids-body .shelf-h{background:transparent;box-shadow:none;color:#fffaf0;
  text-shadow:0 0 8px rgba(10,15,30,.85),0 0 22px rgba(10,15,30,.5),0 2px 2px rgba(0,0,0,.8)}
.kids-body .shelf-h small{color:#f3ead6;text-shadow:0 0 6px rgba(10,15,30,.9),0 1px 2px rgba(0,0,0,.9)}
.kids-body .shelf-h::before,.kids-body .shelf-h::after{filter:drop-shadow(0 0 4px rgba(10,15,30,.7)) brightness(1.35)}
.kids-body .juke-link{background:transparent;border:2px solid rgba(255,248,230,.7);box-shadow:0 0 18px rgba(10,15,30,.25);color:#fffaf0;
  text-shadow:0 0 6px rgba(10,15,30,.9),0 1px 2px rgba(0,0,0,.9)}
.kids-body .juke-link:hover{background:rgba(255,248,230,.12)}
.kids-body .juke-link:active{transform:translateY(2px);box-shadow:0 0 18px rgba(10,15,30,.25)}
.kids-body .kids-back,.kids-body .door-smooth{background:transparent;color:#fffaf0;border:1px solid rgba(255,248,230,.55);
  text-shadow:0 0 6px rgba(10,15,30,.9)}
.kids-body.sky-dark .tile{box-shadow:none}
.kids-body.sky-day .tile-name,.kids-body.sky-rain .tile-name{text-shadow:0 0 3px rgba(20,15,10,.9),0 0 8px rgba(20,15,10,.45),0 1px 1px rgba(0,0,0,.9)}
.kids-body.sky-day .shelf-h,.kids-body.sky-rain .shelf-h{text-shadow:0 0 4px rgba(20,15,10,.85),0 0 12px rgba(20,15,10,.4),0 2px 2px rgba(0,0,0,.7)}
.kids-body.sky-day .juke-link,.kids-body.sky-rain .juke-link{background:rgba(30,40,60,.18);text-shadow:0 0 3px rgba(20,15,10,.9),0 1px 1px rgba(0,0,0,.9)}
/* bright skies: dark storybook ink with a soft cream glow reads better than light text */
.kids-body.sky-day .tile-name,.kids-body.sky-rain .tile-name,.kids-body.sky-day .shelf-h,.kids-body.sky-rain .shelf-h,
.kids-body.sky-day .juke-link,.kids-body.sky-rain .juke-link{color:#3a2a1a;text-shadow:0 0 4px rgba(255,250,236,.95),0 0 10px rgba(255,250,236,.8),0 0 18px rgba(255,250,236,.5)}
.kids-body.sky-day .shelf-h small,.kids-body.sky-rain .shelf-h small{color:#4a3a2b;text-shadow:0 0 4px rgba(255,250,236,.95),0 0 10px rgba(255,250,236,.7)}
.kids-body.sky-day .juke-link,.kids-body.sky-rain .juke-link{background:rgba(255,250,236,.22);border-color:rgba(74,58,43,.45)}
.kids-body.sky-day .shelf-h::before,.kids-body.sky-day .shelf-h::after,.kids-body.sky-rain .shelf-h::before,.kids-body.sky-rain .shelf-h::after{filter:drop-shadow(0 0 4px rgba(255,250,236,.9))}
/* smaller show cards (~25% smaller than before) */
.kids-body .tiles{grid-template-columns:repeat(auto-fill,minmax(138px,1fr));gap:.9rem 1rem;max-width:900px;margin:0 auto;width:100%}
.kids-body .tile-name{font-size:1.02rem;padding:.1rem .2rem .35rem}
.kids-body .tile img,.kids-body .tile .tile-text{border-radius:18px}
.kids-body .tile-song{width:38px;height:38px;font-size:1.1rem;bottom:14px;right:12px}

/* ---------- watched: small soft laser-green checks ---------- */
.done-check,.ep-done{display:inline-flex;align-items:center;justify-content:center;width:1.15em;height:1.15em;margin-left:.3em;border-radius:50%;
  font-size:.72em;font-weight:900;color:#0b2a12;background:#7dff9b;box-shadow:0 0 6px rgba(125,255,155,.75),0 0 14px rgba(125,255,155,.35);
  vertical-align:.12em;text-shadow:none !important;font-family:"Segoe UI",system-ui,sans-serif;font-style:normal;line-height:1}
.ep-done{margin:0 .2rem 0 0}
.ep.seen .ep-title{opacity:.7}
.kids-body .ep.seen{background:rgba(255,250,240,.82)}

/* ---------- keep watching row ---------- */
.kids-body .keep{display:flex;flex-direction:column;gap:.4rem;max-width:900px;margin:0 auto;width:100%}
.kids-body .keep-h{margin:0;text-align:center;font-family:Georgia,"Times New Roman",serif;font-weight:400;font-size:1.35rem;color:#fffaf0;
  text-shadow:0 0 6px rgba(10,15,30,.85),0 1px 2px rgba(0,0,0,.9)}
.kids-body.sky-day .keep-h,.kids-body.sky-rain .keep-h{color:#3a2a1a;text-shadow:0 0 4px rgba(255,250,236,.95),0 0 10px rgba(255,250,236,.8)}
.kids-body .keep-tile{position:relative}
.kids-body .keep-ep{display:block;font-family:"Segoe UI",system-ui,sans-serif;font-size:.72rem;letter-spacing:.06em;opacity:.95}
.kids-body .keep-bar{position:absolute;left:12%;right:12%;bottom:12px;height:5px;border-radius:5px;background:rgba(255,250,236,.45);overflow:hidden}
.kids-body .keep-bar i{display:block;height:100%;background:#7dff9b;box-shadow:0 0 8px rgba(125,255,155,.8)}

/* ---------- jukebox: pick a show, its songs unfold ---------- */
.kids-body .juke-pick{margin:.6rem 0 0;color:#fffaf0;font-family:Georgia,serif;font-style:italic;text-shadow:0 0 6px rgba(10,15,30,.85)}
.kids-body.sky-day .juke-pick,.kids-body.sky-rain .juke-pick{color:#3a2a1a;text-shadow:0 0 4px rgba(255,250,236,.95)}
.kids-body .juke-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(138px,1fr));gap:.9rem 1rem;max-width:900px;margin:0 auto;width:100%}
.kids-body .juke-show{background:none;padding:0;margin:0;border-radius:18px}
.kids-body .juke-show[open]{grid-column:1/-1;background:rgba(251,246,234,.9);padding:.8rem 1rem 1rem;box-shadow:0 12px 30px rgba(10,15,30,.35)}
.kids-body .juke-card{list-style:none;cursor:pointer;display:flex;flex-direction:column;gap:.3rem}
.kids-body .juke-card::-webkit-details-marker{display:none}
.kids-body .juke-card img,.kids-body .juke-card .tile-text{width:100%;aspect-ratio:4/3.1;object-fit:cover;border-radius:18px;border:2px solid rgba(255,248,230,.55);box-shadow:0 10px 26px rgba(10,15,30,.38)}
.kids-body .juke-name{order:-1;text-align:center;font-family:Georgia,serif;font-size:1.02rem;color:#fffaf0;text-shadow:0 0 6px rgba(10,15,30,.85),0 1px 2px rgba(0,0,0,.9)}
.kids-body .juke-name small{display:block;font-family:"Segoe UI",sans-serif;font-size:.72rem;opacity:.9}
.kids-body.sky-day .juke-name,.kids-body.sky-rain .juke-name{color:#3a2a1a;text-shadow:0 0 4px rgba(255,250,236,.95),0 0 10px rgba(255,250,236,.8)}
.kids-body .juke-show[open] .juke-card{display:none}
.kids-body .juke-songs-h{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap;margin-bottom:.4rem}
.kids-body .juke-songs-h h2{margin:0 auto 0 0;color:#4a3a2b;text-shadow:none}
.kids-body .juke-show[open] .juke-songs{animation:unfold .35s ease-out}
@keyframes unfold{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}
.kids-body .juke-card:focus-visible img{border-color:#ffe7a8}
.kids-body .juke-title{color:#fffaf0;text-shadow:0 0 8px rgba(10,15,30,.85),0 2px 2px rgba(0,0,0,.8)}
.kids-body.sky-day .juke-title,.kids-body.sky-rain .juke-title{color:#3a2a1a;text-shadow:0 0 4px rgba(255,250,236,.95),0 0 12px rgba(255,250,236,.8)}
/* dedication under the title (about 30% smaller than the old line) */
.kids-body .shelf-h small.dedication{font-size:.56rem;letter-spacing:.22em}

/* ---------- watch-in-order lock ---------- */
.ep.locked{opacity:.5;cursor:not-allowed;filter:grayscale(.4)}
.kids-body .ep.locked{background:rgba(255,250,240,.55);box-shadow:none}
.kids-body .ep.locked:hover{transform:none;border-color:#efe4cd}
.ep-lock{font-size:.95rem;opacity:.8}
.ep.up-next{border-color:#7dff9b !important;box-shadow:0 0 0 2px rgba(125,255,155,.35),0 0 14px rgba(125,255,155,.3)}
.ep-next{font-size:.72rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:#1d5a2c;background:#c9ffd6;border-radius:999px;padding:.1rem .5rem;margin-right:.3rem}
.lock-note{margin:.1rem 0 .6rem;font-size:.9rem}
.kids-body .lock-note{background:rgba(255,250,240,.85);color:#4a3a2b;border-radius:14px;padding:.45rem .8rem}
.parent-unlock{display:flex;flex-wrap:wrap;gap:.4rem;align-items:center;margin:0 0 .7rem;background:rgba(255,250,240,.85);border-radius:14px;padding:.45rem .7rem}
.tv-lockmsg{position:absolute;left:50%;bottom:12%;transform:translateX(-50%);z-index:5;background:rgba(10,15,30,.82);color:#fff;font-weight:800;
  font-size:clamp(1rem,2.4vw,1.4rem);padding:.7rem 1.2rem;border-radius:999px;box-shadow:0 0 0 2px rgba(125,255,155,.45)}
.kids-body.sky-dark .eps-h{color:#fffaf0;text-shadow:0 0 6px rgba(10,15,30,.85),0 1px 2px rgba(0,0,0,.9)}
.kids-body.sky-day .eps-h,.kids-body.sky-rain .eps-h{text-shadow:0 0 4px rgba(255,250,236,.95),0 0 10px rgba(255,250,236,.8)}
.ph-by{font-size:.72rem;font-weight:700;background:rgba(255,255,255,.85);color:#4a5a4e;border-radius:999px;padding:.1rem .5rem;margin-right:auto}
.ph-ok{background:#e3efe5;color:#2f6b45;border-radius:12px;padding:.45rem .8rem;font-weight:700}
.ph-help{margin-top:.8rem}.ph-help summary{cursor:pointer;font-weight:700}
/* ---------- photos page ---------- */
.ph-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:.6rem}
.ph{position:relative;margin:0;border-radius:14px;overflow:hidden;aspect-ratio:1;background:rgba(0,0,0,.06);content-visibility:auto;contain-intrinsic-size:auto 130px}
.ph img{width:100%;height:100%;object-fit:cover;display:block}
.ph figcaption{position:absolute;left:0;right:0;bottom:0;display:flex;gap:.3rem;align-items:center;justify-content:flex-end;padding:.35rem;
  background:linear-gradient(transparent,rgba(0,0,0,.45))}
.ph-b{border:0;border-radius:999px;background:rgba(255,255,255,.88);width:30px;height:30px;font-size:.95rem;cursor:pointer}
.ph-hidden img{opacity:.35;filter:grayscale(1)}
.ph-add{cursor:pointer}
/* lofi button in Kids World: sits above the mini player, readable on every sky */
.kids-body .lofi{background:rgba(251,246,234,.82);color:#4a3a2b;border-color:rgba(255,255,255,.8)}
.kids-body.sky-dark .lofi{background:rgba(12,18,40,.7);color:#e6ecf5;border-color:rgba(190,210,235,.2)}
body.has-mp .lofi{bottom:96px}
/* ---------- videos ---------- */
.ph-tabs{display:flex;gap:.5rem}
.ph-tabs a{padding:.45rem 1rem;border-radius:999px;background:rgba(255,255,255,.6);font-weight:700;color:#4a5a4e !important}
.ph-tabs a.on{background:#7fa58c;color:#fff !important}
.ph-tabs small{opacity:.75;font-weight:500}
html body.sky-dark .ph-tabs a{background:rgba(255,255,255,.08);color:#e9eef5 !important}
html body.sky-dark .ph-tabs a.on{background:#6fbfb0;color:#06201c !important}
.vid-play{all:unset;cursor:pointer;display:block;width:100%;height:100%;position:relative}
.vid-play img{width:100%;height:100%;object-fit:cover}
.vid-tri{position:absolute;left:50%;top:45%;transform:translate(-50%,-50%);width:46px;height:46px;border-radius:50%;background:rgba(0,0,0,.5);color:#fff;
  display:flex;align-items:center;justify-content:center;font-size:1.2rem;padding-left:3px}
.vid-len{position:absolute;right:6px;top:6px;background:rgba(0,0,0,.6);color:#fff;font-size:.72rem;border-radius:6px;padding:.05rem .35rem}
.vid-wait{display:flex;align-items:center;justify-content:center;height:100%;font-size:.85rem;text-align:center;padding:.5rem;color:#6f675e}
.vid-box{position:fixed;inset:0;z-index:100;background:rgba(0,0,0,.88);display:flex;align-items:center;justify-content:center}
.vid-box[hidden]{display:none}
.vid-box video{max-width:96vw;max-height:90vh;border-radius:12px}
.vid-x{position:absolute;top:14px;right:16px;border:0;background:rgba(255,255,255,.9);border-radius:999px;width:42px;height:42px;font-size:1.1rem;cursor:pointer}

/* ---------- the magic door (replaces the big button, 2026-10-07) ---------- */
.kids-body .door-wrap{gap:.6rem;justify-content:flex-end;padding-bottom:9vh}
.mdoor{position:relative;background:none;border:0;padding:0;cursor:pointer;width:min(74vw,380px);aspect-ratio:720/815;
  -webkit-tap-highlight-color:transparent;animation:mdoor-breathe 5s ease-in-out infinite;transition:transform .9s cubic-bezier(.3,.1,.2,1)}
.mdoor img{position:relative;width:100%;height:100%;object-fit:contain;display:block;
  filter:drop-shadow(0 18px 18px rgba(20,30,20,.35)) drop-shadow(0 0 26px rgba(255,214,130,.35))}
.mdoor-light{position:absolute;left:22%;right:22%;top:22%;bottom:12%;border-radius:45% 45% 8% 8%;
  background:radial-gradient(closest-side,rgba(255,236,170,.85),rgba(255,206,110,.35) 60%,transparent);filter:blur(14px);
  animation:mdoor-glow 3.2s ease-in-out infinite}
.mdoor:hover,.mdoor:focus-visible{transform:scale(1.03)}
.mdoor:focus-visible{outline:none}
.mdoor:focus-visible img{filter:drop-shadow(0 0 30px rgba(255,226,150,.9))}
.mdoor-sparks i{position:absolute;width:6px;height:6px;border-radius:50%;background:#fff6c8;box-shadow:0 0 10px 3px rgba(255,226,140,.7);
  opacity:0;animation:mdoor-spark 4.5s ease-in-out infinite}
.mdoor-sparks i:nth-child(1){left:18%;top:30%}.mdoor-sparks i:nth-child(2){left:80%;top:22%;animation-delay:.8s}
.mdoor-sparks i:nth-child(3){left:12%;top:62%;animation-delay:1.6s}.mdoor-sparks i:nth-child(4){left:86%;top:58%;animation-delay:2.3s}
.mdoor-sparks i:nth-child(5){left:50%;top:8%;animation-delay:3s}.mdoor-sparks i:nth-child(6){left:66%;top:80%;animation-delay:3.7s}
@keyframes mdoor-breathe{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}
@keyframes mdoor-glow{0%,100%{opacity:.55}50%{opacity:1}}
@keyframes mdoor-spark{0%,100%{opacity:0;transform:translateY(6px) scale(.6)}40%{opacity:1}70%{opacity:.4;transform:translateY(-16px) scale(1)}}
.mdoor.open{transform:scale(1.35);animation:none}
.mdoor.open .mdoor-light{opacity:1;animation:none;inset:5%;filter:blur(20px)}
.mdoor-flash{position:fixed;inset:0;pointer-events:none;background:radial-gradient(circle at 50% 60%,#fff8dc,#ffe7a8 40%,rgba(255,231,168,0) 75%);
  opacity:0;transition:opacity .8s ease-in .15s;z-index:50}
.door-opening .mdoor-flash{opacity:1}
.kids-body .door-hint{color:#fffaf0;text-shadow:0 0 12px rgba(40,30,15,.75),0 0 2px rgba(40,30,15,.9),0 0 22px rgba(255,220,140,.35)}
@media (prefers-reduced-motion:reduce){.mdoor,.mdoor-light,.mdoor-sparks i{animation:none}}

/* ---------- installed app on phones (2026-10-07): page runs behind the system bars, nav is one swipeable row ---------- */
html body{padding-bottom:env(safe-area-inset-bottom)}
html body .top{padding-top:max(.6rem,env(safe-area-inset-top))}
html body .lofi{bottom:calc(14px + env(safe-area-inset-bottom))}
@media (max-width:700px){
  html body .top{flex-wrap:wrap;gap:.35rem;padding-left:14px;padding-right:0}
  html body .top .brand{font-size:1.35rem}
  html body .top nav{flex:1 0 100%;display:flex;flex-wrap:nowrap;overflow-x:auto;gap:.15rem;padding:0 14px .35rem 0;
    scrollbar-width:none;-webkit-overflow-scrolling:touch;mask-image:linear-gradient(90deg,#000 88%,transparent)}
  html body .top nav::-webkit-scrollbar{display:none}
  html body .top .navlink{white-space:nowrap;flex:0 0 auto;padding:.45rem .8rem;font-size:.95rem}
}

/* drag photos/videos onto the Photos page from a computer */
body.ph-drag::after{content:"Drop to add to the family album";position:fixed;inset:12px;z-index:60;display:flex;align-items:center;justify-content:center;
  border:3px dashed rgba(127,165,140,.9);border-radius:24px;background:rgba(246,241,234,.82);color:#2f4a3a;font:700 1.6rem/1.2 Georgia,serif;pointer-events:none}
@media (hover:none){.ph-dropnote{display:none}}