/* The topic directory uses the established collection colors as a second navigation layer. */
@media screen {
  .topics-section { max-width:1440px; margin:0 auto; padding:48px 5% 44px; background:#f3eee8; border-top:1px solid #e5dacd; }
  .topics-section .section-heading { align-items:end; }
  .topics-section .section-heading>p { max-width:330px; font-size:12px; line-height:1.8; color:#526456; }
  .topics-section .eyebrow { color:#78528a; }
  .topics-section h2 { max-width:670px; }
  .directory-controls { display:grid; grid-template-columns:minmax(240px,1.7fr) minmax(200px,1fr) 150px auto; align-items:end; gap:13px; margin:24px 0 19px; }
  .directory-controls label { display:block; font-size:11px; font-weight:700; color:#4f6654; margin-bottom:7px; }
  .directory-controls input,.directory-controls select { width:100%; min-height:45px; border:1px solid #c6d1c2; border-radius:9px; background:#fffdf7; color:#294b3d; padding:10px 12px; font-size:12px; }
  .directory-controls input { border:2px solid #659d85; padding:9px 12px; }
  .directory-controls input::placeholder { color:#627669; opacity:1; }
  .directory-controls .reset-button { min-height:45px; white-space:nowrap; font-size:11px; padding:9px 4px; }
  .topic-alphabet { display:flex; align-items:center; flex-wrap:wrap; gap:5px; margin:0 0 18px; }
  .topic-alphabet button { min-width:31px; min-height:33px; padding:6px 8px; border:1px solid #d1d8c9; border-radius:7px; background:#fffaf0; color:#4c6552; font-size:11px; font-weight:700; }
  .topic-alphabet button:first-child { padding-left:13px; padding-right:13px; }
  .topic-alphabet button:hover { background:#e4efdc; border-color:#819d75; }
  .topic-alphabet button[aria-pressed=true] { background:#67418e; color:#fff; border-color:#67418e; }
  .topic-alphabet button:disabled { opacity:.38; }
  .directory-summary { display:flex; align-items:start; justify-content:space-between; gap:28px; padding-bottom:15px; }
  .directory-summary>p:first-child { color:#62428c; font-size:12px; font-weight:700; white-space:nowrap; }
  .directory-summary>p:last-child { max-width:580px; text-align:right; font-size:10px; line-height:1.7; color:#627060; }
  .directory-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; }
  .directory-topic { position:relative; text-align:left; display:flex; flex-direction:column; align-items:flex-start; justify-content:space-between; gap:10px; min-height:99px; border:1px solid transparent; border-left:5px solid var(--topic-bright); border-radius:10px; background:var(--topic-fill); padding:14px 15px; color:#294b3d; transition:transform .15s,box-shadow .15s; }
  .directory-topic>strong { font-size:12px; font-weight:600; line-height:1.5; }
  .directory-topic-count { font-size:10px; font-weight:600; color:var(--topic-color); }
  .directory-topic:hover { border-color:var(--topic-color); box-shadow:0 5px 13px #263e2612; transform:translateY(-2px); }
  .directory-topic.is-selected { box-shadow:inset 0 0 0 2px var(--topic-color); }
  .directory-toggle { display:flex; width:max-content; margin:24px auto 0; min-width:195px; }
  .directory-empty { background:#fffaf1; border:1px dashed #c7b5d2; border-radius:12px; padding:25px; text-align:center; }
  .directory-empty h3 { font-size:17px; color:#614784; }
  .directory-empty p { font-size:12px; color:#5c6c5a; }
  .directory-scope { margin:22px auto 0; max-width:800px; text-align:center; font-size:10px; line-height:1.8; color:#64715f; }
  .collections-section { background:#fff8eb; }
  .collections-section .section-heading h2 { font-size:36px; }
  .collections-section .section-heading>p { max-width:350px; }
  .active-topic { margin-bottom:23px; padding:21px 23px; background:var(--topic-fill); border:1px solid var(--topic-bright); border-left:5px solid var(--topic-bright); border-radius:13px; }
  .active-topic-top { display:flex; justify-content:space-between; align-items:start; gap:15px; margin-bottom:13px; }
  .active-topic .eyebrow { color:var(--topic-color); font-size:8px; }
  .active-topic .reset-button { color:var(--topic-color); white-space:nowrap; font-size:10px; }
  .active-topic h3 { font:34px/1.1 var(--serif); color:#23473b; margin-bottom:12px; }
  .active-topic>p { font-size:12px; line-height:1.8; color:#395746; }
  .active-topic>.active-topic-note { font-size:10px; line-height:1.8; margin-top:9px; color:#4e654f; }
  .active-topic-actions { display:flex; flex-wrap:wrap; align-items:center; gap:16px; margin-top:17px; }
  .active-topic-actions .button { font-size:10px; min-height:38px; padding:10px 13px; }
  .active-topic-actions .text-link { color:var(--topic-color); font-size:11px; font-weight:600; }
  #subject-filter { border-color:#a791bb; }
  .topic-starters-download { display:grid; grid-template-columns:1.2fr 1fr; align-items:center; gap:35px; background:#fff0bd; border:1px solid #e7c15a; border-radius:16px; padding:27px 30px; margin-bottom:30px; color:#394a31; }
  .topic-starters-download .eyebrow { color:#77552b; }
  .topic-starters-download h3 { font:32px/1.12 var(--serif); margin:12px 0; color:#3a4e30; }
  .topic-starters-download p { color:#5d6146; font-size:12px; line-height:1.8; }
  .starter-pack-links { display:grid; gap:12px; justify-self:end; width:100%; max-width:290px; }
  .starter-pack-links .button { font-size:11px; min-height:44px; }
  .resource-topics { margin-top:26px; border-top:1px solid var(--line); padding-top:17px; }
  .resource-topics h3 { font-size:12px; margin-bottom:11px; }
  #resource-topic-list { display:flex; flex-wrap:wrap; gap:7px; }
  #resource-topic-list button { padding:7px 10px; border-radius:7px; border:1px solid var(--topic-bright); background:var(--topic-fill); color:var(--topic-color); font-size:10px; line-height:1.5; }
  #resource-topic-list button:hover { background:#fff; }
}
@media screen and (max-width:1150px) {
  .directory-controls { grid-template-columns:minmax(200px,1.5fr) minmax(170px,1fr) 135px; }
  .directory-controls .reset-button { grid-column:1/-1; justify-self:end; min-height:25px; padding-top:0; padding-bottom:0; }
  .directory-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
}
@media screen and (max-width:760px) {
  .topics-section { padding:35px 6%; }
  .topics-section .section-heading { display:block; }
  .topics-section .section-heading h2 { font-size:34px; }
  .topics-section .section-heading>p { max-width:none; margin-top:12px; }
  .directory-controls { grid-template-columns:1fr 1fr; gap:12px; margin-top:20px; }
  .directory-search { grid-column:1/-1; }
  .directory-controls .reset-button { grid-column:1/-1; }
  .directory-controls label { font-size:10px; }
  .directory-controls input,.directory-controls select { font-size:11px; }
  .topic-alphabet { gap:5px; }
  .topic-alphabet button { min-width:30px; min-height:33px; }
  .directory-summary { display:block; }
  .directory-summary>p:last-child { text-align:left; margin-top:6px; }
  .directory-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .directory-topic { min-height:100px; padding:13px; }
  .directory-topic>strong { font-size:11px; }
  .directory-scope { text-align:left; font-size:10px; }
  .collections-section .section-heading h2 { font-size:31px; }
  .topic-starters-download { grid-template-columns:1fr; gap:20px; padding:23px; }
  .starter-pack-links { justify-self:stretch; max-width:none; grid-template-columns:1fr 1fr; }
  .starter-pack-links .button { padding:12px; font-size:10px; }
  .active-topic { padding:19px; }
  .active-topic h3 { font-size:31px; }
}
@media screen and (max-width:460px) {
  .topics-section .section-heading h2 { font-size:31px; }
  .directory-grid { grid-template-columns:1fr; gap:8px; }
  .directory-topic { min-height:73px; gap:6px; padding:13px 15px; }
  .directory-topic>strong { font-size:12px; }
  .directory-topic-count { font-size:10px; }
  .directory-controls { grid-template-columns:1fr; }
  .directory-search { grid-column:auto; }
  .directory-controls .reset-button { grid-column:auto; }
  .starter-pack-links { grid-template-columns:1fr; }
  .topic-starters-download h3 { font-size:29px; }
  .active-topic-actions { display:grid; gap:13px; }
  .active-topic-actions .button { width:max-content; max-width:100%; }
}
@media screen and (prefers-reduced-motion:reduce) {
  .directory-topic:hover { transform:none; }
}
@media print {
  .resource-topics { display:none!important; }
}