/* October 26 review: stable controls and media-led editorial reading. */
.suggestions{grid-template-columns:repeat(5,minmax(0,1fr));max-width:1140px;gap:10px}
.suggestions>.suggestions-label{grid-column:1/-1;grid-row:auto;margin-bottom:2px}
.suggestion-links{display:contents}
.suggestion-links a,.shuffle-suggestions{width:100%;height:48px;min-height:48px;font-size:13px;line-height:1.25;padding:8px 12px;grid-column:auto;grid-row:auto}
.shuffle-suggestions{white-space:normal}
.reference-topbar{display:flex;justify-content:space-between;align-items:center;gap:24px}
.reference-topbar .next-reference{display:inline-flex;align-items:center;justify-content:flex-end;gap:12px;max-width:60%;text-align:right}
.reference-topbar .next-reference>span:first-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.creative-variants{padding:10px 0 16px;gap:18px;font-size:14px}
.creative-variants button{width:48px;height:48px;min-width:48px;padding:0;font-size:23px;border:1px solid var(--ink);background:var(--paper)}
.creative-variants button:disabled{opacity:.3}
.creative-variants #variant-count{min-width:120px;text-align:center;font-variant-numeric:tabular-nums}
.carousel-stage{height:clamp(340px,64vh,640px);width:100%;display:grid;place-items:center;overflow:hidden;position:relative}
.carousel-stage>.creative-image-open,.carousel-stage>.ad-player{height:100%;width:100%;min-height:0;display:grid;place-items:center;padding:0}
.carousel-stage img,.carousel-stage video,.carousel-stage .packaging-cutout{width:100%!important;height:100%!important;max-width:100%;max-height:100%;object-fit:contain;display:block;margin:0}
.carousel-stage .ad-player{aspect-ratio:auto}
.carousel-thumbnails{display:flex;gap:8px;overflow-x:auto;padding:16px 2px 4px;scrollbar-width:thin}
.carousel-thumbnails button{position:relative;flex:0 0 62px;height:62px;border:1px solid var(--line);background:var(--paper);padding:4px;border-radius:0}
.carousel-thumbnails button[aria-pressed=true]{border:2px solid var(--ink);background:var(--acid)}
.carousel-thumbnails img{width:100%;height:100%;object-fit:contain;display:block}
.carousel-thumbnails button>span{position:absolute;right:3px;bottom:3px;background:var(--paper);font-size:10px;padding:1px 3px}
.story-film{aspect-ratio:16/9;overflow:hidden;background:var(--ink);margin:28px 0 36px}
.story-film button{display:grid;grid-template-rows:minmax(0,1fr) 52px;width:100%;height:100%;padding:0;border:1px solid var(--ink);text-align:left}
.story-film button>img{width:100%;height:100%;min-height:0;object-fit:cover}
.story-film-link{display:flex;gap:12px;align-items:center;background:var(--acid);padding:12px 18px;font-size:14px;font-weight:600}
.story-film iframe{width:100%;height:100%;border:0;display:block}
.news-library .learn-featured img{object-fit:cover;background:none}
.news-library .learn-card-image{overflow:hidden}
.story-media-banner>div{aspect-ratio:3/1;overflow:hidden}
.story-media-banner img{height:100%;max-height:none;object-fit:cover}
.story-timeline{list-style:none;padding:0!important;border-left:1px solid var(--line);margin:26px 0 34px!important}
.story-timeline li{display:grid;grid-template-columns:105px 1fr;gap:20px;padding:12px 0 12px 20px!important;margin:0!important;position:relative}
.story-timeline li:before{content:'';width:7px;height:7px;background:var(--ink);border-radius:50%;position:absolute;left:-4px;top:23px}
.story-timeline time{font-size:13px;font-weight:600}.story-timeline strong{font-size:17px;display:block}.story-timeline p{font-size:16px!important;line-height:1.6!important;margin:5px 0 0!important}
.story-reading .story-media-pair img{aspect-ratio:4/3;object-fit:cover}
.story-reading .story-media-trio img{aspect-ratio:4/5;object-fit:cover}
.story-stat-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);margin:28px 0 36px}
.story-stat-strip>div{background:var(--paper);padding:22px 16px}.story-stat-strip strong{font-size:clamp(25px,3vw,36px);line-height:1.15;display:block;letter-spacing:-.03em}.story-stat-strip span{display:block;margin-top:10px;font-size:13px;line-height:1.5}
@media(max-width:1100px){.suggestions{grid-template-columns:repeat(5,minmax(0,1fr))}.suggestions>.suggestions-label{grid-column:1/-1;grid-row:auto}.shuffle-suggestions{grid-column:auto;grid-row:auto}}
@media(max-width:700px){.suggestions{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.suggestion-links a,.shuffle-suggestions{font-size:12px}.reference-topbar{gap:12px;font-size:12px}.reference-topbar .next-reference{max-width:54%}.creative-variants{padding-top:4px;gap:14px}.carousel-stage{height:420px;max-height:62vh;min-height:300px}.carousel-thumbnails button{flex-basis:54px;height:54px}.story-timeline li{grid-template-columns:72px 1fr;gap:10px;padding-left:15px!important}.story-timeline strong{font-size:16px}.story-timeline p{font-size:15px!important}.story-stat-strip>div{padding:16px 10px}.story-stat-strip strong{font-size:25px}.story-stat-strip span{font-size:12px}.story-film-link{font-size:13px}.story-reading .story-media-pair>div{gap:8px}}

.story-reading .story-media-trio img{aspect-ratio:3/2;object-fit:contain}

/* Equal slots: content changes never change the rhythm of browsing controls. */
.facets{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:1px;padding:1px;border:0;background:#bdbdb0;outline:1px solid var(--ink);outline-offset:-1px;overflow:visible}
.facets>.facet,.facets>.facet[data-facet=pageType],.facets>.facet[data-facet=section]{min-width:0;border:0;background:var(--paper)}
.facets>.facet>summary{height:46px;min-height:46px;padding:10px 12px;white-space:normal;line-height:1.25}
.facets>.facet>summary>span:first-child{min-width:0}
.facets>.facet>summary .chevron{flex-shrink:0;margin-left:auto}
.browse-top .format-tabs,.feed-tabs>div{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);width:min(100%,660px);max-width:100%;gap:4px;overflow:visible}
.browse-top .format-tab,.feed-tabs>div>button{min-width:0;width:100%;min-height:44px;padding:10px 12px;display:flex;align-items:center;justify-content:center;text-align:center;line-height:20px}
.website-view-tabs,.feed-toolbar .feed-view-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-flow:row;width:min(100%,480px);gap:4px;flex-shrink:0}
.website-view-tabs button{width:100%;min-width:0;min-height:44px;padding:10px 12px;text-align:center;white-space:normal;text-wrap:balance;line-height:20px}
.density{display:grid;grid-auto-flow:column;grid-auto-columns:1fr}
.density button{width:100%;min-width:72px;min-height:36px;padding:0 10px;display:block}
@media(min-width:701px) and (max-width:1100px){
 .facets{grid-auto-flow:row;grid-template-columns:repeat(4,minmax(0,1fr))}
 .browse-top .format-tabs{width:min(100%,660px)}
}
@media(max-width:700px){
 .facets{grid-auto-flow:column;grid-auto-columns:144px;grid-template-columns:none;overflow-x:auto}
 .facets>.facet>summary{height:44px;min-height:44px;font-size:12px}
 .browse-top .format-tabs,.feed-tabs>div{width:100%;grid-auto-flow:row;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px}
 .browse-top .format-tab,.feed-tabs>div>button{font-size:12px;padding:10px 6px}
 .website-view-tabs,.feed-toolbar .feed-view-tabs{width:100%;max-width:none}
 .website-view-tabs button{font-size:12px;padding:10px 6px;line-height:18px;min-height:48px}
 .density button{min-width:66px;padding:0 8px}
}
@media(max-width:700px){.density button[data-density=dense]{display:none}}

/* Compact narrative image rows, shared by Learn and News. */
.story-media-banner-pair>div,.story-media-banner-trio>div{display:grid;gap:12px;height:clamp(140px,18vw,220px)}
.story-media-banner-pair>div{grid-template-columns:repeat(2,minmax(0,1fr))}
.story-media-banner-trio>div{grid-template-columns:repeat(3,minmax(0,1fr))}
.story-media-banner-pair img,.story-media-banner-trio img{width:100%;height:100%;min-height:0;object-fit:cover}
.story-media-banner-pair a,.story-media-banner-trio a{min-width:0;min-height:0}
/* A quiet CPG frame; color enters around the information rather than behind body text. */
.campaign-editorial .story-type,.learn-article .story-type{background:var(--acid);border-color:var(--ink);color:var(--ink)}
.story-chapter>h2::before,.learn-prose>h2::before{content:'';display:block;width:28px;height:3px;background:var(--red);margin:0 0 16px}
.story-chapter ul:not(.story-timeline) li::marker,.learn-prose ul li::marker{color:var(--red)}
.story-timeline{border-color:var(--red)}.story-timeline li:before{background:var(--red)}
.story-stat-strip{grid-template-columns:repeat(var(--stat-count,3),minmax(0,1fr));gap:0;background:var(--paper);border-color:var(--ink)}
.story-stat-strip>div{background:transparent;border-right:1px solid var(--line);padding:20px 14px}
.story-stat-strip>div:last-child{border-right:0}.story-stat-strip strong{font-size:clamp(22px,2.2vw,30px)}
.story-stat-strip span{font-size:12px;line-height:1.5}
.story-color-reveal{transition:background-color 1.1s ease}
.story-stat-strip.is-in-view,.story-table-wrap.is-in-view{background-color:#e2eef6}
.story-table-wrap thead{background:#e4ed9e}
.story-editorial-take.is-in-view,.learn-chapter-takeaway.is-in-view{border-top-color:var(--red)}
@media(max-width:700px){
 .story-stat-strip{grid-template-columns:repeat(2,minmax(0,1fr))}
 .story-stat-strip>div:nth-child(2n){border-right:0}.story-stat-strip>div:nth-child(n+3){border-top:1px solid var(--line)}
 .story-media-banner-pair>div,.story-media-banner-trio>div{gap:8px;height:140px}
 .story-media-banner-trio>div{height:120px}
}
@media(prefers-reduced-motion:reduce){.story-color-reveal{transition:none}}
.story-stat-strip strong{min-height:36px;display:flex;align-items:center}
.story-stat-strip:has(>div:nth-child(4))>div:last-child strong{font-size:18px;white-space:nowrap}
@media(max-width:700px){.story-stat-strip:has(>div:nth-child(4))>div:last-child strong{font-size:16px}}

/* Keep the reset action inside the sort control: filtering never adds a row. */
.feed-toolbar .feed-sort-control{position:relative;display:flex;flex-direction:column;justify-content:center}
.feed-sort-control>label{font:9px/12px "Space Mono",monospace;text-transform:uppercase;color:var(--muted)}
.feed-toolbar .feed-sort-control .feed-reset{position:absolute;right:9px;top:0;min-height:28px;padding:0 3px;font-size:10px;line-height:1;grid-column:auto}
.feed-toolbar .feed-sort-control .feed-reset[hidden]{display:none}
@media(max-width:700px){
 .feed-toolbar .feed-filters:has(>.feed-select:nth-child(3))>.feed-sort-control{grid-column:1/-1}
 .feed-toolbar .feed-sort-control:only-child{grid-column:1/-1}
}

@media(min-width:701px){
 .feed-toolbar.has-website-views{flex-wrap:nowrap;gap:16px}
 .feed-toolbar.has-website-views .feed-view-tabs{flex:1 1 0;width:auto;min-width:0;max-width:480px;height:55px}
 .feed-toolbar.has-website-views .feed-view-tabs button{height:45px;min-height:0;padding:2px 6px;line-height:18px;white-space:normal;text-wrap:balance}
}

/* Keep sorting beside format navigation; extra filters occupy only the space they use. */
#brand-feed-tools{border-top:1px solid var(--ink);border-bottom:1px solid var(--line);padding:12px 0;margin-bottom:24px}
.feed-topbar{display:flex;align-items:center;justify-content:space-between;gap:24px;min-width:0}
.feed-topbar .feed-tabs{border:0;padding:0;min-width:0;flex:1}
.feed-topbar .feed-tabs>div{width:100%;max-width:660px}
.feed-topbar .feed-sort-control{position:relative;flex:0 0 174px;width:174px;min-width:0;min-height:54px;padding:8px 12px;gap:5px}
.feed-topbar .feed-sort-control select{width:100%;max-width:none;font-size:14px;line-height:20px}
.feed-topbar .feed-reset{position:absolute;right:9px;top:0;min-height:28px;padding:0 3px;font-size:10px;line-height:1}
.feed-topbar .feed-reset[hidden]{display:none}
#brand-feed-tools .feed-toolbar{justify-content:flex-start;margin:12px 0 0;padding:0;border:0;gap:16px}
#brand-feed-tools .feed-toolbar .feed-filters{justify-content:flex-start}
#brand-feed-tools .feed-toolbar.has-website-views{justify-content:space-between}
@media(min-width:701px) and (max-width:950px){
 .feed-topbar{gap:16px}.feed-topbar .feed-sort-control{flex-basis:140px;width:140px}
 .feed-topbar .feed-tabs>div>button{font-size:12px;padding:10px 6px}
}
@media(max-width:700px){
 #brand-feed-tools{margin-bottom:20px}
 .feed-topbar{flex-wrap:wrap;gap:12px}.feed-topbar .feed-tabs{flex-basis:100%}
 .feed-topbar .feed-sort-control{flex-basis:100%;width:100%;min-height:54px}
 #brand-feed-tools .feed-toolbar{gap:12px}
 #brand-feed-tools .feed-toolbar .feed-filters>.feed-select{grid-column:auto}
 #brand-feed-tools .feed-toolbar .feed-filters>.feed-select:only-child{grid-column:1/-1}
}
