/* Keep the full footer in document flow; only the header is fixed. */
body{padding-top:var(--fixed-header-height,88px)}
.site-header{position:fixed;inset:0 0 auto;width:100%;z-index:200;transition:transform .14s ease-out}
.site-nav button.active,.profile-link.active{color:#ff9500}
.profile-link.active img{filter:invert(56%) sepia(94%) saturate(1890%) hue-rotate(359deg) brightness(102%) contrast(108%)}
.museum-section .news-row{position:relative}
.museum-link:focus-visible{outline:2px solid #ff9500;outline-offset:6px;border-radius:4px}
.market-grid article{position:relative;cursor:pointer;height:auto;min-height:365px;padding-bottom:18px}
.market-grid small{display:block;line-height:1.5}
.market-card-link{position:absolute;inset:0;z-index:2;border-radius:inherit}
.market-card-link:focus-visible{outline:2px solid #ffb700;outline-offset:-4px}
.opportunity-pagination{height:24px}
.opportunity-pagination button{height:24px;position:relative;overflow:hidden;border-radius:4px}
.opportunity-pagination button.active:after{content:"";position:absolute;inset:10px 0;background:#ffb700;transform-origin:left;animation:opportunity-progress 8s linear forwards}
.home-motion-paused .opportunity-pagination button.active:after{animation-play-state:paused}
@keyframes opportunity-progress{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@media(max-width:767px){
 .hero-copy>p:not([hidden]){display:block;font-size:16px;margin:12px 0 20px;line-height:1.4}
 .hero-mobile-label{display:none}
 .opportunities-section,.market-section{width:var(--mobile-content);padding-top:64px}
 .opportunity-card{width:100%;height:auto;min-height:0;margin-top:20px;padding:56px 20px 24px;display:flex;flex-direction:column;gap:24px}
 .opportunity-art{position:relative;inset:auto;width:min(100%,240px);margin:0 auto}
 .opportunity-art>img{width:100%;height:260px;object-fit:contain;background:#ececec}
 .opportunity-insight{width:100%;margin:0}
 .opportunity-values,.confidence,.opportunity-chart-card{position:static;width:100%;height:auto;margin:0}
 .opportunity-values{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
 .opportunity-values>div{width:auto;height:auto;min-height:90px;padding:16px 12px}
 .opportunity-values strong{font-size:clamp(14px,4vw,20px);overflow-wrap:anywhere}
 .confidence{margin:20px 0}
 .opportunity-chart-card{padding:20px 14px}
 .market-grid{grid-template-columns:1fr;gap:20px;margin-top:24px}
 .market-grid article{width:100%;min-height:0}
 .market-image{height:250px}
 .opportunity-pagination button{min-height:24px}
}
@media(prefers-reduced-motion:reduce){.site-header,body[data-route] .site-footer{transition:none}.opportunity-pagination button.active:after{animation:none}.opportunity-art>img,.opportunity-art figcaption,.opportunity-insight{transition:none}}

/* Auction logos replace Market Signals artwork; accompanying copy is unchanged. */
.market-image:has(.auction-logo){background:#f5f3ef;display:flex;align-items:center;justify-content:center;padding:36px;box-sizing:border-box}
.market-image img.auction-logo{display:block;width:100%;height:auto;max-height:100%;object-fit:contain}

/* One accessible control per source record, seven dots total. */
.opportunity-pagination{grid-template-columns:repeat(7,minmax(0,1fr));height:32px;align-items:center}
.opportunity-pagination button,.opportunity-pagination button:focus,.opportunity-pagination button:focus-visible{height:32px;justify-content:center}
.opportunity-pagination button span{width:7px;height:7px;flex:none}
.opportunity-pagination button.active span{background:#ffb700;transform:scale(1.35)}
.opportunity-pagination button.active:after{display:none}
.opportunity-pagination button:focus-visible span{outline:2px solid #fff;outline-offset:5px}
#opportunitySource{display:block;width:100%;height:315px;background:transparent;border:0;box-sizing:border-box;overflow:hidden}
#opportunityImage{display:block;width:100%;height:100%;object-fit:cover;object-position:center;border:0}
.opportunity-art figcaption{overflow-wrap:anywhere}
@media(max-width:767px){#opportunitySource{height:260px}.opportunity-pagination{top:16px}}

/* Keep the design's compact values, percentage bar and chart; no extra prose. */
#opportunityCard .confidence[hidden],#opportunityGrade[hidden]{display:none}
#opportunityCard .opportunity-insight{min-width:0;display:block}
#opportunityCard .opportunity-values small{overflow-wrap:anywhere}
#opportunityCard .confidence{position:static;display:grid;grid-template-columns:1fr;align-items:start;margin:16px 0 30px;width:100%;height:auto;gap:14px}
#opportunityCard .confidence b{justify-self:end;padding-inline-end:16px}
#opportunityCard .confidence span{height:15px;border-radius:8px}
#opportunityCard .confidence.negative b{color:#ff7474}
#opportunityCard .confidence.negative i{background:#ff7474}
#opportunityConfidenceBar{width:0}
#opportunityGrowth.negative{color:#ff7474}
#opportunityCard .opportunity-chart-card{height:auto;aspect-ratio:540/438;min-height:250px;padding:30px 28px;overflow:hidden}
#opportunityCard .opportunity-chart-card>div{gap:28px;margin:0;position:absolute;top:74px;left:28px;z-index:1;pointer-events:none}
#opportunityCard .opportunity-chart-card{position:relative;inset:auto}
#opportunityCard .opportunity-chart-card p{margin:0;font-size:12px;line-height:1.35}
#opportunityCard .opportunity-chart-card canvas{width:100%;height:calc(100% - 40px);margin-top:24px}
@media(min-width:1101px){
 #opportunityCard{padding:42px 98px 42px 102px;grid-template-columns:290px minmax(0,1fr);gap:74px}
 #opportunityCard .opportunity-art{width:290px;margin-top:82px}
 #opportunitySource{height:342px}
 #opportunityCard .opportunity-insight{margin-top:74px}
 #opportunityCard .opportunity-values{gap:36px}
 #opportunityCard .opportunity-values>div{height:96px;padding:22px 15px}
 #opportunityCard .opportunity-values strong{font-size:20px}
 #opportunityCard .opportunity-art .grade{width:58px;height:58px;left:7px;top:0;transform:none;font-size:24px;z-index:1}
}
@media(max-width:767px){
 #opportunityCard .opportunity-chart-card{min-height:219px;aspect-ratio:auto;height:240px;padding:24px 18px}
 #opportunityCard .opportunity-chart-card>div{top:66px;left:18px}
 #opportunityCard .confidence{margin:20px 0 26px}
}

/* Keep the image fade/slide after the source link wrapper was introduced. */
.opportunity-art>a{transition:opacity .18s ease,transform .18s ease}
.opportunity-card.is-changing .opportunity-art>a{opacity:.18;transform:translateX(8px)}

/* Uniform design-frame dimensions; keep original assets and animate the wrapper. */
#opportunitySource[data-category="design"] #opportunityImage{object-position:center bottom}
#opportunitySource[data-category="wine"] #opportunityImage{object-position:center}
@media(prefers-reduced-motion:reduce){.opportunity-art>a{transition:none}}
@media(min-width:768px){#opportunityCard{height:auto;min-height:600px}}

#detailDocuments{display:grid;gap:10px;margin:16px 0;max-width:100%;overflow-wrap:anywhere}
#detailDocuments[hidden]{display:none}
#detailDocuments a,#invoiceFileName,#invoiceFileReady a[data-review-document-control]{color:#ffbd00;text-decoration:underline;overflow-wrap:anywhere}

#invoiceFileReady button[data-review-document-control]{border:0;background:none;color:inherit;padding:0 6px;min-width:24px;cursor:pointer}

/* Long translations/amounts must never contribute intrinsic column width.
   Keep artwork, chart and card geometry; reduce glyph size in content-fit.js. */
#opportunityCard .opportunity-values{grid-template-columns:repeat(2,minmax(0,1fr))}
#opportunityCard .opportunity-values>div{min-width:0;grid-template-rows:15px 1fr;align-content:start}
#opportunityCard .opportunity-values small,
#opportunityCard .opportunity-values strong,
#opportunityCard figcaption>*{display:block;min-width:0;max-width:100%;white-space:nowrap;overflow-wrap:normal}
#opportunityCard .opportunity-values small{line-height:15px}
#opportunityCard .opportunity-values strong{line-height:24px}
#opportunityCard .opportunity-chart-card p{white-space:nowrap;line-height:16px}
#opportunityCard .opportunity-chart-card>div{right:28px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,3fr)}
#opportunityCard .opportunity-chart-card>div>*{min-width:0;white-space:nowrap;line-height:20px}
@media(max-width:767px){
 #opportunityCard .opportunity-chart-card>div{right:18px}
}
