/* Prep & Pretend premium overlay: The Little Worlds Atelier. */
:root{
  --atelier-paper:#fffdf5;
  --atelier-paper-deep:#f3ecd8;
  --atelier-sky:#c6e1e5;
  --atelier-sky-deep:#a9d2da;
  --atelier-ink:#123f57;
  --atelier-ink-soft:#30596c;
  --atelier-teal:#176c6b;
  --atelier-coral:#bc493d;
  --atelier-gold:#e7b64a;
  --atelier-line:rgba(18,63,87,.18);
  --atelier-shadow-1:0 10px 30px rgba(18,63,87,.10);
  --atelier-shadow-2:0 28px 70px rgba(18,63,87,.18);
  --atelier-shadow-book:0 32px 85px rgba(18,63,87,.24),0 8px 22px rgba(18,63,87,.12);
  --atelier-ease:cubic-bezier(.2,.8,.2,1);
  --atelier-ease-out:cubic-bezier(.16,1,.3,1);
  --pointer-x:50%;
  --pointer-y:28%;
}
html{background:var(--atelier-sky-deep);scroll-behavior:smooth;scrollbar-color:#6d9eaa var(--atelier-sky)}
body.story-site{
  min-height:100dvh;color:var(--atelier-ink);overflow-x:hidden;
  background:
    radial-gradient(900px 560px at var(--pointer-x) var(--pointer-y),rgba(255,253,245,.52),transparent 66%),
    radial-gradient(1200px 680px at 50% 16%,rgba(255,255,255,.28),transparent 70%),
    linear-gradient(180deg,#cce5e8 0%,#b8dce2 48%,#a9d2da 100%);
  background-attachment:fixed;
}
body.story-site::before{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:0;
  box-shadow:inset 0 0 160px rgba(18,63,87,.10);
}
body.story-site>*{position:relative;z-index:1}
::selection{background:var(--atelier-gold);color:var(--atelier-ink)}

.story-header.site-header{
  position:sticky;top:14px;z-index:80;width:min(1320px,calc(100% - 32px));max-width:none;
  min-height:78px;margin:14px auto 12px;padding:12px 20px;
  border:1px solid rgba(18,63,87,.12);border-radius:16px;
  background:rgba(255,253,245,.88);
  box-shadow:0 12px 38px rgba(18,63,87,.12),inset 0 1px rgba(255,255,255,.8);
  backdrop-filter:blur(14px) saturate(1.08);-webkit-backdrop-filter:blur(14px) saturate(1.08);
  transition:transform .22s var(--atelier-ease),background .22s var(--atelier-ease);
}
.story-header.site-header.is-scrolled{
  background:rgba(255,253,245,.95);
  box-shadow:0 16px 42px rgba(18,63,87,.17),inset 0 1px rgba(255,255,255,.88);
}
.story-header .brand{min-width:190px}
.story-header .approved-wordmark{width:154px;height:auto;clip-path:inset(0 0 10% 0);transition:transform .22s var(--atelier-ease)}
.story-header .brand:hover .approved-wordmark{transform:translateY(-1px)}
.story-header .approved-wordmark-tagline{margin-top:-7px;font-size:.61rem;letter-spacing:.045em;color:var(--atelier-ink-soft);opacity:.88}
.story-header nav{gap:6px!important;padding:5px;background:rgba(198,225,229,.42);border-radius:12px}
.story-header nav a{
  min-height:42px;display:inline-flex;align-items:center;padding:9px 13px;border-radius:9px;color:var(--atelier-ink);
  transition:background .2s var(--atelier-ease),color .2s var(--atelier-ease),transform .2s var(--atelier-ease);
}
.story-header nav a:hover{background:var(--atelier-paper);color:var(--atelier-teal);transform:translateY(-1px)}
.story-header nav a:active{transform:translateY(0) scale(.98)}
.story-header a:focus-visible{outline:3px solid var(--atelier-coral);outline-offset:3px}

.book-workspace{
  position:relative;isolation:isolate;
  padding-top:clamp(24px,4vw,58px)!important;padding-bottom:clamp(36px,5vw,78px)!important;
}
.book-workspace::before{
  content:"";position:absolute;z-index:-2;width:min(1050px,82vw);height:420px;left:50%;top:17%;
  transform:translateX(-50%);border-radius:50%;
  background:radial-gradient(ellipse at center,rgba(255,253,245,.58),rgba(255,253,245,.12) 52%,transparent 74%);
  filter:blur(24px);pointer-events:none;
}
.book-workspace::after{
  content:"";position:absolute;z-index:-1;left:50%;bottom:46px;width:min(980px,74vw);height:72px;
  transform:translateX(-50%);border-radius:50%;background:rgba(18,63,87,.12);filter:blur(30px);pointer-events:none;
}
.book-engine{transition:filter .28s var(--atelier-ease),transform .5s var(--atelier-ease-out)}
.book-spread{
  border:1px solid rgba(18,63,87,.10);border-radius:14px!important;
  box-shadow:var(--atelier-shadow-book)!important;overflow:hidden;
}
.book-spread::before{
  content:"";position:absolute;inset:0;pointer-events:none;z-index:9;border-radius:inherit;
  box-shadow:inset 0 1px rgba(255,255,255,.82),inset 0 -1px rgba(18,63,87,.05);
}
.book-engine::after{
  height:10px!important;bottom:-7px!important;background:linear-gradient(180deg,#ede3c8,#d6c399)!important;
  box-shadow:0 14px 30px rgba(18,63,87,.16)!important;border-radius:0 0 12px 12px;
}

.book-engine.is-cover{max-width:540px!important;perspective:1400px}
.is-cover .book-spread{
  border-radius:7px 18px 18px 7px!important;
  transform:perspective(1400px) rotateX(var(--cover-rx,0deg)) rotateY(var(--cover-ry,0deg));transform-origin:center;
  box-shadow:0 44px 100px rgba(18,63,87,.28),0 12px 28px rgba(18,63,87,.16),inset -1px 0 rgba(255,255,255,.5)!important;
}
.is-cover .book-spread::after{
  left:0!important;width:18px!important;background:linear-gradient(90deg,rgba(87,67,31,.22),rgba(255,255,255,.08) 55%,transparent)!important;
}
.cover-page{padding:40px 34px 28px!important}
.cover-title{max-width:92%;filter:drop-shadow(0 1px rgba(255,253,245,.85))}
.cover-title h1,.cover-title h2{font-size:clamp(3rem,4vw,3.85rem)!important;letter-spacing:-.028em!important;line-height:.99!important;text-wrap:balance}
.cover-title p{font-size:1rem!important;font-weight:700;letter-spacing:.01em}
.cover-open{
  min-width:205px;border:1px solid rgba(255,255,255,.20);border-radius:12px!important;padding:14px 22px!important;
  box-shadow:0 12px 28px rgba(18,63,87,.28),inset 0 1px rgba(255,255,255,.16)!important;
  transition:transform .22s var(--atelier-ease),background .22s var(--atelier-ease)!important;
}
.cover-open:hover{transform:translateY(-2px)!important;box-shadow:0 18px 32px rgba(18,63,87,.30),inset 0 1px rgba(255,255,255,.18)!important}
.cover-open:active{transform:translateY(0) scale(.985)!important}
.book-bookmark{
  top:-12px!important;right:24px!important;padding:11px 19px 16px!important;border-radius:3px 3px 8px 8px!important;
  background:linear-gradient(180deg,#c45143,#a8382d)!important;box-shadow:0 10px 20px rgba(88,37,31,.20)!important;
}

.book-engine.is-reference .book-spread{box-shadow:0 38px 90px rgba(18,63,87,.22),0 8px 22px rgba(18,63,87,.10)!important}
.map-spread{padding:38px 52px 42px!important;background:linear-gradient(145deg,#eef8f8 0%,#e3f1f3 100%)!important}
.map-spread h1,.map-spread h2{font-size:clamp(2.3rem,3.5vw,3.4rem)!important;letter-spacing:-.025em}
.world-map{border-radius:12px;overflow:hidden;box-shadow:0 18px 48px rgba(18,63,87,.18),0 2px 8px rgba(18,63,87,.08);border:1px solid rgba(18,63,87,.14)}
.world-map>a rect{fill:rgba(255,253,245,.96)!important;stroke:rgba(18,63,87,.34)!important;stroke-width:1!important;filter:drop-shadow(0 4px 7px rgba(18,63,87,.12))}
.world-map>a{transition:filter .18s var(--atelier-ease)}
.world-map>a:hover,.world-map>a:focus-visible{filter:drop-shadow(0 8px 12px rgba(18,63,87,.24))}
.world-map>a:hover rect,.world-map>a:focus-visible rect{fill:#fffdf5!important;stroke:var(--atelier-teal)!important}
.world-map>a:focus-visible{outline:none}
.map-preview{border:1px solid rgba(18,63,87,.14)!important;border-radius:12px!important;box-shadow:0 20px 48px rgba(18,63,87,.20)!important;background:rgba(255,253,245,.97)!important}

.page-pair,.book-world,.book-kit,.chapter-pair{background:transparent}
.book-page{background:var(--atelier-paper);position:relative}
.book-page:first-child{box-shadow:inset -1px 0 rgba(18,63,87,.08)}
.book-page:last-child{box-shadow:inset 1px 0 rgba(255,255,255,.9)}
.book-world .book-page:first-child,.book-kit .book-page:first-child{background:var(--tint)!important}
.book-world .book-page h1,.book-world .book-page h2{letter-spacing:-.025em}
.world-heading-icon{filter:drop-shadow(0 6px 8px rgba(18,63,87,.12))}
.world-story{font-size:1.02rem!important;line-height:1.62!important}
.sample-choice,.chapter-world-list button{
  border-radius:10px!important;
  transition:transform .2s var(--atelier-ease),background .2s var(--atelier-ease)!important;
}
.sample-choice:hover,.chapter-world-list button:hover{transform:translateY(-2px);box-shadow:0 8px 18px rgba(18,63,87,.10)}
.sample-choice[aria-pressed="true"]{box-shadow:inset 0 0 0 1px rgba(18,63,87,.18),0 8px 18px rgba(18,63,87,.08)}
.book-sheet-scene{background:linear-gradient(150deg,#fffdf7 0%,#f4ecd8 100%)!important}
.scene-pages{gap:24px!important}
.scene-sheet{
  box-shadow:0 16px 34px rgba(18,63,87,.16)!important;
  transition:transform .2s var(--atelier-ease)!important;
}
.scene-sheet:hover{transform:translateY(-4px)!important;box-shadow:0 24px 42px rgba(18,63,87,.22)!important}
.scene-sheet span{background:rgba(255,253,245,.96)!important;border-top:1px solid rgba(18,63,87,.08)}

.book-controls{
  bottom:16px!important;padding:10px!important;border:1px solid rgba(18,63,87,.12);border-radius:14px!important;
  background:rgba(255,253,245,.88)!important;box-shadow:0 14px 34px rgba(18,63,87,.14),inset 0 1px rgba(255,255,255,.9)!important;
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
}
.book-controls a,.book-controls button,.book-controls select{min-height:44px;border-radius:9px!important;border-color:rgba(18,63,87,.20)!important}
.book-controls a:hover,.book-controls button:hover{background:#eef6f4!important;color:var(--atelier-teal)}
.book-controls select{background:#fffdf8!important}
.book-hint{color:rgba(18,63,87,.8)!important;letter-spacing:.01em}

.preview-dialog{border-radius:14px!important;box-shadow:0 34px 110px rgba(6,30,57,.58)!important}
.preview-dialog::backdrop{background:rgba(6,30,45,.72)!important;backdrop-filter:blur(4px)}
.preview-sheet img,.buyer-preview img,.bundle-world img{transition:transform .22s var(--atelier-ease),filter .22s var(--atelier-ease)}
.preview-sheet:hover img,.buyer-preview:hover img{transform:translateY(-3px);filter:saturate(1.03)}

.book-resource .book-workspace{max-width:1240px;margin-inline:auto}
.resource-engine{max-width:1120px!important}
.resource-engine .book-spread{background:var(--atelier-paper)!important}
.book-resource-page{
  background:radial-gradient(700px 300px at 100% 0,rgba(198,225,229,.34),transparent 72%),var(--atelier-paper)!important;
  padding:clamp(30px,5vw,66px)!important;
}
.book-resource-page>main,.book-resource-page>div{max-width:none}
.book-resource-page h1{font-size:clamp(2.65rem,5vw,5rem)!important;letter-spacing:-.035em;max-width:13ch}
.book-resource-page h2{letter-spacing:-.018em}
.book-resource-page .button{box-shadow:0 10px 22px rgba(18,63,87,.14)}

.catalog-heading{padding-top:64px!important;padding-bottom:50px!important}
.catalog-heading h1{font-size:clamp(3.2rem,5vw,5.4rem)!important;letter-spacing:-.038em!important;max-width:11ch!important}
.catalog-heading p{font-size:1.18rem!important;max-width:54ch}
.catalog-grid{gap:54px 28px!important}
.catalog-item{position:relative}
.catalog-art{
  border:1px solid rgba(18,63,87,.10);border-radius:14px;box-shadow:0 12px 30px rgba(18,63,87,.10);
  transition:transform .22s var(--atelier-ease),border-color .22s var(--atelier-ease);
}
.catalog-item:hover .catalog-art{transform:translateY(-5px);box-shadow:0 24px 42px rgba(18,63,87,.16);border-color:rgba(18,63,87,.18)}
.catalog-art img{filter:drop-shadow(0 12px 14px rgba(18,63,87,.12))!important}
.catalog-item-text h3{font-size:1.5rem!important;letter-spacing:-.01em}
.price-link{padding-top:3px;color:var(--atelier-ink)}
.price-link span{color:var(--atelier-teal)}
.catalog-filters button{min-height:44px;transition:transform .18s var(--atelier-ease),background .18s var(--atelier-ease),border-color .18s var(--atelier-ease)}
.catalog-filters button:hover{transform:translateY(-1px);border-color:rgba(18,63,87,.38);background:rgba(255,253,245,.68)}

.buyer-guide{
  border:1px solid rgba(18,63,87,.12)!important;border-radius:14px!important;
  box-shadow:0 24px 60px rgba(18,63,87,.14)!important;background:linear-gradient(150deg,#fffdf8 0%,#f7f2e5 100%)!important;
}
.buyer-guide-panel{padding:clamp(28px,4.3vw,54px)!important}
.buyer-facts>div,.buyer-two-columns>section,.buyer-center-card{
  border-color:rgba(18,63,87,.12)!important;border-radius:12px!important;background:rgba(232,242,242,.72)!important;
}
.buyer-preview{border-color:rgba(18,63,87,.14)!important;border-radius:10px!important;box-shadow:0 8px 20px rgba(18,63,87,.08)}
.buyer-preview:hover,.buyer-preview:focus-visible{box-shadow:0 18px 34px rgba(18,63,87,.14)!important}
.buyer-checkout{border-radius:12px!important;background:linear-gradient(135deg,#dfeeed,#edf5ef)!important;border:1px solid rgba(23,108,107,.14)}

.bundle-offer,.bundle-option,.bundle-closer{border-color:rgba(18,63,87,.14)!important}
.bundle-offer.compact{border-radius:14px;background:linear-gradient(145deg,#e5efea,#f5f3e7)!important;box-shadow:var(--atelier-shadow-1)}
.bundle-world img{filter:drop-shadow(0 10px 12px rgba(18,63,87,.12))!important}
.bundle-world:hover img{transform:translateY(-4px) scale(1.015)}
.matrix-scroll{border-radius:12px;border:1px solid rgba(18,63,87,.12);background:rgba(255,253,245,.72);box-shadow:0 10px 28px rgba(18,63,87,.08)}
.matrix-table th,.matrix-table td{padding:15px 12px!important}

.button{
  border-radius:10px!important;min-height:50px;box-shadow:0 9px 20px rgba(18,63,87,.12);
  transition:transform .18s var(--atelier-ease),background .18s var(--atelier-ease)!important;
}
.button:hover{transform:translateY(-2px);box-shadow:0 14px 25px rgba(18,63,87,.16)}
.button:active{transform:translateY(0) scale(.985);box-shadow:0 6px 14px rgba(18,63,87,.12)}
.text-link{transition:color .18s var(--atelier-ease),border-color .18s var(--atelier-ease)}
.text-link:hover{color:var(--atelier-teal)}

.story-footer{
  margin-top:0!important;padding:28px 24px 34px!important;color:rgba(255,253,245,.82)!important;
  background:linear-gradient(180deg,#123f57,#0e3447)!important;border-top:1px solid rgba(255,255,255,.10);
}
.story-footer>a{color:#fffdf5}
.story-footer-directory>summary{color:#fffdf5;text-decoration-color:rgba(255,253,245,.45)}
.story-footer-nav{border-top-color:rgba(255,255,255,.16)!important}
.story-footer-nav a{color:rgba(255,253,245,.82)}
.story-footer-nav a:hover{color:#fffdf5}

@keyframes atelier-arrive{
  from{opacity:.001;transform:translateY(18px) scale(.985);filter:blur(4px)}
  to{opacity:1;transform:translateY(0) scale(1);filter:blur(0)}
}
.premium-ready .book-engine.is-cover{animation:atelier-arrive .72s var(--atelier-ease-out) both}
.premium-ready .story-header{animation:atelier-arrive .28s var(--atelier-ease-out) both}

@media(max-width:900px){
  .story-header.site-header{top:8px;width:calc(100% - 20px);margin:8px auto 8px;padding:10px 14px}
  .story-header nav{gap:2px!important}
  .story-header nav a{padding:8px 10px;font-size:.83rem}
  .map-spread{padding:32px 28px 36px!important}
}

@media(max-width:700px){
  body.story-site{background:linear-gradient(180deg,#c9e3e7 0%,#b7dae0 48%,#afd3da 100%);background-attachment:scroll}
  body.story-site::before{box-shadow:inset 0 0 90px rgba(18,63,87,.06)}
  .story-header.site-header{position:relative;top:0;display:block;border-radius:14px;padding:12px 13px 10px;background:rgba(255,253,245,.93);backdrop-filter:none}
  .story-header .brand{min-width:0;width:max-content;margin-bottom:9px}
  .story-header .approved-wordmark{width:132px}
  .story-header .approved-wordmark-tagline{font-size:.56rem}
  .story-header nav{width:100%;display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px!important;padding:5px}
  .story-header nav a{justify-content:center;text-align:center;min-height:40px;padding:7px 6px;font-size:.76rem;line-height:1.2}
  .book-workspace{padding:14px 12px 34px!important}
  .book-workspace::before{width:110vw;height:280px;top:12%;filter:blur(18px)}
  .book-workspace::after{width:88vw;bottom:26px}
  .book-engine.is-cover{max-width:100%!important}
  .is-cover .book-spread{border-radius:6px 14px 14px 6px!important;box-shadow:0 28px 58px rgba(18,63,87,.22),0 7px 18px rgba(18,63,87,.13)!important}
  .cover-page{padding:28px 22px 18px!important}
  .cover-title h1,.cover-title h2{font-size:clamp(2.15rem,10vw,3rem)!important;line-height:1.01!important}
  .cover-title p{font-size:.86rem!important}
  .cover-open{min-width:190px;padding:12px 18px!important}
  .book-bookmark{right:13px!important}
  .map-spread{padding:28px 18px 30px!important}
  .map-spread h1,.map-spread h2{font-size:2.25rem!important}
  .world-map{border-radius:10px}
  .book-controls{position:static!important;width:100%!important;background:rgba(255,253,245,.94)!important;backdrop-filter:none}
  .book-resource-page{padding:30px 20px!important}
  .book-resource-page h1{font-size:clamp(2.55rem,13vw,4rem)!important;max-width:12ch}
  .catalog-heading{padding-top:38px!important;padding-bottom:36px!important}
  .catalog-heading h1{font-size:clamp(2.8rem,13vw,4.4rem)!important}
  .catalog-grid{gap:36px 16px!important}
  .catalog-art{border-radius:11px}
  .catalog-item:hover .catalog-art{transform:none}
  .buyer-guide-panel{padding:22px 16px!important}
  .story-footer{padding:28px 20px 34px!important}
}

@media(max-width:390px){
  .story-header nav{grid-template-columns:repeat(2,minmax(0,1fr))}
  .catalog-grid{grid-template-columns:1fr!important}
  .catalog-art img{height:auto!important;max-height:330px}
}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  body.story-site{background-position:center top!important}
  .premium-ready .book-engine.is-cover,.premium-ready .story-header{animation:none!important}
  .catalog-item:hover .catalog-art,.scene-sheet:hover,.bundle-world:hover img,.button:hover,.cover-open:hover,.story-header nav a:hover{transform:none!important}
}

/* Final mobile reflow and motion guard. */
html,body.story-site{max-width:100%;overflow-x:hidden}
.book-engine,.book-spread,.cover-page{max-width:100%;width:100%}
@keyframes atelier-arrive{
  from{opacity:.001;transform:translateY(18px) scale(.985)}
  to{opacity:1;transform:translateY(0) scale(1)}
}
.premium-ready .book-engine.is-cover,.premium-ready .story-header{animation:none}
@media(prefers-reduced-motion:no-preference){
  .premium-ready .book-engine.is-cover{animation:atelier-arrive .72s var(--atelier-ease-out) both}
  .premium-ready .story-header{animation:atelier-arrive .28s var(--atelier-ease-out) both}
}
@media(max-width:700px){
  .story-header.site-header{width:calc(100% - 16px);max-width:calc(100% - 16px);overflow:hidden}
  .story-header nav{grid-template-columns:repeat(2,minmax(0,1fr))!important;min-width:0}
  .story-header nav a{min-width:0;white-space:normal;overflow-wrap:anywhere}
  .story-header nav a:last-child{grid-column:1/-1}
  .book-workspace,.book-engine,.book-spread,.cover-page{min-width:0;max-width:100%}
  .cover-art{max-width:none}
  .book-controls{max-width:100%;min-width:0;overflow:hidden}
  .book-controls select{min-width:0;max-width:100%}
}
@media(max-width:430px){
  .book-workspace{padding-inline:8px!important}
  .cover-page{padding-inline:18px!important}
  .story-header .approved-wordmark{width:125px}
}

/* Keep anchor and programmatic focus clear of the sticky desktop header. */
html{scroll-padding-top:112px}
main[id],section[id],h1[id],h2[id],h3[id]{scroll-margin-top:112px}
@media(max-width:700px){
  html{scroll-padding-top:12px}
  main[id],section[id],h1[id],h2[id],h3[id]{scroll-margin-top:12px}
}
