/* Page-local layout pieces reused inside .page-wrapper on individual pages
   (the global chrome — topbar/sidebar — lives in shell.css). */

.ac-searchlayout { display: flex; gap: 16px; align-items: flex-start; flex-wrap: wrap; }

.ac-catrail { flex: 0 0 250px; background: var(--bg-sunken); border: 1px solid var(--line); border-radius: 10px; padding: 16px 10px; overflow-y: auto; align-self: flex-start; }
.ac-catgroup-label { font-size: 9.5px; font-weight: 700; letter-spacing: 0.08em; color: var(--text-6); text-transform: uppercase; margin: 16px 8px 6px; }
.ac-catgroup-label:first-of-type { margin-top: 2px; }
.ac-catitem { display: flex; justify-content: space-between; width: 100%; padding: 8px 9px; border-radius: 7px; font-size: 12px; color: var(--accent);; background: none; border: none; text-align: left; }
.ac-catitem span { font-family: 'JetBrains Mono', monospace; font-size: 10.5px; color: var(--text-5); font-variant-numeric: tabular-nums; }
.ac-catitem.active { background: var(--accent-16); color: var(--accent-tint); font-weight: 600; }
.ac-catitem.active span { color: var(--accent); }

.ac-center { display: flex; flex-direction: column; gap: 12px; min-width: 0; flex: 1 1 480px; }

.ac-screen-head { display: flex; align-items: center; justify-content: space-between; }
.ac-screen-title { font-size: 15px; font-weight: 700; }
.ac-screen-sub { font-size: 11.5px; color: var(--text-5); margin-top: 2px; }

@media (max-width: 760px) {
  .ac-catrail { flex: 1 1 100%; max-height: 200px; }
  .ac-center { flex: 1 1 100%; }
}