.device-intro { margin-bottom: 1.5rem; }
.directory-counts { display: grid; grid-template-columns: repeat(5, 1fr); gap: 1rem; }
.directory-counts > div { border-top: 2px solid var(--line); padding: 1rem 0; display: flex; align-items: baseline; gap: .75rem; }
.directory-counts strong { font-size: 2rem; }
.directory-counts span { font-size: 1rem; }
.directory-filters { display: grid; grid-template-columns: 1.3fr 1fr 1.2fr 1.2fr; align-items: end; gap: 1rem; padding: 1.25rem; border: 1px solid var(--line); border-radius: 1rem; background: var(--surface); }
.directory-filters label { display: grid; gap: .5rem; min-width: 0; font-size: .875rem; font-weight: 600; }
.directory-filters input, .directory-filters select { width: 100%; min-width: 0; min-height: 2.75rem; border: 1px solid var(--line); border-radius: .5rem; background: var(--bg); color: var(--text); padding: .625rem; font: inherit; font-size: 1rem; }
.directory-filters > a { padding: .75rem 0; }
.directory-filters :focus-visible { outline: 2px solid var(--text); outline-offset: 3px; }
.directory-result { margin: 1.25rem 0; }
.directory-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.25rem; }
.directory-card { padding: 1.5rem; border: 1px solid var(--line); border-radius: 1rem; background: var(--surface); min-width: 0; overflow-wrap: anywhere; }
.directory-card-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 1rem; }
.directory-card-heading h2 { font-size: 1.375rem; margin: .25rem 0; }
.directory-card-heading p { margin: 0; }
.directory-status { flex-shrink: 0; border: 1px solid var(--line); border-radius: 2rem; padding: .35rem .65rem; font-size: .875rem; }
.directory-status-scenario_verified { background: #ddf5e7; color: #145333; }
.directory-status-supported { background: #ddf5e7; color: #145333; }
.directory-status-adapting { background: #e1edff; color: #234d85; }
.directory-status-pending { background: #fff0d1; color: #6a4709; }
.directory-progress { font-size: 1rem; padding-bottom: 1rem; border-bottom: 1px solid var(--line); }
.directory-card dl { margin: 0; display: grid; gap: 1rem; }
.directory-card dt { color: var(--muted); font-size: .875rem; margin-bottom: .3rem; }
.directory-card dd { margin: 0; font-size: 1rem; }
.directory-card dd small { display: block; font-size: .875rem; margin-top: .3rem; color: var(--muted); }
.directory-card code { white-space: normal; overflow-wrap: anywhere; font-size: .875rem; }
.directory-warning { padding: 1rem; border-left: 3px solid #b88119; background: var(--surface); }
@media (max-width: 850px) { .directory-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) { .directory-grid { grid-template-columns: 1fr; } .directory-counts { grid-template-columns: repeat(2, 1fr); } .directory-filters { grid-template-columns: 1fr; } .directory-card { padding: 1rem; } .directory-card-heading { flex-wrap: wrap; } }