.bedtime-hero { display:grid; grid-template-columns:minmax(0,1.3fr) minmax(230px,.7fr); align-items:center; gap:clamp(20px,4vw,48px); }
.bedtime-hero h1 { max-width:15ch; }
.bedtime-hero img { display:block; width:100%; aspect-ratio:1/1; object-fit:cover; border-radius:24px; box-shadow:0 16px 32px #3f285d24; }
.bedtime-player { max-width:800px; padding:clamp(22px,4vw,38px); border:1px solid #ddd1e9; border-radius:24px; background:linear-gradient(130deg,#f5effb,#fff8e9); box-shadow:0 12px 28px #3f285d13; }
.bedtime-player h2,.bedtime-ritual h2 { font-family:'Baloo 2',sans-serif; font-weight:800; color:#3f285d; }
.bedtime-player p { line-height:1.65; }
.bedtime-controls { display:flex; flex-wrap:wrap; gap:12px; margin:22px 0 10px; }
.bedtime-controls button { min-height:48px; padding:10px 20px; border:1px solid #9d6536; border-radius:10px; background:linear-gradient(180deg,#fbe0a0,#f1bf74 54%,#d9944e); box-shadow:inset 0 2px 0 #fff4d3,0 3px 0 #8b542d; color:#40294d; cursor:pointer; font:800 16px/1.2 'Nunito',sans-serif; }
.bedtime-controls button:hover { filter:brightness(1.04); }
.bedtime-controls button:focus-visible { outline:3px solid #73539b; outline-offset:3px; }
.bedtime-controls button:disabled { opacity:.55; cursor:default; }
.bedtime-status { min-height:1.5em; color:#62516c; font-size:14px; }
.bedtime-ritual { max-width:800px; }
.bedtime-ritual p { line-height:1.7; }
.bedtime-back { margin:0 auto 3rem; padding:0 34px; max-width:980px; }
.cottage-lullaby { margin-block:28px; padding:clamp(22px,4vw,38px); border:1px solid #e1d6ea; border-radius:24px; background:linear-gradient(120deg,#f3ecf8,#fff7e6); box-shadow:0 10px 24px #3f285d12; }
.cottage-lullaby h2 { margin:4px 0 10px; font-family:'Baloo 2',sans-serif; font-weight:800; font-size:clamp(28px,3vw,40px); color:#3f285d; }
.cottage-lullaby p { margin-bottom:16px; }
@media(max-width:760px) { .bedtime-hero { grid-template-columns:1fr; } .bedtime-hero img { max-width:500px; aspect-ratio:3/2; } .bedtime-back { padding:0 20px; } .bedtime-controls button { flex:1 1 auto; } }

/* The night palette follows through from header to footer on this page. */
.bedtime-page #main {
  color: #fff5e4;
  padding: 18px 0 40px;
  background: radial-gradient(ellipse at 52% 42%, #30375c 0%, #202848 48%, #17213e 100%);
}
.bedtime-page #main .resource-hero h1,
.bedtime-page #main .resource-section h2,
.bedtime-page #main .eyebrow { color: #fff1d9; }
.bedtime-page #main .resource-lead,
.bedtime-page #main .resource-section p,
.bedtime-page #main .bedtime-status { color: #f5eee7; }
.bedtime-page #main a { color: #ffdd9b; text-decoration-thickness: 1px; text-underline-offset: 3px; }
.bedtime-page #main a:hover { color: #ffedc6; }
.bedtime-page #main a:focus-visible { outline: 3px solid #f7c877; outline-offset: 4px; border-radius: 3px; }
.bedtime-page #main .resource-section {
  background: rgba(35, 43, 78, .85);
  border: 1px solid rgba(249, 203, 130, .34);
  box-shadow: inset 0 1px 0 rgba(255, 228, 182, .08), 0 14px 28px rgba(10, 13, 35, .22), 0 0 22px rgba(246, 184, 96, .07);
}
.bedtime-page #main .bedtime-player {
  background: linear-gradient(125deg, rgba(48, 51, 83, .88), rgba(61, 49, 71, .82));
  border: 1px solid rgba(255, 205, 128, .53);
  box-shadow: 0 0 0 1px rgba(255, 221, 163, .06), 0 0 52px rgba(247, 181, 75, .24), 0 18px 34px rgba(8, 12, 32, .25);
}
.bedtime-page .bedtime-hero img {
  aspect-ratio: 4 / 3;
  object-fit: cover;
  box-shadow: 0 0 0 1px rgba(255, 220, 160, .18), 0 14px 35px rgba(8, 12, 32, .35), 0 0 38px rgba(252, 183, 83, .12);
}
.bedtime-page #main .bedtime-controls button {
  background: linear-gradient(180deg, #ffe4ae 0%, #efbd74 54%, #dc9652 100%);
  color: #32254a;
  border-color: #ac713c;
  box-shadow: inset 0 2px 0 #fff4da, 0 3px 0 #8b542d;
}
.bedtime-page #main .bedtime-controls button:disabled { opacity: .78; }
.bedtime-page #main .bedtime-controls button:focus-visible { outline: 3px solid #ffe3a1; outline-offset: 4px; }
.bedtime-page #main .bedtime-back { margin-top: 32px; }
@media (max-width: 760px) {
  .bedtime-page #main .bedtime-hero img { max-width: none; width: 100%; aspect-ratio: 4 / 3; }
}

/* Bedtime-only night header and footer: shared structure, gentle dark colours. */
.bedtime-page { background:#17213e; color:#fff1df; }
.bedtime-page .site-header { color:#fff1df; }
.bedtime-page .site-header .wordmark,
.bedtime-page .site-header .wordmark-copy strong,
.bedtime-page .site-header .wordmark-copy small { color:#fff1df; }
.bedtime-page .site-header .colly-nav-parent,
.bedtime-page .site-header .colly-nav-toggle { color:#fff1df; }
.bedtime-page .site-header .colly-nav-parent:hover,
.bedtime-page .site-header .colly-nav-parent:focus-visible,
.bedtime-page .site-header .colly-nav-group.is-open > .colly-nav-parent { background:#354164; color:#fff6e6; }
.bedtime-page .site-header .colly-nav-group--grown > .colly-nav-parent { background:#303958; color:#fff1df; }
.bedtime-page .site-header .colly-nav-toggle { background:#303958; border-color:rgba(255,226,176,.35); }
.bedtime-page .site-header .colly-nav-dropdown { background:#273252; border-color:rgba(255,226,176,.22); }
.bedtime-page .site-header .colly-nav-dropdown a { color:#fff1df; }
.bedtime-page .site-header .colly-nav-dropdown a:hover,
.bedtime-page .site-header .colly-nav-dropdown a:focus-visible { background:#3e4b70; color:#fff9ec; outline-color:#f7cf8a; }
.bedtime-page .site-footer { color:#fff1df; border-top-color:rgba(255,226,176,.2); }
.bedtime-page .site-footer a { color:#ffe1a4; }
.bedtime-page .site-footer a:focus-visible,
.bedtime-page .site-header a:focus-visible,
.bedtime-page .site-header button:focus-visible { outline:3px solid #f7cf8a; outline-offset:3px; }
/* Only the warmly lit player is framed; the containing section is plain. */
.bedtime-page #main .resource-section.bedtime-player-section {
  background:transparent; border:0; box-shadow:none; padding:0;
}
.bedtime-page #main .bedtime-player { margin-inline:auto; }
/* The Play button regains its full amber colour after Stop or the song's end. */
.bedtime-page #main #bedtime-play:not(:disabled) { opacity:1; filter:none; }
/* A few background stars glow softly without interfering with controls. */
.bedtime-page #main { position:relative; isolation:isolate; }
.bedtime-page #main::before {
  content:""; position:absolute; inset:0; pointer-events:none; z-index:0; opacity:.52;
  background-image:
    radial-gradient(circle 2px at 7% 12%,#ffebbd 0 1.5px,transparent 2px),
    radial-gradient(circle 2px at 17% 40%,#f4e9ce 0 1px,transparent 2px),
    radial-gradient(circle 2px at 88% 18%,#ffebbd 0 1.5px,transparent 2px),
    radial-gradient(circle 2px at 92% 61%,#f4e9ce 0 1px,transparent 2px),
    radial-gradient(circle 2px at 11% 78%,#ffebbd 0 1.5px,transparent 2px),
    radial-gradient(circle 2px at 74% 89%,#f4e9ce 0 1px,transparent 2px);
  animation:bedtime-stars 12s ease-in-out infinite alternate;
}
.bedtime-page #main > * { position:relative; z-index:1; }
@keyframes bedtime-stars { from { opacity:.32; } to { opacity:.72; } }
@media (prefers-reduced-motion:reduce) { .bedtime-page #main::before { animation:none; opacity:.52; } }
@media (max-width:760px) {
  .bedtime-page .site-header .colly-nav-groups { background:#273252; }
  .bedtime-page .site-header .colly-nav-dropdown a { background:#303c60; border-color:rgba(255,226,176,.18); }
  .bedtime-page .site-header .colly-nav-dropdown { background:transparent; }
}