.archive-page{
  --archive-row-bg:rgba(20,24,30,.04);
  --archive-row-hover:rgba(20,24,30,.078);
  --archive-green-hover:#0f6841;
  padding-bottom:42px;
}
.archive-wrap{max-width:900px}
.archive-hero{padding:48px 0 20px}
.archive-back{
  display:inline-block;margin-bottom:30px;padding:5px 0;
  color:var(--muted);font-size:13px;font-weight:600;
  transition:color .2s ease;
}
.archive-back:hover{color:var(--green)}
.archive-eyebrow{
  margin:0 0 8px;color:var(--green);font-size:12px;font-weight:800;
  letter-spacing:1.8px;
}
.archive-hero h1{
  margin:0;font-size:clamp(38px,4.2vw,43.4px);font-weight:800;
  line-height:1.02;letter-spacing:-2px;
}
.archive-content{padding:0 0 12px}
.archive-panel{
  overflow:hidden;padding:16px;border:1px solid var(--line);
  border-radius:18px;background:var(--panel-2);
  box-shadow:0 8px 26px rgba(20,24,30,.06);
}
.archive-list{display:grid;gap:9px;margin:0;padding:0;list-style:none}
.archive-item{min-width:0}
.archive-row{
  display:grid;grid-template-columns:42px minmax(0,1fr) max-content;
  align-items:start;padding:8px 18px 8px 16px;
  border-left:4px solid var(--green);border-radius:11px;
  background:var(--archive-row-bg);color:inherit;
  transition:transform .2s ease,box-shadow .2s ease,background-color .2s ease,border-color .2s ease;
}
.archive-row:hover{
  transform:translateX(2px);border-left-color:var(--archive-green-hover);
  background:var(--archive-row-hover);box-shadow:0 6px 16px var(--shadow);
}
.archive-number{
  padding-top:12px;color:var(--soft);font-size:12px;font-weight:800;
  font-variant-numeric:tabular-nums;
}
.archive-copy{min-width:0;padding:9px 0}
.archive-link{
  display:block;color:var(--text);font-size:17px;font-weight:750;
  line-height:1.25;
}
.archive-summary{margin:4px 0 0;color:var(--muted);font-size:13.5px;line-height:1.45}
.archive-reading-time{
  padding:13px 0 0 20px;color:var(--soft);font-size:12px;
  line-height:1.35;white-space:nowrap;
}
html[data-theme="dark"] .archive-page{
  --archive-row-bg:rgba(255,255,255,.055);
  --archive-row-hover:rgba(255,255,255,.10);
  --archive-green-hover:#31a873;
}
html[data-theme="dark"] .archive-panel{box-shadow:0 8px 28px rgba(0,0,0,.24)}

@media (max-width:640px){
  .archive-page{padding-bottom:26px}
  .archive-hero{padding:34px 0 16px}
  .archive-back{margin-bottom:22px}
  .archive-panel{padding:11px;border-radius:15px}
  .archive-row{grid-template-columns:32px minmax(0,1fr);padding:7px 13px 9px 12px}
  .archive-number{padding-top:11px}
  .archive-reading-time{grid-column:2;padding:0 0 8px;color:var(--soft)}
}

@media (max-width:420px){
  .archive-hero h1{letter-spacing:-1.4px}
  .archive-link{font-size:16px}
  .archive-summary{font-size:13px}
}

@media (prefers-reduced-motion:reduce){
  .archive-row{transition:none}
  .archive-row:hover{transform:none}
}