#book:has(#species-directory) { width: 660px; }
#species-directory {
  color: #273e42;
  font: 14px/1.4 var(--sans);
}
#species-directory [hidden] { display: none !important; }
.directory-switch { display:flex; margin-bottom:12px; gap:4px; }
.directory-switch button {
  border:1px solid #96a89c; padding:6px 11px; color:#25494e; background:#efe7d1;
  font:700 13px/1.3 var(--sans); min-height:34px; cursor:pointer;
}
.directory-switch button[aria-pressed="true"] { color:#fff8dc; background:#27545a; border-color:#27545a; }
.directory-switch button:focus-visible { outline:2px solid #286472; outline-offset:2px; }
.directory-filters {
  display: grid;
  grid-template-columns: 1fr 1.18fr 1fr;
  gap: 8px;
}
.directory-filters label { min-width: 0; }
.directory-filters label > span {
  display:block; margin-bottom: 3px; font-weight:700; font-size:12px;
}
.directory-search { grid-column: 1/-1; }
.directory-filters input, .directory-filters select {
  display:block; width:100%; min-height:36px; padding:5px 7px;
  border:1px solid #8e9f97; border-radius:0; background:#fff9e9;
  color:#213e43; font:14px/1.3 var(--sans);
}
.directory-filters input:focus, .directory-filters select:focus,
.directory-entry summary:focus-visible { outline:2px solid #286472; outline-offset:1px; }
.directory-summary, .directory-pagination {
  display:flex; align-items:center; justify-content:space-between; gap:8px;
}
.directory-summary { margin:8px 0 4px; }
.directory-summary small { color:#4a5d5a; font-size:12px; }
.directory-summary button, .directory-status button, .directory-detail button {
  cursor:pointer; color:#1d545f; border:0; background:none; text-decoration:underline;
  font:inherit; padding:3px 0;
}
.directory-status { margin:10px 0 5px; color:#294c51; font-size:13px; font-weight:700; }
.directory-results { border-top:1px solid #9ba89b; }
.directory-entry { border-bottom:1px solid #c6c5b2; }
.directory-entry summary {
  display:grid; grid-template-columns:minmax(0,1fr) minmax(84px,auto) 9px;
  align-items:center; gap:10px; list-style:none; padding:8px 2px; cursor:pointer;
}
.directory-entry summary::-webkit-details-marker { display:none; }
.directory-entry summary:hover { background:#eee4ca; }
.directory-title strong,.directory-title i,.directory-class small { display:block; }
.directory-title strong { font-size:14px; line-height:1.3; overflow-wrap:anywhere; }
.directory-title i { margin-top:1px; color:#4c625e; font-size:12px; overflow-wrap:anywhere; }
.directory-class { color:#395259; text-align:right; font-size:12px; }
.directory-class small { color:#635d4b; font-size:11px; }
.directory-chevron { width:7px; height:7px; border-right:2px solid #526961; border-bottom:2px solid #526961; transform:rotate(-45deg); }
.directory-entry[open] .directory-chevron { transform:rotate(45deg); }
.directory-detail { padding:8px 12px 11px; margin-bottom:7px; background:#efe6cf; border-left:2px solid #9db19e; font-size:13px; }
.directory-facts { display:grid; gap:7px; overflow-wrap:anywhere; }
.directory-detail ul { padding-left:19px; margin:2px 0; }
.directory-detail li { margin:2px 0; }
.directory-detail a { color:#165868; }
.directory-pagination { margin:10px 0; font-size:12px; }
.directory-pagination button { min-height:34px; padding:4px 9px; cursor:pointer; background:#efe1c1; border:1px solid #8ba196; color:#22454b; font:inherit; }
.directory-pagination button:disabled { opacity:.45; cursor:default; }
.directory-method { margin:12px 0; font-size:12px; color:#415854; }
.directory-method summary { cursor:pointer; color:#2e5558; font-weight:700; }
.directory-method p { margin:6px 0; }
.directory-close { margin-top:10px; }
@media(max-width:480px) {
  .directory-filters {grid-template-columns:1fr 1fr; }
  .directory-filters label:nth-child(3) {grid-column:1/-1; grid-row:2; }
  .directory-entry summary {gap:6px; grid-template-columns:minmax(0,1fr) minmax(62px,auto) 8px; }
  .directory-status {margin-top:7px;}
}