/* The screenshot's horizontal header is shared by every product route. */
body.site-header-page>.site-header{box-sizing:border-box!important;display:flex!important;position:relative!important;inset:auto!important;align-items:center!important;justify-content:flex-start!important;flex-wrap:nowrap!important;gap:20px!important;width:calc(100% - 64px)!important;max-width:1536px!important;min-height:100px!important;height:auto!important;margin:0 auto!important;padding:16px 0 22px!important;border:0!important;border-bottom:1px solid #bacbb5!important;border-radius:0!important;background:#e5efdf!important;color:#193f33!important;box-shadow:none!important;text-align:left!important;z-index:30;isolation:isolate;color-scheme:light}
body.site-header-page>.site-header::before,body.site-header-page>.site-header::after{content:none!important}
body.site-header-page .site-header .brand-lockup{display:inline-flex!important;align-items:center;flex:0 0 auto!important;gap:8px!important;width:auto!important;margin:0 auto 0 0!important;padding:0!important;color:#193f33!important;text-decoration:none;white-space:nowrap!important;font-size:28px!important;line-height:1.2!important}
body.site-header-page .site-header .brand-lockup::after{content:'•'!important;align-self:flex-start;color:#e95329;font:700 18px/1 var(--font-site);margin-left:-4px}
body.site-header-page .site-header .brand-lockup>svg{width:24px!important;height:24px!important;flex:none;fill:none;stroke:currentColor;stroke-width:1.7}
body.site-header-page .site-header .brand-lockup span{font-family:var(--font-heading,var(--font-site))!important;font-weight:600!important;letter-spacing:-.075em!important;text-transform:lowercase}
body.site-header-page .site-header .app-navigation{display:flex!important;position:static!important;inset:auto!important;align-items:center!important;justify-content:flex-end!important;flex-direction:row!important;flex-wrap:nowrap!important;flex:0 1 auto!important;gap:6px!important;width:auto!important;height:auto!important;min-height:0!important;margin:0!important;padding:0!important;border:0!important;border-radius:0!important;background:none!important;box-shadow:none!important;transform:none!important;order:0!important}
body.site-header-page .site-header .nav-item{display:flex!important;flex-direction:row!important;align-items:center!important;justify-content:center!important;flex:none;gap:10px!important;min-height:48px!important;padding:10px 12px!important;border:0!important;border-bottom:2px solid transparent!important;border-radius:2px!important;background:transparent!important;color:#667e6e!important;font-size:16px!important;font-weight:500!important;line-height:1.4!important;white-space:nowrap!important;text-decoration:none;transform:none!important}
body.site-header-page .site-header .nav-item[hidden]{display:none!important}
body.site-header-page .site-header .nav-item[aria-current='page']{background:#d6e4ce!important;color:#193f33!important;border-bottom-color:#e95329!important;font-weight:800!important}
body.site-header-page .site-header .nav-item::before,body.site-header-page .site-header .nav-item::after{content:none!important}
body.site-header-page .site-header .nav-item svg{display:block!important;width:22px!important;height:22px!important;flex:0 0 22px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
body.site-header-page .site-header .service-header-actions{display:flex!important;position:static!important;align-items:center;flex:0 0 auto!important;gap:8px!important;margin:0!important;padding:0!important}
body.site-header-page .site-header :is(.service-account-entry,.site-menu-toggle){display:grid!important;place-items:center!important;flex:none;width:48px!important;min-width:48px!important;height:48px!important;min-height:48px!important;margin:0!important;padding:11px!important;border:1px solid #bacbb5!important;border-radius:3px!important;background:#f8f7ef!important;color:#193f33!important;box-shadow:none!important;text-decoration:none}
body.site-header-page .site-header :is(.service-account-entry,.site-menu-toggle) svg{display:block!important;width:24px!important;height:24px!important;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
body.site-header-page .site-header .install-slot{flex:none!important;width:auto!important;margin:0!important;padding:0!important;order:0!important}
body.site-header-page .site-header .install-slot:not(:has(button:not([hidden]))){display:none!important}
body.site-header-page .site-header .service-install-button{min-height:48px;padding:12px 16px;border:1px solid #bacbb5;border-radius:3px;background:#f8f7ef;color:#193f33;font:800 16px/1.4 var(--font-site);white-space:nowrap}
body.site-header-page .site-header .service-install-button[hidden]{display:none!important}
body.site-header-page .site-header .site-menu-toggle{display:none!important}
body.site-header-page .site-header :is(a,button):focus-visible{outline:3px solid #e95329!important;outline-offset:3px}
body.site-header-page .site-header .nav-item:hover{background:#dce8d6!important;color:#193f33!important}
/* The old sidebar columns now belong to content, without a duplicate menu. */
body.site-header-page:not(.hero-page)>.responsive-container,body.site-header-page:not(.hero-page)>main.responsive-container{display:block!important;width:100%!important;max-width:1600px!important;margin:0 auto!important;padding:32px!important;min-height:0!important}
body.site-header-page>.responsive-container::before,body.site-header-page>.responsive-container::after{content:none!important}
body.site-header-page :is(.album-content,.home-content){grid-column:auto!important;grid-row:auto!important}
body.site-header-page .story-screen{max-width:1400px!important}
body.site-header-page .video-screen{max-width:1400px!important}
body.site-header-page .account-shell{padding-top:32px}
body.site-header-page #open-search{flex:none;display:grid;place-items:center;width:46px;height:46px;min-height:46px;padding:10px;border:1px solid #bacbb5;border-radius:3px;background:#f8f7ef;color:#193f33}
body.site-header-page #open-search svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7}
body.site-header-page .album-filter-row{flex-wrap:wrap}
body.site-header-page.hero-page>.hero-shell{display:block!important;grid-template-columns:none!important;box-sizing:border-box!important;width:100%!important;height:calc(100dvh - var(--site-header-height,100px))!important;min-height:0!important;margin:0!important;padding:0!important}
body.site-header-page.hero-page .hero-shell::after{content:none!important}
body.site-header-page.hero-page .hero-workspace{width:100%!important;height:100%!important;border-radius:0!important}
body.site-header-page #aquarium-game iframe{height:calc(100dvh - var(--site-header-height,100px))}
body.site-header-page[data-aquarium-trial='true'] #aquarium-game iframe{height:calc(100dvh - var(--site-header-height,100px) - 60px)}
@media(min-width:1024px) and (max-width:1279px){
 body.site-header-page>.site-header{flex-wrap:wrap!important;gap:14px!important}
 body.site-header-page .site-header .app-navigation{order:3!important;flex-basis:100%!important;justify-content:flex-end!important}
}
@media(max-width:1023px){
 /* Keep the mobile hero scene immersive, including landscape phones. */
 body.site-header-page.hero-page>.site-header{display:none!important}
 body.site-header-page.hero-page>.hero-shell{height:100dvh!important}
 body.site-header-page>.site-header{width:calc(100% - 32px)!important;min-height:76px!important;padding:14px 0!important;gap:8px!important;flex-wrap:wrap!important}
 body.site-header-page .site-header .brand-lockup{font-size:24px!important;gap:4px!important}
 body.site-header-page .site-header .brand-lockup>svg{width:20px!important;height:20px!important}
 body.site-header-page .site-header :is(.service-account-entry,.site-menu-toggle){width:44px!important;min-width:44px!important;height:44px!important;min-height:44px!important;padding:10px!important}
 body.site-header-page .site-header .site-menu-toggle{display:grid!important}
 body.site-header-page .site-header .app-navigation{display:none!important;order:4!important;flex-basis:100%!important;flex-wrap:wrap!important;justify-content:flex-start!important;gap:4px!important;padding-top:6px!important}
 body.site-header-page .site-header[data-menu-open='true'] .app-navigation{display:flex!important}
 body.site-header-page .site-header .nav-item{flex:1 1 calc(50% - 4px)!important;justify-content:flex-start!important;font-size:14px!important;padding:10px!important}
 body.site-header-page .site-header .install-slot{flex-basis:100%!important;margin-top:6px!important}
 body.site-header-page .site-header .service-install-button{width:100%;font-size:14px}
 body.site-header-page:not(.hero-page)>main.responsive-container{padding:24px 16px!important}
 body.site-header-page .video-create-bar,body.site-header-page .story-mini-player{bottom:0}
}

body.site-header-page .upload-art{max-width:100%!important;margin-inline:0!important}


@media(max-width:1023px) and (max-height:500px){
 body.site-header-page #hero-games-layer .hero-game-hud{left:auto;right:76px;top:68px;bottom:16px;width:36%;max-width:300px;max-height:none}
 body.site-header-page [data-hero-game="ball"] #hero-game-actions{grid-template-columns:repeat(2,minmax(0,1fr))}
 body.site-header-page [data-hero-game="ball"] #hero-game-actions button{height:auto;min-height:44px}
}

/* Reference menu, 30 September: one measured layout for every route. */
body.site-header-page>.site-header{
  box-sizing:border-box!important;width:100%!important;max-width:none!important;height:120px!important;min-height:120px!important;
  margin:0!important;padding:0 48px!important;gap:22px!important;border:0!important;border-bottom:1px solid #d2e3cf!important;
  background:linear-gradient(180deg,#eef8eb 0%,#e9f4e5 100%)!important;
  box-shadow:0 6px 22px #8cad8d24!important;
}
body.site-header-page .site-header .brand-lockup{
  gap:10px!important;height:48px!important;min-height:48px!important;font-size:43px!important;line-height:1.05!important;
}
body.site-header-page .site-header .brand-lockup>svg{width:44px!important;height:44px!important;flex:0 0 44px!important;stroke-width:1.8!important}
body.site-header-page .site-header .brand-lockup::after{
  position:relative;top:-8px;align-self:flex-start;margin-left:-5px;font:800 24px/1 var(--font-site);
}
body.site-header-page .site-header .app-navigation{gap:18px!important;flex:0 0 auto!important;align-self:center!important}
body.site-header-page .site-header .nav-item{
  box-sizing:border-box!important;position:relative!important;min-height:68px!important;height:68px!important;
  padding:0 16px!important;gap:14px!important;border:0!important;border-bottom:3px solid transparent!important;
  border-radius:17px!important;background:transparent!important;color:#547268!important;
  font-size:20px!important;font-weight:600!important;line-height:1.2!important;
}
body.site-header-page .site-header .nav-item[data-nav='home']{width:168px!important}
body.site-header-page .site-header .nav-item[data-nav='album']{width:144px!important}
body.site-header-page .site-header .nav-item[data-nav='create']{width:175px!important}
body.site-header-page .site-header .nav-item[data-nav='aquarium']{
  width:185px!important;min-height:60px!important;height:60px!important;margin-left:32px!important;
  border-radius:30px!important;background:#dbead6!important;
}
body.site-header-page .site-header .nav-item[data-nav='aquarium']::before{
  content:''!important;position:absolute;left:-39px;top:50%;width:1px;height:46px;
  transform:translateY(-50%);background:#bfd3bf;pointer-events:none;
}
body.site-header-page .site-header .nav-item[aria-current='page']{
  background:#dcebd8!important;color:#173f33!important;border-bottom-color:#ed4d27!important;font-weight:800!important;
}
body.site-header-page .site-header .nav-item[data-nav='aquarium'][aria-current='page']{background:#d1e5cd!important}
body.site-header-page .site-header .nav-item svg{
  width:38px!important;min-width:38px!important;height:38px!important;flex:0 0 38px!important;
  stroke-width:1.9!important;
}
body.site-header-page .site-header .install-slot{margin-left:20px!important}
body.site-header-page .site-header .service-install-button{
  box-sizing:border-box!important;display:flex!important;align-items:center!important;justify-content:center!important;gap:8px!important;
  width:auto!important;min-width:0!important;max-width:100%!important;height:44px!important;min-height:44px!important;
  padding:0 14px!important;border:1px solid #e24622!important;border-radius:12px!important;
  background:linear-gradient(115deg,#e13f1f,#ea5127)!important;color:#fff!important;
  box-shadow:0 3px 8px #ba5a3c18!important;font:700 14px/1.2 var(--font-site)!important;
}
body.site-header-page .site-header .service-install-button svg{
  display:block;width:20px;height:20px;flex:0 0 20px;fill:none;stroke:currentColor;stroke-width:2;
  stroke-linecap:round;stroke-linejoin:round;
}
body.site-header-page .site-header .service-install-button[hidden],
html[data-display='standalone'] body.site-header-page .site-header .install-slot{display:none!important}
body.site-header-page .site-header .service-header-actions{gap:0!important}
body.site-header-page .site-header .service-account-entry{
  box-sizing:border-box!important;width:70px!important;min-width:70px!important;height:70px!important;min-height:70px!important;
  padding:14px!important;border:1px solid #c4d9c5!important;border-radius:50%!important;
  background:#f3f9ef!important;color:#204d41!important;
}
body.site-header-page .site-header .service-account-entry svg{width:40px!important;height:40px!important;stroke-width:1.8!important}
body.site-header-page .site-header .nav-item:hover{background:#e0eddb!important}
body.site-header-page .site-header .service-install-button:hover{background:linear-gradient(115deg,#ce3b1d,#df4924)!important}
body.site-header-page #aquarium-game iframe{height:calc(100dvh - var(--site-header-height,120px))}
body.site-header-page[data-aquarium-trial='true'] #aquarium-game iframe{height:calc(100dvh - var(--site-header-height,120px) - 60px)}
@media(min-width:1280px) and (max-width:1599px){
  body.site-header-page>.site-header{height:100px!important;min-height:100px!important;padding:0 32px!important;gap:14px!important}
  body.site-header-page .site-header .brand-lockup{font-size:31px!important;gap:8px!important}
  body.site-header-page .site-header .brand-lockup>svg{width:30px!important;height:30px!important;flex-basis:30px!important}
  body.site-header-page .site-header .brand-lockup::after{font-size:19px}
  body.site-header-page .site-header .app-navigation{gap:8px!important}
  body.site-header-page .site-header .nav-item{width:auto!important;height:56px!important;min-height:56px!important;padding:0 10px!important;gap:9px!important;font-size:16px!important}
  body.site-header-page .site-header .nav-item[data-nav='aquarium']{width:136px!important;height:52px!important;min-height:52px!important;margin-left:18px!important;padding:0 14px!important}
  body.site-header-page .site-header .nav-item[data-nav='aquarium']::before{left:-18px;height:36px}
  body.site-header-page .site-header .nav-item svg{width:23px!important;min-width:23px!important;height:23px!important;flex-basis:23px!important}
  body.site-header-page .site-header .install-slot{margin-left:8px!important}
  body.site-header-page .site-header .service-install-button{width:auto!important;min-width:0!important;height:44px!important;min-height:44px!important;border-radius:12px!important;font-size:14px!important;gap:8px!important}
  body.site-header-page .site-header .service-install-button svg{width:20px;height:20px;flex-basis:20px}
  body.site-header-page .site-header .service-account-entry{width:56px!important;min-width:56px!important;height:56px!important;min-height:56px!important;padding:13px!important}
  body.site-header-page .site-header .service-account-entry svg{width:28px!important;height:28px!important}
}
@media(min-width:1024px) and (max-width:1279px){
  body.site-header-page>.site-header{height:auto!important;min-height:144px!important;padding:16px 24px!important;gap:12px!important}
  body.site-header-page .site-header .brand-lockup{font-size:31px!important}
  body.site-header-page .site-header .brand-lockup>svg{width:30px!important;height:30px!important;flex-basis:30px!important}
  body.site-header-page .site-header .app-navigation{order:3!important;flex:1 1 100%!important;gap:8px!important}
  body.site-header-page .site-header .nav-item{width:auto!important;height:52px!important;min-height:52px!important;padding:0 10px!important;gap:8px!important;font-size:16px!important}
  body.site-header-page .site-header .nav-item[data-nav='aquarium']{width:136px!important;height:52px!important;min-height:52px!important;margin-left:18px!important;padding:0 14px!important}
  body.site-header-page .site-header .nav-item[data-nav='aquarium']::before{left:-18px;height:36px}
  body.site-header-page .site-header .nav-item svg{width:23px!important;min-width:23px!important;height:23px!important;flex-basis:23px!important}
  body.site-header-page .site-header .install-slot{margin-left:8px!important}
  body.site-header-page .site-header .service-install-button{width:auto!important;min-width:0!important;height:44px!important;min-height:44px!important;border-radius:12px!important;font-size:14px!important;gap:8px!important}
  body.site-header-page .site-header .service-install-button svg{width:20px;height:20px;flex-basis:20px}
  body.site-header-page .site-header .service-account-entry{width:56px!important;min-width:56px!important;height:56px!important;min-height:56px!important;padding:13px!important}
  body.site-header-page .site-header .service-account-entry svg{width:28px!important;height:28px!important}
}
@media(max-width:1023px){
  body.site-header-page>.site-header{height:auto!important;min-height:76px!important;padding:12px 16px!important;gap:8px!important}
  body.site-header-page .site-header .brand-lockup{font-size:clamp(21px,4.2vw,28px)!important;gap:6px!important}
  body.site-header-page .site-header .brand-lockup>svg{width:25px!important;height:25px!important;flex-basis:25px!important}
  body.site-header-page .site-header .brand-lockup::after{top:-4px;font-size:15px}
  body.site-header-page .site-header :is(.service-account-entry,.site-menu-toggle){
    width:48px!important;min-width:48px!important;height:48px!important;min-height:48px!important;
    padding:12px!important;border:1px solid #c4d9c5!important;border-radius:50%!important;
    background:#f3f9ef!important;
  }
  body.site-header-page .site-header .site-menu-toggle{display:grid!important}
  body.site-header-page .site-header .service-account-entry svg{width:23px!important;height:23px!important}
  body.site-header-page .site-header .app-navigation{
    order:4!important;flex:1 1 100%!important;gap:8px!important;padding:12px 0 4px!important;
  }
  body.site-header-page .site-header .nav-item{
    box-sizing:border-box!important;width:auto!important;height:56px!important;min-height:56px!important;
    padding:0 13px!important;gap:10px!important;font-size:16px!important;
  }
  body.site-header-page .site-header .nav-item svg{width:23px!important;min-width:23px!important;height:23px!important;flex-basis:23px!important}
  body.site-header-page .site-header .nav-item[data-nav='aquarium']{
    width:auto!important;height:56px!important;min-height:56px!important;margin-left:0!important;border-radius:17px!important;
  }
  body.site-header-page .site-header .nav-item[data-nav='aquarium']::before{content:none!important}
  body.site-header-page .site-header .install-slot{flex:1 1 100%!important;margin:4px 0 0!important}
  body.site-header-page .site-header .service-install-button{
    width:max-content!important;min-width:0!important;max-width:100%!important;height:44px!important;min-height:44px!important;border-radius:12px!important;font-size:14px!important;
  }
}
@media(max-width:359px){
  body.site-header-page .site-header .brand-lockup{font-size:19px!important}
  body.site-header-page .site-header .brand-lockup>svg{width:21px!important;height:21px!important;flex-basis:21px!important}
  body.site-header-page .site-header :is(.service-account-entry,.site-menu-toggle){width:44px!important;min-width:44px!important;height:44px!important;min-height:44px!important}
}

body.site-header-page.editorial-theme .site-header .app-navigation.service-navigation .nav-item{font-size:20px!important;gap:14px!important}
@media(min-width:1024px) and (max-width:1599px){
  body.site-header-page.editorial-theme .site-header .app-navigation.service-navigation .nav-item{font-size:16px!important;gap:9px!important}
}
@media(max-width:1023px){
  body.site-header-page.editorial-theme .site-header .app-navigation.service-navigation .nav-item{font-size:16px!important;gap:10px!important}
}

body.site-header-page:has(>.share-card){display:flex!important;flex-direction:column;align-items:stretch;padding:0!important;min-height:100dvh}
body.site-header-page:has(>.share-card)>.share-card{align-self:center;margin:auto!important}


/* Installation guidance when the browser has no native installation prompt. */
.install-help{box-sizing:border-box;width:min(440px,calc(100% - 32px));max-height:calc(100dvh - 32px);padding:24px;border:1px solid #c4d9c5;border-radius:20px;background:#fffefa;color:#193f33;font:400 16px/1.5 var(--font-site);box-shadow:0 18px 60px #173f3326}
.install-help::backdrop{background:#102c2266}
.install-help h2{margin:0 0 16px;font:600 20px/1.4 var(--font-heading)}
.install-help p{margin:0 0 16px}
.install-help form{display:flex;justify-content:flex-end;margin:20px 0 0}
.install-help button{min-height:44px;padding:10px 20px;border:0;border-radius:12px;background:#194e41;color:white;font:700 14px/1.4 var(--font-site);cursor:pointer}