@font-face{font-family:'Caveat';src:url('/assets/britannic-fonts/caveat.woff2') format('woff2');font-style:normal;font-weight:400;font-display:swap}
@font-face{font-family:'Alex Brush';src:url('/assets/britannic-fonts/alex-brush.woff2') format('woff2');font-style:normal;font-weight:400;font-display:swap}
.atlas-home{overflow:auto;--paper:#fffbed;--ink:#493f34;--rust:#95634d;font-family:'Caveat',cursive;font-size:1.625rem;line-height:1.5;font-synthesis:none;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
.story-shelf{height:auto;min-height:100svh;overflow:hidden;background:radial-gradient(ellipse at 14% 38%,#e8ecd54d,transparent 54%),radial-gradient(ellipse at 95% 42%,#dce9ec4d,transparent 54%),var(--paper)}
.story-shelf::before{display:none}
.story-shelf::after{position:fixed;z-index:20;opacity:.075}
.shelf-top{display:flex;justify-content:space-between;align-items:center;gap:24px;padding:32px clamp(24px,5vw,80px)}
.shelf-brand{font-family:'Alex Brush',cursive;font-size:2.625rem;line-height:1.1}
.shelf-brand span{display:block;margin-block-start:8px;font-family:'Caveat',cursive;font-size:1.375rem;line-height:1.4}
.shelf-top nav{gap:28px;font-size:1.5rem;line-height:1.4}
.shelf-top button,.shelf-top nav a{min-height:48px;padding:8px 0;white-space:nowrap}
.shelf-top #stamp-count{font-size:1.25rem;margin-inline-start:8px;color:var(--rust);font-variant-numeric:tabular-nums}
.shelf-intro{text-align:center;padding:32px 24px 40px}
.shelf-intro h1{font-family:'Alex Brush',cursive;font-size:clamp(3.5rem,6vw,5rem);line-height:1.1;font-weight:400;text-wrap:balance;letter-spacing:0}
.shelf-intro p{margin:24px auto 0;max-inline-size:45ch;font-size:1.75rem;line-height:1.5;text-wrap:pretty}
.shelf-navigation{display:flex;justify-content:space-between;align-items:center;gap:24px;padding:0 clamp(24px,5vw,80px) 16px}
.shelf-navigation>p{margin:0;font-size:1.375rem}
.shelf-navigation>div{display:flex;align-items:center;gap:18px}
.shelf-navigation button{width:48px;height:48px;border:1px solid #89795870;border-radius:50%;font-size:1.625rem}
.shelf-navigation button:disabled{opacity:.35;cursor:default}
.shelf-navigation span{font-size:1.375rem;white-space:nowrap;font-variant-numeric:tabular-nums}
.shelf-row{display:flex;gap:clamp(28px,4vw,64px);overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scroll-padding-inline:clamp(24px,5vw,80px);padding:8px clamp(24px,5vw,80px) 40px;padding-inline-end:calc(100% - min(76vw,620px) - clamp(24px,5vw,80px));overscroll-behavior-x:contain;scrollbar-width:thin;scrollbar-color:#bdab8470 transparent;touch-action:pan-x pan-y pinch-zoom}
.shelf-story{position:relative;isolation:isolate;flex:0 0 min(76vw,620px);scroll-snap-align:start;display:block;text-align:center;padding:0 20px 28px;color:var(--ink);border-radius:4px}
.shelf-story::before{content:'';position:absolute;inset:3% -8% 12%;z-index:-1;background:radial-gradient(ellipse,var(--wash) 8%,transparent 70%);pointer-events:none}
.tone-meadow{--wash:#dce6bd75}.tone-sea{--wash:#cbdfe675}.tone-winter{--wash:#cadbe660}.tone-sand{--wash:#e6d5b675}.tone-rose{--wash:#e9d0c875}
.shelf-art{--art-size:clamp(280px,36vw,420px);width:min(100%,var(--art-size));aspect-ratio:1;margin-inline:auto;display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(0,1fr);place-items:end center;transform-origin:center;transition:transform 180ms cubic-bezier(.215,.61,.355,1)}
.shelf-art img{display:block;width:var(--paint-width,100%);height:var(--paint-height,100%);min-width:0;min-height:0;object-fit:contain}
.shelf-copy{margin:36px auto 0;max-inline-size:36ch}
.shelf-copy h2{font:400 3rem/1.1 'Alex Brush',cursive;min-block-size:2.2em;text-wrap:balance;letter-spacing:0}
.shelf-copy p{font-size:1.625rem;line-height:1.5;margin:16px 0 12px;text-wrap:pretty;overflow-wrap:break-word}
.shelf-enter{display:block;font-size:1.5rem;margin-block-start:12px;color:var(--rust)}
.shelf-note,.shelf-stamp{display:block;font-size:1.25rem;line-height:1.4;min-height:1.75rem}
.shelf-tools{display:flex;justify-content:center;flex-wrap:wrap;gap:16px 36px;padding:40px 24px 0}
.shelf-tools button{font-size:1.5rem;min-height:48px;padding:8px 0;text-decoration:underline;text-decoration-thickness:from-font;text-underline-offset:.25em;text-decoration-skip-ink:auto}
.shelf-bottom{text-align:center;padding:36px 24px 40px;font-size:1.25rem}
.shelf-bottom p{margin:16px auto 0;max-inline-size:65ch}
.shelf-camera{position:fixed;z-index:1000;pointer-events:none;background:var(--paper);inset:0}
.shelf-camera .shelf-art{position:absolute;margin:0;transition:none}
.story-shelf dialog{font-family:'Caveat',cursive;width:min(780px,calc(100% - 32px));padding:28px;max-height:calc(100dvh - 32px)}
.story-shelf dialog h2,.story-shelf dialog h3{font-family:'Alex Brush',cursive;font-size:3rem;font-weight:400;line-height:1.1;letter-spacing:0;text-wrap:balance}
.story-shelf dialog h4{font-family:'Caveat',cursive;font-size:1.75rem;font-weight:400;line-height:1.3}
.story-shelf dialog p,.story-shelf .panel-intro{font-size:1.5rem!important;line-height:1.5;max-inline-size:65ch;overflow-wrap:break-word}
.story-shelf dialog .ink-label,.story-shelf dialog .eyebrow{font-size:1.125rem;letter-spacing:0;font-weight:400}
.story-shelf .panel-top{top:-28px}
.story-shelf .panel-top button{width:48px;height:48px;font-size:2rem}
.story-shelf .button,.story-shelf .ink-button,.story-shelf .story-tabs button,.story-shelf .clue-options button,.story-shelf .quiz .answer,.story-shelf .years button{font-size:1.375rem;min-height:48px;font-weight:400}
.story-shelf .story-tabs{flex-wrap:wrap}
.story-shelf .video-actions{flex-wrap:wrap}
.story-shelf .video-actions span,.story-shelf .video-note,.story-shelf details,.story-shelf .panel-evidence a,.story-shelf .quiz .feedback{font-size:1.25rem}
.story-shelf .film-library strong,.story-shelf .passport-stamp>strong{font:400 1.5rem/1.4 'Caveat',cursive}
.story-shelf .film-library small,.story-shelf .film-library button>span>span,.story-shelf .passport-stamp small{font-size:1.125rem;letter-spacing:0}
.story-shelf .passport-stamp{min-height:170px}
.atlas-home::selection{background:#e7d5a4;color:#493f34}
@media(hover:hover) and (pointer:fine){.shelf-story:hover .shelf-art{transform:translateY(-4px) scale(1.025)}}
@media(max-width:700px){
 .shelf-top{align-items:flex-start;gap:16px;padding-block:24px}.shelf-brand{font-size:2.125rem}.shelf-brand span{font-size:1.125rem}.shelf-top nav{flex-direction:column;align-items:flex-end;gap:0;font-size:1.25rem}.shelf-top #stamp-count{font-size:1.125rem;margin-inline-start:4px}
 .shelf-intro{padding-block:20px 36px}.shelf-intro h1{font-size:3.5rem}.shelf-intro p{font-size:1.625rem}
 .shelf-navigation{align-items:flex-start;gap:12px}.shelf-navigation>p{max-width:150px;font-size:1.25rem}.shelf-navigation>div{gap:10px}
 .shelf-row{padding-inline-end:calc(100% - 88vw - 24px)}.shelf-story{flex-basis:88vw;padding-inline:0}.shelf-art{--art-size:300px}.shelf-copy{margin-block-start:28px}.shelf-copy h2{font-size:3rem}
 .story-shelf dialog{padding:24px}.story-shelf .panel-top{top:-24px}.story-shelf .reading-heading{flex-wrap:wrap}
}
@media(max-height:550px) and (min-width:701px){.shelf-intro{padding-block:12px 28px}.shelf-art{--art-size:260px}.shelf-story{flex-basis:55vw}.shelf-row{padding-inline-end:calc(100% - 55vw - clamp(24px,5vw,80px))}}
@media(prefers-reduced-motion:reduce){.shelf-art{transition:none}.shelf-row{scroll-behavior:auto}}
