/* Compact migration layout. Original book artwork and all editorial content retained. */
/* Critical fix: an HTML height attribute must not keep the cover 1224 CSS px tall. */
.book-cover { width:100%; height:auto; aspect-ratio:22/17; object-fit:contain; }
.hero-inner { padding-top:42px; padding-bottom:48px; gap:42px; }
.hero-copy { padding-bottom:0; }
.hero h1 { margin-bottom:20px; }
.hero-text { margin-bottom:22px; }
.header-inner { min-height:88px; }
.section { padding-top:60px; padding-bottom:60px; }
.mission-head, .book-head { gap:40px; }
.values { margin-top:30px; gap:28px; }
.value { padding-top:18px; }
.value-number { margin-bottom:12px; }
.book-head { margin-bottom:28px; }
.belong { gap:48px; }
.game-layout { gap:40px; }
.facts-head { margin-bottom:28px; }
.facts { row-gap:26px; }
.fact { padding-top:17px; }
.fact .icon { margin-bottom:10px; }
.give { margin-top:32px; padding:26px 30px; }
.contact { padding:42px 36px; }
.contact-inner { gap:40px; }
.contact h2 { margin-bottom:18px; }
.signup-pending { padding:22px; border:1px dashed #a78abf; border-radius:12px; background:#f9f5ff; }
.signup-pending h3 { font-size:22px; line-height:1.25; margin:0 0 12px; }
.signup-pending p { font-size:15px; margin:0 0 18px; }
.signup-pending .privacy { margin-bottom:0!important; }
@media (min-width:1450px) { .hero-inner { padding-top:54px; padding-bottom:58px; } }
@media (max-width:1000px) { .hero-inner { gap:30px; }.contact { padding:36px 24px; } }
@media (max-width:700px) {
  .wrap { padding-left:22px; padding-right:22px; }
  .header-inner { min-height:76px; }
  .brand-small { font-size:13px; }
  .brand-large { font-size:25px; }
  .nav-cta { padding:9px 12px; }
  .hero-inner { gap:26px; padding-top:28px; padding-bottom:38px; }
  .hero h1 { font-size:clamp(38px,10.4vw,48px); line-height:1.05; margin-bottom:18px; }
  .hero .eyebrow { margin-bottom:13px; }
  .hero-text { font-size:16px; line-height:1.6; margin-bottom:20px; }
  .hero-art { width:88%; max-width:380px; padding:0 8px; margin:8px auto 0; }
  .hero-art:before { inset:-12px -14px -12px; }
  .hero-art:after { inset:8px -4px -16px 14px; }
  .book-label { width:78px; height:78px; bottom:5px; right:-9px; font-size:9px; }
  .book-label span { font-size:18px; }
  .actions { gap:16px; }
  .btn { min-height:48px; padding:13px 19px; }
  .ribbon { padding:11px 9px; font-size:10px; }
  .ribbon span { margin:0 7px; }
  .section { padding-top:36px; padding-bottom:36px; }
  h2 { font-size:36px; margin-top:10px; margin-bottom:18px; }
  .mission-head, .book-head, .belong, .contact-inner { gap:18px; }
  .values { margin-top:24px; gap:18px; }
  .value { padding-top:14px; }
  .value-number { margin:0; }
  .book-head { margin-bottom:23px; }
  .samples { gap:22px; }
  .sample-note { margin-top:16px; }
  .belong aside { padding-left:18px; }
  .belong aside p { margin-bottom:14px; }
  .game-layout { gap:22px; }
  .game-title { font-size:38px; }
  .game-intro { margin-bottom:10px; }
  .theo-greeting { margin-top:6px; }
  .theo-greeting img { width:84px; height:91px; }
  .ocean-play { height:310px; }
  .game-status { min-height:42px; margin-top:11px; }
  .game-safety { margin-top:10px; }
  .facts-head { margin-bottom:22px; }
  .facts-head p { margin-top:16px; }
  .facts { gap:22px 18px; }
  .fact { padding-top:14px; }
  .fact h3 { margin-bottom:9px; }
  .fact p { margin-bottom:9px; }
  .give { padding:24px 22px; margin-top:26px; gap:18px; }
  .contact { padding:28px 10px; }
  .contact .wrap { padding-left:14px; padding-right:14px; }
  .contact h2 { font-size:37px; }
  .contact-inner { gap:24px; }
  .signup-pending { padding:19px; }
  .site-footer { padding:20px 0; }
}

/* Theodore interest preview: native page fields, with no embedded form frame. */
.google-signup { min-width:0; }
.google-signup h3 { font-size:23px; line-height:1.25; margin:0 0 10px; }
.google-form-intro { font-size:14px!important; margin:0 0 17px!important; line-height:1.6; }
.google-form-intro a,.privacy a { text-underline-offset:3px; }
.interest-form { display:grid; grid-template-columns:1fr; gap:15px; max-width:610px; }
.interest-form .field { display:flex; flex-direction:column; gap:5px; min-width:0; color:var(--ink); font-size:14px; font-weight:bold; line-height:1.45; }
.interest-form .field span,.required-note { color:#62566e; font-size:11px; font-weight:normal; line-height:1.45; }
.interest-form input:not([type=checkbox]):not([type=radio]),.interest-form textarea { display:block; width:100%; min-width:0; min-height:58px; border:1px solid #b6a8c4; border-radius:12px; padding:13px 15px; background:#fff; color:var(--ink); font:16px var(--sans); box-shadow:inset 0 1px 2px rgba(46,32,61,.04); transition:border-color .18s,box-shadow .18s; }
.interest-form textarea { min-height:92px; resize:vertical; }
.interest-form input:focus-visible,.interest-form textarea:focus-visible { outline:3px solid var(--pink); outline-offset:2px; border-color:var(--pink); }
.field-row { display:grid; grid-template-columns:1fr 1fr; gap:18px; }
.form-consent,.radio-option { display:flex; align-items:flex-start; gap:12px; min-height:30px; font-size:14px; line-height:1.55; }
.form-consent input,.radio-option input { flex:0 0 24px; width:24px; height:24px; margin:0; accent-color:var(--pink); }
.marketing-choice { border:0; border-top:1px solid #c9bad7; padding:13px 0 0; margin:1px 0 0; min-width:0; }
.marketing-choice legend { padding:0 0 10px; font-size:14px; font-weight:bold; }
.marketing-choice legend .required-note { display:block; padding-top:2px; }
.radio-option { margin:0 0 12px; }
.radio-option:last-child { margin-bottom:0; }
.shipping-details { border-top:1px solid #c9bad7; padding-top:13px; font-size:13px; }
.shipping-details summary { cursor:pointer; font-weight:bold; text-decoration:underline; text-underline-offset:3px; min-height:32px; }
.shipping-details p { margin:8px 0 12px!important; font-size:12px!important; line-height:1.6; }
.shipping-details .field { margin-top:12px; }
.form-bottom { margin-top:2px; }
.form-bottom .btn { width:100%; min-height:60px; font-size:15px; }
.form-bottom .btn[disabled] { opacity:1; cursor:not-allowed; background:var(--pink); border-color:var(--pink); color:#fff; }
.preview-notice { margin:10px 0 0!important; text-align:center; font-size:12px!important; line-height:1.55; font-weight:bold; color:#554767; }
.google-form-note { font-size:12px!important; line-height:1.6; margin:13px 0 0!important; color:#594f65; }
.privacy { margin-top:16px!important; }
@media(max-width:700px) { .google-signup h3 { font-size:22px; }.field-row { gap:12px; }.interest-form { gap:14px; }.interest-form .field { font-size:13px; }.form-consent,.radio-option { font-size:13px; } }
@media(max-width:380px) { .field-row { grid-template-columns:1fr; } }
@media(prefers-reduced-motion:reduce) { .interest-form input,.interest-form textarea { transition:none; } }

/* Interactive book sneak peek */
.book-reader { max-width:1050px; margin:0 auto; outline:none; }
.book-reader:focus-visible { outline:3px solid var(--pink); outline-offset:7px; border-radius:10px; }
.reader-stage { position:relative; display:grid; place-items:center; min-height:220px; padding:18px; overflow:hidden; border:1px solid #cad9d2; border-radius:9px; background:#fbf7f1; box-shadow:0 12px 28px rgba(23,63,71,.10); touch-action:pan-y; }
.reader-image { display:block; width:100%; height:auto; max-height:min(62vw,520px); object-fit:contain; }
.reader-image.is-turning { animation:reader-turn .24s ease-out both; }
@keyframes reader-turn { from { opacity:.45; transform:translateX(9px); } to { opacity:1; transform:translateX(0); } }
.reader-enlarge { position:absolute; right:25px; bottom:25px; min-height:48px; padding:10px 17px; border:1px solid rgba(23,63,71,.25); border-radius:30px; background:rgba(251,247,241,.96); color:var(--ink); font:700 13px var(--sans); cursor:pointer; box-shadow:0 4px 12px rgba(23,63,71,.12); transition:transform .18s,background .18s; }
.reader-enlarge:hover { background:#fff; transform:translateY(-2px); }
.reader-controls { display:grid; grid-template-columns:1fr auto 1fr; gap:16px; align-items:center; width:100%; margin:17px 0 0; }
.reader-nav { display:inline-flex; align-items:center; justify-content:center; gap:11px; min-width:120px; min-height:50px; padding:10px 17px; border:1px solid #9db7b4; border-radius:30px; background:#f7faf6; color:var(--ink); font:700 14px var(--sans); cursor:pointer; transition:background .18s,transform .18s; }
.reader-nav:first-child { justify-self:start; }
.reader-nav:last-child { justify-self:end; }
.reader-nav:hover:not(:disabled) { background:#fff; transform:translateY(-1px); }
.reader-nav:disabled { opacity:.48; cursor:not-allowed; }
.reader-nav span[aria-hidden=true] { font-size:18px; line-height:1; }
.reader-count { margin:0; text-align:center; font-size:13px; line-height:1.45; font-weight:bold; color:#4c666b; }
.reader-label { margin:13px 0 0; text-align:center; font:normal 24px/1.25 var(--serif); color:var(--ink); }
.book-reader .sample-note { margin:12px 0 0; text-align:center; color:#526b6d; font-size:13px; }
.reader-hint { margin:9px 0 0; text-align:center; color:#526b6d; font-size:11px; line-height:1.5; }
.reader-dialog { width:min(1160px,96vw); max-width:1160px; padding:20px; }
.reader-dialog .modal-header { margin-bottom:15px; }
.reader-dialog .close { min-width:84px; min-height:48px; }
.reader-dialog .reader-dialog-stage { max-width:1080px; margin:0 auto; outline:none; }
.reader-dialog .reader-dialog-stage:focus-visible { outline:3px solid var(--pink); outline-offset:4px; }
.reader-dialog #sample-image { display:block; width:100%; height:auto; max-height:calc(88vh - 150px); margin:0 auto; object-fit:contain; }
.reader-dialog .reader-label { margin-top:11px; }
.reader-dialog .reader-count { font-size:12px; }
@media(max-width:700px) {
  .reader-stage { min-height:160px; padding:9px; }
  .reader-image { max-height:60vw; }
  .reader-enlarge { right:14px; bottom:14px; min-height:48px; padding:9px 13px; font-size:12px; }
  .reader-controls { gap:8px; margin-top:13px; }
  .reader-nav { min-width:105px; min-height:50px; padding:9px 12px; gap:7px; font-size:13px; }
  .reader-count { font-size:11px; }
  .reader-label { font-size:22px; }
  .book-reader .sample-note { font-size:12px; }
  .reader-dialog { padding:12px; }
  .reader-dialog #sample-image { max-height:calc(78vh - 120px); }
}
@media(max-width:380px) {
  .reader-controls { grid-template-columns:1fr 1fr; }
  .reader-count { grid-column:1/-1; grid-row:1; }
  .reader-nav:first-child { grid-column:1; grid-row:2; }
  .reader-nav:last-child { grid-column:2; grid-row:2; }
}
@media(prefers-reduced-motion:reduce) {
  .reader-image.is-turning { animation:none; }
  .reader-enlarge,.reader-nav { transition:none; }
}
.reader-side{display:block;margin:12px auto 0;min-height:48px;padding:9px 18px;border:1px solid #8aaba7;border-radius:26px;background:#fff;color:var(--ink);font:700 13px var(--sans);cursor:pointer}
.reader-side[hidden]{display:none}
.reader-dialog .reader-side{margin-bottom:2px}
.reef-safety{position:sticky;bottom:10px}
@media(prefers-reduced-motion:reduce){.reef-safety{scroll-behavior:auto}}
.reader-zoom-tools{display:flex;justify-content:center;flex-wrap:wrap;gap:8px;margin:12px auto 0}
.reader-zoom-tools .reader-nav{min-width:94px;min-height:48px}
/* Reader: clip only artwork; controls and zoom stay outside this viewport. */
.reader-stage{display:block;min-height:0;padding:12px;overflow:visible;aspect-ratio:auto}
.reader-viewport{position:relative;width:100%;aspect-ratio:22/17;overflow:hidden;border-radius:5px;background:#f7f2e8;touch-action:pan-y}
.reader-viewport[data-spread="true"]{aspect-ratio:44/17}
.reader-image{position:absolute;inset:0;width:100%;height:100%;max-height:none;object-fit:contain;transform:translate(0,0);transition:none}
.reader-image.is-turning{animation:reader-turn .24s ease-out both}
.reader-enlarge{position:relative;right:auto;bottom:auto;display:block;margin:12px auto 0;z-index:2}
.reader-dialog{overflow-y:auto;max-height:96vh}
.reader-dialog .reader-dialog-stage{max-width:1080px;margin:0 auto;height:auto;min-height:0;overflow:visible}
.reader-dialog .reader-viewport{max-height:min(64vh,640px)}
.reader-dialog .reader-viewport[data-spread="false"]{width:min(100%,68vh);margin-inline:auto}
.reader-dialog .reader-viewport[data-spread="true"]{aspect-ratio:44/17}
.reader-zoom-tools{position:relative;z-index:3}
.reader-zoom-tools .reader-nav{min-width:54px}
.reader-zoom-hint{width:100%;margin:0;text-align:center;font-size:12px;color:#526b6d}
.reader-dialog .reader-controls{margin-top:12px}
.reader-image[data-spread="true"]{width:100%;height:100%}
.reader-dialog #sample-image{width:100%;height:100%;max-height:none;object-fit:contain;transform:translate(var(--pan-x,0px),var(--pan-y,0px)) scale(var(--reader-scale,1));transform-origin:center center;touch-action:none;cursor:grab}
@media(max-width:700px){.reader-dialog .reader-viewport{max-height:none}}
@media(prefers-reduced-motion:reduce){.reader-image.is-turning{animation:none}}
@keyframes reader-turn{from{opacity:.5}to{opacity:1}}
