/* One geometry for every page; only the light/dark colour treatment changes. */
:root{--site-header-top:16px;--site-header-clearance:71px;--site-anchor-offset:95px}
html{scrollbar-gutter:stable}
body:not(.home-page){padding-top:var(--site-header-clearance)}
@supports not (scrollbar-gutter:stable){html{overflow-y:scroll}}
.header.site-header{position:fixed;inset:var(--site-header-top) auto auto 5.5%;display:grid;grid-template-columns:82px minmax(0,1fr) 46px 66px;gap:16px;align-items:center;width:89%;max-width:none;height:55px;min-height:55px;margin:0;padding:0;opacity:1;z-index:60;isolation:isolate}
.home-page>.header.site-header{opacity:calc(.42 + var(--reveal)*.58)}
.header.site-header>.brand{display:block;width:82px;justify-self:start;align-self:center;flex:none}
.header.site-header>.brand img{display:block;width:82px;height:55px;object-fit:contain}
.header.site-header>nav{display:grid;grid-template-columns:84px 190px 136px 170px;gap:10px;align-items:center;justify-self:end;width:610px;max-width:none;min-width:0;margin:0;padding:0;font-size:12px;font-weight:400;letter-spacing:.06em;line-height:1.4}
.header.site-header>nav>.moments-dropdown{width:100%;min-width:0}
.header.site-header>nav .nav-pill:not(#moments-toggle),.header.site-header>nav #moments-toggle{display:flex;align-items:center;justify-content:center;gap:14px;width:100%;height:46px;min-height:46px;margin:0;padding:0 12px;border-width:1px;font-size:inherit;font-weight:400;letter-spacing:inherit;line-height:1.4;box-sizing:border-box;white-space:nowrap}
.header.site-header .nav-chevron{width:12px;height:8px;flex:none}
.header.site-header .header-cart{position:static;inset:auto;display:flex;align-items:center;justify-content:center;gap:7px;width:66px;min-width:66px;max-width:66px;height:46px;min-height:46px;margin:0;padding:0 10px;border:1px solid #ffffff40;border-radius:40px;background:#ffffff05;color:#f4f1e9;font:12px/1.4 "Avenir Next",Avenir,"Segoe UI",sans-serif;letter-spacing:0;box-sizing:border-box}
.header.site-header .header-cart:hover{background:#ffffff12}
.header.site-header .header-cart svg{display:block;width:17px;height:21px;flex:none}
.header.site-header [data-cart-count]{display:block;width:18px;min-width:18px;max-width:18px;text-align:center;font-variant-numeric:tabular-nums;line-height:1}
.shop-page .header.site-header .header-cart{background:var(--bryth-neutral-ink);border-color:var(--bryth-neutral-ink);color:var(--bryth-neutral-paper)}
.shop-page .header.site-header .header-cart:hover{background:#44473f}
.shop-page .shop-delivery{margin-top:28px}
.intro-active .site-header :is(.header-cart,.header-account){visibility:hidden}
@media(min-width:1700px){.header.site-header{width:86%;left:7%}}
@media(max-width:1050px) and (min-width:701px){
 .header.site-header{grid-template-columns:70px minmax(0,1fr) 44px 56px;gap:12px}
 .header.site-header>.brand,.header.site-header>.brand img{width:70px}
 .header.site-header>.brand img{height:47px}
 .header.site-header>nav{grid-template-columns:62px 142px 102px 132px;width:459px;gap:7px;font-size:9px;letter-spacing:.025em}
 .header.site-header>nav .nav-pill:not(#moments-toggle),.header.site-header>nav #moments-toggle{height:44px;min-height:44px;padding-inline:7px;gap:8px}
 .header.site-header .header-cart{width:56px;min-width:56px;max-width:56px;height:44px;min-height:44px;padding-inline:7px;font-size:11px;gap:4px}
 .header.site-header .nav-chevron{width:10px;height:7px}
}
@media(max-width:700px){
 :root{--site-header-top:12px;--site-header-clearance:106px;--site-anchor-offset:130px}
 .header.site-header{top:var(--site-header-top);left:7%;grid-template-columns:62px minmax(0,1fr) 44px 60px;grid-template-rows:44px 44px;gap:6px 8px;width:86%;height:94px;min-height:94px;margin:0;align-items:center}
 .header.site-header>.brand{grid-column:1;grid-row:1;width:62px;align-self:start}
 .header.site-header>.brand img{width:62px;height:42px}
 .header.site-header>nav{grid-column:1 / -1;grid-row:2;grid-template-columns:.62fr 1.4fr 1.04fr 1.3fr;grid-template-rows:44px;width:100%;max-width:none;min-width:0;gap:6px;font-size:8px;letter-spacing:.025em;align-self:start;justify-self:stretch}
 .header.site-header>nav .nav-pill:not(#moments-toggle),.header.site-header>nav #moments-toggle{height:44px;min-height:44px;padding-inline:6px;gap:6px}
 .header.site-header .nav-chevron{width:9px;height:6px}
 .header.site-header .header-cart{grid-column:4;grid-row:1;justify-self:start;align-self:center;width:60px;min-width:60px;max-width:60px;height:44px;min-height:44px;padding-inline:8px;gap:5px;font-size:10px}
 .header.site-header .header-cart svg{width:14px;height:17px}
 .shop-page .shop-delivery{margin-top:28px}
}

/* A translucent neutral surface keeps navigation readable while content moves beneath it. */
.header.site-header::before{content:'';position:fixed;top:0;left:0;right:0;height:calc(var(--site-header-clearance) + 16px);background:#fbfcfcf2;border-bottom:1px solid var(--bryth-neutral-stroke);box-shadow:0 7px 24px #24333a08;z-index:-1;opacity:0;pointer-events:none;transition:opacity .2s}
@supports ((backdrop-filter:blur(16px)) or (-webkit-backdrop-filter:blur(16px))){.header.site-header::before{background:#fbfcfcd9;backdrop-filter:blur(16px) saturate(125%);-webkit-backdrop-filter:blur(16px) saturate(125%)}}
body .header.site-header[data-scrolled]::before{opacity:1}
body .header.site-header[data-scrolled]{opacity:1}
body .header.site-header[data-scrolled]>.brand img{filter:brightness(.22)}
body .header.site-header[data-scrolled]>nav{visibility:visible}
body .header.site-header[data-scrolled] .nav-pill{color:var(--bryth-neutral-ink);background:#ffffff66;border-color:var(--bryth-neutral-stroke)}
body .header.site-header[data-scrolled] .nav-pill:hover,body .header.site-header[data-scrolled] .nav-pill[aria-current]{background:#ffffffd9}
body .header.site-header[data-scrolled] .header-cart{color:var(--bryth-neutral-ink);background:#ffffff99;border-color:var(--bryth-neutral-stroke);visibility:visible}
body .header.site-header[data-scrolled] .moments-menu{background:#fbfcfcf5;border-color:var(--bryth-neutral-stroke);box-shadow:0 18px 50px #344e591a}
body .header.site-header[data-scrolled] .moment-option{color:var(--bryth-neutral-ink)}
body .header.site-header[data-scrolled] .moment-option:hover{background:var(--bryth-neutral-hover)}
body .header.site-header[data-scrolled] .coming-soon{color:var(--bryth-neutral-copy);border-color:var(--bryth-neutral-line)}
body .header.site-header[data-scrolled] .coming-dot{background:var(--bryth-neutral-accent)}
body .header.site-header[data-scrolled] :is(a,button,summary):focus-visible{outline-color:var(--bryth-neutral-button)}
body :is(section[id],article[id],main[id],div[id],li[id],h2[id],p[id]){scroll-margin-top:var(--site-anchor-offset)}
.sleep-page{--site-anchor-offset:calc(var(--site-header-clearance) + 84px)}
.sleep-page .sleep-sections{top:calc(var(--site-header-clearance) + 16px)}
.skip-link{z-index:100}
@media(prefers-reduced-motion:reduce){.header.site-header::before{transition:none}}

/* The account shortcut always sits between the navigation and the cart. */
.header.site-header .header-account{display:flex;align-items:center;justify-content:center;width:46px;height:46px;min-width:46px;border:1px solid #ffffff40;border-radius:50%;background:#ffffff05;color:#f4f1e9}
.header.site-header .header-account svg{width:21px;height:24px;stroke:currentColor;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}
.header.site-header .header-account:hover{background:#ffffff12}
body:is(.legal-page,.friends-page,.shop-page) .header.site-header .header-account,body .header.site-header[data-scrolled] .header-account{background:#ffffff66;border-color:var(--bryth-neutral-line);color:var(--bryth-neutral-ink);visibility:visible}
body:is(.legal-page,.friends-page,.shop-page) .header.site-header .header-account:hover,body .header.site-header[data-scrolled] .header-account:hover{background:#ffffffcc}
.header.site-header .header-account[aria-current]{border-color:var(--bryth-neutral-accent);background:var(--bryth-neutral-hover)}
@media(max-width:1050px) and (min-width:701px){.header.site-header .header-account{width:44px;min-width:44px;height:44px}}
@media(max-width:800px) and (min-width:701px){.header.site-header{grid-template-columns:62px minmax(0,1fr) 40px 50px;gap:8px}.header.site-header>.brand,.header.site-header>.brand img{width:62px}.header.site-header>nav{grid-template-columns:56px 128px 92px 116px;width:410px;gap:6px;font-size:8px}.header.site-header .header-account{width:40px;min-width:40px}.header.site-header .header-cart{width:50px;min-width:50px;max-width:50px;padding-inline:5px}}
@media(max-width:700px){.header.site-header .header-account{grid-column:3;grid-row:1;width:44px;height:44px;min-width:44px}.header.site-header .header-account svg{width:19px;height:22px}.header.site-header .moments-menu{left:0;right:auto;width:230px;max-width:calc(100vw - 80px);min-width:0}.header.site-header>nav .nav-pill:not(#moments-toggle),.header.site-header>nav #moments-toggle{gap:4px}}
@media(max-width:360px){.header.site-header>nav{font-size:7px;letter-spacing:0}.header.site-header>nav .nav-pill:not(#moments-toggle),.header.site-header>nav #moments-toggle{padding-inline:4px}}

/* Account status is readable with a mouse and keyboard, without moving the header. */
.header.site-header .header-account{position:relative}
.account-tooltip{position:absolute;right:0;top:calc(100% + 10px);z-index:2;width:max-content;max-width:min(280px,75vw);padding:12px 16px;border:1px solid var(--bryth-neutral-stroke);border-radius:14px;background:#fbfcfc;color:var(--bryth-neutral-ink);box-shadow:0 10px 30px #24333a1a;font:12px/1.65 "Avenir Next",Avenir,sans-serif;letter-spacing:0;text-align:left;white-space:normal;overflow-wrap:anywhere;visibility:hidden;opacity:0;pointer-events:none;transition:opacity .15s}
.account-tooltip::before{content:'';position:absolute;top:-12px;left:0;right:0;height:12px}
.header-account:focus-visible .account-tooltip{visibility:visible;opacity:1;pointer-events:auto}
@media(hover:hover){.header-account:hover .account-tooltip{visibility:visible;opacity:1;pointer-events:auto}}
.header-account[data-tooltip-dismissed] .account-tooltip{visibility:hidden;opacity:0;pointer-events:none}
@media(prefers-reduced-motion:reduce){.account-tooltip{transition:none}}

/* Invisible bridge preserves hover while crossing the gap below YOUR MOMENTS. */
.header.site-header .moments-menu::before{content:'';position:absolute;left:0;right:0;top:-14px;height:14px}