/* The children's book keeps the approved night/gold theatre, with a softer ateliê.
   Existing serif is the book's voice; DM Sans remains the readable UI type.
   DESIGN_VARIANCE 7 / MOTION_INTENSITY 5 / VISUAL_DENSITY 4, preserve mode.
   Layers: decorative art 0, content 1, inherited header 20. No pointer tracking. */
.adventure-world{--adventure-blue:#152c59;position:relative;isolation:isolate;overflow:clip;background:radial-gradient(ellipse at 75% 6%,#1b3159 0,transparent 38%),var(--night)}
.adventure-hero{position:relative;display:grid;grid-template-columns:1.2fr .8fr;align-items:center;gap:80px;padding-block:58px 72px;min-height:min(690px,calc(100dvh - var(--header-height)))}
.adventure-hero-copy{position:relative;z-index:1}
.adventure-hero h1{font-size:clamp(52px,6vw,88px);line-height:1.08;max-width:700px}
.adventure-hero-copy>p:not(.eyebrow){font-size:17px;line-height:1.75;max-width:420px;margin-top:24px}
.adventure-actions{display:flex;align-items:center;gap:26px;flex-wrap:wrap;margin-top:30px}
.adventure-actions .text-link{border:0;background:transparent;padding:12px 0;color:var(--gold);min-height:48px}
.adventure-book{justify-self:center;position:relative;width:min(100%,300px);transform:rotate(5deg);padding:0 0 15px 10px}
.adventure-book:before{content:'';position:absolute;inset:12px 0 62px 17px;background:#bec4c4;transform:translate(5px,0);border-radius:2px;box-shadow:0 25px 70px #03091299}
.adventure-book img{position:relative;width:100%;border-radius:3px;box-shadow:-8px 0 0 #172443,0 0 0 1px #e6c58240}
.adventure-book figcaption{position:relative;text-align:center;margin-top:24px;color:var(--gold);font-size:13px;letter-spacing:.02em;transform:rotate(-5deg)}
.adventure-stars{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.adventure-stars span{position:absolute;color:var(--gold);font-family:Georgia,serif;font-size:25px;opacity:.55}
.adventure-stars span:nth-child(1){top:13%;left:53%;font-size:38px}
.adventure-stars span:nth-child(2){top:74%;left:59%;font-size:52px}
.adventure-stars span:nth-child(3){top:9%;right:6%}
.adventure-stars span:nth-child(4){top:48%;right:0;font-size:33px}
.adventure-stars span:nth-child(5){top:91%;left:37%;font-size:17px}
.scene-map{border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin-bottom:42px}
.scene-map summary{cursor:pointer;list-style:none;display:flex;align-items:center;justify-content:space-between;gap:20px;min-height:68px;font-size:15px;color:var(--ink)}
.scene-map summary::-webkit-details-marker{display:none}
.scene-map summary>span,.play-prompt summary>span{font-size:24px;color:var(--gold);transition:transform .2s var(--ease)}
.scene-map[open] summary>span,.play-prompt[open] summary>span{transform:rotate(45deg)}
.scene-strip{display:flex;gap:14px;overflow-x:auto;padding:8px 6px 26px;scroll-snap-type:x proximity;scrollbar-color:var(--gold) var(--surface)}
.scene-strip button{flex:0 0 126px;position:relative;display:grid;grid-template-columns:22px 1fr;align-content:start;gap:10px 8px;padding:8px;background:transparent;border:1px solid transparent;color:var(--muted);text-align:left;scroll-snap-align:start}
.scene-strip img{width:100%;height:130px;object-fit:cover;grid-column:1/-1;border-radius:3px;opacity:.7;transition:opacity .2s,transform .2s}
.scene-strip button>span{font-size:11px;line-height:1.4}
.scene-strip .scene-number{color:var(--gold);font-size:13px;font-variant-numeric:tabular-nums}
.scene-strip button[aria-current],.scene-strip button:hover{border-color:var(--line);color:var(--ink)}
.scene-strip button[aria-current] img,.scene-strip button:hover img{opacity:1;transform:translateY(-3px)}
.adventure-stage{scroll-margin-top:calc(var(--header-height) + 22px);border:1px solid var(--line);border-radius:20px;background:#0d192d;margin-bottom:60px}
.adventure-stage-header{padding:24px 32px;display:flex;justify-content:space-between;align-items:center;gap:25px;border-bottom:1px solid var(--line);background:#14233c;border-radius:20px 20px 0 0}
.adventure-stage-header>div:first-child{display:flex;align-items:center;gap:16px}
.stage-symbol{font-size:36px;color:var(--gold)}
.adventure-stage-header p{color:var(--ink);font-size:15px;font-weight:600}
.adventure-stage-header p>span{display:block;color:var(--muted);font-size:11px;font-weight:400;margin-top:3px}
.adventure-stage .mode-tabs{border:1px solid #e6c58233;border-radius:10px;padding:4px;gap:3px;align-items:center;flex-shrink:0}
.adventure-stage .mode-tabs button,.adventure-stage .mode-tabs a{padding:10px 14px;border-radius:7px;font-size:12px;min-height:44px;white-space:nowrap}
.adventure-stage .mode-tabs button.selected{background:var(--gold);color:var(--night);font-weight:600}
.adventure-stage .mode-tabs button.selected:after{display:none}
.adventure-stage .mode-tabs a{color:var(--gold);display:flex;gap:7px;align-items:center}
.adventure-stage .reader-workspace{padding:30px 32px 32px;gap:38px;grid-template-columns:minmax(0,1.25fr) minmax(275px,.85fr)}
.adventure-stage .reader-side{top:100px;padding-top:39px}
.adventure-stage [data-mode=paint] .reader-side{display:flex;flex-direction:column}
.adventure-stage [data-mode=paint] .paint-controls{order:-1;margin-top:0;padding-top:0;border-top:0}
.adventure-stage [data-mode=paint] .scene-copy{border-top:1px solid var(--line);padding-top:24px;margin-top:26px}
.adventure-stage [data-mode=paint] #reading-size{display:none}
.sheet-caption{min-height:39px;display:flex;justify-content:space-between;gap:10px;align-items:start;color:var(--muted);font-size:11px}
.sheet-caption button{background:transparent;color:var(--gold);padding:0 0 8px;min-height:30px;font-size:11px;text-align:right}
.adventure-stage .reader-sheet{border:8px solid #dcd2bc;border-radius:5px;overflow:hidden;box-shadow:0 14px 40px #03091255;aspect-ratio:786/1100}
.adventure-stage .reader-sheet>img,.adventure-stage .reader-sheet canvas{width:100%;height:100%;object-fit:fill}
.adventure-stage .reader-paging button{font-size:13px;min-height:44px}
.adventure-stage .reader-paging select{border-radius:7px;min-height:44px}
.adventure-stage .scene-copy h2{font-size:clamp(28px,2.6vw,38px);line-height:1.2;letter-spacing:-.025em}
.adventure-stage .scene-copy p{font-size:16px;line-height:1.8}
.adventure-stage .scene-copy blockquote{position:relative;margin:25px 0;padding:18px 20px;background:#1b2b43;border-radius:2px 16px 16px 16px;font-size:27px}
.adventure-stage .large-reading .scene-copy p{font-size:21px}
.adventure-stage .large-reading .scene-copy blockquote{font-size:32px}
.adventure-stage .narration-note{font-size:13px;line-height:1.7}
.adventure-stage .narration-note>span:first-child{color:var(--gold);font-size:30px;line-height:1}
.adventure-stage .narration-note span span{display:block;font-size:12px;color:var(--muted);margin-top:8px}
.adventure-stage .narration-note:hover strong{color:var(--gold)}
.adventure-stage .paint-controls{margin-top:26px;padding-top:24px}
.adventure-stage .paint-controls h3{font-size:26px;letter-spacing:-.025em}
.tool-help{font-size:12px;line-height:1.65;margin-block:12px 16px;min-height:40px}
.adventure-stage .paint-toolbar{gap:7px;margin-bottom:23px}
.adventure-stage .paint-toolbar button{border-radius:8px;min-height:44px;font-size:13px}
.adventure-stage .palette{grid-template-columns:repeat(8,minmax(0,1fr));gap:9px}
.adventure-stage .swatch{max-width:none;height:auto;min-height:30px;border:2px solid #faf7ed44;box-shadow:inset 0 -4px 0 #0002}
.adventure-stage .swatch.selected:after{border-width:2px}
.adventure-stage .custom-color,.adventure-stage .brush-size{font-size:13px}
.adventure-stage input[type=color]{width:48px;height:40px;border:1px solid var(--line);background:var(--night);padding:4px;border-radius:6px;cursor:pointer}
.adventure-stage .painting-actions button{min-height:44px;border-radius:8px;font-size:13px}
.adventure-stage #download-paint{grid-column:1/-1}
.play-prompt{border-top:1px solid var(--line);margin-top:28px;padding-top:12px}
.play-prompt summary{cursor:pointer;list-style:none;display:flex;align-items:center;justify-content:space-between;gap:15px;min-height:48px;font-size:14px;color:var(--gold)}
.play-prompt summary::-webkit-details-marker{display:none}
.play-prompt h3{font-size:25px;margin-top:12px;letter-spacing:-.02em}
.play-prompt p{font-size:14px;line-height:1.8;margin-top:12px;padding-bottom:10px}
.grownup-note{border-top:1px solid var(--line);padding-top:14px;margin-top:18px}
.grownup-note summary{font-size:12px;cursor:pointer;color:var(--gold);min-height:35px}
.grownup-note p{font-size:12px;line-height:1.7}
.dream-prompts{padding-top:26px;margin-top:26px;border-top:1px solid var(--line)}
.dream-prompts>p:first-child{font-size:15px;color:var(--ink)}
.dream-prompts>div{display:flex;flex-wrap:wrap;gap:7px;margin-block:14px}
.dream-prompts button{background:#1b2b43;border:1px solid var(--line);border-radius:8px;color:var(--gold);padding:10px 12px;font-size:12px;min-height:44px}
#dream-prompt{font-size:13px;line-height:1.8;min-height:72px}
.adventure-next{display:grid;grid-template-columns:50px 1fr auto;gap:30px;align-items:center;padding-block:25px 90px}
.adventure-next>span{color:var(--gold);font-size:44px;align-self:start}
.adventure-next h2{font-size:clamp(30px,3vw,42px);letter-spacing:-.025em;line-height:1.2}
.adventure-next p{margin-top:20px;font-size:14px;max-width:480px;line-height:1.8}
.listening-hero{position:relative;display:grid;grid-template-columns:.8fr 1.2fr;gap:100px;align-items:center;padding-block:70px 90px;min-height:calc(100dvh - var(--header-height))}
.listening-art{position:relative;padding:20px 0 20px 20px}
.listening-art>img{position:relative;width:min(100%,320px);border-radius:4px;transform:rotate(-5deg);box-shadow:0 25px 70px #03091288;z-index:1}
.record-ring{position:absolute;bottom:8%;right:-16%;border:1px solid var(--line);background:repeating-radial-gradient(circle,#152540 0px,#152540 3px,#20314d 4px,#152540 5px);border-radius:50%;width:230px;height:230px;display:grid;place-items:center;font-size:65px;color:var(--gold)}
.listening-copy{position:relative;z-index:1}
.listening-copy h1{font-size:clamp(45px,4.5vw,67px);line-height:1.12;letter-spacing:-.03em}
.listening-copy>p:not(.eyebrow){font-size:16px;max-width:500px;margin-top:25px;line-height:1.8}
.listening-player{position:relative;padding:26px 28px;margin-top:30px;border:1px solid var(--line);border-radius:16px;background:#14233c}
.listening-player h2{font-size:27px;letter-spacing:-.025em;line-height:1.2;padding-right:30px}
.listening-player p{margin-top:15px;font-size:14px;line-height:1.8}
.listening-mark{position:absolute;right:22px;top:20px;font-size:30px;color:var(--gold)}
.listening-copy>.text-link{margin-top:28px;font-size:13px}
.listening-copy .adventure-actions{gap:14px}
.listening-copy .adventure-actions .button{gap:16px;padding-inline:18px}
.audio-error{color:var(--gold);font-size:13px;margin-top:12px}
.listening-together{border-top:1px solid var(--line);padding-block:65px 85px;max-width:820px;text-align:center}
.listening-together h2{font-size:clamp(32px,4vw,50px);line-height:1.2}
.listening-together p{max-width:570px;margin:25px auto;font-size:16px;line-height:1.8}
details summary:focus-visible{outline:2px solid var(--gold);outline-offset:5px}
@media(prefers-reduced-motion:no-preference){
 html:not([data-motion=off]) .adventure-book{animation:book-arrive .7s cubic-bezier(.2,0,0,1) both}
 html:not([data-motion=off]) .adventure-hero-copy{animation:story-arrive .6s cubic-bezier(.2,0,0,1) both}
 @keyframes book-arrive{from{opacity:0;transform:translateY(25px) rotate(9deg)}to{opacity:1;transform:translateY(0) rotate(5deg)}}
 @keyframes story-arrive{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}
}
@media(max-width:1100px){
 .adventure-hero{gap:45px}.adventure-book{max-width:260px}
 .adventure-stage-header{padding:20px;flex-wrap:wrap}.adventure-stage .reader-workspace{padding:22px;gap:24px;grid-template-columns:minmax(0,1.1fr) minmax(250px,.9fr)}
 .adventure-stage .palette{grid-template-columns:repeat(6,minmax(0,1fr));gap:12px}
 .listening-hero{gap:65px}.record-ring{width:180px;height:180px}
 .listening-copy .adventure-actions .button{font-size:12px}
 .adventure-next{grid-template-columns:40px 1fr}.adventure-next>.button{grid-column:2;justify-self:start}
}
@media(max-width:760px){
 .adventure-hero{gap:25px;grid-template-columns:1fr;padding-block:35px 38px;min-height:auto}
 .adventure-hero h1{font-size:clamp(47px,11vw,72px)}
 .adventure-hero .eyebrow{font-size:10px;margin-bottom:18px}
 .adventure-hero-copy>p:not(.eyebrow){font-size:15px;max-width:370px;margin-top:19px}
 .adventure-actions{gap:20px;margin-top:23px}
 .adventure-actions .button{padding-inline:18px;font-size:13px}
 .adventure-actions .text-link{font-size:13px}
 .adventure-book{width:200px;max-width:60%;margin-block:12px 5px}
 .adventure-book figcaption{font-size:11px;margin-top:18px}
 .adventure-stars span:nth-child(1){top:52%;left:5%}.adventure-stars span:nth-child(2){top:85%;left:auto;right:2%}
 .scene-map{margin-bottom:26px}.scene-map summary{font-size:14px;min-height:62px}
 .adventure-stage{border-radius:14px}.adventure-stage-header{border-radius:14px 14px 0 0;padding:15px;gap:16px}
 .adventure-stage-header>div:first-child{gap:12px}.stage-symbol{font-size:29px}
 .adventure-stage-header p{font-size:14px}
 .adventure-stage .mode-tabs{display:grid;width:100%;grid-template-columns:1fr 1fr;gap:3px}
 .adventure-stage .mode-tabs button{font-size:12px;padding-inline:6px}
 .adventure-stage .mode-tabs a{grid-column:1/-1;justify-content:center;font-size:12px;min-height:38px}
 .adventure-stage .reader-workspace{grid-template-columns:1fr;padding:18px 13px 25px;gap:24px}
 .adventure-stage .reader-side{position:static;padding-top:0}
 .sheet-caption{font-size:10px;gap:8px;align-items:start}
 .sheet-caption button{font-size:10px;min-height:32px}
 .adventure-stage .reader-sheet{border-width:5px}
 .adventure-stage .reader-paging select{max-width:130px;font-size:11px}
 .adventure-stage .reader-paging button{font-size:12px}
 .adventure-stage .scene-copy h2{font-size:30px}
 .adventure-stage .paint-controls{padding-top:0;margin-top:0;margin-bottom:5px;border-top:0}
 .adventure-stage .palette{grid-template-columns:repeat(6,minmax(0,1fr));gap:12px}
 .adventure-stage .swatch{min-height:38px;min-width:0}
 .adventure-stage .mobile-paintbar{top:calc(var(--header-height) + 5px);background:#0d192d;padding:10px 0;margin-bottom:12px;border-radius:8px}
 .adventure-stage .mobile-paintbar .swatch{min-height:40px;min-width:40px;width:40px;height:40px}
 .adventure-stage .grownup-note{margin-bottom:20px}
 .adventure-next{grid-template-columns:25px 1fr;gap:15px;padding-block:0 55px}
 .adventure-next>span{font-size:29px}.adventure-next h2{font-size:30px}.adventure-next p{font-size:14px}
 .adventure-next>.button{max-width:100%;gap:15px;padding-inline:17px;font-size:12px}
 .listening-hero{grid-template-columns:1fr;gap:32px;padding-block:40px 50px;min-height:auto}
 .listening-art{order:2;justify-self:center;width:220px;padding:10px 20px 20px 0}
 .record-ring{width:125px;height:125px;right:-20px;font-size:35px}
 .listening-copy h1{font-size:clamp(42px,10vw,64px)}
 .listening-copy .eyebrow{font-size:10px;margin-bottom:18px}
 .listening-copy>p:not(.eyebrow){font-size:15px;margin-top:20px}
 .listening-player{padding:22px 20px;margin-top:22px}
 .listening-player h2{font-size:25px}.listening-player p{font-size:13px}
 .listening-copy .adventure-actions{gap:12px}.listening-copy .adventure-actions .button{min-height:48px;flex:1;max-width:300px}
 .listening-together{padding-block:40px 55px}.listening-together p{font-size:15px}
}
@media print{.adventure-hero,.scene-map,.adventure-stage-header,.adventure-next,.sheet-caption,.play-prompt{display:none!important}.adventure-world,.adventure-stage{background:white;border:0;margin:0}.adventure-stage .reader-workspace{display:block;padding:0}.adventure-stage .reader-sheet{border:0;aspect-ratio:auto}}