/* Approved shared template — every route inherits this baseline.
   Keep shared values here; do not add per-story design variants. */
:root{
 --af-heading-align:center;
 --af-pill-size:13px;
 --af-pill-weight:600;
 --af-pill-height:30px;
 --af-pill-width:112px;
 --af-pill-gap:16px;
 --af-touch-target:44px;
 --af-body-size:18px;
 --af-body-leading:1.5;
 --af-headline-size:clamp(27px,7.4vw,30px);
 --af-label-size:16px;
 --af-quiet-heading-size:15px;
 --af-rule-width:66%;
 --af-ink:#242424;
}
/* Navigation is grouped tightly; the headline leads the reading area. */
.reader-wayfinding{padding-top:4px;padding-bottom:8px}
.reader-invitation{font:700 14px/1.3 Georgia,serif;letter-spacing:.06em;margin:0 0 4px}
.reader-agency{font:400 13px/1.4 Roboto,Arial,sans-serif;color:#41444a;margin:4px 0 0}
#reader-nav.reader-actions{display:flex;justify-content:center;gap:var(--af-pill-gap);padding:0}
#reader-nav.reader-actions>div{flex:0 1 var(--af-pill-width);min-height:var(--af-touch-target)}
#reader-nav .evidence-pill,#reader .front-page-pill,#sheet>.dock .home-pill{
 height:var(--af-pill-height);min-height:var(--af-pill-height);
 font:var(--af-pill-weight) var(--af-pill-size)/1.2 Roboto,Arial,sans-serif;
 color:#41444a;background:transparent;padding:0 10px
}
#reader-nav .evidence-pill{width:100%;max-width:var(--af-pill-width);white-space:nowrap}
#reader-nav .evidence-pill::before,#reader .front-page-pill::before,#sheet>.dock .home-pill::before{inset:-7px 0;min-height:var(--af-touch-target)}
/* Centred headings across stories, feeds, sources, utilities and credits. */
h1,h2,h3{ text-align:var(--af-heading-align) }
#feed-list .feed-text-row h3,#feed-list .feed-text-row .flip-line{text-align:var(--af-heading-align)}
#feed-list .feed-text-row .flip-line{margin-left:auto;margin-right:auto}
.stream-heading{position:relative;justify-content:center;padding-left:32px;padding-right:32px}
.stream-heading .chevron{position:absolute;right:0;top:50%;transform:translateY(-50%);margin:0}
#stream-title{text-align:var(--af-heading-align)}
#reading .flip-label{font:600 var(--af-label-size)/1.3 Roboto,Arial,sans-serif!important;letter-spacing:.02em;margin:16px 0 0;color:#41444a;text-align:center}
#reading .flip-label+h2{font:700 var(--af-headline-size)/1.15 Editorial,Georgia,serif;letter-spacing:-.025em;text-align:center;margin:12px 0 20px;text-wrap:pretty}
#reading>p{font-size:var(--af-body-size);line-height:var(--af-body-leading);text-align:left}
#reading>h3{font:700 22px/1.25 Editorial,Georgia,serif;text-align:center;margin:24px 0 12px}
/* The conclusion ends the argument; readable limits follow a shorter rule. */
#reading .limits{border:0;margin-top:24px;padding-top:0;display:flow-root}
#reading .limits::before{content:"";display:block;width:var(--af-rule-width);height:1.5px;margin:0 auto 24px;background:#616570}
#reading .limits h3{font:600 var(--af-quiet-heading-size)/1.4 Roboto,Arial,sans-serif;text-align:center;margin:0 0 12px;color:#41444a}
#reading .limits p{font:400 17px/1.5 Georgia,serif;text-align:left;color:#41444a;margin:0 0 16px}
/* Centre utility titles without moving the close control or body copy. */
.information-card>header{position:relative;min-height:44px;padding:0 44px}
#information-title{width:100%;text-align:center}
#information-close{position:absolute;right:0;top:50%;transform:translateY(-50%)}
#information-content h3{text-align:center}
#information-content p{text-align:left}
/* Image credits also uses the site’s centred heading grammar. */
body.image-credits h1,body.image-credits h2{text-align:center}

/* Approved utility reading refinement, shared by About and Profile. */
:root{--af-utility-fade-duration:1000ms}
#information{transition:opacity var(--af-utility-fade-duration) ease-in-out}
#information-content{flex:1 1 auto;min-height:0}
#information-content h3{margin:0 0 8px}
#information-content .about-section{margin:22px 0 0}
#information-content .about-section p{margin:0 0 10px}
#information-content .about-section p:last-child{margin-bottom:0}
#information-content .about-section:last-child{padding-bottom:8px}
#information-navigation{height:44px;min-height:44px;flex:none;display:flex;align-items:center;justify-content:flex-end;background:#fff}
#information-advance{display:flex;align-items:center;justify-content:center;width:44px;height:44px;padding:11px;border:0;background:transparent;color:#41444a}
#information-advance svg{width:22px;height:22px}
@media(prefers-reduced-motion:reduce){#information{transition:none}}

/* Utility reading uses the shared chevron, without a visible scroll track. */
#information-content{scrollbar-width:none;-ms-overflow-style:none}
#information-content::-webkit-scrollbar{display:none;width:0;height:0}
.utility-text-link{display:block;width:fit-content;max-width:100%;min-height:44px;margin:8px auto 0;padding:10px 4px;background:transparent;border:0;color:#41444a;font:600 14px/1.5 Roboto,Arial,sans-serif;text-decoration:underline;text-underline-offset:3px;text-align:center}

/* Approved front-page rhythm and common footer anchor. */
:root{--af-footer-top-space:14px;--af-footer-bottom-space:6px;--af-search-fade:500ms}
#reader>.dock,#sheet>.dock{padding:var(--af-footer-top-space) 0 calc(var(--af-footer-bottom-space) + env(safe-area-inset-bottom))}
#reader .front-page-pill::before,#sheet>.dock .home-pill::before{inset:-8px 0 -6px;min-height:44px}
#handle{height:24px}
#search-form{margin-top:8px;margin-bottom:12px}
.stream-heading{padding-bottom:8px}
#feed-list .feed-text-row.feed-hook-first:first-child{padding-top:16px}
#feed-list .feed-text-row h3{font-size:26px;line-height:1.12}
#feed-list .feed-publisher{color:#50545a;font-weight:600}
@media(min-width:480px){#feed-list .feed-text-row h3{font-size:28px}}
/* Search is a quiet editing state; native browser controls remain native. */
#search,.library-search input{font-size:16px}
#feed-scroll{opacity:1;transition:opacity var(--af-search-fade) ease-in-out}
#sheet>.dock{opacity:1;transition:opacity var(--af-search-fade) ease-in-out}
.search-editing #feed-scroll,.search-editing #sheet>.dock{opacity:0;pointer-events:none}
.search-editing #sheet{height:var(--af-search-height)!important}
.search-editing #feed-scroll{overflow:hidden}
@media(prefers-reduced-motion:reduce){#feed-scroll,#sheet>.dock{transition:none}}

/* Landing content is not part of a settled feed/reader page. Keep only its logo. */
.sheet-settled #streams,.sheet-settled #landing .identity>:not(.wordmark),.reader-open #streams,.reader-open #landing .identity>:not(.wordmark){visibility:hidden!important;transition:none!important}
/* Only front-page content participates in the search fade. */
.stream-heading{opacity:1;visibility:visible;transition:opacity var(--af-search-fade) ease-in-out,visibility 0s linear 0s}
.search-editing .stream-heading{opacity:0;visibility:hidden;pointer-events:none;transition:opacity var(--af-search-fade) ease-in-out,visibility 0s linear var(--af-search-fade)}
@media(prefers-reduced-motion:reduce){.stream-heading{transition:none}}

/* Initial dialog focus is on its static heading; keyboard controls retain a ring. */
#information-title:focus{outline:none;box-shadow:none}
#information-close{border-radius:6px}
#information-close:focus:not(:focus-visible){outline:none;box-shadow:none}
#information-close:focus-visible{outline:2px solid #616570;outline-offset:2px;box-shadow:none}

/* Founder correction: retain original 16px/17px red punch lines and lighter
   4px text-width brush from styles.css. Natural wrapping preserves wording. */

/* Landing refinement: no inactive feed peeking below the nine topics. */
.landing-rest #sheet{visibility:hidden;pointer-events:none}
#landing{--af-publication-line:1rem;height:100dvh;grid-template-rows:6svh 50.566667svh minmax(0,1fr) var(--af-publication-line);padding-bottom:4px;--af-tile-gap:8px;--af-tile-label:clamp(10px,1.8svh,14px);--af-tile-size:min(103px,calc((100dvh - 56.566667svh - 4px - var(--af-publication-line) - 3.9 * var(--af-tile-label) - 40px) / 3))}
#landing .identity{grid-template-rows:14svh 5.666667svh 20.9svh 10svh;row-gap:0}
#landing .eye{height:20.9svh}
/* The message has its own centred band between the eye and first tile row. */
#landing h1{transform:none;align-self:center}
#streams{height:100%;grid-template-rows:repeat(3,max-content);row-gap:var(--af-tile-gap);align-items:start;align-content:start}
#streams .stream{min-width:0;gap:var(--af-tile-gap)}
#streams .stream img{width:min(100%,var(--af-tile-size))}
#streams .stream span{font-size:var(--af-tile-label);min-height:1.3em;line-height:1.3;margin-top:0}
#information-content .edition-current p{text-align:center}

/* Profile recommendation: approved five-destination grouping in shared utility. */
.profile-menu-approved{margin-top:12px;padding:0 0 4px}
.profile-menu-approved .profile-group{padding:8px 0}
.profile-menu-approved .profile-group+.profile-group::before{content:"";display:block;width:48px;height:1px;background:#d8d8d5;margin:8px auto 20px}
.profile-menu-approved .profile-destination{display:flex;align-items:center;justify-content:center;gap:12px;width:100%;min-height:56px;padding:14px 4px;border:0;background:transparent;color:#30343b;font:600 18px/1.4 Roboto,Arial,sans-serif;text-align:center;border-radius:6px}
.profile-destination svg{width:18px;height:18px;flex:none}
.profile-menu-approved .utility-text-link{margin-top:12px;font-size:12px;font-weight:400;color:#616570}
#information-content .profile-destination-note p{text-align:center}

/* Preserve the same close/header position while Profile destinations change. */
#information.profile-view .information-card{height:calc(100dvh - 40px)}

/* Utility overlays fade the origin to neutral at the same pace as the card. */
#information{background:#fff}
#information.profile-view .information-card,#information.profile-view #information-navigation{background:#fcfbf8}
.profile-identity{display:block;width:40px;height:47px;color:#252b36;margin:4px auto 8px}
.profile-menu-approved .profile-destination{position:relative;display:block;padding-left:44px;padding-right:44px}
.profile-menu-approved .profile-destination>span{display:block;width:100%;text-align:center}
.profile-menu-approved .profile-destination svg{position:absolute;right:13px;top:50%;transform:translateY(-50%)}

/* One shared optical close axis, also used by Profile’s arrow column. */
#information-close{display:flex;align-items:center;justify-content:center;padding:0}
#information-close svg{display:block;width:20px;height:20px;flex:none}
.profile-linked-page{padding-top:20px}
#information-content .profile-linked-page>h3{font:600 20px/1.3 Roboto,Arial,sans-serif;margin:0 0 12px}
#information-content .profile-trial-note{text-align:center;font-size:13px;color:#616570;margin:0 auto 24px;max-width:32ch}
.profile-linked-page .profile-identity{margin:20px auto}
.profile-empty{padding:22px 12px;text-align:center}
#information-content .profile-empty p{text-align:center;margin:0 auto 12px;max-width:30ch}
#information-content .profile-empty .empty-heading{font-size:18px;font-weight:600;color:#30343b}
.profile-follow-group{padding:20px 8px;min-height:96px;border-bottom:1px solid #deddd8}
.profile-follow-group:last-child{border-bottom:0}
.profile-follow-group h4{font:600 18px/1.4 Roboto,Arial,sans-serif;text-align:center;margin:0 0 12px}
#information-content .profile-follow-group p{text-align:center;font-size:14px;color:#616570;margin:0}
.profile-channel{padding:16px 8px;border-bottom:1px solid #deddd8}
.profile-channel summary{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;min-height:64px;list-style:none;cursor:pointer;font:600 18px/1.4 Roboto,Arial,sans-serif}
.profile-channel summary::-webkit-details-marker{display:none}
.profile-channel .channel-status{font:400 13px/1.4 Roboto,Arial,sans-serif;color:#616570;text-decoration:underline;text-underline-offset:3px}
#information-content .profile-channel p{text-align:center;font-size:14px;margin:12px 0}
.profile-linked-page .profile-return{margin-top:16px}

#utility-return{flex:none;width:100%;margin:8px auto 0;min-height:44px}

/* Full privacy explanation closes About; subordinate headings remain readable. */
#information-content .privacy-group{margin-top:28px}
#information-content .privacy-group h4{font:600 14px/1.4 Roboto,Arial,sans-serif;text-align:center;color:#191919;margin:0 0 8px}

/* Site-wide rollout of approved Layout One and invariant navigation slots. */
:root{--af-footer-pill-width:112px;--af-utility-inset:20px}
#reader .front-page-pill,#sheet>.dock .home-pill{width:var(--af-footer-pill-width);flex:none}
/* Every utility keeps the same close axis and footer, however short its copy. */
#information .information-card{height:calc(100dvh - 2 * var(--af-utility-inset))}
#information{padding:var(--af-utility-inset)}
/* Font scaling may wrap content; it must never change the navigation row. */
#reader-nav.reader-actions{min-height:var(--af-touch-target);align-items:center;flex:none}
#reader-nav.reader-actions>div{display:flex;align-items:center;justify-content:center;height:var(--af-touch-target)}
#reader .front-page-pill,#sheet>.dock .home-pill{white-space:nowrap}

/* Ancillary credits share the utility shell, type and anchored return control. */
body.image-credits article{padding:22px 0;border-top:1px solid #deddd8;scroll-margin-top:12px}
body.image-credits article img{display:block;width:150px;max-width:100%;height:112px;object-fit:cover;margin:0 auto 12px}
body.image-credits article h2{font:600 14px/1.4 Roboto,Arial,sans-serif;margin:0 0 8px}
body.image-credits article p{margin:0 0 10px}
body.image-credits #information-content a{color:#41444a;overflow-wrap:anywhere;text-underline-offset:3px}
body.image-credits #information-close{text-decoration:none}

/* Search explanation replaces the faded feed without moving any controls.
   Stories fade out for 500ms; then guidance fades in gently over 1600ms. */
.search-guidance{position:absolute;z-index:3;top:96px;left:24px;right:24px;max-width:34ch;margin:0 auto;text-align:center;opacity:0;visibility:hidden;pointer-events:none;transition:opacity var(--af-search-fade) ease-in-out,visibility 0s linear var(--af-search-fade)}
.search-guidance h2{font:700 18px/1.3 Editorial,Georgia,serif;letter-spacing:-.01em;margin:0 0 12px}
.search-guidance p{font:400 14px/1.55 Roboto,Arial,sans-serif;color:#41444a;margin:0}
.search-editing .search-guidance{opacity:1;visibility:visible;transition:opacity 1600ms ease-in-out var(--af-search-fade),visibility 0s linear 0s}
@media(prefers-reduced-motion:reduce){.search-guidance,.search-editing .search-guidance{transition:none}}

/* The input page explains the three actions in the shared utility type scale. */
.search-guidance h2{margin-bottom:14px}
.input-steps{list-style:none;counter-reset:input-step;padding:0;margin:0;text-align:left}
.input-steps li{counter-increment:input-step;display:grid;grid-template-columns:18px minmax(0,1fr);gap:8px;margin:0 0 8px;font:400 14px/1.5 Roboto,Arial,sans-serif;color:#41444a}
.input-steps li::before{content:counter(input-step) ".";color:#616570;font-weight:600}
.input-steps li:last-child{margin-bottom:0}
.input-steps strong{font-weight:600;color:#242424}
.input-steps p{font:inherit;margin:0}

/* A calm handover in one reserved area. Typed queries never move navigation. */
.search-editing.input-typing .search-guidance{opacity:0;visibility:hidden;transition:opacity 500ms ease-in-out,visibility 0s linear 500ms}
.search-suggestions{position:absolute;z-index:4;top:96px;left:24px;right:24px;max-width:34ch;height:156px;margin:0 auto;opacity:0;visibility:hidden;pointer-events:none;transition:opacity 650ms ease-in-out,visibility 0s linear 650ms}
.search-editing.input-suggestions-visible .search-suggestions{opacity:1;visibility:visible;pointer-events:auto;transition:opacity 650ms ease-in-out,visibility 0s linear 0s}
#search-suggestion-options{height:156px;display:grid;grid-template-rows:repeat(3,48px);gap:6px}
.input-suggestion{display:block;width:100%;height:48px;padding:0 10px;border:0;border-radius:6px;background:transparent;text-align:left;font:400 14px/1.35 Roboto,Arial,sans-serif;color:#41444a;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.input-suggestion[aria-selected="true"],.input-suggestion:active{background:#f3f3f4;color:#242424}
.input-suggestion.suggestion-empty{visibility:hidden;pointer-events:none}
#search-suggestion-note{position:absolute;top:0;left:0;right:0;margin:0;padding:12px 10px;font:400 14px/1.5 Roboto,Arial,sans-serif;color:#616570;text-align:center}
@media(prefers-reduced-motion:reduce){.search-editing.input-typing .search-guidance,.search-suggestions,.search-editing.input-suggestions-visible .search-suggestions{transition:none}}

/* Let the complete suggestion fade finish before instructions return. */
.search-editing.input-returning-guide .search-guidance{transition:opacity 1600ms ease-in-out 650ms,visibility 0s linear 0s}
@media(prefers-reduced-motion:reduce){.search-editing.input-returning-guide .search-guidance{transition:none}}

/* Search results reuse the front-page sheet, geometry and JS500ms smoothstep reveal. */
#search-neutral{position:fixed;left:50%;transform:translateX(-50%);bottom:0;width:min(100%,560px);background:#fff;z-index:2;pointer-events:none}
.search-results-waiting #feed-scroll,.search-results-waiting .stream-heading,.search-results-waiting #sheet>.dock{opacity:0;pointer-events:none}
.search-results-waiting .search-guidance,.search-results-waiting .search-suggestions{opacity:0;visibility:hidden;pointer-events:none}
.search-results-rolling #sheet{transition:none!important}
.search-context{font:400 14px/1.45 Roboto,Arial,sans-serif;color:#616570;text-align:center;overflow-wrap:anywhere;margin:12px 0 0}
#stream-title:focus{outline:none;box-shadow:none}

.search-results-rolling #feed-scroll,.search-results-rolling .stream-heading,.search-results-rolling #sheet>.dock{opacity:1;transition:none}