.plate{border:1px solid var(--rule);background:var(--surface-raised);box-shadow:0 18px 50px -24px color-mix(in srgb, var(--ink) 40%, transparent);pointer-events:none;-webkit-user-select:none;user-select:none;max-width:max(40rem,260svh - 52rem);margin-inline:auto;padding:.75rem .75rem 0;position:relative}.plate:before{content:"";border:1px solid color-mix(in srgb, var(--rule) 55%, transparent);pointer-events:none;position:absolute;inset:4px}.plate__map{aspect-ratio:360/136;background:color-mix(in srgb, var(--paper-aged) 35%, var(--surface));position:relative;overflow:hidden}.plate__svg{width:100%;height:100%;position:absolute;inset:0}.plate__frame{fill:color-mix(in srgb, var(--paper) 70%, transparent);stroke:color-mix(in srgb, var(--ink) 50%, transparent);stroke-width:1px;vector-effect:non-scaling-stroke;opacity:0;animation-name:plate-cycle;animation-timing-function:ease-in-out;animation-iteration-count:infinite}.plate__years{font-family:var(--font-display);letter-spacing:.04em;color:var(--accent);margin:0;font-size:clamp(1.5rem,3.4vw,2.75rem);line-height:1;display:grid;position:absolute;bottom:clamp(.5rem,2vw,1.25rem);left:clamp(.75rem,2.5vw,1.75rem)}.plate__year{opacity:0;grid-area:1/1;animation-name:plate-cycle;animation-timing-function:ease-in-out;animation-iteration-count:infinite}.plate__pin{--face:clamp(28px, 3.2vw, 46px);--lift:calc(var(--face) / -2);transform:translate(-50%, var(--lift));opacity:0;flex-direction:column;align-items:center;gap:.2rem;animation-name:pin-cycle;animation-timing-function:ease-out;animation-iteration-count:infinite;display:flex;position:absolute}.plate__face{width:var(--face);height:var(--face);border:2px solid var(--accent);object-fit:cover;object-position:50% 20%;background:var(--paper-aged);box-shadow:0 0 0 2px var(--surface-raised), 0 4px 12px -2px color-mix(in srgb, var(--ink) 45%, transparent);border-radius:50%;display:block}.plate__name{background:color-mix(in srgb, var(--surface-raised) 88%, transparent);font-family:var(--font-ui);white-space:nowrap;color:var(--ink);border-radius:2px;padding:.05rem .4rem;font-size:.68rem;font-weight:500}.plate__timeline{font-family:var(--font-ui);letter-spacing:.08em;text-transform:uppercase;color:var(--ink-faint);align-items:center;gap:.9rem;padding:.8rem .5rem .9rem;font-size:.7rem;display:flex}.plate__end{flex:none}.plate__rule{background:var(--rule);flex:1;height:2px;position:relative}.plate__tick{background:var(--ink-faint);width:1px;height:10px;position:absolute;top:50%;transform:translate(-50%,-50%)}.plate__marker{top:50%;left:var(--at-0);border:2px solid var(--surface-raised);background:var(--accent);width:14px;height:14px;box-shadow:0 0 0 1px var(--accent);border-radius:50%;animation-name:plate-scrub;animation-timing-function:ease-in-out;animation-iteration-count:infinite;position:absolute;transform:translate(-50%,-50%)}@keyframes plate-cycle{0%{opacity:0}5%{opacity:1}33%{opacity:1}38%{opacity:0}to{opacity:0}}@keyframes pin-cycle{0%{opacity:0;transform:translate(-50%, calc(var(--lift) + 10px)) scale(.6)}3%{opacity:1;transform:translate(-50%, var(--lift)) scale(1.06)}5%{opacity:1;transform:translate(-50%, var(--lift)) scale(1)}25%{opacity:1;transform:translate(-50%, var(--lift)) scale(1)}29%{opacity:0;transform:translate(-50%, var(--lift)) scale(.9)}to{opacity:0}}@keyframes plate-scrub{0%,30%{left:var(--at-0)}36%,63%{left:var(--at-1)}69%,96%{left:var(--at-2)}to{left:var(--at-0)}}@media (prefers-reduced-motion:reduce){.plate__frame,.plate__year,.plate__pin,.plate__marker{animation:none}.plate__frame:first-of-type,.plate__year:first-of-type,.plate__pin[data-frame="0"]{opacity:1}}@media not (min-width:40rem){.plate__name{display:none}}