.view-toggle { display: inline-flex; margin-left: 12px; border: 1px solid var(--border); border-radius: 100px; overflow: hidden; vertical-align: middle; }
.view-toggle button { padding: 9px 18px; font-size: 13px; font-weight: 500; font-family: inherit; border: none; background: var(--surface); color: var(--ink-3); cursor: pointer; transition: all .2s; }
.view-toggle button.active { background: var(--accent); color: #fff; }
.arch-year { font-family: 'Source Serif 4', 'Noto Serif SC', serif; font-size: 20px; font-weight: 700; color: var(--accent); margin: 26px 0 6px; }
.arch-item { display: flex; align-items: baseline; gap: 14px; padding: 8px 4px; border-bottom: 1px dashed var(--border-light); }
.arch-item:hover { background: var(--bg-alt); }
.arch-item .ad { flex: none; width: 92px; font-family: 'JetBrains Mono', monospace; font-size: 12px; color: var(--ink-4); }
.arch-item .at { font-size: 14px; color: var(--ink-2); font-weight: 400; }
.arch-item:hover .at { color: var(--accent); }
@media (max-width: 768px) { .view-toggle { margin-left: 0; } }