/* One familiar header across the homepage and public reading routes. */
::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:#171514}::-webkit-scrollbar-thumb{background:#88766c;border-radius:6px}
/* Keep controls live; view-transition snapshots cannot receive clicks. */
:root,.site-header,.content-header{view-transition-name:none}
html{scroll-behavior:auto}
html.smooth-scroll-ready{scroll-behavior:smooth}
.site-header nav>a,.content-header nav>a{display:inline-flex;align-items:center;min-height:44px;min-width:44px}
.site-header>nav{order:1;margin-left:auto}
.site-header .header-discord{order:2;display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;gap:9px;min-width:44px;min-height:44px;padding:11px 16px;border:0;border-radius:8px;background:#f3ede2;color:#171514;font:800 14px/1.2 Manrope,sans-serif;transition:background-color 150ms ease-out,transform 150ms ease-out}
.site-header .header-discord:hover{background:#e8dcd0;color:#171514;transform:translateY(-1px)}
.site-header .header-discord:active{transform:translateY(0)}
.content-header{width:calc(100% - 112px);max-width:1260px;height:94px;min-height:94px;position:relative;z-index:20;flex-wrap:nowrap;gap:28px}
.content-header .reading-brand{gap:9px;line-height:1}
.content-header .reading-brand img{width:124px;height:auto}
.content-header .reading-brand span{font:700 34px/1 Caveat,cursive;transform:rotate(-9deg);margin-top:-8px;color:#f3ede2}
.content-header nav{width:auto;padding:0;gap:28px;font:450 14px/1.65 Manrope,sans-serif;flex-wrap:nowrap}
.content-header nav>a{padding:8px 0;white-space:nowrap}
.content-header nav.menu-ready{display:flex}
.content-header .reading-join{gap:10px;font-weight:800;border-left:1px solid #f3ede229;padding-left:25px}
.content-header .reading-join svg{width:20px;height:20px}
.content-header .reading-menu,.site-header .menu-toggle{width:44px;height:44px;padding:10px;flex-direction:column;justify-content:center;gap:7px;border:0;background:none}
.content-header .reading-menu>span,.site-header .menu-toggle>span{width:24px;height:2px;background:#f3ede2;transition:transform .2s ease-out}
.content-header .reading-menu[aria-expanded=true]>span:first-child,.site-header .menu-toggle[aria-expanded=true]>span:first-child{transform:translateY(4.5px) rotate(45deg)}
.content-header .reading-menu[aria-expanded=true]>span:last-child,.site-header .menu-toggle[aria-expanded=true]>span:last-child{transform:translateY(-4.5px) rotate(-45deg)}
.reading-city{background:linear-gradient(90deg,#171514d9,#171514ed 44%,#171514c9),linear-gradient(0deg,#171514bf,transparent 75%),url('/assets/nova-city-1920.webp') 53% center/cover no-repeat;filter:saturate(.32)}
@media(min-width:901px){.content-header>.reading-menu:not([hidden]){display:none}.content-header nav.menu-ready:not(.is-open){display:flex}}
@media(max-width:1100px){.content-header{width:calc(100% - 72px)}.content-header nav{gap:20px;font-size:13px}.content-header .reading-join{padding-left:20px}}
@media(max-width:900px){
  .content-header{width:calc(100% - 40px);height:auto;min-height:78px;flex-wrap:wrap}
  .content-header.navigation-ready{height:78px;flex-wrap:nowrap}
  .content-header .reading-brand{min-height:78px}
  .content-header .reading-brand img{width:114px}.content-header .reading-brand span{font-size:32px}
  .content-header>.reading-menu:not([hidden]){display:flex}
  .content-header nav{position:static;width:100%;flex-direction:column;align-items:stretch;background:#1c1815;padding:22px;gap:4px}
  .content-header nav.menu-ready{position:absolute;top:78px;left:-20px;right:-20px;width:auto;box-shadow:0 15px 22px #0006}
  .content-header nav.menu-ready:not(.is-open){display:none}.content-header nav.is-open{display:flex}
  .content-header nav>a{font-size:16px;padding:11px 4px;min-height:44px}
  .content-header .reading-join{border-left:0;border-top:1px solid #f3ede229;justify-content:flex-start;padding:17px 4px 4px}
  .site-header{height:78px}
  .site-header{gap:10px}
  .site-header .header-discord{order:1;margin-left:auto;padding:10px 12px;gap:7px}
  .site-header .menu-toggle{order:2;flex-shrink:0}
  .site-header>nav{order:3;margin-left:0}
  .site-header.shell{width:calc(100% - 40px)}
  .site-header .brand img{width:114px}
  .site-header .brand>.handwritten{font-size:32px}
  .site-header .menu-toggle{display:flex}
  .site-header nav{display:none;position:absolute;top:78px;left:-20px;right:-20px;flex-direction:column;align-items:stretch;background:#1c1815;padding:22px;gap:4px;box-shadow:0 15px 22px #0006}
  .site-header nav.open{display:flex}
  .site-header nav>a{font-size:16px;padding:11px 4px;min-height:44px}
  .site-header nav .nav-join{border-left:0;border-top:1px solid #f3ede229;justify-content:flex-start;padding:17px 4px 4px}
}
@media(max-width:420px){.site-header .brand img{width:96px}.site-header .brand>.handwritten{font-size:28px}}
@media(max-width:360px){.site-header .header-discord span{display:none}.site-header .header-discord{padding:10px}}
@media(max-width:760px){.reading-city{background-position:64% 50%;background-image:linear-gradient(90deg,#171514dc,#171514ee 70%),url('/assets/nova-city-1920.webp');filter:saturate(.2)}}

/* Native links/history remain intact. The shared script fades live content on arrival. */
@view-transition{navigation:none}
.disclosure-body{display:flow-root}
.social-filters button{transition:color 150ms ease-out,background-color 150ms ease-out,box-shadow 150ms ease-out}
.official-posts[data-motion-swapping]{overflow:clip}
.official-media.youtube-loading>iframe{position:absolute;inset:0;opacity:0}
.official-media.youtube-loading .youtube-play{cursor:progress}
.official-media.youtube-loading .youtube-play svg{visibility:hidden}
.official-media.youtube-loading .youtube-play span{position:static;padding:10px 16px;border-radius:8px;background:#171514de}
html.motion-paused::view-transition-group(*),html.motion-paused::view-transition-old(*),html.motion-paused::view-transition-new(*){animation:none!important}
html.motion-paused{scroll-behavior:auto!important}
html.motion-paused .menu-toggle>span,html.motion-paused .reading-menu>span,html.motion-paused .social-filters button{transition:none}
html.motion-paused .content-page *{transition:none!important;animation:none!important}
html.motion-paused .content-page .reading-button:hover,html.motion-paused .content-page .story-row:hover .story-image img{transform:none}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto!important}
  @view-transition{navigation:none}
  ::view-transition-group(*),::view-transition-old(*),::view-transition-new(*){animation:none!important}
  .menu-toggle>span,.content-header .reading-menu>span,.social-filters button{animation:none;transition:none}
}
@media(forced-colors:active){.reading-city{display:none}.content-header nav,.content-header .reading-menu>span{background:Canvas}.content-header .reading-menu>span{background:ButtonText}}