/* Night/weather presentation for Youth appearance in either collection.
   Catalog filtering, embedded products, and stored choices stay with their owners. */
.hub-youth-weather-controls{display:none;position:absolute;top:9px;right:max(20px,calc((100% - 1274px)/2));z-index:3;align-items:center;gap:10px;height:64px}
body[data-library-theme="youth"] .hub-youth-weather-controls{display:flex}
body[data-library-theme="youth"] #hub-world .hub-shell{padding-top:86px}
.hub-youth-weather-button{position:relative;display:grid;place-items:center;width:60px;height:60px;min-width:48px;min-height:48px;padding:3px;border:0;border-radius:12px;background:transparent;color:#294a39;box-shadow:none;touch-action:manipulation}
.hub-youth-weather-button::before,.hub-youth-weather-button::after{content:none}
.hub-youth-weather-button>img{display:block;width:100%;height:100%;object-fit:contain;pointer-events:none;user-select:none;filter:drop-shadow(0 2px 2px #243c394d);transition:filter .2s}
.hub-youth-weather-button:hover>img{filter:brightness(1.09) drop-shadow(0 2px 3px #243c3970)}
.hub-youth-weather-button:focus-visible{outline:3px dashed #264c39;outline-offset:2px}
.hub-youth-weather-fallback{display:none;font:700 12px/1.3 ui-rounded,"Trebuchet MS",system-ui,sans-serif}
.hub-youth-weather-button[data-art-missing="true"]>img{display:none}
.hub-youth-weather-button[data-art-missing="true"]>.hub-youth-weather-fallback{display:block}
#hub-youth-rain-toggle[aria-pressed="true"]{outline:2px solid #e9d494;outline-offset:-3px;background:#b7d6ee12}
.hub-youth-night-stars,.hub-youth-night-owl,.hub-youth-night-moon,.hub-youth-rain{display:none;position:absolute;pointer-events:none}
body[data-library-theme="youth"] #hub-world[data-youth-time="night"]{background:#142c34;--hub-ink:#f9efd7;--hub-muted:#d5dfd6;--hub-line:#829b87;--hub-silver:#dfdbac;--hub-bright:#fff4c5}
body[data-library-theme="youth"] #hub-world[data-youth-time="night"] .hub-world-scenery::before{background:linear-gradient(180deg,transparent 63%,#142c3426 78%,#142c34 100%),url('./hub-youth/night-garden-r12.webp') 27% top / cover no-repeat;background-color:#142c34}
body[data-library-theme="youth"] #hub-world[data-youth-time="night"] .hub-youth-air{display:none}
body[data-library-theme="youth"] #hub-world[data-youth-time="night"] :is(.hub-youth-night-stars,.hub-youth-night-owl,.hub-youth-night-moon,.hub-youth-rain){display:block}
.hub-youth-night-moon{left:calc(50% - 32px);top:4px;width:64px;height:64px;object-fit:contain;filter:drop-shadow(0 0 9px #fff0b84d);user-select:none}
.hub-youth-night-moon[data-art-missing="true"]{display:none!important}
.hub-youth-night-stars{inset:0;height:min(100%,var(--hub-youth-scene-height,1160px));overflow:hidden}
.hub-youth-night-stars>i{position:absolute;left:var(--star-x);top:var(--star-y);width:var(--star-size);height:var(--star-size);border-radius:50%;background:#fff4c5;box-shadow:0 0 4px 1px #dcebd755;opacity:.52;animation:hub-youth-star-breathe 8s ease-in-out var(--star-delay) infinite alternate}
.hub-youth-night-owl{left:var(--hub-owl-left,clamp(18px,12%,174px));top:var(--hub-owl-top,3px);width:76px;height:76px;min-width:44px;min-height:44px;padding:0;border:0;border-radius:8px;background:transparent;box-shadow:none;isolation:isolate;z-index:2;pointer-events:auto;touch-action:manipulation}
.hub-youth-night-owl>img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;user-select:none;pointer-events:none;clip-path:polygon(0 0,100% 0,100% 52.5%,70.625% 52.5%,69.6875% 59.375%,65.9375% 65.3125%,60.625% 69.6875%,54.375% 71.875%,54.375% 75%,53.4375% 76.875%,52.1875% 77.1875%,51.25% 76.875%,50.9375% 75%,50.3125% 76.875%,49.0625% 77.5%,48.125% 76.5625%,47.5% 74.6875%,47.1875% 72.1875%,42.1875% 71.875%,41.5625% 75%,40.625% 76.5625%,39.6875% 76.25%,39.0625% 74.6875%,38.4375% 76.25%,37.1875% 76.25%,36.25% 74.6875%,35.3125% 71.875%,30.625% 71.875%,25.625% 71.5625%,23.125% 69.0625%,20.9375% 66.25%,18.125% 60.3125%,15.9375% 59.6875%,15% 54.375%,0 54.375%);filter:drop-shadow(0 2px 2px #0a181f5c)}
.hub-youth-owl-open{opacity:1}
.hub-youth-owl-blink{opacity:0;animation:hub-youth-owl-blink 7.7s step-end infinite;mask-image:radial-gradient(ellipse 9% 8% at 37% 32%,#000 88%,transparent 100%),radial-gradient(ellipse 9% 8% at 56% 36%,#000 88%,transparent 100%);-webkit-mask-image:radial-gradient(ellipse 9% 8% at 37% 32%,#000 88%,transparent 100%),radial-gradient(ellipse 9% 8% at 56% 36%,#000 88%,transparent 100%)}
.hub-youth-night-owl[data-blink-missing="true"] .hub-youth-owl-open{animation:none}
.hub-youth-night-owl[data-open-missing="true"]{display:none!important}
.hub-youth-night-owl[data-blink-missing="true"] .hub-youth-owl-blink{display:none}
.hub-youth-rain{inset:0;width:100%;height:100%;opacity:.8}
#hub-world[data-youth-weather-paused="true"] :is(.hub-youth-night-stars>i,.hub-youth-night-owl>img){animation-play-state:paused}
#hub-world[data-youth-weather-still="true"] :is(.hub-youth-night-stars>i,.hub-youth-night-owl>img){animation:none}
#hub-world[data-youth-weather-still="true"] .hub-youth-owl-blink{display:none}
/* Midnight panels keep the same storybook shapes and high-contrast warm ink. */
body[data-library-theme="youth"] #hub-world[data-youth-time="night"] :is(.hub-intro,.hub-toolbar,.hub-feature,.hub-section-heading,.hub-preference-notice){background:#213b43;border-color:#89a492;color:#f9efd7;box-shadow:0 4px 0 #0b242b,0 10px 25px #04161b33}
body[data-library-theme="youth"] #hub-world[data-youth-time="night"] :is(.hub-intro h1,.hub-section-heading h2,.hub-feature-copy h3){color:#fbf0d4;text-shadow:0 2px 0 #0c2730}
body[data-library-theme="youth"] #hub-world[data-youth-time="night"] :is(.hub-intro p:not(.hub-kicker),.hub-feature-copy>p:not([class]),.hub-feature-copy .hub-subtitle,.hub-count){color:#dce7dd}
body[data-library-theme="youth"] #hub-world[data-youth-time="night"] :is(.hub-kicker,.hub-card-eyebrow){color:#d5dcae}
body[data-library-theme="youth"] #hub-world[data-youth-time="night"] .hub-mode-control{background:#304d4d;border-color:#91ac91;color:#fff1cb;box-shadow:0 3px 0 #102f35}
body[data-library-theme="youth"] #hub-world[data-youth-time="night"] .hub-mode-control:hover{background:#3b5b58}
body[data-library-theme="youth"] #hub-world[data-youth-time="night"] :is(.hub-mode-control small,.hub-mode-control>span:last-child){color:#dce4bd}
body[data-library-theme="youth"] #hub-world[data-youth-time="night"] .hub-filter{color:#e7efdc}
body[data-library-theme="youth"] #hub-world[data-youth-time="night"] .hub-filter:hover{background:#38594f;color:#fff8db}
body[data-library-theme="youth"] #hub-world[data-youth-time="night"] .hub-filter[aria-pressed="true"]{background:#dbe3b9;color:#283f35;border-color:#a6bb8c;box-shadow:0 2px 0 #142d30}
body[data-library-theme="youth"] #hub-world[data-youth-time="night"] :is(.hub-cameo-controls button,.hub-section-heading span){background:#304c4e;color:#f1e9c8;border-color:#8da88f;box-shadow:none}
body[data-library-theme="youth"] #hub-world[data-youth-time="night"] .hub-cameo-controls button:hover{background:#3b5a57;color:#fff8d9}
body[data-library-theme="youth"] #hub-world[data-youth-time="night"] .hub-feature-art{border-color:#89a492}
body[data-library-theme="youth"] #hub-world[data-youth-time="night"] #hub-meadow-help{color:#edf0d0;text-shadow:0 1px 3px #0d2630}
body[data-library-theme="youth"] #hub-world[data-youth-time="night"] .hub-youth-weather-button{color:#fff1c8}
body[data-library-theme="youth"] #hub-world[data-youth-time="night"] :is(button,a):focus-visible{outline-color:#ffedaa}
@keyframes hub-youth-star-breathe{from{opacity:.28}to{opacity:.8}}
@keyframes hub-youth-owl-blink{0%,85%,90%,94%,100%{opacity:0}87%,92%{opacity:1}}
@media(max-width:700px){
 .hub-youth-weather-controls{right:17px;top:9px;height:56px;gap:8px}
 .hub-youth-weather-button{width:52px;height:52px}
 body[data-library-theme="youth"] #hub-world .hub-shell{padding-top:78px}
 .hub-youth-night-moon{left:calc(50% - 44px);top:13px;width:46px;height:46px}
 .hub-youth-night-owl{left:var(--hub-owl-left,24px);top:var(--hub-owl-top,6px);width:64px;height:64px}
 body[data-library-theme="youth"] #hub-world[data-youth-time="night"] .hub-world-scenery::before{background-position:42% top}
}
@media(prefers-reduced-motion:reduce){.hub-youth-night-stars>i,.hub-youth-night-owl>img{animation:none!important}.hub-youth-owl-blink{display:none!important}.hub-youth-weather-button>img{transition:none}}
@media(forced-colors:active){
 .hub-youth-weather-button{border:1px solid ButtonText;background:ButtonFace!important;color:ButtonText!important;forced-color-adjust:auto}
 .hub-youth-weather-button>img{display:none}.hub-youth-weather-fallback{display:block}
 #hub-youth-rain-toggle[aria-pressed="true"]{outline:3px solid Highlight}
 body[data-library-theme="youth"] #hub-world[data-youth-time="night"] :is(.hub-intro,.hub-toolbar,.hub-feature,.hub-section-heading,.hub-preference-notice,.hub-mode-control,.hub-section-heading span,.hub-cameo-controls button){background:Canvas;color:CanvasText;border-color:CanvasText;box-shadow:none}
 body[data-library-theme="youth"] #hub-world[data-youth-time="night"] :is(.hub-intro h1,.hub-intro p:not(.hub-kicker),.hub-section-heading h2,.hub-feature-copy h3,.hub-feature-copy>p:not([class]),.hub-feature-copy .hub-subtitle,.hub-count,.hub-kicker,.hub-card-eyebrow,.hub-mode-control small,.hub-mode-control>span:last-child,#hub-meadow-help){color:CanvasText;text-shadow:none}
 body[data-library-theme="youth"] #hub-world[data-youth-time="night"] .hub-filter{color:ButtonText;background:ButtonFace}
 body[data-library-theme="youth"] #hub-world[data-youth-time="night"] .hub-filter[aria-pressed="true"]{border-color:Highlight;color:Highlight}
 body[data-library-theme="youth"] #hub-world[data-youth-time="night"] :is(button,a):focus-visible{outline-color:Highlight}
}

/* The Full collection retains both activities, notes and footer at night. */
body[data-library-theme="youth"] #hub-world[data-youth-time="night"] :is(.hub-app-card,.hub-library-note,.hub-footer){background:#213b43;border-color:#89a492;color:#dce7dd;box-shadow:0 4px 0 #0b242b,0 10px 25px #04161b33}
body[data-library-theme="youth"] #hub-world[data-youth-time="night"] .hub-card-body h3{color:#fbf0d4}
body[data-library-theme="youth"] #hub-world[data-youth-time="night"] .hub-card-body>p:not([class]){color:#dce7dd}
body[data-library-theme="youth"] #hub-world[data-youth-time="night"] :is(.hub-library-note,.hub-footer) a{color:#f4e9b3}
body[data-library-theme="youth"] #hub-world[data-youth-time="night"] .hub-app-art{border-color:#89a492}
@media(forced-colors:active){body[data-library-theme="youth"] #hub-world[data-youth-time="night"] :is(.hub-app-card,.hub-library-note,.hub-footer){background:Canvas;color:CanvasText;border-color:CanvasText;box-shadow:none}body[data-library-theme="youth"] #hub-world[data-youth-time="night"] :is(.hub-card-body h3,.hub-card-body>p:not([class]),.hub-library-note a,.hub-footer a){color:CanvasText}}

/* Owl artwork is clipped above its separate twig; the existing tree is its perch. */
.hub-youth-night-owl::before,.hub-youth-night-owl::after{content:none}
.hub-youth-night-owl:focus-visible{outline:3px dashed #ffedaa;outline-offset:1px}
.hub-youth-night-owl[data-reacting]>img{filter:brightness(1.1) drop-shadow(0 0 4px #f1dbb155)}
.hub-youth-owl-fallback{display:none}
.hub-friend-sprite{position:relative}
.hub-star-twinkle{display:none;position:absolute;inset:-11%;pointer-events:none}
.hub-meadow-friend[data-youth-friend="star"][data-reacting] .hub-friend-sprite{animation:hub-star-greeting 1.2s ease-in-out 1}
.hub-meadow-friend[data-youth-friend="star"][data-reacting] .hub-star-twinkle{display:block}
.hub-star-twinkle>i{position:absolute;left:calc(12% + var(--spark-index)*18%);top:10%;width:7px;height:7px;background:#fff0b2;clip-path:polygon(50% 0,62% 37%,100% 50%,62% 63%,50% 100%,38% 63%,0 50%,38% 37%);opacity:0;animation:hub-star-sparkle 1.15s ease-in-out 1}
.hub-star-twinkle>i:nth-child(even){top:80%}.hub-star-twinkle>i:nth-child(3){top:0}
@keyframes hub-star-greeting{0%,100%{filter:brightness(1)}45%{filter:brightness(1.35) drop-shadow(0 0 9px #ffefa1)}}
@keyframes hub-star-sparkle{0%,100%{opacity:0;transform:scale(.5)}45%{opacity:.95;transform:scale(1.2)}}
#hub-world[data-youth-reduced="true"] .hub-meadow-friend[data-youth-friend="star"][data-reacting] .hub-friend-sprite{animation:none;filter:brightness(1.18) drop-shadow(0 0 5px #ffefa1)}
#hub-world[data-youth-reduced="true"] .hub-star-twinkle>i{animation:none;opacity:.8}
@media(prefers-reduced-motion:reduce){.hub-star-twinkle>i{animation:none;opacity:.8}.hub-meadow-friend[data-youth-friend="star"][data-reacting] .hub-friend-sprite{animation:none}}
@media(forced-colors:active){.hub-youth-night-owl{background:ButtonFace;border:1px solid ButtonText;color:ButtonText}.hub-youth-night-owl>img{display:none}.hub-youth-owl-fallback{display:block}.hub-youth-night-owl:focus-visible{outline-color:Highlight}.hub-star-twinkle>i{background:Highlight}}

/* Tall phone crops receive enough open sky for the existing bough and owl. */
body[data-library-theme="youth"] #hub-world[data-youth-time="night"] .hub-shell{padding-top:var(--hub-owl-header-space,86px)}

body[data-library-theme="youth"] #hub-world[data-youth-time="night"] .hub-library-note a.hub-explorer-link{background:#304c4e;border-color:#8da88f;color:#f4e9b3;box-shadow:0 3px 0 #0b242b}
body[data-library-theme="youth"] #hub-world[data-youth-time="night"] .hub-library-note a.hub-explorer-link:hover{background:#3b5a57;color:#fff8d9}
@media(forced-colors:active){body[data-library-theme="youth"] #hub-world[data-youth-time="night"] .hub-library-note a.hub-explorer-link{background:ButtonFace;color:ButtonText;border-color:ButtonText;box-shadow:none}}
