.timeline-layout{max-width:820px;margin:0 auto;padding:calc(var(--mb) + 60px) 36px 90px;min-height:calc(100svh - 90px)}.timeline-year{scroll-margin-top:calc(var(--mb) + 30px);margin-bottom:65px}.timeline-year>h2{font:400 32px/1.2 'Inter Tight',Inter,sans-serif;letter-spacing:-.8px;margin:0 0 30px}.timeline-track{border-left:1px solid var(--line);padding-left:30px}.timeline-month{font:500 .875rem/1.5 Inter,sans-serif;letter-spacing:1.5px;text-transform:uppercase;color:var(--muted);margin:38px 0 24px}.timeline-month:first-child{margin-top:0}.timeline-entry{position:relative;display:grid;grid-template-columns:44px minmax(0,1fr);gap:18px;margin-bottom:42px}.timeline-entry::before{content:'';position:absolute;left:-34px;top:7px;width:7px;height:7px;background:var(--bg);border:1px solid var(--dim);border-radius:50%}.timeline-day{font:.875rem/1.5 Inter,sans-serif;color:var(--muted);display:flex;flex-direction:column;align-items:flex-start}.timeline-day span:first-child{font-size:18px;color:var(--ink)}.timeline-undated{padding-top:0;font-size:16px}.timeline-card{display:block;position:relative;padding:0 25px 30px 0;border-bottom:1px solid var(--line)}.timeline-kind{display:block;font:.875rem/1.5 Inter,sans-serif;letter-spacing:1px;text-transform:uppercase;color:var(--muted);margin:0 0 14px}.timeline-card h3{font:400 clamp(24px,3vw,32px)/1.25 'Inter Tight',Inter,sans-serif;letter-spacing:-.5px;margin:0 0 16px;overflow-wrap:anywhere}.timeline-excerpt{font:400 1rem/1.85 Literata,Georgia,serif;margin:0;color:var(--muted)}.timeline-open{position:absolute;right:0;top:0;font-size:19px;transition:transform .2s}.timeline-card:hover .timeline-open{transform:translate(3px,-3px)}.timeline-card:hover h3{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:5px}.work-detail{max-width:1000px;margin:auto;padding:calc(var(--mb) + 50px) 36px 70px;min-height:calc(100svh - 90px)}.timeline-back{display:inline-block;padding-block:8px;font-size:.875rem;color:var(--muted)}.work-detail header{margin:45px 0 30px}.work-meta{font-size:.875rem;color:var(--muted)}.work-detail h1{font:400 38px/1.2 'Inter Tight',Inter,sans-serif;letter-spacing:-1px}.work-detail figure{margin:0}.work-detail figcaption{font-size:.875rem;line-height:1.7;color:var(--muted);margin-top:15px}.gallery-canvas~.site-footer{position:static}.timeline-layout~.site-footer{position:static}
@media(max-width:700px){.timeline-layout{padding:calc(var(--mb) + 36px) 6% 45px}.timeline-year>h2{font-size:28px}.timeline-track{padding-left:20px}.timeline-entry{grid-template-columns:30px minmax(0,1fr);gap:12px;margin-bottom:30px}.timeline-entry::before{left:-24px}.timeline-card{padding-right:20px}.timeline-card h3{font-size:25px}.timeline-excerpt{font-size:13px}.work-detail{padding:calc(var(--mb) + 35px) 6% 45px}.work-detail h1{font-size:30px}}
.timeline-entry-content{min-width:0;border-bottom:1px solid var(--line);padding-bottom:24px}.timeline-entry-content .timeline-card{border-bottom:0;padding-bottom:15px}.entry-metadata{display:flex;flex-direction:column;gap:9px;font:.875rem/1.6 Inter,sans-serif;color:var(--muted)}.entry-tags{display:flex;gap:7px 12px;flex-wrap:wrap}.entry-tag:hover,.entry-tag:focus-visible{color:var(--ink);text-decoration:underline;text-underline-offset:3px}#filter-empty{font:14px/1.8 Inter,sans-serif;color:var(--muted);padding:25px 0}
@media(max-width:700px){.entry-metadata{font-size:.875rem}}

/* Images: box has the image's exact ratio (no layout shift), a blurred tiny preview, then the real file fades in. */
.timeline-image,.work-image{position:relative;overflow:hidden;aspect-ratio:var(--r);background:color-mix(in srgb,var(--ink) 5%,var(--bg))}
.timeline-image{width:min(100%,calc(560px * var(--r)));margin:0 0 20px}
.work-image{width:min(100%,calc(80svh * var(--r)))}
.timeline-image::before,.work-image::before,.mosaic-tile::before{content:'';position:absolute;inset:0;background:var(--lqip) center/cover;filter:blur(18px);transform:scale(1.15)}
.timeline-image picture,.work-image picture,.mosaic-tile picture{position:relative;display:block;width:100%;height:100%}
.timeline-image img,.work-image img,.mosaic-tile img{display:block;width:100%;height:100%;object-fit:cover}
.js .timeline-image img,.js .work-image img,.js .mosaic-tile img{opacity:0;transition:opacity .45s ease}
.js .timeline-image img.is-loaded,.js .work-image img.is-loaded,.js .mosaic-tile img.is-loaded{opacity:1}
.timeline-card:hover .timeline-image img,.timeline-card:hover .mosaic-tile img{opacity:.92}
@media(prefers-reduced-motion:reduce){.js .timeline-image img,.js .work-image img{transition:none}}
.timeline-year[hidden],.timeline-month[hidden]{display:none}

/* ---- Filters: big kind tabs + chips ------------------------------------- */
.filters{margin:0 0 64px}
.kind-tabs{display:flex;gap:6px 34px;flex-wrap:wrap;align-items:baseline}
.kind-tab{display:inline-flex;align-items:flex-start;padding:4px 0 8px;font:400 clamp(30px,4.8vw,46px)/1.1 'Inter Tight',Inter,sans-serif;letter-spacing:-.035em;color:var(--muted);white-space:nowrap;transition:color .2s}
.kind-tab span{background:linear-gradient(currentColor,currentColor) 0 100%/0 2px no-repeat;padding-bottom:6px;transition:background-size .3s cubic-bezier(.2,.7,.2,1)}
.kind-tab sup{font:500 .875rem Inter,sans-serif;letter-spacing:0;margin:4px 0 0 5px;color:var(--muted)}
.kind-tab:hover{color:var(--ink)}
.kind-tab[aria-current]{color:var(--ink)}.kind-tab.is-empty{color:var(--muted)}
.kind-tab[aria-current] span{background-size:100% 2px}
.chips{display:none;flex-wrap:wrap;gap:8px;margin-top:22px}
.js .chips{display:flex}
.chip{flex:none;min-height:44px;padding:0 14px;border:1px solid var(--line);border-radius:999px;background:transparent;color:var(--muted);font:.875rem/1.4 Inter,sans-serif;cursor:pointer;white-space:nowrap;transition:color .15s,border-color .15s,background .15s,opacity .15s}
.chip:hover{color:var(--ink);border-color:var(--muted)}
.chip[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:var(--bg)}
.chip[aria-pressed="true"]::after{content:' ×';opacity:.7}
.chip:disabled{opacity:.35;cursor:default;border-color:var(--line);color:var(--muted)}
.chip-person{font-style:italic;font-family:Georgia,'Times New Roman',serif;font-size:.875rem}
.kind-tab:focus-visible,.chip:focus-visible{outline:2px solid var(--ink);outline-offset:3px}
@media(prefers-reduced-motion:reduce){.kind-tab span{transition:none}}

/* ---- Image groups --------------------------------------------------------- */
.mosaic{position:relative;display:grid;gap:3px;aspect-ratio:3/2;margin:0 0 20px}
.mosaic-2{grid-template-columns:1fr 1fr}
.mosaic-3{grid-template-columns:2fr 1fr;grid-template-rows:1fr 1fr}
.mosaic-3 .mosaic-tile:first-child{grid-row:1/3}
.mosaic-tile{position:relative;overflow:hidden;min-height:0;background:color-mix(in srgb,var(--ink) 5%,var(--bg))}
.mosaic-more{position:absolute;right:0;bottom:0;width:calc((100% - 3px)/3);height:calc((100% - 3px)/2);display:flex;align-items:center;justify-content:center;background:rgb(0 0 0 / .65);color:#fff;font:400 22px 'Inter Tight',Inter,sans-serif;letter-spacing:-.02em;pointer-events:none}
.work-text{font:400 1rem/1.8 Literata,Georgia,serif;color:var(--muted);max-width:620px;margin:0 0 18px}
.work-figures{display:flex;flex-direction:column;gap:46px}
.work-figure{margin:0}
.work-zoom{display:block;width:100%;cursor:zoom-in}
.work-figure figcaption{font-size:.875rem;line-height:1.7;color:var(--muted);margin-top:12px}

/* ---- Full-screen viewer (swipe = native scroll snapping) ------------------- */
.viewer{position:fixed;inset:0;width:100%;height:100%;max-width:none;max-height:none;margin:0;padding:0;border:0;background:#0b0b0b;color:#e8e8e6}
.viewer::backdrop{background:#0b0b0b}
.viewer-track{display:flex;width:100%;height:100%;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;overscroll-behavior:contain;scrollbar-width:none}
.viewer-track::-webkit-scrollbar{display:none}
.viewer-slide{flex:0 0 100%;height:100%;scroll-snap-align:center;scroll-snap-stop:always;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:56px 16px 64px;box-sizing:border-box}
.viewer-slide picture{display:contents}
.viewer-slide img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;min-height:0}
.viewer-caption{font:.875rem/1.6 Inter,sans-serif;color:#9a9a98;margin:14px 0 0;text-align:center}
.viewer-bar{position:absolute;top:0;left:0;right:0;display:flex;justify-content:space-between;align-items:center;padding:12px 16px;font:.875rem Inter,sans-serif;color:#9a9a98;pointer-events:none}
.viewer-bar button,.viewer-nav{pointer-events:auto;background:none;border:0;color:#e8e8e6;cursor:pointer;font:300 28px/1 Inter,sans-serif;min-width:44px;min-height:44px}
.viewer-nav{position:absolute;top:50%;transform:translateY(-50%);font-size:34px;opacity:.6}
.viewer-nav:hover{opacity:1}.viewer-prev{left:8px}.viewer-next{right:8px}
.viewer-nav[disabled]{opacity:0;pointer-events:none}
.viewer-dots{position:absolute;left:0;right:0;bottom:22px;display:flex;justify-content:center;gap:7px;pointer-events:none}
.viewer-dots span{width:5px;height:5px;border-radius:50%;background:#555}
.viewer-dots span.is-on{background:#e8e8e6}
html.viewer-open{overflow:hidden}
@media(hover:none){.viewer-nav{display:none}}

/* ---- Phone: one column, date inline, images use the full width ------------ */
@media(max-width:700px){
  .timeline-layout{padding:calc(var(--mb) + 34px) 20px 40px}
  .filters{margin-bottom:40px}
  /* Tabs and chips swipe sideways instead of wrapping, bleeding to the screen edge. */
  .kind-tabs,.chips{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin-inline:-20px;padding-inline:20px;scroll-padding-inline:20px}
  .kind-tabs::-webkit-scrollbar,.chips::-webkit-scrollbar{display:none}
  .kind-tabs{gap:0 4.2vw}
  .kind-tab{font-size:clamp(20px,6.1vw,34px)}
  .kind-tab sup{margin-left:3px;font-size:.875rem}
  .chips{margin-top:16px;-webkit-mask-image:linear-gradient(90deg,transparent,#000 20px,#000 calc(100% - 32px),transparent);mask-image:linear-gradient(90deg,transparent,#000 20px,#000 calc(100% - 32px),transparent)}
  .chip{min-height:44px}
  .timeline-year{margin-bottom:40px}
  .timeline-year>h2{font-size:15px;font-weight:500;letter-spacing:0;margin:0 0 6px;color:var(--muted)}
  .timeline-track{border-left:0;padding-left:0}
  .timeline-month{display:none}
  .timeline-entry{display:block;margin:0;padding:22px 0 0}
  .timeline-entry::before{display:none}
  .timeline-day{flex-direction:row;gap:5px;align-items:baseline;font-size:.875rem;letter-spacing:1px;text-transform:uppercase;margin-bottom:10px;float:left}
  .timeline-day span:first-child{font-size:.875rem;color:var(--muted)}
  .timeline-day::after{content:'·';margin:0 5px 0 1px}
  .timeline-kind{margin:0 0 12px;line-height:1.5}
  .timeline-card{padding-right:28px}
  .timeline-card h3{font-size:25px;margin-bottom:12px}
  .timeline-excerpt{font-size:1rem;line-height:1.75}
  .timeline-image{width:100%;max-height:none;margin:0 0 16px}
  .timeline-entry-content{padding-bottom:18px}
  .timeline-card .timeline-image{clear:both;width:calc(100% + 28px)}
  .entry-metadata{gap:2px;font-size:.875rem}
  .entry-tags{gap:0 16px}
  .entry-tag{display:inline-block;padding:8px 0}
  .work-detail{padding:calc(var(--mb) + 28px) 20px 40px}
  .work-detail header{margin:28px 0 22px}
  .work-image{width:100%}
  .work-figures{gap:30px}
  .work-figures.is-group .work-figure{margin-inline:-20px}
  .work-figures.is-group figcaption{padding-inline:20px}
  .mosaic{margin-right:-28px}
}

.viewer button:focus-visible{outline-color:currentColor}