/* A small width system: reading, reference, gallery, and multi-panel workspace.
   The brand shell stays full bleed. Home and teaching boards are not restyled. */
.utility-page{--layout-reading:55rem;--layout-standard:80rem;--layout-gallery:90rem;--layout-comparison:62.5rem;--page-gutter:24px}
.utility-page[data-layout=standard] #main{max-width:var(--layout-standard);margin-inline:auto}
.utility-page[data-layout=comparison] #main{max-width:var(--layout-comparison);margin-inline:auto}
.utility-page[data-layout=gallery] #main{max-width:var(--layout-gallery);margin-inline:auto}
.utility-page[data-layout] .page-intro{padding:26px var(--page-gutter) 24px}
.utility-page[data-layout] .page-intro h1{font-size:var(--h1-page);margin:0 0 10px;line-height:1.08}
.utility-page[data-layout] .page-intro .lede{font-size:16px;line-height:1.6}
.utility-page[data-layout] .page-intro .record-copy>.eyebrow{margin-bottom:8px}
.utility-page[data-layout] .section{padding-inline:var(--page-gutter)}
.utility-page[data-layout=standard] .reading{max-width:var(--layout-reading);margin-left:0}
.utility-page[data-layout] :is(.section-head,.record-copy,.search-form,.compare-form)>*{min-width:0}
.utility-page[data-layout] .record-card-open{font:500 14px/1.5 var(--body);text-transform:none}
.utility-page[data-layout] :is(.search-form,.compare-form) label{font:14px/1.5 var(--body);color:var(--muted)}
.utility-page[data-layout] :is(.search-form,.compare-form) .button{min-height:44px}
.utility-page[data-layout] :is(.data-table,.reference-list){font-size:15px;line-height:1.5}
.utility-page[data-layout] .data-table th{font-size:14px}
.utility-page[data-layout] .data-table td{font-variant-numeric:tabular-nums}
.utility-page[data-layout] .table-wrap{max-width:100%;overflow-x:auto}
.utility-page[data-layout] :is(.release-jumps,.tournament-jumps){padding:8px var(--page-gutter);gap:4px 24px}
.utility-page[data-layout] :is(.release-jumps,.tournament-jumps) a{display:inline-flex;align-items:center;min-height:44px}
.utility-page[data-layout] .breadcrumbs{padding-inline:var(--page-gutter);font:14px/1.5 var(--body)}

.utility-page .reader-notice{padding-inline:var(--page-gutter)}

/* Results have a clear event, winner, and next action. Artwork supports them. */
.utility-page .tournament-card{grid-template-columns:minmax(0,1fr) 116px;padding:24px;gap:24px}
.utility-page .tournament-featured{grid-template-columns:minmax(0,1fr) 180px;padding:28px}
.utility-page .tournament-card h2{font-size:34px;line-height:1.1;margin:10px 0;max-width:28ch}
.utility-page .tournament-featured h2{font-size:46px}
.utility-page .tournament-winner{margin:20px 0;gap:4px;font-size:16px;line-height:1.5}
.utility-page .tournament-winner>strong{font-size:30px}
.utility-page .tournament-count{margin-top:12px;font:14px/1.5 var(--body)}
.utility-page .tournament-card .fine{font:14px/1.5 var(--body)}
.utility-page .tournament-card .actions{gap:12px 20px;align-items:center}
.utility-page .tournament-card .actions a:not(.button){font:14px/1.5 var(--body);min-height:44px;display:inline-flex;align-items:center}
.utility-page .tournament-snapshot{grid-template-columns:minmax(0,1fr) minmax(0,1fr);padding:24px;gap:32px}
.utility-page .tournament-snapshot dl{justify-content:flex-start;gap:40px}
.utility-page .tournament-snapshot dd{font-size:36px}
.utility-page .tournament-deck-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.utility-page .tournament-deck-grid :is(p,.accent){font:14px/1.5 var(--body)}
.utility-page .tournament-next h2{font-size:34px}
.utility-page .meta-board{max-width:100%}

/* Image-led editorial modules are composed, not scaled to fill a monitor. */
[data-page-family=news][data-page-kind=index] .news-card:first-child{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr)}
[data-page-family=news] .news-card:first-child>img{min-height:260px;max-height:400px}
[data-page-family=news] .news-card:first-child .news-card-copy{padding:28px}
[data-page-family=news] .news-card:first-child h2{font-size:42px;line-height:1.08}
.utility-page .release-featured{grid-template-columns:minmax(0,1.1fr) minmax(0,1fr)}
.utility-page .release-featured h3{font-size:52px}
.utility-page .release-featured .release-body{justify-content:center}
.utility-page .release-featured .release-actions{margin-top:0}
.utility-page .release-labels{margin-bottom:14px}
.utility-page .legend-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
.utility-page .legend-grid .record-card{padding:22px 18px;gap:18px}
.utility-page .legend-grid .record-card-art,.utility-page .legend-grid .record-card-art img{width:94px}
.utility-page .legend-grid .record-card-title{font-size:30px;line-height:1.1}
.utility-page .legend-grid .record-card .eyebrow{font-family:var(--body);text-transform:none;letter-spacing:0;font-size:14px}
.utility-page .legend-grid .record-card-meta{font:14px/1.5 var(--body);color:var(--muted)}
.utility-page .glossary-list{grid-template-columns:repeat(3,minmax(0,1fr));gap:24px 32px;margin-bottom:36px}
.utility-page .glossary-list>div{border-top:1px solid var(--soft);padding-top:16px}
.utility-page .glossary-list dt{font-size:27px}

@media(max-width:1100px){
 .utility-page .legend-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .utility-page .glossary-list{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:700px){
 .utility-page{--page-gutter:16px}
 .utility-page[data-layout] .page-intro{padding:20px var(--page-gutter)}
 .utility-page[data-layout] .page-intro h1{font-size:var(--h1-page)}
 .utility-page[data-layout] .breadcrumbs{padding-block:10px}
 .utility-page .legend-grid,.utility-page .glossary-list{grid-template-columns:minmax(0,1fr)}
 .utility-page .tournament-card,.utility-page .tournament-featured{position:relative;display:block;padding:20px}
 .utility-page .tournament-card-copy>.eyebrow,.utility-page .tournament-card h2,.utility-page .tournament-card-copy>.fine:first-of-type{padding-right:82px}
 .utility-page .tournament-card h2{font-size:30px;max-width:none;min-height:66px}
 .utility-page .tournament-champion-art{position:absolute;right:20px;top:20px;width:70px;max-width:none}
 .utility-page .tournament-winner{margin:16px 0}
 .utility-page .tournament-snapshot{grid-template-columns:minmax(0,1fr);padding:20px;gap:16px}
 .utility-page .tournament-snapshot dl{padding-top:16px;gap:28px}
 .utility-page .tournament-deck-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .utility-page .tournament-deck-grid>a{padding:16px}
 .utility-page .release-featured{display:flex}
 .utility-page .release-featured h3{font-size:42px}
 [data-page-family=news] .news-card:first-child>img{min-height:0;max-height:none;aspect-ratio:16/9}
 [data-page-family=news] .news-card:first-child .news-card-copy{padding:20px}
 [data-page-family=news] .news-card:first-child h2{font-size:32px}
}
@media(max-width:600px){
}
@media(max-width:360px){
 .utility-page .tournament-card h2{font-size:28px}
}

/* Reference indexes lead with identity; full rules stay on the card reference. */
.utility-page .legend-name{display:block}
.utility-page .legend-subtitle{display:block;font:15px/1.5 var(--body);text-transform:none;letter-spacing:0;margin-top:6px;color:var(--muted)}
.utility-page .top-deck-breakdown{grid-template-columns:repeat(2,minmax(0,1fr))}
.utility-page .top-deck-group{display:grid;grid-template-columns:110px minmax(0,1fr);align-items:start;border-top:2px solid var(--soft)}
.utility-page .top-deck-art{padding:20px 0 20px 16px;background:none}
.utility-page .top-deck-art img{width:94px;height:132px}
.utility-page .top-deck-group>div{padding:20px}
.utility-page .top-deck-group h3{font-size:28px}
.utility-page .top-deck-group :is(ul,.top-deck-compare){font-size:14px;line-height:1.5}
.utility-page .top-deck-group li>a{min-height:40px}
.utility-page .play-hero{display:flex;justify-content:space-between;align-items:center;gap:20px 32px;padding-block:20px;background:var(--bg2)}
.utility-page .play-local{display:flex;align-items:center;gap:20px;min-width:0}
.utility-page .play-local .button{flex:none;font-size:20px;min-height:44px}
.utility-page .play-local p{max-width:36ch;font:15px/1.6 var(--body);margin:0;color:var(--muted)}
.utility-page .play-shortcuts{display:flex;flex-direction:column;gap:4px;flex:none;font:14px/1.5 var(--body)}
.utility-page .play-shortcuts a{min-height:40px;display:flex;align-items:center}
.utility-page .browse-filter-panel{margin-top:12px}
.utility-page .browse-filter-panel>summary{font:14px/1.5 var(--body);cursor:pointer;min-height:44px;display:flex;align-items:center;gap:10px;width:fit-content;list-style:none}
.utility-page .browse-filter-panel>summary:after{content:'+';color:var(--ac)}
.utility-page .browse-filter-panel[open]>summary:after{content:'−'}
.utility-page .browse-filter-panel>summary::-webkit-details-marker{display:none}
.utility-page [data-browse-filter-count]{color:var(--ac)}
.utility-page .event-filters{margin-top:8px;gap:12px}
.utility-page .event-filters label{font:14px/1.5 var(--body)}
.utility-page[data-page-family=events] .card-toolbar{padding:20px var(--page-gutter) 12px}
.utility-page[data-page-family=events] .calendar-row{padding-block:22px;gap:24px;grid-template-columns:150px minmax(0,1fr)}
.utility-page[data-page-family=events] .calendar-row time{font:500 16px/1.5 var(--body)}
.utility-page[data-page-family=events] .calendar-row h2{font-size:30px;line-height:1.1}
.utility-page[data-page-family=events] .calendar-row p{font-size:15px;line-height:1.6}
.utility-page[data-page-family=events] .calendar-row .context-links{font:14px/1.5 var(--body)}
.utility-page[data-page-family=learn] .learning-paths h2{font-size:30px;line-height:1.1}
.utility-page[data-page-family=learn] .learning-paths a{padding:22px}
.utility-page[data-page-family=learn] .foundation-feature h2{font-size:clamp(36px,4vw,50px)}
.utility-page[data-page-family=learn] .foundation-feature{padding:28px;gap:28px}
.utility-page[data-page-family=learn] .foundation-feature-art{min-height:280px}
@media(max-width:900px){
 .utility-page .play-hero{display:block}
 .utility-page .play-shortcuts{flex-direction:row;flex-wrap:wrap;gap:0 24px;margin-top:8px}
}
@media(max-width:700px){
 .utility-page .top-deck-breakdown{grid-template-columns:minmax(0,1fr)}
 .utility-page .top-deck-group{grid-template-columns:96px minmax(0,1fr)}
 .utility-page .top-deck-art img{width:80px;height:112px}
 .utility-page .top-deck-group>div{padding:16px}
 .utility-page .play-hero{padding-block:16px}
 .utility-page .play-local{gap:16px}
 .utility-page .play-local p{font-size:14px;line-height:1.5}
 .utility-page .play-shortcuts{gap:0 18px;font-size:14px}
 .utility-page .play-shortcuts a{min-height:44px}
 .utility-page .browse-filter-panel{margin-top:8px}
 .utility-page .browse-filter-panel>summary{width:100%}
 .utility-page .browse-filter-panel>summary:after{margin-left:auto}
 .utility-page .event-filters{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
 .utility-page .event-filters>label{width:auto}
 .utility-page[data-page-family=events] .calendar-row{grid-template-columns:minmax(0,1fr);gap:8px}
 .utility-page[data-page-family=events] .calendar-list{padding-top:4px}
 .utility-page[data-page-family=events] .calendar-row h2{font-size:28px}
 .utility-page[data-page-family=learn] .foundation-feature{padding:22px 18px}
 .utility-page[data-page-family=learn] .foundation-feature h2{font-size:36px}
}

/* Keep the illustrative lesson cards clear of their caption at the new width. */
.utility-page[data-page-family=learn] .foundation-feature-art{min-height:320px}
.utility-page[data-page-family=learn] .foundation-feature-field{width:64%;top:6%;right:1%}
.utility-page[data-page-family=learn] .foundation-feature-unit{width:30%;top:9%;left:6%}
.utility-page[data-page-family=learn] .foundation-feature-point{bottom:23%}
@media(max-width:700px){
 .utility-page[data-page-family=learn] .foundation-feature-art{min-height:240px}
 .utility-page[data-page-family=learn] .foundation-feature-unit{width:34%}
 .utility-page[data-page-family=learn] .foundation-feature-field{width:68%}
}

/* The newly released Stats tool keeps its charts and interactions. Its labels
   follow the same readable floor in the builder and tournament reader. */
.utility-page .ds :is(.ds-kicker,.ds-panel-head .ds-kicker,.ds-rune-note .ds-kicker,.ds-chart-axis,.ds-ring span){font:14px/1.5 var(--body);letter-spacing:0}
.utility-page .ds :is(.ds-scope,.ds-metrics dt,.ds-identity-domains,.ds-section-counts>div,.ds-section-counts dd,.ds-champion-name p,.ds-axis-label,.ds-bar-space>b,.ds-power-row,.ds-power-row b,.ds-breakdown-row,.ds-breakdown-row b){font:14px/1.5 var(--body);letter-spacing:0;text-transform:none}
.utility-page .ds :is(.ds-header>div>p:last-child,.ds-metrics p,.ds-scope-note,.ds-caption,.ds-breakdown-row small,.ds-rune-note p,.ds-card-result small,.ds-method,.ds-explore-hint){font:13px/1.6 var(--body);letter-spacing:0}
.utility-page .ds :is(.ds-data-warning,.ds-empty-results p,.ds-card-result strong){font:14px/1.6 var(--body)}
.utility-page .ds :is(.ds-clear,.ds-chart-jump,.ds-scope select){font-size:14px;min-height:44px}
.utility-page .ds .ds-method summary{min-height:44px;display:flex;align-items:center}
.utility-page .ds .ds-panel-head{flex-wrap:wrap;gap:12px}
.utility-page .ds .ds-chart-jump{margin-left:0}
.utility-page .ds .ds-power-row{min-height:44px}
.utility-page .ds .ds-metrics dd{letter-spacing:0}
.utility-page .db-workspace-tabs button{font-size:14px}
@media(max-width:700px){
 .utility-page .ds .ds-metrics>div{padding:16px 12px}
 .utility-page .ds .ds-type-layout{gap:16px}
 .utility-page .ds .ds-ring{width:100px;height:100px;flex-basis:100px;padding:12px}
 .utility-page .ds .ds-breakdown-row{grid-template-columns:8px minmax(0,1fr) auto 38px;gap:6px}
}
@media(max-width:380px){
 .utility-page .ds .ds-type-layout{display:block}
 .utility-page .ds .ds-ring{margin:0 auto 16px}
}
/* Mobile polish: breadcrumb links keep their size but take a 44px tap. The search page starts with suggestions. */
.breadcrumbs a{display:inline-block;padding-block:14px;margin-block:-14px}
.search-results:has(>.search-start){border:0}
.search-start p{margin:0 0 10px;font:16px/1.7 var(--body);color:var(--muted)}
.search-start a{display:inline-block;padding-block:10px;margin-block:-10px;color:var(--ac)}
/* Results arrive after the index loads; holding their space keeps the footer from jumping. */
.section:has(>.search-results){min-height:80vh}
/* A guessed card or Legend address fills this box after load; its space is held so nothing jumps. */
.not-found-help{min-height:12rem}.not-found-matches{display:flex;flex-wrap:wrap;gap:8px 18px;padding:0;margin:14px 0 0;list-style:none}.not-found-matches a{display:inline-block;padding-block:10px}
/* Card results read like the /cards/ tiles: art first, the name at tile size, then the text. */
.search-results>a.result-card{display:grid;grid-template-columns:76px minmax(0,1fr);gap:16px;align-items:start}
.result-card>img,.result-card-art{display:block;width:76px;height:auto;aspect-ratio:744/1039;border-radius:5px;background:var(--bg2)}
.result-card-body{display:grid;gap:6px;min-width:0}
.result-card-name{font:600 23px/1.05 var(--head);color:var(--ink);overflow-wrap:anywhere}
.result-card-text{font:14px/1.55 var(--body);color:var(--muted);overflow-wrap:anywhere}
.search-results>a.result-card:hover .result-card-name{color:var(--ac)}
.search-near a{display:inline-block;padding-block:10px;margin-block:-10px;color:var(--ac)}

/* Mobile polish: separators never start a line on phones. The current page's crumb repeats
   the H1 right below it, so phones drop it; a title's " · " becomes a line break. */
@media(max-width:700px){.breadcrumbs li:last-child:not(:first-child){display:none}h1 .title-sep{display:block;font-size:0}}
[data-browse-also] a{color:var(--ac);text-decoration:underline;text-underline-offset:3px}
/* Card index rows (by set and by tag): a small thumbnail beside each card's name and number. */
.card-directory .card-directory-card{position:relative;padding-left:56px;min-height:82px}
.card-directory .card-directory-card img{position:absolute;left:0;top:12px;width:40px;height:56px;object-fit:contain;border-radius:3px}
/* Polish pass: decklists in search are compact rows under one heading, below the cards they rank with. */
.search-results>.result-decks{grid-column:1/-1;padding:18px 22px 22px;border-right:1px solid var(--soft);border-bottom:1px solid var(--soft);background:var(--bg)}
.result-decks>h2{margin:0 0 6px;font:600 13px/1.4 var(--body);text-transform:none;letter-spacing:0;color:var(--muted)}
.result-deck-rows{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,380px),1fr));column-gap:28px}
.result-deck{display:grid;gap:2px;padding:10px 0;border-top:1px solid var(--soft);color:var(--ink);text-decoration:none;min-width:0}
.result-deck-title{font:500 16px/1.35 var(--body);overflow-wrap:anywhere}
.result-deck:hover .result-deck-title{text-decoration:underline;text-underline-offset:3px}
.result-deck .fine{font-size:13px;color:var(--muted)}
.result-decks>.button{margin-top:12px}

/* Page system (Oct 3 polish). Reading pages (articles, Learn guides, About, legal, rules) are
   one centred 55rem column, breadcrumb and title included: Ron, Oct 7, "center formatting was
   more appealing" than the Oct 3 left edge. Other inner pages share the standard gutter.
   H1 steps: --h1-display (identity heroes), --h1-page (every page and article title),
   --h1-compact (tool pages). Pages use these tokens, never their own H1 sizes. */
.utility-page{--h1-display:clamp(56px,7vw,104px);--h1-page:clamp(40px,4vw,56px);--h1-compact:clamp(32px,3vw,42px)}
@media(max-width:700px){.utility-page{--h1-display:48px;--h1-page:38px;--h1-compact:32px}}
.utility-page[data-layout=reading] #main{max-width:var(--layout-reading);margin-inline:auto}
.utility-page .player-page:has(>.intro){max-width:var(--layout-standard);margin-inline:auto;padding-inline:var(--page-gutter)}
.utility-page .player-page .intro h1{font-size:var(--h1-page);line-height:1.06}

/* Links inside prose look like links: an underline, not just a colour that matches the text. */
:is(.reading,[data-layout=reading] #main,[data-page-family=history] #main,[data-page-family=glossary] #main) :is(p,li,dd,figcaption):not(nav *) a:not([class]){text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.22em}

/* One story card on the News index and its topic pages. The title is the card's link and
   covers the whole card. A story without a picture is a plain text card, never a grey panel.
   Six tracks of two: a last row of one card runs full width beside its picture, a last row of
   two splits the width, so the grid never ends on an orphan. Phones list the rest as rows. */
[data-page-family=news] .news-grid{grid-template-columns:repeat(6,minmax(0,1fr));gap:32px 24px}
[data-page-family=news] .news-card{position:relative;grid-column:span 2;align-self:start}
[data-page-family=news] .news-card:first-child{grid-column:1/-1;align-self:stretch}
[data-page-family=news] .news-card h2 a::after{content:'';position:absolute;inset:0}
[data-page-family=news] .news-card:hover h2 a{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:.12em}
[data-page-family=news] .news-card:focus-within{outline:3px solid var(--ac);outline-offset:4px}
[data-page-family=news] .news-card h2 a:focus-visible{outline:0}
[data-page-family=news] .news-card:not(:first-child) .news-card-copy{padding-bottom:0}
[data-page-family=news] .news-card:not(:first-child) .news-card-copy>p:not(.story-meta){margin-bottom:0}
[data-page-family=news] .news-card:not(:first-child):not(:has(>img)) .news-card-copy{padding-top:16px}
[data-page-family=news] .news-card:nth-child(3n+2):last-child:not(:first-child){grid-column:1/-1;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0 32px;align-items:center}
[data-page-family=news] .news-card:nth-child(3n+2):last-child:not(:first-child)>img{aspect-ratio:16/9}
[data-page-family=news] .news-card:nth-child(3n+2):nth-last-child(2),[data-page-family=news] .news-card:nth-child(3n+2):nth-last-child(2)+.news-card{grid-column:span 3}
@media(max-width:900px){
 [data-page-family=news] .news-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 [data-page-family=news] .news-card,[data-page-family=news] .news-card:nth-child(3n+2):nth-last-child(2),[data-page-family=news] .news-card:nth-child(3n+2):nth-last-child(2)+.news-card{grid-column:auto}
 [data-page-family=news] .news-card:first-child{grid-column:1/-1}
 [data-page-family=news] .news-card:nth-child(3n+2):last-child:not(:first-child){grid-column:auto;display:block}
 [data-page-family=news] .news-card:nth-child(even):last-child:not(:first-child){grid-column:1/-1;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0 24px;align-items:center}
}
@media(max-width:690px){
 [data-page-family=news] .news-grid{grid-template-columns:minmax(0,1fr);gap:0}
 [data-page-family=news] .news-card:first-child{margin-bottom:12px}
 [data-page-family=news] .news-card:not(:first-child),[data-page-family=news] .news-card:nth-child(3n+2):last-child:not(:first-child){grid-column:auto;display:grid;grid-template-columns:104px minmax(0,1fr);gap:0 14px;align-items:start;padding-block:16px;border-top:1px solid var(--soft)}
 [data-page-family=news] .news-card:not(:first-child)>img{grid-column:1;aspect-ratio:4/3;width:104px;height:auto;margin:2px 0 0}
 [data-page-family=news] .news-card:not(:first-child) .news-card-copy{grid-column:2;padding:0}
 [data-page-family=news] .news-card:not(:first-child):not(:has(>img)){grid-template-columns:minmax(0,1fr)}
 [data-page-family=news] .news-card:not(:first-child):not(:has(>img)) .news-card-copy{grid-column:1}
 [data-page-family=news] .news-card:not(:first-child) h2{font-size:21px;line-height:1.18;margin:4px 0 0}
 [data-page-family=news] .news-card:not(:first-child) .news-card-copy>p:not(.story-meta){display:none}
 [data-page-family=news] .news-card:not(:first-child) .story-meta{font-size:13px}
}
.topic-nav .button[aria-current=page]{background:var(--ink);color:var(--bg);border-color:var(--ink)}

/* Article header: the story's kind and Save share one row, the reading column keeps a 680px
   measure, and phones drop the breadcrumb (News is lit in the nav) so the first line comes sooner. */
[data-page-kind=detail][data-page-family=news] .record-copy{display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:16px;align-items:center;max-width:calc(var(--layout-reading) - 2*var(--page-gutter))}
[data-page-kind=detail][data-page-family=news] .record-copy>*{grid-column:1/-1}
[data-page-kind=detail][data-page-family=news] .record-copy>.eyebrow{grid-column:1;grid-row:1;margin:0}
[data-page-kind=detail][data-page-family=news] .record-copy>.record-tools{grid-column:2;grid-row:1;margin:0}
[data-page-kind=detail][data-page-family=news] .record-copy>h1{margin-top:10px}
.utility-page .reading>p:not([class]){max-width:42.5rem}
@media(max-width:600px){
 [data-page-kind=detail][data-page-family=news] .breadcrumbs{display:none}
 [data-page-kind=detail][data-page-family=news] #main>.page-intro{padding-block:18px 14px}
 [data-page-kind=detail][data-page-family=news] .record-copy>h1{margin:8px 0 0}
 [data-page-kind=detail][data-page-family=news] .reading{padding-top:16px}
 .utility-page .reading>p:not([class]),.utility-page .reading>ul>li,.utility-page .reading>ol>li,.utility-page .reading>blockquote{font-size:18px;line-height:1.6}
}
/* Related stories under an article: each with its own credited picture; other records follow as links. */
.related-stories{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,240px),1fr));gap:24px;margin-top:16px}
.related-story{display:grid;align-content:start;gap:6px;color:var(--ink);border-top:1px solid var(--soft);padding-top:12px}
.related-story-art{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;margin-bottom:6px}
.related-story strong{font:600 18px/1.3 var(--body);text-wrap:pretty}
.related-story .fine{font:14px/1.5 var(--body);color:var(--muted)}
.related-story:hover strong{text-decoration:underline;text-underline-offset:.15em}
.related-also{display:flex;flex-wrap:wrap;gap:4px 20px;align-items:baseline;margin:24px 0 0;font:15px/1.5 var(--body)}
.related-also span{color:var(--muted)}
.related-also a{display:inline-block;padding-block:10px;margin-block:-10px;text-decoration:underline;text-underline-offset:.2em}
@media(max-width:600px){.related-stories{grid-template-columns:minmax(0,1fr);gap:0}.related-story{grid-template-columns:96px minmax(0,1fr);column-gap:14px;padding-block:14px}.related-story-art{grid-row:1/3;margin:0;aspect-ratio:4/3}.related-story-text{grid-template-columns:minmax(0,1fr)}.related-story strong{font-size:17px}}
.utility-page .reading>:is(ul,ol){max-width:42.5rem}
@media(max-width:600px){[data-page-kind=detail][data-page-family=news] .record-tools .save-button{min-height:44px}}
/* On phones the current page's crumb is dropped, so a two-step trail would be a lone "Home". */
@media(max-width:700px){.breadcrumbs:has(li:nth-child(2):last-child){display:none}}
/* Site search on phones: the query field gets its own row, Show and Search share the next one, and the
   "Search" label is read by screen readers only (the page title already says it), so results start sooner. */
@media(max-width:600px){
 .search-form[data-hub-search]{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:end}
 .search-form[data-hub-search]>label.grow{grid-column:1/-1;font-size:0;gap:0}
 .search-form[data-hub-search]>label.grow input{font-size:17px}
 .search-form[data-hub-search]>label:not(.grow){flex-direction:row;align-items:center;gap:10px}
 .search-form[data-hub-search]>label:not(.grow) select{flex:1;min-width:0}
 .search-form[data-hub-search]>.button{padding-inline:18px}
 [data-page-family=search] .page-intro{padding-block:18px 14px}
}