.agent-directory-page .page-heading { margin-bottom: 27px; }.directory-toolbar { border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); display: flex; justify-content: space-between; align-items: center; padding: 11px 0; color: var(--faint); font: 9px var(--mono); }.directory-toolbar > div { display: flex; gap: 3px; }.directory-list { margin-top: 16px; border-top: 1px solid var(--line); }.directory-row { display: grid; grid-template-columns: 32px 215px minmax(0,1fr) 100px 20px; align-items: center; gap: 12px; border-bottom: 1px solid var(--line); padding: 14px 13px; transition: background .2s ease; }.directory-row:hover { background: var(--surface); }.directory-row strong { display: block; font-size: 11px; }.directory-row small { display: block; margin-top: 4px; color: var(--faint); font-size: 9px; }.directory-task { color: var(--muted); font-size: 10px; }.directory-state { color: var(--faint); font: 8px var(--mono); white-space: nowrap; }.directory-state i { display: inline-block; width: 5px; height: 5px; border-radius: 50%; background: var(--faint); margin-right: 5px; }.directory-state.working { color: var(--green); }.directory-state.working i { background: var(--green); }.directory-state.ready { color: var(--green); }.directory-state.ready i { background: var(--green); }.directory-state.attention { color: var(--amber); }.directory-state.attention i { background: var(--amber); }.directory-state.waiting { color: var(--amber); }.directory-state.waiting i { background: var(--amber); }.directory-arrow { color: var(--faint); text-align: right; }.directory-row:hover .directory-arrow { color: var(--amber); }
@media (max-width: 800px) { .directory-row { grid-template-columns: 32px minmax(0,1fr) 20px; }.directory-task, .directory-state { display: none; } }