.archive-controls { display:flex; align-items:flex-end; gap:28px; margin:0; }
.archive-controls[hidden], .archive-status[hidden] { display:none; }
.archive-search { flex:1; min-width:0; }
.archive-controls input, .archive-controls select { display:block; box-sizing:border-box; height:52px; margin:0; font:inherit; font-size:18px; line-height:1.4; color:var(--ink); background:transparent; border:0; border-bottom:1px solid var(--control-rule); border-radius:0; padding:12px 0; width:100%; }
.archive-controls select { padding-right:24px; cursor:pointer; }
.archive-controls input::placeholder { color:var(--muted); opacity:1; }
.archive-controls input:focus-visible, .archive-controls select:focus-visible { outline:2px solid var(--accent); outline-offset:4px; }
.archive-status { font-size:16px; color:var(--muted); margin:-28px 0 0; }
.archive-list:focus { outline:none; }
.archive-empty { color:var(--muted); }
.topic-browse, .topic-count { margin:12px 0 0; color:var(--muted); font-size:16px; }
.topic-browse a, .topic-list a { text-decoration:none; }
.topic-browse a:hover, .topic-list a:hover { text-decoration:underline; text-underline-offset:5px; }
.topic-list { list-style:none; padding:0; margin:0; display:grid; gap:34px; }
.topic-title { display:flex; align-items:baseline; justify-content:space-between; gap:24px; }
.topic-title h2 { margin:0; font-size:var(--type-body, 24px); font-weight:400; }
.topic-list p { margin:5px 0 0; color:var(--muted); font-size:19px; line-height:1.5; }
.topic-title .archive-meta { white-space:nowrap; }
.topic-list a:focus-visible, .topic-browse a:focus-visible { outline:2px solid var(--accent); outline-offset:4px; }
.archive-pagination a { text-decoration:none; }
.archive-pagination[hidden] { display:none; }
.writing-formats { display:flex; gap:24px; margin-bottom:-32px; font-size:18px; }
.writing-formats[hidden] { display:none; }
.writing-formats a { color:var(--muted); text-decoration:none; }
.writing-formats a[aria-current], .writing-formats a:hover { color:var(--ink); text-decoration:underline; text-underline-offset:6px; }
.archive-pagination a:hover { text-decoration:underline; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
@media(max-width:480px) { .archive-controls { gap:18px; align-items:stretch; } .archive-controls input,.archive-controls select { font-size:16px; } .archive-controls select { max-width:140px; } }