.detail-shell { width: min(1160px, calc(100% - 2rem)); }
.detail-nav { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: 1rem 1.25rem; border-radius: 18px; background: var(--brand-strong); color: #fff; box-shadow: var(--shadow); }
.detail-nav .brand { color: #fff; font-family: "DM Serif Display", Georgia, serif; font-size: 1.3rem; }
.detail-nav nav { display: flex; flex-wrap: wrap; gap: .45rem; }
.detail-nav nav a { color: #fff; border: 1px solid rgba(255,255,255,.25); border-radius: 999px; padding: .4rem .7rem; font-size: .86rem; }
.breadcrumbs { display: flex; flex-wrap: wrap; gap: .45rem; align-items: center; padding: 1rem .2rem; color: var(--muted); font-size: .88rem; }
.detail-hero, .detail-panel { background: var(--surface); border: 1px solid var(--line); border-radius: 20px; box-shadow: var(--shadow); }
.detail-hero { display: grid; grid-template-columns: minmax(280px, .78fr) minmax(0, 1.5fr); overflow: hidden; }
.detail-image-panel { min-height: 440px; padding: 1.4rem; display: grid; place-items: center; background: linear-gradient(145deg,#f4ede0,#fffdf8); }
.detail-image-panel img { width: 100%; max-width: 440px; aspect-ratio: 1; object-fit: contain; border-radius: 16px; }
.detail-image-placeholder { color: var(--muted); }
.detail-copy { padding: clamp(1.35rem,4vw,3rem); align-self: center; }
.detail-eyebrow { margin: 0 0 .5rem; color: var(--accent); text-transform: uppercase; letter-spacing: .09em; font-weight: 700; font-size: .78rem; }
.detail-copy h1, .detail-panel h2 { font-family: "DM Serif Display", Georgia, serif; color: var(--brand-strong); line-height: 1.08; }
.detail-copy h1 { margin: 0; font-size: clamp(2rem,4.5vw,3.7rem); }
.detail-original-title { color: var(--muted); font-size: 1.04rem; max-width: 68ch; }
.detail-chips { display: flex; flex-wrap: wrap; gap: .45rem; margin: 1rem 0; }
.detail-chips span { border: 1px solid var(--line); background: var(--surface-alt); border-radius: 999px; padding: .35rem .62rem; font-size: .84rem; }
.detail-metrics { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .7rem; margin: 1.25rem 0; }
.detail-metrics div { border: 1px solid var(--line); border-radius: 12px; padding: .8rem; background: var(--surface-alt); }
.detail-metrics span { display: block; color: var(--muted); text-transform: uppercase; letter-spacing: .06em; font-size: .72rem; }
.detail-metrics strong { display: block; margin-top: .25rem; color: var(--brand-strong); font-size: 1.28rem; }
.metric-positive { color: var(--success)!important; }.metric-negative { color: #a73535!important; }
.detail-actions { display: flex; flex-wrap: wrap; gap: .65rem; }
.detail-panel { margin-top: 1rem; padding: clamp(1.2rem,3vw,2rem); }
.detail-panel header h2, .detail-methodology h2 { margin: 0; font-size: clamp(1.5rem,3vw,2.2rem); }
.detail-panel header > p:last-child { color: var(--muted); }
.detail-definition-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: .75rem; margin: 1.2rem 0 0; }
.detail-definition-grid div { border-top: 2px solid var(--accent); padding: .75rem; background: var(--surface-alt); border-radius: 0 0 10px 10px; }
.detail-definition-grid dt { color: var(--muted); font-size: .75rem; text-transform: uppercase; letter-spacing: .05em; }.detail-definition-grid dd { margin: .3rem 0 0; font-weight: 600; overflow-wrap: anywhere; }
.related-sales-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .75rem; }
.related-sale { display: grid; grid-template-columns: 90px 1fr; gap: .75rem; border: 1px solid var(--line); border-radius: 12px; padding: .7rem; }
.related-sale img { width: 90px; height: 90px; object-fit: contain; border-radius: 9px; background: #f5f1e8; }.related-sale h3 { margin: 0; font-size: .94rem; }.related-sale p { margin: .4rem 0 0; color: var(--muted); font-size: .84rem; }
.grade-stat-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(170px,1fr)); gap: .7rem; }
.grade-stat-grid article { border: 1px solid var(--line); border-radius: 12px; padding: .8rem; background: var(--surface-alt); }.grade-stat-grid span,.grade-stat-grid small { display:block;color:var(--muted); }.grade-stat-grid strong { display:block;color:var(--brand);font-size:1.35rem;margin:.18rem 0; }
.sale-history-list { display: grid; gap: .55rem; }.sale-history-list article { display:grid;grid-template-columns:70px minmax(0,1fr) auto;align-items:center;gap:.8rem;border-bottom:1px solid var(--line);padding:.65rem 0; }.sale-history-list img { width:70px;height:70px;object-fit:contain;border-radius:8px;background:#f5f1e8; }.sale-history-copy h3 { margin:0;font-size:.96rem; }.sale-history-copy p { display:flex;flex-wrap:wrap;gap:.45rem;margin:.35rem 0 0;color:var(--muted);font-size:.84rem; }.sale-history-copy p span:not(:last-child)::after { content:" ·"; }.sale-history-action { white-space:nowrap;font-weight:600; }
.detail-methodology { border-left: 4px solid var(--accent); }.detail-methodology p { max-width: 90ch; color: var(--muted); }
@media (max-width: 800px) { .detail-nav nav a:not(:first-child){display:none}.detail-hero{grid-template-columns:1fr}.detail-image-panel{min-height:280px}.detail-image-panel img{max-height:340px}.detail-definition-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.related-sales-grid{grid-template-columns:1fr}.detail-copy h1{font-size:2.25rem} }
@media (max-width: 520px) { .detail-shell{width:min(100% - 1rem,1160px);margin-top:.5rem}.detail-nav{border-radius:14px}.detail-metrics,.detail-definition-grid{grid-template-columns:1fr 1fr}.sale-history-list article{grid-template-columns:58px 1fr}.sale-history-list img{width:58px;height:58px}.sale-history-action{grid-column:2}.detail-copy{padding:1.15rem}.detail-panel{padding:1rem} }
@media (prefers-reduced-motion: reduce) { *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important} }
