/* A straight gallery rail; the expedition and journal layouts are unchanged. */
.site-header{width:100%;max-width:none;margin:0;border-radius:0;padding-inline:max(24px,calc((100% - 1248px)/2));}
.site-header.meso-header{display:block;padding:0;background-color:#1b2226;border-bottom:1px solid #ac97655c;box-shadow:0 8px 28px #0003;}
.meso-header .header-inner{max-width:1320px;margin:0 auto;padding:0 36px;display:flex;align-items:center;gap:24px;min-height:78px;}
.meso-header .brand{flex-shrink:0;}
.meso-header .primary-navigation{margin:0;display:flex;align-self:stretch;align-items:stretch;gap:4px;width:auto;}
.meso-header .primary-navigation .nav-button{display:inline-flex;align-items:center;justify-content:center;min-width:0;padding:12px 16px;border:0;border-radius:0;background:transparent;color:#bfc3b6;box-shadow:none;font-family:var(--serif);font-size:14px;white-space:nowrap;}
.meso-header .friends-desktop-label{white-space:pre;}
.meso-header .primary-navigation .nav-button.active{color:#e5cc91;background:transparent;box-shadow:inset 0 -2px #ac9765;}
.meso-header .primary-navigation .nav-button:hover,.meso-header .primary-navigation .nav-button:focus-visible{background:#ac97650d;color:#eee9db;}
.meso-header .header-utilities{margin-left:auto;display:flex;align-items:center;justify-content:flex-end;gap:18px;width:auto;flex-shrink:0;}
.meso-header .header-utilities .nav-button{display:inline-flex;width:auto;min-width:0;min-height:44px;align-items:center;justify-content:center;padding:8px 0;border:0;border-radius:0;background:transparent;box-shadow:none;color:#eee9db;font-family:var(--serif);font-size:14px;font-weight:400;white-space:nowrap;}
.meso-header .header-utilities .nav-button:hover{color:#dfc895;background:transparent;text-decoration:none;}
.header-account{position:relative;padding-left:18px;border-left:1px solid #ac97654d;}
.meso-header .header-utilities .account-nav{gap:9px;margin:0;}
#account-label{min-width:0;max-width:150px;overflow:hidden;text-overflow:ellipsis;}
#account-label[data-guest]{white-space:normal;overflow:visible;text-overflow:clip;text-align:left;line-height:1.25;}
.account-outline{flex-shrink:0;}
.meso-header :focus-visible{outline:2px solid #d7bd7f;outline-offset:3px;}
@media(max-width:1150px){
 .meso-header .header-inner{gap:18px;padding-inline:28px;}
 .meso-header .primary-navigation .nav-button{padding-inline:12px;}
 .meso-header .header-utilities{gap:14px;}
 .header-account{padding-left:14px;}
 #account-label{max-width:115px;}
}
@media(max-width:1020px){
 .meso-header .friends-desktop-label{display:none;}
 /* Independent flex rows avoid a wide navigation column sizing the profile row.
    The break stays between help/account and navigation at every phone width. */
 .meso-header .header-inner{display:flex;flex-wrap:wrap;gap:0 20px;padding:12px 24px 0;min-width:0;}
 .meso-header .header-inner::before{content:'';order:2;flex:0 0 100%;}
 .meso-header .brand{order:0;flex:0 0 auto;}
 .meso-header .header-utilities{order:1;margin-left:auto;flex:1 1 0;min-width:0;}
 .meso-header .header-account{flex:0 1 auto;min-width:0;}
 .meso-header .header-utilities .guide-button{flex:0 0 auto;}
 .meso-header .header-utilities .account-nav{width:100%;max-width:100%;}
 .meso-header .primary-navigation{order:3;flex:1 1 0;min-width:0;margin:8px 0 0;}
 .meso-header .primary-navigation .nav-button{width:auto;min-height:48px;padding:12px;flex:0 1 auto;}
}
@media(max-width:520px){
 .meso-header .header-inner{padding:10px 16px 0;gap:0 10px;}
 .meso-header .brand svg.brand-mark{width:126px;height:28px;}
 .meso-header .header-utilities{gap:12px;}
 .meso-header .header-utilities .nav-button{font-size:12px;}
 .header-account{padding-left:12px;}
 .meso-header .header-utilities .account-nav{gap:6px;}
 #account-label{max-width:72px;}
 .account-outline{width:23px;height:23px;}
 .meso-header .primary-navigation{gap:0;flex-wrap:wrap;}
 .meso-header .primary-navigation .nav-button{font-size:12px;padding:10px 6px;min-height:46px;min-width:max-content;flex:1 1 auto;}
}
@media(max-width:370px){
 .meso-header .header-inner{padding-inline:12px;}
 .meso-header .brand svg.brand-mark{width:110px;height:25px;}
 .meso-header .header-utilities{gap:8px;}
 .header-account{padding-left:8px;}
 #account-label{max-width:44px;}
}

/* Keep the studio centred between reset information and supporting links. */
.site-footer{display:block;width:100%;max-width:none;margin:24px 0 0;padding:16px 0;border-radius:0;border-inline:0;border-top:1px solid #ac97655c;}
.site-footer .footer-inner{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:4px 24px;max-width:1320px;margin:0 auto;padding:0 36px;}
.site-footer .footer-info{grid-column:1;grid-row:1;min-width:0;line-height:1.7;}
.site-footer .dustlight-footer-link{grid-column:2;grid-row:1;justify-self:center;justify-content:center;margin:0;white-space:nowrap;}
.site-footer .footer-actions{grid-column:3;grid-row:1;display:flex;flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:4px 20px;min-width:0;margin:0;}
@media(max-width:850px){
 .site-footer .footer-inner{display:flex;flex-direction:column;gap:4px;padding-inline:24px;text-align:center;}
 .site-footer .dustlight-footer-link{order:0;align-self:center;}
 .site-footer .footer-info{order:1;text-align:center;}
 .site-footer .footer-actions{order:2;justify-content:center;gap:4px 20px;}
 .site-footer button{text-align:center;}
}
@media(max-width:520px){.site-footer .footer-inner{padding-inline:16px;}.site-footer .footer-actions{gap:4px 16px;}}

.header-profile-icon{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;flex:0 0 26px;}
.meso-header .header-profile-icon .social-avatar{width:26px;height:26px;flex-basis:26px;border-width:1px;--avatar-radius:7px;--beta-outset:1px;--beta-sprig-size:8px;--beta-sprig-offset:-2px;}
.meso-header .header-profile-icon .avatar-symbol{width:22px;height:22px;}

/* Updates is a supporting destination in the footer, with a quiet unread mark. */
.updates-unread-dot{display:none;width:6px;height:6px;border-radius:50%;margin-left:7px;background:#d6b979;vertical-align:middle;flex:0 0 6px;}
.has-unread-updates .updates-unread-dot{display:inline-block;}
.whats-new-message{font-size:16px;line-height:1.7;white-space:pre-line;}
.whats-new-actions{display:flex;flex-wrap:wrap;align-items:center;gap:14px 22px;margin-top:26px;}
.whats-new-actions .primary-button,.whats-new-actions .action-link{min-height:44px;}
@media(max-width:520px){.whats-new-actions{align-items:stretch;flex-direction:column;}.whats-new-actions .action-link{display:inline-flex;align-items:center;justify-content:center;}}
.site-footer [data-updates-link]{display:inline-flex;align-items:center;min-height:44px;font-size:12px;text-underline-offset:3px;}
@media(max-width:600px){.site-footer [data-updates-link]{font-size:11px;}}

/* A short page fills the viewport; long pages keep the footer after content. */
body:has(>.site-header):has(>.site-footer){min-height:100vh;min-height:100dvh;display:flex;flex-direction:column}
body:has(>.site-footer)>main{flex:1 0 auto;width:100%;min-height:0}
body>.site-header,body>.site-footer{flex-shrink:0}

/* Centre each standard heading between the navigation and its first surface.
   Shared depth aligns panel tops; minimum sizing grows for wrapping and zoom. */
@media(min-width:1101px){
 :root{--page-heading-height:9.5rem;--page-heading-gap:22px;}
 body>.site-header+main,body>.site-header~main{padding-top:var(--page-heading-gap);margin-block-start:0;}
 main .page-heading,main .custom-shell>.page-heading,main .account-page>.page-heading,main .notes-heading,main .policy-heading{
  display:flex;flex-direction:column;justify-content:center;align-items:stretch;gap:0;
  min-height:var(--page-heading-height);margin-bottom:var(--page-heading-gap);
 }
 main .page-heading:is(.expedition-heading,.journal-heading){display:grid;grid-template-columns:minmax(0,1fr) 340px;align-items:center;align-content:center;gap:24px;}
 main .page-heading.expedition-heading{grid-template-columns:minmax(0,1fr) minmax(340px,540px);}
 main .page-heading>div:first-child{align-self:stretch;}
 main .page-heading:is(.expedition-heading,.journal-heading)>div:first-child{align-self:center;}
 main .page-heading :is(.intro,h1):last-child,main .notes-heading>p:last-child,main .policy-heading>p:last-child{margin-bottom:0;}
 main .custom-shell.custom-round>.page-heading h1{margin-bottom:12px;}
}

/* The Discord mark shares the footer's palette and an accessible tap target. */
.site-footer .footer-discord{display:inline-flex;align-items:center;justify-content:center;flex:0 0 44px;width:44px;min-height:44px;border-radius:6px;text-decoration:none;}
.site-footer .footer-discord svg{display:block;width:24px;height:24px;flex-shrink:0;}
.site-footer .footer-discord:focus-visible{outline:2px solid var(--map-gold,#d8b66b);outline-offset:2px;}

/* v129: shorten the shared heading area by one quarter of the deployed
   13rem / 26px rhythm. Let long headings and controls grow naturally. */
@media(min-width:1101px){
 :root,body.clado-body{--page-heading-height:9.75rem!important;--page-heading-gap:19.5px!important}
 body>.site-header~main{padding-top:var(--page-heading-gap)}
 body main .page-heading,body main .custom-shell>.page-heading,body main .account-page>.page-heading,body main .notes-heading,body main .policy-heading{min-height:var(--page-heading-height);margin-bottom:var(--page-heading-gap)}
}
@media(min-width:641px) and (max-width:1100px){
 body>.site-header~main{padding-top:21px}
 body main .page-heading,body main .custom-shell>.page-heading,body main .account-page>.page-heading,body main .notes-heading,body main .policy-heading{margin-bottom:19.5px}
}
@media(max-width:640px){
 body>.site-header~main{padding-top:18px}
 body main .page-heading,body main .custom-shell>.page-heading,body main .account-page>.page-heading,body main .notes-heading,body main .policy-heading{margin-bottom:15px}
}

@media(min-width:961px) and (max-width:1100px){
 body main .page-heading:is(.expedition-heading,.journal-heading,.clado-heading){min-height:102px}
}
@media(min-width:641px) and (max-width:960px){
 body main .page-heading:is(.expedition-heading,.journal-heading){gap:15px}
}
@media(max-width:640px){
 body main .page-heading:is(.expedition-heading,.journal-heading){gap:13.5px}
}