/* V14: the same slide, spring and magnetic language as the homepage. */
.archive-list { position:relative; isolation:isolate; }
.archive-row {
  --cover-rest:-2deg; --cover-lift:-3deg;
  position:relative; grid-template-columns:24px 64px minmax(0,1fr) 160px 86px 40px;
  gap:20px; min-height:116px; padding:17px 0; isolation:isolate;
  color:var(--ink); user-select:none; -webkit-user-select:none; transition:color .25s ease;
}
.archive-row:nth-child(even) { --cover-rest:2deg; --cover-lift:3deg; }
.archive-row::before {
  content:""; position:absolute; inset:0 -18px; z-index:-1;
  background:var(--project-soft); opacity:0;
  clip-path:inset(100% 0 0 round 30% 30% 0 0);
  transition:opacity .3s,clip-path var(--motion-time) var(--motion-ease);
}
.archive-row:hover { padding:17px 0; color:var(--ink); }
.archive-row:is(.is-archive-active,:focus-visible) { z-index:2; }
.archive-row:is(.is-archive-active,:focus-visible)::before { opacity:.4; clip-path:inset(0 round 0); }
.archive-row:focus-visible { outline:2px solid var(--accent); outline-offset:5px; }
.archive-number { display:block; font:10px var(--mono); color:var(--muted); }
.archive-symbol { position:relative; display:grid; place-items:center; width:64px; height:64px; perspective:500px; }
.archive-symbol::before {
  content:""; position:absolute; inset:5px; border-radius:50%; background:var(--project-soft);
  transform:scale(.88); transition:transform .6s var(--motion-settle),opacity .4s;
}
.archive-symbol::after {
  content:""; position:absolute; left:15px; right:15px; bottom:6px; height:6px;
  border-radius:50%; background:var(--project-color); filter:blur(4px);
  opacity:0; transform:scale(.5); transition:transform .6s var(--motion-settle),opacity .4s;
}
.archive-symbol-art {
  position:relative; z-index:1; display:block; width:43px; height:43px;
  filter:drop-shadow(0 3px 2px #0000000a);
  transform:translate3d(0,0,0); transition:transform .62s var(--motion-settle),filter .5s;
}
.archive-symbol-art :is(svg,img) { display:block; width:100%; height:100%; object-fit:contain; transform:translate3d(0,0,0); transition:transform .6s var(--motion-settle); }
.archive-symbol i { position:absolute; right:3px; top:7px; width:5px; height:5px; border-radius:50%; background:var(--project-color); opacity:0; transform:translate(-8px,10px) scale(.4); transition:opacity .3s,transform .6s var(--motion-settle); }
.archive-row:is(.is-archive-active,:focus-visible) .archive-symbol::before { transform:scale(1.04); opacity:.65; }
.archive-row:is(.is-archive-active,:focus-visible) .archive-symbol::after { opacity:.22; transform:scale(1); }
.archive-row:is(.is-archive-active,:focus-visible) .archive-symbol-art {
  transform:translateY(-5px) rotate(-4deg) scale(1.1);
  filter:drop-shadow(0 8px 5px #00000017);
}
.archive-row:is(.is-archive-active,:focus-visible) .archive-symbol i { opacity:.75; transform:translate(0,-3px) scale(1); }
.archive-text { display:flex; flex-direction:column; align-items:flex-start; justify-content:center; gap:8px; min-width:0; transition:transform .5s var(--motion-ease); }
.archive-title { position:relative; display:block; overflow:hidden; font-size:clamp(17px,1.55vw,24px); line-height:1.35; font-weight:500; letter-spacing:-.02em; overflow-wrap:anywhere; }
.archive-title>span { display:block; transition:transform var(--motion-time) var(--motion-ease); }
.archive-title>span+span { position:absolute; inset:0; transform:translateY(110%); }
.archive-row:is(.is-archive-active,:focus-visible) .archive-title>span { transform:translateY(-110%); }
.archive-row:is(.is-archive-active,:focus-visible) .archive-title>span+span { transform:translateY(0); }
.archive-summary { display:block; margin:0; font-size:12px; line-height:1.65; color:var(--muted); }
.archive-row:is(.is-archive-active,:focus-visible) .archive-text { transform:translateX(4px); }
.archive-preview {
  position:relative; justify-self:center; display:block; width:114px; height:70px;
  pointer-events:none; perspective:650px; transform:rotate(var(--cover-rest));
  transition:transform .62s var(--motion-settle);
}
.archive-preview-picture {
  display:block; position:absolute; inset:0; overflow:hidden; background:var(--surface);
  border:3px solid var(--surface); border-radius:4px; box-shadow:0 3px 9px #00000014;
  transform:translate3d(0,0,0); transition:transform .6s var(--motion-settle),box-shadow .5s;
}
.archive-preview-picture::after {
  content:""; position:absolute; inset:0; pointer-events:none; opacity:0;
  background:radial-gradient(100px circle at var(--archive-light-x,50%) var(--archive-light-y,45%),#ffffff28,transparent 76%);
  transition:opacity .4s;
}
.archive-preview-picture img { display:block; width:100%; height:100%; object-fit:cover; transform:scale(1.015); transition:transform .65s var(--motion-settle); }
.archive-preview-picture .cover-media-label { font-size:7px; padding:3px 5px; left:auto; right:4px; bottom:4px; }
.archive-preview-caption { position:absolute; bottom:7px; left:9px; font-size:7px; color:#fff; padding:3px 5px; background:#111b; opacity:0; transform:translateY(4px); transition:opacity .22s,transform .45s var(--motion-ease); }
.archive-row:is(.is-archive-active,:focus-visible) .archive-preview { transform:translateY(-6px) rotate(var(--cover-lift)) scale(1.32); }
.archive-row:is(.is-archive-active,:focus-visible) .archive-preview-picture {
  transform:translate3d(var(--archive-x,0px),var(--archive-y,0px),0) rotateX(var(--archive-rx,0deg)) rotateY(var(--archive-ry,0deg));
  box-shadow:0 16px 22px -10px #00000038,0 4px 8px #00000014;
}
.archive-row:is(.is-archive-active,:focus-visible) .archive-preview-picture img { transform:scale(1.045) translate(calc(var(--archive-x,0px) * -.16),calc(var(--archive-y,0px) * -.16)); }
.archive-row:is(.is-archive-active,:focus-visible) .archive-preview-picture::after { opacity:1; }
.archive-row:is(.is-archive-active,:focus-visible) .archive-preview-caption { opacity:1; transform:translateY(0); transition-delay:.08s; }
/* Entry/exit lives on the outer layer; the inner layer follows the cursor's spring. */
.archive-row.is-archive-active .archive-preview-picture { transition:box-shadow .5s; }
.archive-row.is-archive-active .archive-symbol-art :is(svg,img) { transform:translate3d(calc(var(--archive-x,0px) * .5),calc(var(--archive-y,0px) * .5),10px) rotateX(var(--archive-rx,0deg)) rotateY(var(--archive-ry,0deg)); transition:none; }
.archive-row.is-archive-active .archive-preview-picture img { transition:transform .12s linear; }
.archive-status { display:block; color:var(--muted); font-size:10px; justify-self:end; white-space:nowrap; }
.archive-arrow { position:relative; isolation:isolate; width:38px; height:38px; display:block; border:1px solid var(--line); border-radius:50%; overflow:hidden; color:var(--soft-ink); transition:color .3s,border-color .3s; }
.archive-arrow::before {
  content:""; position:absolute; z-index:-1; inset:-1px; background:var(--ink);
  border-radius:35% 35% 0 0; transform:translateY(105%);
  transition:transform var(--motion-time) var(--motion-ease),border-radius var(--motion-time);
}
.archive-arrow span { position:absolute; inset:0; display:grid; place-items:center; font-size:21px; transition:transform var(--motion-time) var(--motion-ease); }
.archive-arrow span+span { transform:translate(-115%,115%); }
.archive-row:is(.is-archive-active,:focus-visible) .archive-arrow { color:var(--bg); border-color:var(--ink); }
.archive-row:is(.is-archive-active,:focus-visible) .archive-arrow::before { transform:translateY(0); border-radius:0; }
.archive-row:is(.is-archive-active,:focus-visible) .archive-arrow span { transform:translate(115%,-115%); }
.archive-row:is(.is-archive-active,:focus-visible) .archive-arrow span+span { transform:translate(0,0); }
.archive-row:active .archive-preview { scale:.97; transition:scale .12s; }
.archive-expand { position:relative; isolation:isolate; overflow:hidden; padding:15px 22px; border:1px solid var(--accent-line); border-radius:40px; margin-top:38px; transition:color .3s,border-color .3s; }
.archive-expand::before { content:""; position:absolute; inset:0; z-index:-1; background:var(--ink); transform:translateY(105%); border-radius:35% 35% 0 0; transition:transform var(--motion-time) var(--motion-ease),border-radius var(--motion-time); }
.archive-expand:is(:hover,:focus-visible) { color:var(--bg); border-color:var(--ink); }
.archive-expand:is(:hover,:focus-visible)::before { transform:translateY(0); border-radius:0; }
:root[data-theme="dark"] .archive-symbol::before { opacity:.7; }
:root[data-theme="dark"] .archive-preview-picture { border-color:#343936; box-shadow:0 5px 12px #0007; }
@media(min-width:1600px) { .archive-row { grid-template-columns:28px 72px minmax(0,1fr) 200px 100px 42px; gap:25px; min-height:128px; } .archive-preview { width:128px; height:78px; } .archive-summary{font-size:13px} }
@media(max-width:1050px) {
  .archive-row { grid-template-columns:18px 58px minmax(0,1fr) 120px 36px; gap:16px; }
  .archive-status { display:none; }
  .archive-symbol { width:58px; height:58px; }
  .archive-preview { width:94px; height:62px; }
  .archive-row:is(.is-archive-active,:focus-visible) .archive-preview { transform:translateY(-4px) rotate(var(--cover-lift)) scale(1.22); }
}
@media(max-width:760px) {
  .archive-row { grid-template-columns:48px minmax(0,1fr) 64px; gap:14px; padding:18px 0; min-height:105px; }
  .archive-row:hover { padding:18px 0; }
  .archive-row::before { inset:0 -10px; }
  .archive-number,.archive-status,.archive-arrow { display:none; }
  .archive-symbol { width:48px; height:52px; }
  .archive-symbol::before { inset:3px 0; }
  .archive-symbol-art { width:36px; height:36px; }
  .archive-title { font-size:16px; }
  .archive-text { gap:5px; }
  .archive-summary { display:block; font-size:10px; margin:0; line-height:1.6; }
  .archive-preview { width:62px; height:53px; }
  .archive-preview-picture { border-width:2px; }
  .archive-preview-caption,.archive-preview .cover-media-label { display:none; }
  .archive-row:is(.is-archive-active,:focus-visible) .archive-text { transform:none; }
  .archive-row:is(.is-archive-active,:focus-visible) .archive-preview { transform:rotate(0) scale(1.06); }
}
@media(hover:none),(pointer:coarse),(prefers-reduced-motion:reduce) {
  .archive-row *, .archive-row::before, .archive-symbol::before, .archive-symbol::after, .archive-arrow::before, .archive-expand::before { transition:none!important; }
  .archive-row:is(.is-archive-active,:focus-visible) :is(.archive-symbol-art,.archive-symbol::before,.archive-symbol i,.archive-text,.archive-preview,.archive-preview-picture,.archive-preview-picture img) { transform:none; }
  .archive-row .archive-title>span { transform:none!important; }
  .archive-row .archive-title>span+span { display:none; }
  .archive-row:active .archive-preview { scale:1; }
  .archive-symbol::after,.archive-preview-picture::after { display:none; }
  .archive-row .archive-symbol-art :is(svg,img) { transform:none!important; }
}
