/* Shared controls for the child-facing site. Illustrated scenes keep their own layout. */
:root{--ui-paper:#f6f0e1;--ui-ink:#214b4b;--ui-muted:#68766b;--ui-line:#ded8c5;--ui-gold:#f6cf78;--ui-radius:20px;--ui-body:Onest,Arial,sans-serif;--ui-heading:Lora,Georgia,serif}
body{color:var(--ui-ink)}
body>header.site-header{display:flex;align-items:center;gap:clamp(14px,2vw,32px);padding:18px clamp(20px,4vw,64px);max-width:none;min-height:96px;background:var(--ui-paper);box-sizing:border-box;flex-wrap:nowrap;font:14px/1.4 var(--ui-body)}
.site-header>a:first-child{flex:0 0 auto}.site-header>a:first-child>img{width:clamp(115px,13vw,185px);height:auto;max-height:66px;object-fit:contain}
.site-header>nav{display:flex;align-items:center;justify-content:center;gap:clamp(16px,2vw,30px);flex:1;min-width:0;margin:0}
.site-header>nav>a{display:flex;align-items:center;min-height:44px;white-space:nowrap;text-decoration:none;color:var(--ui-ink);border-bottom:2px solid transparent}
.site-header>nav>a[aria-current=page]{border-color:#b27e37}
.site-header .season-badge{display:flex;align-items:center;flex:0 0 auto;gap:8px;min-width:0;margin:0;white-space:nowrap;font-size:12px;text-decoration:none;color:inherit}
.site-header .season-badge img{width:32px;height:38px;object-fit:contain}.site-header .season-badge strong{font:20px var(--ui-heading)}
.site-header .reader-link,.site-header>.child-profile-link{display:flex;align-items:center;gap:8px;white-space:nowrap;min-height:44px;max-width:150px;text-decoration:none;color:var(--ui-ink)}
.site-header .child-header-portrait{width:40px;height:44px;object-fit:contain}
.site-header .child-news-button{position:relative;width:48px;min-width:48px;height:48px;padding:7px;display:inline-flex;justify-content:center;align-items:center;border:0;border-radius:50%;background:transparent;margin:0}
.site-header .child-news-button:hover{background:#eee3c8}.site-header .child-news-button>img{width:34px;height:34px;object-fit:contain}.site-header .child-news-button>span{display:none}
.site-header .child-news-button>b{position:absolute;right:-2px;top:0;min-width:17px;border-radius:14px;background:var(--ui-gold);font:10px/17px var(--ui-body)}.site-header .child-news-button>b:empty{display:none}
.site-pocket{position:relative;flex:none}.site-pocket summary{cursor:pointer;list-style:none;padding:10px;min-height:44px;box-sizing:border-box}.site-pocket summary::-webkit-details-marker{display:none}.site-pocket summary img{width:26px;height:26px;object-fit:contain}
.site-pocket>div{position:absolute;right:0;top:100%;z-index:200;width:220px;padding:10px;background:var(--ui-paper);border:1px solid var(--ui-line);border-radius:var(--ui-radius);box-shadow:0 12px 35px #183d3820}.site-pocket a{display:block;padding:12px;color:var(--ui-ink);text-decoration:none;border-radius:12px}.site-pocket a:hover{background:#eae3d0}
.site-back{display:inline-flex;align-items:center;min-height:44px;margin:8px 0 18px;color:var(--ui-muted);font:14px var(--ui-body);text-decoration:none}
button,a.primary,.primary,a.secondary,.secondary{font-family:var(--ui-body)}
a.primary,button.primary,a.secondary,button.secondary{min-height:46px;box-sizing:border-box;border-radius:26px;padding:12px 22px;font-size:15px;line-height:1.45}
:is(button,a,input,select,summary):focus-visible{outline:3px solid #b78335;outline-offset:4px}
dialog{border:1px solid var(--ui-line);border-radius:24px;background:var(--ui-paper);color:var(--ui-ink);max-width:calc(100vw - 32px);max-height:calc(100dvh - 40px)}
dialog::backdrop{background:#173d3826;backdrop-filter:blur(3px)}
dialog :is(.close,.peek-close,.child-news-close){min-width:44px;min-height:44px;font-size:25px;border-radius:50%}
#error:not([hidden]){max-width:820px;margin:16px auto;padding:18px 22px;border-radius:16px;background:#fbebcf;color:#654722;font:15px/1.6 var(--ui-body)}
#error button{margin:12px 12px 0 0;min-height:44px;padding:10px 18px;border-radius:24px;border:1px solid #bda36b;background:var(--ui-paper)}
.site-header .season-badge>span{display:flex;flex-direction:column;gap:3px}.site-header .season-badge time{font:11px var(--ui-body);color:var(--ui-muted)}.site-header .child-header-avatar{display:block;flex:0 0 40px;width:40px;height:40px}.site-header .child-header-avatar img{max-width:none}
main>.site-back{margin-left:clamp(20px,4vw,64px)}
@media(max-width:1150px){body>header.site-header{gap:12px;padding:14px 24px}.site-header>nav{gap:16px}.site-header .season-badge strong{font-size:17px}.site-header .season-badge img{width:27px}.site-header .child-profile-link{max-width:115px}.site-header .site-pocket summary{padding:7px}}
@media(max-width:940px){.site-header .season-badge{display:none}}
@media(max-width:780px){body>header.site-header{flex-wrap:wrap;gap:8px 16px;padding:12px 18px;min-height:82px}.site-header>a:first-child>img{width:116px}.site-header>nav{order:10;flex-basis:100%;justify-content:flex-start;gap:24px;overflow:auto;scrollbar-width:none}.site-header>.reader-link,.site-header>.child-profile-link{margin-left:auto}.site-header .site-pocket{margin-left:0}.site-header .child-news-button{margin:0}.site-back{margin-left:4px}dialog{border-radius:20px}}
.site-header>nav{order:1}.site-header>.season-badge{order:2}.site-header>.child-profile-link{order:3}.site-header>.child-news-button{order:4}.site-header>.site-pocket{order:5}
@media(max-width:780px){.site-header>nav{order:10}.site-header>.season-badge{display:flex;order:11;flex-basis:100%;justify-content:center;min-height:28px;gap:8px}.site-header>.season-badge>img{width:24px;height:26px}.site-header>.season-badge>span{flex-direction:row;align-items:center;gap:8px}.site-header>.season-badge strong{font-size:14px}}

/* Persistent navigation across reading, atlas, collections and editors. */
html{scroll-padding-top:calc(var(--site-header-height,96px) + 16px)}
body:has(>header.site-header){overflow-x:clip}
body>header.site-header{position:sticky;top:0;z-index:1300;display:flex;background:var(--ui-paper,#f6f0e2);border-bottom:1px solid var(--ui-line,#ded6c2);width:100%;margin:0}
body.is-reading>header.site-header{display:flex}
body .reader-tools{top:var(--site-header-height,96px)}
body.editor-family>header.site-header{display:flex;flex-wrap:wrap;height:auto;grid-template-columns:none}
body.editor-family>header.site-header>h1{font-size:20px;order:6}
body.editor-family>header.site-header>#save{order:7;margin-left:auto}
body.workshop-editor .fitting{top:var(--site-header-height,96px);height:calc(100dvh - var(--site-header-height,96px))}
@media(max-width:780px){body>header.site-header .season-badge{display:none}body>header.site-header{gap:4px 12px;padding:8px 16px}body>header.site-header>nav{flex-basis:100%;order:10}}
body.editor-family>header.site-header>nav{order:10;flex:0 0 100%;justify-content:center}
body.editor-family>header.site-header>.site-pocket img{width:26px;height:26px}
body.editor-family>header.site-header>a{flex-shrink:0}
body.editor-family>header.site-header>h1{margin-left:auto}
body.workshop-editor .stage>.hero{left:auto;top:auto}
@media(max-width:680px){body.workshop-editor .fitting{top:auto;height:510px}}

/* One scrollbar treatment for pages, dialogs, catalogues and horizontal scenes. */
:root{--scroll-track:#eee5d2;--scroll-thumb:#ad9364;--scroll-thumb-hover:#896e43}
html,body,body *{scrollbar-width:thin!important;scrollbar-color:var(--scroll-thumb) var(--scroll-track)!important}
@supports selector(::-webkit-scrollbar){
 html,body,body *{scrollbar-width:auto!important;scrollbar-color:auto!important}
 ::-webkit-scrollbar{width:12px;height:12px}
 ::-webkit-scrollbar-track{background:var(--scroll-track);border-radius:12px}
 ::-webkit-scrollbar-thumb{background:var(--scroll-thumb);border:3px solid var(--scroll-track);border-radius:12px;min-height:36px;min-width:36px}
 ::-webkit-scrollbar-thumb:hover{background:var(--scroll-thumb-hover)}
 ::-webkit-scrollbar-thumb:active{background:#705937}
 ::-webkit-scrollbar-corner{background:var(--scroll-track)}
}
@media(forced-colors:active){html,body,body *{scrollbar-color:auto!important;scrollbar-width:auto!important}}
/* A compact back arrow does not reserve a separate navigation row. */
main:has(>.site-back){position:relative}
main>.site-back{position:absolute;top:8px;left:clamp(12px,3vw,44px);margin:0;width:40px;height:40px;min-height:40px;display:inline-flex;align-items:center;justify-content:center;font-size:25px;line-height:1;border-radius:50%;z-index:2}
main>.site-back:hover{background:#eee5d2;color:var(--ui-ink)}
main:has(>.site-back) .path-tabs{padding-top:14px;padding-bottom:14px}
.achievement-section{max-width:1200px;margin:24px auto 48px;padding:0 24px}
.achievement-section>h2{font:26px Lora,Georgia,serif;color:var(--ui-ink);margin:0 0 22px}
.achievement-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:26px 20px}
.achievement-grid.milestones{grid-template-columns:repeat(6,minmax(0,1fr))}
.achievement{text-align:center;padding:12px 8px 20px;border-bottom:1px solid var(--ui-line)}
.achievement>img{display:block;width:100%;height:150px;object-fit:contain;margin:0 auto 12px}
.achievement.pending>img{filter:grayscale(1);opacity:.42}
.achievement h3{font:19px/1.35 Lora,Georgia,serif;margin:0 0 8px}
.achievement p{font:13px/1.5 Onest,Arial,sans-serif;color:var(--ui-muted);margin:0 0 10px}
.achievement small{font:12px Onest,Arial,sans-serif;color:#8b795a}
.achievement.earned small{color:#376c53}
@media(max-width:850px){.achievement-grid,.achievement-grid.milestones{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:500px){.achievement-grid,.achievement-grid.milestones{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px 12px}.achievement>img{height:125px}.achievement-section{padding:0 16px}}

/* The existing painted book is the shared loading motif. */
.skaska-loading,img.skaska-image-loading{background-image:url('assets/redrawn/book-blot-v1.png');background-repeat:no-repeat;background-position:center;background-size:38px auto;animation:skaska-loading-breathe 1.3s ease-in-out infinite}
.skaska-loading{display:inline-block;width:64px;height:64px;flex:none}
img.skaska-image-loading{color:transparent;min-height:44px}
@keyframes skaska-loading-breathe{0%,100%{background-size:32px auto;background-position:50% 52%}50%{background-size:40px auto;background-position:50% 46%}}
@media(prefers-reduced-motion:reduce){.skaska-loading,img.skaska-image-loading{animation:none}}

/* Main navigation and avatar account menu. */
.site-header>.site-account{order:5}
.site-header .site-avatar-toggle{display:flex;align-items:center;gap:5px;padding:4px;min-width:52px;min-height:48px}
body>header.site-header .site-avatar-toggle>img{width:42px;height:44px;max-height:none;object-fit:contain}
.site-avatar-toggle .child-header-avatar{width:44px;height:44px;flex-basis:44px}
.site-avatar-toggle>span[aria-hidden]{font:18px Onest,Arial,sans-serif;color:var(--ui-muted)}
.site-account>div a:last-child{border-top:1px solid var(--ui-line);border-radius:0;margin-top:6px;padding-top:16px}
@media(max-width:940px){body>header.site-header>.season-badge{display:flex}}
@media(max-width:780px){body>header.site-header>.season-badge{display:flex;order:2;flex-basis:auto;margin-left:auto}.site-header>.season-badge time{display:none}.site-header>.season-badge strong{font-size:14px}.site-header>.season-badge>img{width:23px;height:28px}.site-header>.season-badge>span{display:block}}

.site-header .site-stars{order:4;white-space:nowrap;text-decoration:none;color:#947039;font:18px Lora,serif;padding:8px 4px}.site-header .site-account{order:5}

.site-header .site-stars{display:inline-flex;align-items:center;gap:4px;border:0;background:none;border-radius:0}.site-stars img{width:28px;height:28px;object-fit:contain}

/* First arrival and seasonal preview. */
.wardrobe-action-bar{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:14px 34px;border-bottom:1px solid var(--ui-line)}
.wardrobe-action-bar h1{font:26px var(--ui-heading);margin:0}.wardrobe-action-bar a{color:inherit}.wardrobe-action-bar button{margin:0}
.empty-backpack{text-align:center;padding:55px 20px 85px}.empty-backpack>img{width:150px;height:170px;object-fit:contain}.empty-backpack h2{font:28px var(--ui-heading);margin:10px 0 22px}



@media(max-width:600px){.wardrobe-action-bar{padding:12px;flex-wrap:wrap}}

body.editor-family>header.site-header{flex-wrap:nowrap}
body.editor-family>header.site-header>nav{order:1;flex:1;justify-content:center}
body.editor-family>header.site-header .site-stars>img{width:28px;height:28px}
@media(max-width:780px){body.editor-family>header.site-header{flex-wrap:wrap}body.editor-family>header.site-header>nav{order:10;flex-basis:100%}}





.has-reader-presence{overflow:visible!important}.reader-presence{position:absolute;left:50%;top:-54px;transform:translateX(-50%);z-index:15;display:flex;flex-direction:column;align-items:center;pointer-events:none;filter:drop-shadow(0 3px 4px #51401c44)}.reader-presence>img,.reader-presence>.child-header-avatar{display:block;width:52px;height:52px;object-fit:contain;position:relative}.reader-presence .child-header-avatar img{max-width:none}.reader-presence small{display:block!important;font:11px Onest,sans-serif!important;white-space:nowrap;background:#f6e4b5;color:#214b4b;padding:3px 8px;border-radius:9px}.atlas-marker .reader-presence{top:-68px}.find-reader{border:1px solid #b9a47d;border-radius:20px;background:#f6efdf;color:#214b4b;padding:10px 18px;font:14px Onest,sans-serif;cursor:pointer}.chronicle-heading .find-reader{display:block;margin:0 auto 20px}.atlas-reading-link{display:flex;justify-content:space-between;align-items:center;margin:18px 0}.atlas-reading-link small{display:block;font:12px/1.5 Onest,sans-serif;margin-top:5px}.reader-found{animation:reader-found 1s ease}@keyframes reader-found{50%{transform:translateX(-50%) translateY(-12px)}}@media(prefers-reduced-motion:reduce){.reader-found{animation:none}}
.atlas-marker>span.reader-presence{opacity:1;top:-68px;background:none;box-shadow:none;padding:0;min-width:0;border-radius:0}.atlas-marker.has-reader-presence{z-index:7}

/* Keep the complete painted cover: side-cropping hid narrative details. */




/* A clear portrait medallion above the child's current place. */
.reader-presence .reader-presence-portrait{display:grid;place-items:center;width:60px;height:60px;box-sizing:border-box;border:3px solid #ac7c37;border-radius:50%;background:#fff7e5;overflow:hidden;box-shadow:0 0 0 3px #fff8e9,0 4px 10px #243f3d55;flex:none}
.reader-presence-portrait>img,.reader-presence-portrait>.child-header-avatar{display:block;position:relative;width:52px;height:52px;object-fit:contain;flex:none}
.reader-presence small{margin-top:5px}.atlas-marker .reader-presence,.atlas-marker>span.reader-presence{top:-82px}

.coming-soon-label{display:block;color:#927344;font-size:13px;letter-spacing:.06em;margin:12px 0}.site-avatar-toggle img.child-header-avatar{width:48px;height:48px;object-fit:contain;border-radius:50%}

/* Prototype controls stay out of the reader-facing site. */
body>.workbench,body>.collection-workbench,body>.journey-workbench{display:none!important}

.atlas-marker>span.atlas-story-badge{position:absolute;display:flex;flex-direction:column;align-items:center;left:50%;top:-65px;transform:translateX(-50%);opacity:1;pointer-events:none;background:none;padding:0;box-shadow:none;min-width:0;white-space:nowrap;z-index:8}.atlas-story-badge img{display:block;width:48px;height:48px;padding:6px;box-sizing:border-box;object-fit:contain;border:2px solid #ac7c37;border-radius:50%;background:#fff7e5;box-shadow:0 0 0 3px #fff8e9,0 3px 8px #243f3d44}.atlas-story-badge small{display:block;font:11px Onest,sans-serif;background:#f6e4b5;color:#214b4b;padding:2px 7px;border-radius:9px;margin-top:4px}.atlas-marker.has-reader-presence>span.atlas-story-badge{left:calc(50% + 48px);top:-65px}.atlas-marker:has(.atlas-story-badge){z-index:6}.atlas-marker.is-undiscovered:has(.atlas-story-badge){opacity:1;filter:none}

/* A story at the reader position is a small companion badge. */
.atlas-marker.has-reader-presence>span.atlas-story-badge{left:calc(50% + 37px);top:-58px;z-index:16}.atlas-marker.has-reader-presence>.atlas-story-badge img{width:34px;height:34px;padding:4px;border-width:2px;box-shadow:0 0 0 2px #fff8e9,0 2px 5px #243f3d33}.atlas-marker.has-reader-presence>.atlas-story-badge small{display:none}
.atlas-marker.has-reader-presence>span.atlas-story-badge{width:34px;min-width:34px}.atlas-marker.has-reader-presence>.atlas-story-badge img{min-width:34px;max-width:none;flex:none}

.account-page{padding:44px 24px 64px!important;max-width:660px!important;margin:auto}.account-book{width:80px;display:block;margin:0 auto 18px}.account-page h1{font-size:clamp(28px,4vw,38px)}.account-page .name-form{max-width:440px;margin:26px auto}.account-page input{width:100%;box-sizing:border-box}.account-profiles{display:flex;justify-content:center;gap:22px;flex-wrap:wrap;margin:30px 0}.account-child{background:transparent;border:0;color:inherit;font:inherit;cursor:pointer;display:grid;gap:10px;justify-items:center}.account-child img{width:100px;height:100px;border-radius:50%;object-fit:contain;background:#ede5d1}.account-save-status{position:fixed;bottom:18px;left:50%;transform:translateX(-50%);padding:12px 22px;background:#f5ecd9;color:#245650;border:1px solid #c6b487;border-radius:12px;z-index:1000;box-shadow:0 4px 16px #0002;font-size:14px}.account-page .text-link{background:none;border:0;color:inherit;cursor:pointer}.account-page [role=status]{font-size:14px;line-height:1.6}
/* Keep the mobile header to two rows, including a populated reader account. */
@media(max-width:480px){
 body>header.site-header{gap:4px 8px;padding:8px 12px;min-height:104px}
 body>header.site-header>.season-badge{display:none!important}
 body>header.site-header>a:first-child{margin-right:auto}
 body>header.site-header>a:first-child>img{width:100px}
 body>header.site-header>.site-stars{font-size:15px;padding:4px 0}
 body>header.site-header .site-stars img{width:24px;height:24px}
 body>header.site-header>.child-news-button{width:40px;min-width:40px;height:44px;padding:5px}
 body>header.site-header .site-avatar-toggle{min-width:40px;min-height:44px;padding:0}
 body>header.site-header>nav{gap:18px;font-size:12px;justify-content:space-between}
}

/* Illustrated badges belong to the same clickable map marker. */
.reader-presence,.atlas-marker>span.reader-presence,.atlas-marker>span.atlas-story-badge{pointer-events:auto;cursor:pointer}

/* Account return: saved characters and an actionable offline state. */
.account-return-page{max-width:1060px!important;padding:20px 30px 64px!important;text-align:left}.account-return-page>.site-back{margin:0 0 18px;min-width:44px;justify-content:center}.account-return-layout{display:grid;grid-template-columns:.8fr 1.2fr;align-items:center;gap:56px;padding:42px;background:#fff9eb;border:1px solid #ded0b5;border-radius:20px;box-shadow:0 12px 32px #57472c0c}.account-return-art{text-align:center}.account-return-art>img{width:100%;max-width:290px;height:auto}.account-return-art>p{font:20px/1.6 Lora,serif;color:#85765f}.account-kicker{font-size:11px;letter-spacing:.16em;color:#a17642}.account-return-content h1{font:400 clamp(28px,3.4vw,40px)/1.2 Lora,serif;margin:15px 0 20px}.account-return-content p{font-size:15px;line-height:1.7}.account-local-note{border-left:3px solid #c7a468;padding:4px 0 4px 18px;margin:24px 0}.account-local-note strong{font:20px/1.4 Lora,serif}.account-local-note p{margin:8px 0 0;color:#77725f}.account-return-actions{display:flex;flex-direction:column;align-items:flex-start;gap:18px;margin-top:24px}.account-return-actions .primary{display:inline-block;text-decoration:none;padding:14px 20px;background:#28564c;color:#fff9e9;border-radius:8px}.account-return-actions .text-link{padding:8px 0;text-decoration:underline;text-underline-offset:4px}.account-return-page .account-profiles{justify-content:flex-start}.account-return-page #account-message:empty{display:none}@media(max-width:700px){.account-return-page{padding:16px 18px 40px!important}.account-return-layout{grid-template-columns:1fr;gap:14px;padding:24px}.account-return-art>img{max-width:130px}.account-return-art>p{display:none}.account-return-content h1{font-size:29px}}
/* Keep the event landscape colourful, with only a light grey wash. */



.book-text .reader-initial{float:left;width:4.3em;height:4.3em;object-fit:contain;margin:0 .45em .12em 0;max-width:30%;shape-outside:margin-box}.book-text.has-reader-initial{display:flow-root}
.book-text .reader-initial{mix-blend-mode:multiply}body.night .book-text .reader-initial{mix-blend-mode:normal;border-radius:8px}
#story-peek .peek-image{width:100%;height:auto;aspect-ratio:3/4;object-fit:cover;object-position:center top;border:7px solid #fff8e9;border-radius:14px;box-sizing:border-box;align-self:start;box-shadow:0 6px 18px #584a2920}#story-peek .peek-treasures{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:24px 0}.peek-treasure{display:flex;flex-direction:column;align-items:center;text-align:center;padding:14px 10px;background:#f3ecd9;border:1px solid #ded8c5;border-radius:14px}.peek-treasure small{font:11px/1.4 Onest,sans-serif;color:#68766b;min-height:31px}.peek-treasure img{width:70px;height:70px;object-fit:contain;margin:8px 0}.peek-treasure h3{font:18px/1.35 Lora,serif;margin:4px 0}@media(max-width:600px){#story-peek .peek-image{max-width:260px;justify-self:center}}
.story-band .paired-treasures{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:24px;margin:24px 0;max-width:760px}.story-band .paired-treasures .peek-treasure{padding:24px 20px}.story-band .paired-treasures .peek-treasure img{width:120px;height:120px;margin:12px 0}.story-band .paired-treasures .peek-treasure h3{font-size:24px}.story-band .paired-treasures .peek-treasure small{font-size:13px;min-height:0}@media(max-width:520px){.story-band .paired-treasures{grid-template-columns:1fr 1fr;gap:12px}.story-band .paired-treasures .peek-treasure{padding:16px 10px}.story-band .paired-treasures .peek-treasure img{width:85px;height:85px}.story-band .paired-treasures .peek-treasure h3{font-size:18px}}

[data-admin-catalog-link][hidden],[data-admin-story-catalog][hidden],[data-catalog-access-notice][hidden]{display:none!important}
.site-account .site-logout{display:block;width:100%;text-align:left;padding:12px;margin-top:6px;border:0;border-top:1px solid var(--ui-line);border-radius:0;background:transparent;color:var(--ui-ink);font:inherit;cursor:pointer}.site-account .site-logout:hover{background:#eae3d0}.site-account .site-logout[hidden]{display:none!important}


/* Night Roads uses the chronicle landscape: a wide painted layer fading into paper. */
.halloween-preview{--ui-ink:#294b46;--ui-muted:#655e50;--event-accent:#8a5c30;--event-border:#a48c625e;--event-shadow:#47371c24;--event-paper:#f6f0e2;position:relative;isolation:isolate;overflow:clip;width:100%;max-width:none;min-height:calc(100dvh - 96px);margin:0;padding:0 36px 100px;box-sizing:border-box;background:var(--event-paper);color:var(--ui-ink)}
.halloween-preview::before{content:"";position:absolute;z-index:-2;pointer-events:none;top:80px;bottom:0;left:50%;width:max(100%,1740px);transform:translateX(-50%);background:url('assets/skins/halloween/forest-v2.png') center top/100% auto no-repeat;filter:brightness(.78) saturate(.8);opacity:.75;mask-image:linear-gradient(transparent,#000 90px,#000 calc(100% - 180px),transparent)}
/* The existing forest is dense: a paper clearing keeps the book shelf legible. */
.halloween-preview::after{content:"";position:absolute;z-index:-1;pointer-events:none;inset:75px 0 0;background:radial-gradient(ellipse at 50% 49%,var(--event-paper) 18%,#f6f0e2f5 43%,#f6f0e2bd 62%,#f6f0e200 88%)}
.halloween-preview>.path-tabs,.halloween-preview>header.halloween-heading,.halloween-preview>.halloween-shelf{width:100%;max-width:1040px;margin-left:auto;margin-right:auto;box-sizing:border-box}
.halloween-preview .path-tabs{display:flex;justify-content:center;gap:32px;padding:20px 0;margin:0 auto;background:none;font:20px/1.4 var(--ui-heading)}
.halloween-preview .path-tabs a{padding:8px 0;text-decoration:none;color:var(--ui-muted);border-bottom:1px solid transparent}
.halloween-preview .path-tabs a[aria-current]{color:var(--ui-ink);border-color:var(--event-accent)}
.halloween-preview>header.halloween-heading{position:static;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:40px;min-height:0;margin:0 auto;padding:34px 24px 38px;background:none;border:0;text-align:left;box-sizing:border-box}
.halloween-preview .halloween-heading p{margin:0}
.halloween-preview .halloween-heading .event-kicker{font:12px/1.5 var(--ui-body);letter-spacing:.12em;text-transform:uppercase;color:var(--event-accent);margin-bottom:14px}
.halloween-preview h1{font:400 clamp(40px,4.8vw,64px)/1.12 var(--ui-heading);letter-spacing:-.045em;margin:0 0 18px}
.halloween-preview .halloween-heading .event-intro{font:17px/1.6 var(--ui-heading);max-width:410px;color:var(--ui-muted)}
.halloween-preview .event-calendar{padding:8px 0 8px 30px;border-left:1px solid var(--event-border)}
.halloween-preview .halloween-heading .event-dates{font:25px/1.35 var(--ui-heading);color:var(--event-accent);margin:0}
.halloween-preview .halloween-shelf{position:relative;margin:0 auto;padding:30px 32px 0;background:transparent;border-top:1px solid var(--event-border)}
.halloween-preview .halloween-shelf-heading{display:flex;align-items:baseline;justify-content:space-between;gap:20px;margin:0 0 26px}
.halloween-preview .halloween-shelf-heading h2{font:22px/1.4 var(--ui-heading);margin:0}
.halloween-preview .halloween-shelf-heading p{font:12px/1.5 var(--ui-body);color:var(--ui-muted);margin:0}
.halloween-books{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:34px 28px;max-width:none;margin:0}
.halloween-books article{grid-column:span 2;min-width:0;text-align:left;pointer-events:auto}
.halloween-books article:nth-child(4){grid-column:2/span 2}
.halloween-books article img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:contain;box-sizing:border-box;padding:5px;border:1px solid var(--event-border);background:var(--ui-paper);border-radius:2px;box-shadow:0 5px 12px var(--event-shadow);filter:none;opacity:1}
.halloween-preview .halloween-book-caption{display:grid;grid-template-columns:22px minmax(0,1fr);gap:9px;align-items:baseline;margin:16px 0 0}
.halloween-preview .halloween-book-number{font:11px/1.5 var(--ui-body);color:var(--event-accent)}
.halloween-books article h2{font:19px/1.4 var(--ui-heading);letter-spacing:-.02em;margin:0;padding:0;background:none;color:var(--ui-ink)}
.halloween-books .event-story-link{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:44px;margin:12px 0 0 31px;border-bottom:1px solid var(--event-border);color:var(--event-accent);font:12px/1.5 var(--ui-body);text-decoration:none}
.halloween-books .event-story-link:hover{color:var(--ui-ink);border-color:var(--ui-ink)}
@media(max-width:800px){.halloween-preview{padding:0 22px 55px}.halloween-preview>header.halloween-heading{padding:24px 8px 30px;gap:25px}.halloween-preview .event-calendar{padding-left:20px}.halloween-preview .halloween-shelf{margin:0 auto;padding:24px 18px 0}.halloween-books{gap:28px 18px}.halloween-books article h2{font-size:17px}.halloween-preview .halloween-shelf-heading{display:block}.halloween-preview .halloween-shelf-heading p{margin-top:6px}}
@media(max-width:600px){.halloween-preview{padding:0 16px 45px}.halloween-preview .path-tabs{font-size:19px;gap:26px}.halloween-preview>header.halloween-heading{grid-template-columns:1fr;gap:23px;padding:22px 4px 28px}.halloween-preview h1{font-size:42px}.halloween-preview .halloween-heading .event-intro{font-size:16px}.halloween-preview .event-calendar{display:flex;align-items:center;gap:18px;padding:16px 0 0;border-left:0;border-top:1px solid var(--event-border)}.halloween-preview .halloween-heading .event-dates{font-size:20px;flex:none;margin:0}.halloween-preview .halloween-shelf{margin:0 auto;padding:24px 0 0}.halloween-preview .halloween-shelf-heading{padding:0 10px}.halloween-books{grid-template-columns:repeat(4,minmax(0,1fr));gap:28px 16px}.halloween-books article:nth-child(4){grid-column:span 2}.halloween-books article:last-child{grid-column:2/span 2}.halloween-preview .halloween-book-caption{grid-template-columns:1fr;gap:4px;margin-top:12px}.halloween-books article h2{font-size:17px}.halloween-books .event-story-link{margin-left:0}}
@media(max-width:380px){.halloween-books{grid-template-columns:1fr;max-width:280px;margin:auto}.halloween-books article,.halloween-books article:nth-child(4),.halloween-books article:last-child{grid-column:auto}.halloween-preview h1{font-size:37px}}

@media(max-width:600px){.halloween-preview::before{width:100%;background-size:auto 1100px;mask-image:linear-gradient(transparent,#000 80px,#000 800px,transparent 1100px)}.halloween-preview::after{background:radial-gradient(ellipse at 50% 48%,#f6f0e2f5 25%,#f6f0e2d9 58%,#f6f0e255 85%,transparent)}}

/* Menu layout must not expose account actions hidden by session state. */
.site-pocket-menu [hidden],.site-pocket [hidden]{display:none!important}

/* Wait for the common header's first composition without flashing legacy links. */
body>header[data-site-pending]{visibility:hidden}

/* Guest alternatives occupy the same account slot as a chosen portrait. */
.site-header .site-guest-mark{display:grid;place-items:center;flex:0 0 44px;width:44px;height:44px;box-sizing:border-box;border:1px solid var(--ui-line);border-radius:50%;color:var(--ui-ink);font:400 28px/1 var(--ui-heading);text-align:center}
body>header.site-header .site-avatar-toggle>img.site-guest-book{display:block;flex:0 0 44px;width:44px;height:44px;max-height:none;padding:5px;box-sizing:border-box;object-fit:contain;border:1px solid var(--ui-line);border-radius:50%}

/* Square paintings retain their full composition in collections and recaps. */
.achievement>img{width:min(100%,150px);height:auto;aspect-ratio:1;object-fit:contain}
.reader-dashboard .dashboard-keepsakes img{width:85px;height:85px;aspect-ratio:1;object-fit:contain}
.reader-dashboard.reader-book-home .dashboard-keepsakes img{width:110px;height:110px;aspect-ratio:1;object-fit:contain}
@media(max-width:800px){.reader-dashboard.reader-book-home .dashboard-keepsakes img{width:80px;height:80px}}
@media(max-width:500px){.achievement>img{width:min(100%,125px);height:auto}}

/* Fixed slots prevent account hydration from rearranging the common header. */
body>header.site-header>a:first-child{order:0}
body>header.site-header>nav{order:1}
body>header.site-header>.season-badge{order:2;flex:0 0 auto;margin:0}
body>header.site-header>.child-news-button{order:3;flex-shrink:0}
body>header.site-header>.site-stars{order:4;flex-shrink:0;min-width:44px;min-height:44px;justify-content:center;box-sizing:border-box}
body>header.site-header>.site-account{order:5;flex-shrink:0;margin:0}
@media(max-width:780px){
 body>header.site-header{gap:4px 5px;padding:8px 12px;min-height:104px}
 body>header.site-header>a:first-child{margin-right:auto}
 body>header.site-header>a:first-child>img{width:88px}
 body>header.site-header>.season-badge{display:flex!important;gap:3px;min-height:44px;flex-basis:auto}
 body>header.site-header>.season-badge>img{width:18px;height:24px}
 body>header.site-header>.season-badge strong{font-size:12px}
 body>header.site-header>.season-badge time{display:none}
 body>header.site-header>.child-news-button{width:44px;min-width:44px;height:44px;padding:7px}
 body>header.site-header>.child-news-button>img{width:28px;height:28px}
 body>header.site-header>.site-stars{gap:2px;font-size:14px;padding:0}
 body>header.site-header .site-stars img{width:22px;height:22px}
 body>header.site-header .site-avatar-toggle{width:44px;min-width:44px;height:44px;min-height:44px;padding:0;justify-content:center}
 body>header.site-header .site-avatar-toggle>img{width:38px;height:40px}
 body>header.site-header>nav{order:10;flex:0 0 100%;gap:12px;justify-content:space-between;font-size:12px}
}

/* Keep all five header slots above the navigation even on a 320px screen. */
@media(max-width:360px){
 body>header.site-header{padding:8px;column-gap:3px}
 body>header.site-header>a:first-child{min-width:0}
 body>header.site-header>a:first-child>img{width:64px}
 body>header.site-header>.season-badge{gap:2px}
 body>header.site-header>.season-badge>img{width:14px}
 body>header.site-header>.season-badge strong{font-size:11px}
 body>header.site-header>.site-account{width:44px;min-width:44px}
 body>header.site-header>nav{column-gap:8px}
}

/* Smaller map artwork, with a full finger target around each action. */
@media(max-width:760px){
 .atlas-stage .atlas-marker{min-width:44px;min-height:44px;width:44px;height:44px;padding:10px;box-sizing:border-box}
 .atlas-stage .atlas-marker i{font-family:Arial,sans-serif;font-variant-emoji:text;font-size:12px;width:13px;height:13px;line-height:10px}
 .atlas-stage .atlas-marker.has-map i{width:18px;height:18px;line-height:14px}
 .atlas-stage .atlas-marker>span.atlas-story-badge{top:-24px;width:44px;min-width:44px;height:44px;justify-content:center}
 .atlas-stage .atlas-story-badge img{width:28px;height:28px;min-width:28px;padding:3px;border-width:1px;box-shadow:0 0 0 2px #fff8e9,0 2px 4px #243f3d33}
 .atlas-stage .atlas-story-badge small{display:none}
 .atlas-stage .atlas-marker.has-reader-presence>span.atlas-story-badge{left:calc(50% + 27px);top:-42px;width:44px;min-width:44px}
 .atlas-stage .atlas-marker.has-reader-presence>.atlas-story-badge img{width:28px;height:28px;min-width:28px;padding:3px;border-width:1px}
 .atlas-stage .atlas-filter button{min-width:44px;min-height:44px;padding:3px}
 .atlas-stage .atlas-label-toggle{min-height:44px}
}

/* The first-entry story uses the same painted initials and scene art as the reader. */
.arrival-book .story-art{margin:30px 0}.arrival-book .story-art img{display:block;width:100%;height:auto;border-radius:4px}.arrival-book .prose .book-text{white-space:pre-wrap}
/* Drawn unknown reader: retain the shared 44px account slot. */
body>header.site-header .site-avatar-toggle>img.site-guest-portrait{display:block;flex:0 0 44px;width:44px;height:44px;max-height:none;padding:0;object-fit:contain;border:0;border-radius:0}

