.archive-page{--archive-line: color-mix(in oklch, var(--surface1) 72%, var(--text));--archive-muted: color-mix(in oklch, var(--subtext1) 78%, var(--base));--archive-accent: var(--lavender);--archive-rail-width: 5rem;display:grid;gap:1.5rem;padding:1.25em 1.25rem 0;@media(max-width:720px){gap:1.25rem}@media(max-width:480px){padding:1rem .875rem 0}}.archive-hero{position:relative;display:grid;gap:.6rem;padding-bottom:1.5rem;border-bottom:1px solid var(--archive-line);&:after{content:"";position:absolute;bottom:-5px;left:0;right:0;height:2.5px;background:color-mix(in oklch,var(--text) 50%,var(--base))}}.archive-hero__eyebrow{display:flex;flex-wrap:wrap;align-items:baseline;gap:.5rem;margin:0;color:var(--archive-muted);font-family:var(--font-mono);font-size:.68rem;font-weight:600;letter-spacing:.18em;text-transform:uppercase}.archive-hero__roman{position:absolute;right:0;bottom:1.5rem;color:var(--text);font-family:var(--font-serif);font-size:4.5rem;font-weight:400;letter-spacing:.02em;opacity:.06;line-height:1;pointer-events:none;user-select:none;@media(max-width:720px){font-size:4rem}@media(max-width:480px){font-size:2rem;opacity:.04}}.archive-hero__sep{opacity:.3}.archive-hero__title{margin:0;color:var(--text);font-family:var(--font-serif);font-style:italic;font-synthesis:none;font-size:3rem;font-weight:500;line-height:1;letter-spacing:-.02em;position:relative;z-index:1;@media(max-width:480px){font-size:2.1rem}}.archive-rail{position:fixed;top:50%;left:max(1.25rem,calc((100vw - 50em) / 2 - var(--archive-rail-width) - .5rem));transform:translateY(-50%);z-index:20;pointer-events:none;@media(max-width:1023px){display:none}}.archive-rail__list{display:grid;gap:.4rem;margin:0;padding:0;list-style:none;text-align:left;pointer-events:auto}.archive-rail__link{display:inline-block;padding:.1rem 0;color:var(--archive-muted);font-family:var(--font-mono);font-size:.72rem;font-variant-numeric:tabular-nums;letter-spacing:.08em;text-decoration:none;opacity:.6;transition:color .16s ease,opacity .16s ease;&:hover,&:focus-visible{color:var(--text);opacity:1}&:focus-visible{outline:2px solid color-mix(in oklch,var(--archive-accent) 70%,transparent);outline-offset:3px;border-radius:2px}}.archive-era{display:flex;align-items:baseline;justify-content:center;gap:.85rem;margin:1.5rem 0 .25rem;padding-top:.25rem;color:var(--archive-muted);font-family:var(--font-mono);font-size:.76rem;letter-spacing:.22em;text-transform:uppercase;scroll-margin-top:4.5rem;&:first-child{margin-top:0}@media(max-width:720px){margin-top:1.1rem}}.archive-era__mark{flex:0 0 auto;color:var(--archive-accent);opacity:.7}.archive-era__roman{flex:0 0 auto;color:var(--text);font-family:var(--font-serif);font-size:.9rem;letter-spacing:.28em}.archive-era__year{flex:0 0 auto;color:var(--archive-muted);font-size:.66rem;font-variant-numeric:tabular-nums;letter-spacing:.18em;opacity:.55}.archive-stack{display:grid;gap:1.35rem}.archive-group{--archive-accent: var(--lavender);position:relative;content-visibility:auto;contain-intrinsic-size:auto 18rem;padding:1.1rem 0 0;.archive-era+&{border-top:none;padding-top:.35rem}&.spring{--archive-accent: var(--peach)}&.summer{--archive-accent: var(--green)}&.autumn{--archive-accent: var(--red)}&.winter{--archive-accent: var(--blue)}}.archive-group__header{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:1rem;align-items:baseline;margin-bottom:.85rem;@media(max-width:480px){gap:.6rem}}.archive-group__title{margin:0;color:var(--archive-accent);font-family:var(--font-serif);font-style:italic;font-size:1.7rem;line-height:1.08;letter-spacing:0;padding-inline:.2rem}.archive-group__count{align-self:baseline;color:var(--archive-muted);font-family:var(--font-serif);font-variant-numeric:oldstyle-nums}.timeline{position:relative;display:grid;gap:.15rem;padding-left:1.25rem}.archive-item{position:relative;text-align:left;>div{display:grid;grid-template-columns:4.9rem minmax(0,1fr);gap:.85rem;align-items:baseline;padding:.55rem .35rem .55rem 0;@media(max-width:480px){grid-template-columns:1fr;gap:.1rem;padding:.7rem .5rem .7rem 0}}+&{border-top:.5px solid color-mix(in oklch,var(--surface0) 80%,transparent)}}.archive-popup{--popup-accent: var(--archive-accent);position:absolute;z-index:100;contain:layout style;width:min(20rem,calc(100vw - 2rem));padding:.85rem 1rem .9rem;opacity:0;pointer-events:none;transform:translate(-4px);&[data-placement=right]{width:14rem}&[data-placement=below],&[data-placement=above]{transform:translateY(-3px);border:1px dashed var(--surface0);border-radius:5px}&.is-open{opacity:1;pointer-events:auto;transform:translate(0);background:var(--mantle);transition:opacity .14s ease,transform .18s cubic-bezier(.22,1,.36,1)}@media(hover:none),(max-width:720px){display:none!important}}.archive-popup__eyebrow{display:flex;flex-wrap:wrap;align-items:baseline;margin:0 0 .5rem;padding-bottom:.45rem;border-bottom:.5px solid color-mix(in oklch,var(--surface1) 65%,transparent);color:var(--archive-muted);font-family:var(--font-mono);font-size:.68rem;letter-spacing:.08em;text-transform:uppercase}.archive-popup__index{color:color-mix(in oklch,var(--popup-accent) 80%,var(--text));font-weight:600}.archive-popup__sep{margin:0 .4em;opacity:.4}.archive-popup__excerpt{margin:0;color:var(--archive-muted);font-family:var(--font-serif);font-size:.88rem;line-height:1.55;:where(p,ul,ol){margin:0 0 .35em;&:last-child{margin-bottom:0}}:where(img,video,iframe,figure,pre){display:none}}.article-meta{margin:0;color:var(--archive-muted);font-family:var(--font-mono);font-size:.78rem;font-variant-numeric:tabular-nums;line-height:1.4;white-space:nowrap;@media(max-width:480px){white-space:normal}}a.archive-title{color:var(--text);font-family:var(--font-serif);font-size:1.02rem;font-weight:500;line-height:1.45;overflow-wrap:anywhere;text-decoration:none;text-decoration-color:transparent;text-decoration-thickness:1px;text-underline-offset:.28em;transition:color .14s ease,text-decoration-color .14s ease;&:hover,&:focus-visible{color:var(--archive-accent);text-decoration-color:currentColor}&:focus-visible{outline:2px solid color-mix(in oklch,var(--archive-accent) 70%,transparent);outline-offset:3px;border-radius:3px}}
