/* Centered navigation with room between categories, including the community entry. */
.site-header{display:grid;grid-template-columns:minmax(180px,1fr) minmax(0,auto) minmax(180px,1fr);height:auto;max-width:1440px;align-items:center;column-gap:24px}
.site-header>.wordmark{grid-column:1;grid-row:1;margin:0!important;justify-self:start}
.site-header>.header-controls{grid-column:3;grid-row:1;justify-self:end}
.site-header>nav{grid-column:2;grid-row:1;justify-content:center;gap:18px 32px;flex-wrap:wrap;width:auto;overflow:visible;font-size:17px}
.site-header>.brand-description{grid-column:1/-1;grid-row:2}
.product-shell #product-nav{justify-content:center;gap:14px 26px;flex-wrap:wrap;overflow:visible}
.product-shell #product-nav button{padding-inline:16px}
/* The phone is a fixed English illustration, independent of the site locale. */
html body .hero .phone .phone-header h2{font-size:24px!important;line-height:1.25;font-style:normal;font-family:var(--serif);letter-spacing:normal}
.phone,.floating-note{direction:ltr;text-align:left}
.phone .phone-header p{line-height:1.6}
/* More vertical breathing room within the product introduction. */
.introduction{padding-block:72px 54px}
html body .introduction h2{margin-block:34px 38px;line-height:1.55}
html body .introduction .experience-links{margin-top:44px;row-gap:24px}
#today-content .v2-heading>a{margin-inline-end:32px}
/* Letter entrance and editor have the same outer width; only one is shown at a time. */
.letter-view-v13{width:100%;max-width:none}
.letter-view-v13>.page-title{margin-bottom:30px}
.letter-view-v13 .letter-paper{width:100%;max-width:none;margin:0}
.letter-view-v13 .letters-grid{width:100%;margin:0}
.letter-view-v13 .letter-help-v13{margin-block:12px 30px}
.letter-view-v13 .letter-empty{padding:64px 30px!important}
.letter-view-v13 .letter-empty .letter-envelope{margin:0 auto 34px}
.letter-view-v13 .letter-empty h2{margin:0 0 30px!important;line-height:1.5}
.letter-view-v13 .letter-empty>p{margin:0 0 34px;line-height:1.9}
.letter-view-v13 .letter-empty>button{margin:0}
.community-empty-v13{min-height:42vh}
/* Sleep audio follows the APP's dark card list. Assets will be supplied separately. */
.sleep-page-v13{background:linear-gradient(150deg,#2d304d,#202235);color:#fffdf8;border-radius:26px;padding:44px 38px;max-width:960px;margin:0 auto}
.sleep-page-v13 .eyebrow{color:#d9d6ed;margin-bottom:24px}
.sleep-page-v13 h1{font-size:40px;line-height:1.35;color:#fffdf8;letter-spacing:normal}
.sleep-page-v13 .sleep-intro{font-size:18px;line-height:1.85;color:#ddd9e7;margin-top:24px}
.sleep-list-v13{display:grid;gap:22px;margin-top:38px}
.sleep-row-v13{display:grid;grid-template-columns:100px minmax(0,1fr) 58px;gap:22px;align-items:center;padding:22px;border:1px solid #ffffff25;border-radius:28px;background:#ffffff0d;min-width:0}
.sleep-row-v13>img{width:100px;height:110px;object-fit:cover;border-radius:18px}
.sleep-row-v13 h2{font-family:var(--sans);font-size:22px!important;line-height:1.4;color:#fff;letter-spacing:normal;margin:0!important}
.sleep-row-v13 p{font-size:16px;color:#d4d1de;line-height:1.7;margin-top:10px}
.sleep-row-v13 audio{display:none}
.sleep-row-v13 .sleep-toggle-v13{width:58px;height:58px;padding:0;border:0;border-radius:50%;background:#ffffff20;color:white;font-size:25px}
.sleep-status-v13{grid-column:1/-1;margin:0!important}
.sleep-status-v13:empty{display:none}
.sleep-empty-v13{padding:45px 20px;text-align:center;border:1px solid #ffffff20;border-radius:24px}
.sleep-empty-v13>span{font-size:48px;color:#d6c7ed}
.sleep-empty-v13 p{margin-top:20px;color:#ddd9e7}
@media(max-width:1200px){.site-header{grid-template-columns:1fr auto}.site-header>.header-controls{grid-column:2}.site-header>nav{grid-row:2;grid-column:1/-1;gap:18px 32px}.site-header>.brand-description{grid-row:3}}
@media(max-width:760px){
 .site-header>nav{justify-content:center;gap:18px 26px;font-size:16px;flex-wrap:wrap;overflow:visible;width:100%;order:unset}
 .product-shell #product-nav{justify-content:center;gap:12px 16px;flex-wrap:wrap;overflow:visible}
 .product-shell #product-nav button{padding:8px 11px}
 .introduction{padding-block:55px 42px}
 html body .introduction h2{margin-block:28px 30px}
 html body .introduction .experience-links{margin-top:34px;gap:22px 28px}
 #today-content .v2-heading>a{margin-inline-end:12px}
 .letter-view-v13 .letter-empty{padding:48px 22px!important}
 .letter-view-v13 .letter-empty .letter-envelope{margin-bottom:30px}
 .sleep-page-v13{padding:30px 20px}
 .sleep-page-v13 h1{font-size:29px}
 .sleep-page-v13 .sleep-intro{font-size:16px}
 .sleep-row-v13{grid-template-columns:68px minmax(0,1fr) 42px;gap:12px;padding:16px;border-radius:22px}
 .sleep-row-v13>img{width:68px;height:82px;border-radius:13px}
 .sleep-row-v13 h2{font-size:17px!important}
 .sleep-row-v13 p{font-size:14px}
 .sleep-row-v13 .sleep-toggle-v13{width:42px;height:42px;font-size:20px}
}
