/* Phase 17 timeline */

.timeline-page{max-width:1500px;margin:0 auto;padding:48px clamp(18px,5vw,72px) 72px}
.timeline-hero{max-width:850px;margin-bottom:28px}
.timeline-hero h1{margin:.15em 0;font-size:clamp(2.8rem,6vw,5.6rem);line-height:.95}
.timeline-filters{display:grid;grid-template-columns:repeat(5,minmax(150px,1fr)) auto auto;gap:10px;align-items:end;margin-bottom:42px;padding:16px;background:#fff;border:1px solid #ddd6c9;border-radius:10px}
.timeline-filters label{display:grid;gap:5px;font-size:.8rem;font-weight:800}
.timeline-filters input,.timeline-filters select,.timeline-filters .button{min-height:44px}
.timeline-decade{margin-bottom:54px}
.timeline-decade-heading{display:flex;justify-content:center;margin-bottom:18px}
.timeline-decade-heading span{display:inline-flex;padding:10px 20px;border-radius:999px;background:var(--navy);color:#fff;font-family:Georgia,serif;font-size:1.4rem}
.timeline-track{position:relative;display:grid;gap:26px}
.timeline-track::before{content:"";position:absolute;top:0;bottom:0;left:50%;width:3px;transform:translateX(-50%);background:linear-gradient(var(--gold),#9d7220)}
.timeline-entry{position:relative;display:grid;grid-template-columns:1fr 90px 1fr;align-items:center;min-height:210px}
.timeline-entry.is-left .timeline-card{grid-column:1}
.timeline-entry.is-right .timeline-card{grid-column:3}
.timeline-year{grid-column:2;justify-self:center;align-self:start;margin-top:20px;padding:5px 8px;border-radius:5px;background:#f7f4ec;border:1px solid #d5c29a;font-weight:900;z-index:2}
.timeline-node{position:absolute;left:50%;top:92px;width:18px;height:18px;transform:translateX(-50%);border-radius:50%;background:var(--gold);border:4px solid var(--paper);box-shadow:0 0 0 2px #9d7220}
.timeline-card{display:grid;grid-template-columns:150px 1fr;gap:18px;align-items:center;padding:16px;border:1px solid #ddd6c9;border-radius:10px;background:#fff;color:inherit;text-decoration:none;box-shadow:0 10px 26px rgba(7,21,34,.08);transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
.timeline-card:hover,.timeline-card:focus-visible{transform:translateY(-3px);border-color:var(--gold);box-shadow:0 14px 32px rgba(7,21,34,.14)}
.timeline-cover{width:150px;aspect-ratio:2/3;display:grid;place-items:center;background:radial-gradient(circle at 50% 38%,#fff,#f1eadf 75%);border-radius:7px;overflow:hidden}
.timeline-cover img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 10px 12px rgba(7,21,34,.18))}
.timeline-cover-placeholder{width:78%;aspect-ratio:2/3;display:grid;place-items:center;padding:10px;text-align:center;background:var(--navy);color:#fff;border:1px solid var(--gold)}
.timeline-card h2{margin:.35em 0 .2em;font-size:1.55rem;line-height:1.1}
.timeline-badges{display:flex;flex-wrap:wrap;gap:6px}
.timeline-badge{display:inline-flex;padding:5px 8px;border-radius:999px;background:#e8e3d9;font-size:.66rem;font-weight:900;text-transform:uppercase;letter-spacing:.04em}
.timeline-badge.status-owned,.timeline-badge.verified{background:#dff0e4;color:#17602f}
.timeline-badge.status-missing{background:#f7dddd;color:#8a1717}
.timeline-badge.status-reference_only,.timeline-badge.pending{background:#f6e2c5;color:#7e4c00}
.timeline-badge.rare{background:#4b2354;color:#fff}
.timeline-taxonomy,.timeline-publisher{margin:.3em 0 0;color:#5b574f}
.timeline-empty{padding:52px 24px;text-align:center;background:#fff;border:1px solid #ddd6c9;border-radius:10px}
@media(max-width:1100px){.timeline-filters{grid-template-columns:repeat(3,minmax(150px,1fr))}}
@media(max-width:850px){.timeline-track::before{left:24px}.timeline-entry{grid-template-columns:48px 1fr;align-items:start}.timeline-entry.is-left .timeline-card,.timeline-entry.is-right .timeline-card{grid-column:2}.timeline-year{grid-column:1;justify-self:start;margin-top:18px;font-size:.72rem}.timeline-node{left:24px;top:78px}}
@media(max-width:650px){.timeline-page{padding:34px 14px 54px}.timeline-filters{grid-template-columns:1fr}.timeline-entry{grid-template-columns:38px 1fr}.timeline-track::before,.timeline-node{left:19px}.timeline-card{grid-template-columns:96px 1fr;gap:12px;padding:12px}.timeline-cover{width:96px}.timeline-card h2{font-size:1.2rem}}