/* Component refinements share the reading grid defined in reference.css. */
.masthead { min-height:110px; }
.main-nav { gap:30px; font-size:12px; }
.main-nav .nav-collections { display:inline-flex; align-items:center; gap:5px; }
.nav-collections span { color:#8b9283; font-size:15px; transform:translateY(-2px); }
.name-header { padding-top:25px; row-gap:27px; }
.collection-header { grid-column:1/-1; display:flex; justify-content:space-between; align-items:center; gap:24px; }
.collection-identity { display:inline-flex; align-items:center; gap:12px; border:0; padding:0; background:none; text-align:left; }
.collection-mark { display:block; color:var(--accent); width:43px; height:43px; flex-shrink:0; }
.collection-kicker { display:block; font:9px/1.5 var(--sans); letter-spacing:.09em; text-transform:uppercase; color:#858577; margin-bottom:3px; }
.collection-name { display:block; font:20px/1.25 var(--serif); color:#555c4d; }
.collection-identity:hover .collection-name { color:var(--accent); }
.collection-browse { display:flex; align-items:center; gap:15px; font:11px/1.5 var(--sans); color:#626b5a; }
.collection-browse span { font-size:18px; color:#808c70; transition:transform .2s var(--ease); }
.collection-browse:hover span { transform:translateX(3px); }
.profile-title { padding-top:0; }

/* Boundary, not an additional column or a width change. */
.rail { position:relative; }
.rail::before { content:''; display:block; position:absolute; left:calc(var(--gap) / -2); top:0; bottom:0; width:1px; background:#e2e5dd; }
.rail .selection { background:#e8eeea; padding:21px 22px 22px; border:0; margin-bottom:33px; }
.selection .rail-title { color:var(--accent); text-transform:uppercase; letter-spacing:.12em; font:500 9px/1.5 var(--sans); margin:0 0 9px; }
.selection .noticer-name { font:normal 21px/1.3 var(--serif); margin-bottom:10px; }
.selection .selection-note { font:14px/1.62 var(--serif); letter-spacing:0; color:#4d5b50; }
.selection .rail-link { font:10px/1.6 var(--sans); margin-top:16px; color:#445448; text-decoration-color:#95a59b; }
.place-module { padding-top:0; border-top:0; }
.rail-section:last-child { margin-bottom:0; }
.rail-title { font-size:17px; }
.milestone-context { display:block; font:9px/1.5 var(--sans); color:#68725f; margin:5px 0 7px; }
.milestone-caption { font-size:10.5px; line-height:1.6; }
.milestone-title { margin-bottom:0; }
.milestone-art { margin-top:5px; }

/* Quote + image is one inline editorial figure. It never breaks the left column. */
.quote-feature { clear:both; display:grid; grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr); gap:29px; align-items:center; margin:35px 0 34px; width:100%; }
.quote-copy { border-left:1px solid #c4cbbd; padding:2px 0 2px 20px; }
.quote-copy blockquote p { font:italic 22px/1.48 var(--serif); color:#46513f; letter-spacing:-.15px; }
.quote-attribution { font:13px/1.55 var(--serif); color:#424d3d; margin-top:16px; }
.quote-attribution span { display:block; margin-top:4px; font:9px/1.65 var(--sans); color:#858b7d; }
.quote-image { min-width:0; }
.quote-image > svg { width:100%; height:auto; }
.image-credit { margin-top:7px; padding-top:7px; border-top:1px solid #e3e6da; font:9px/1.6 var(--sans); color:#838b77; }

/* The collection's visual signature repeats in browsing, never throughout the article. */
.collection-dialog-head { display:flex; align-items:center; gap:19px; margin-bottom:15px; }
.collection-dialog-head .collection-mark { width:57px; height:57px; }
.collection-dialog-head .collection-kicker { color:#8d7769; }
.collection-dialog-head h2 { margin:4px 0 0; }
.collection-result { display:grid; grid-template-columns:55px minmax(0,1fr); align-items:center; gap:18px; }
.collection-result .collection-mark { width:48px; height:48px; }
.collection-result:hover h3 { color:var(--accent); }
.collection-result h3 { margin:0 0 6px; font-size:24px; }
.collection-result small { margin-top:8px; }

/* A slow run of work titles, below the objects and away from the reading. */
.work-ticker { display:flex; align-items:center; gap:21px; min-height:58px; padding:13px 0; border-bottom:1px solid var(--line); }
.ticker-label { flex-shrink:0; font:10px/1.5 var(--sans); color:#7e8773; padding:5px 0; }
.ticker-label span { margin-left:6px; }
.ticker-window { flex:1; min-width:0; overflow:hidden; mask-image:linear-gradient(to right,transparent,#000 16px,#000 calc(100% - 16px),transparent); }
.ticker-track { display:flex; width:max-content; animation:work-ticker-scroll 96s linear infinite; animation-play-state:paused; }
.ticker-group { display:flex; align-items:center; flex-shrink:0; gap:24px; padding-right:24px; white-space:nowrap; }
.ticker-item { font:14px/1.8 var(--serif); color:#777f6e; }
.ticker-dot { color:#afba9f; font-size:13px; }
@keyframes work-ticker-scroll { from { transform:translateX(0); } to { transform:translateX(-50%); } }
.work-ticker[data-paused='false'] .ticker-track { animation-play-state:running; }
.work-ticker:hover .ticker-track, .work-ticker:focus-within .ticker-track { animation-play-state:paused; }
.ticker-toggle { display:inline-flex; align-items:center; justify-content:flex-end; gap:7px; border:0; background:none; padding:8px 0 8px 5px; color:#7d8670; font:10px/1.5 var(--sans); min-width:49px; }
.ticker-control-icon { width:12px; text-align:center; font-size:11px; }
.ticker-toggle:disabled { opacity:.65; }
.publication-footer { padding-top:24px; }

@media (max-width:1160px) {
 .main-nav { gap:24px; }
 .selection .selection-note { font-size:13px; }
 .rail .selection { padding:19px 18px 20px; }
 .collection-name { font-size:19px; }
 .quote-feature { gap:23px; }
 .quote-copy { padding-left:17px; }
 .quote-copy blockquote p { font-size:20px; }
 .milestone-context { font-size:8.5px; }
}
@media (min-width:721px) and (max-width:1000px) {
 .quote-feature { grid-template-columns:1fr; gap:20px; }
 .quote-image { max-width:340px; margin-inline:auto; width:100%; }
 .quote-copy blockquote p { font-size:23px; }
}
@media (max-width:850px) {
 .main-nav { gap:19px; font-size:11px; }
 .collection-mark { width:37px; height:37px; }
 .collection-kicker { font-size:8px; }
 .collection-name { font-size:18px; }
 .collection-browse { font-size:10px; gap:8px; }
 .name-header { row-gap:25px; }
 .rail .selection { padding:17px; }
 .selection .noticer-name { font-size:20px; }
 .milestone-context { font-size:9px; }
}
@media (max-width:720px) {
 .masthead { min-height:0; }
 .main-nav { gap:24px; }
 .name-header { row-gap:0; padding-top:21px; }
 .collection-header { margin-bottom:25px; }
 .collection-identity { gap:8px; }
 .collection-browse { font-size:10px; }
 .collection-browse span { font-size:16px; }
 .collection-name { font-size:18px; }
 .sample-status { margin-top:14px; }
 .rail::before { display:none; }
 .rail .selection { max-width:none; padding:22px; margin-bottom:29px; }
 .selection .selection-note { font-size:15px; max-width:550px; }
 .selection .rail-title { font-size:9px; }
 .selection .rail-link { font-size:11px; }
 .selection .noticer-name { font-size:22px; }
 .place-module { border-top:1px solid var(--line); padding-top:20px; }
 .rail-section:last-child { margin-bottom:26px; }
 .quote-copy blockquote p { font-size:22px; }
 .work-ticker { gap:15px; }
 .ticker-item { font-size:13px; }
 .ticker-label { font-size:9px; }
 .milestone-context { font-size:9px; }
}
@media (max-width:580px) {
 .quote-feature { grid-template-columns:1fr; gap:20px; margin-block:30px; }
 .quote-copy { padding-left:19px; }
 .quote-copy blockquote p { font-size:25px; line-height:1.43; }
 .quote-attribution { font-size:14px; }
 .quote-image { width:100%; max-width:390px; justify-self:center; }
 .image-credit { font-size:9px; }
}
@media (max-width:480px) {
 .collection-browse { font-size:0; padding:12px 0 12px 8px; }
 .collection-browse span { font-size:19px; }
 .collection-name { font-size:18px; }
 .collection-header { gap:12px; margin-bottom:24px; }
 .collection-identity { gap:9px; }
 .collection-kicker { font-size:8px; }
 .collection-mark { width:34px; height:34px; }
 .rail .selection { padding:20px 21px; }
 .selection .selection-note { font-size:14.5px; }
 .work-ticker { gap:10px; min-height:55px; }
 .ticker-label { max-width:65px; line-height:1.5; }
 .ticker-toggle { min-width:22px; padding:8px 0; }
 .ticker-control-label { display:none; }
 .collection-dialog-head { gap:12px; }
 .collection-dialog-head .collection-mark { width:41px; height:41px; }
 .collection-dialog-head h2 { font-size:29px; }
 .collection-result { grid-template-columns:41px minmax(0,1fr); gap:12px; }
 .collection-result .collection-mark { width:36px; height:36px; }
}
@media (prefers-reduced-motion:reduce) {
 .ticker-track { animation:none !important; transform:none !important; }
 .ticker-window { overflow-x:auto; scrollbar-width:thin; }
 .ticker-group[aria-hidden='true'] { display:none; }
 .ticker-toggle { pointer-events:none; }
 .collection-browse span { transition:none; }
}
