.directory-home{--home-surface:#fff;--home-canvas:#f8fafc;--home-ink:#17233b;--home-muted:#536580;--home-line:#dbe4ef;--home-accent:#2458d3;background:var(--home-canvas);color:var(--home-ink);padding-bottom:5rem}
.home-shell{max-width:72rem;margin:auto;padding:0 1.5rem}
.directory-hero{padding:4.5rem 0 2.75rem;text-align:center}
.directory-eyebrow{display:flex;align-items:center;justify-content:center;gap:.6rem;color:var(--home-muted);font-size:.8rem;font-weight:700;margin:0 0 1.25rem}
.directory-eyebrow>span:first-child{width:.45rem;height:.45rem;border-radius:50%;background:#10b981;box-shadow:0 0 0 4px #10b98115}
.directory-total{padding-inline-start:.7rem;margin-inline-start:.15rem;border-inline-start:1px solid var(--home-line)}
.directory-hero h1{font-size:clamp(2rem,4.5vw,3.6rem);line-height:1.45;letter-spacing:-.035em;font-weight:900;margin:0 auto 1rem;text-wrap:balance}
.directory-hero h1>span{color:var(--home-accent)}
.directory-intro{max-width:38rem;margin:0 auto;color:var(--home-muted);font-size:1rem;line-height:1.85;text-wrap:balance}
.directory-home .directory-finder{max-width:48rem;margin:2rem auto 0;text-align:start}
.directory-finder>label{font-size:.85rem;color:var(--home-ink);margin-bottom:.6rem}
.directory-finder .tool-finder-row{position:relative;align-items:center;gap:.5rem;border:1px solid #a9bfe7;border-radius:1rem;background:var(--home-surface);padding:.25rem .8rem;box-shadow:0 5px 18px #1e40af08;transition:border-color .15s,box-shadow .15s}
.directory-finder .tool-finder-row:focus-within{border-color:var(--home-accent);box-shadow:0 0 0 3px #2563eb18}
.directory-finder .finder-icon{width:1.35rem;height:1.35rem;stroke-width:1.8;flex-shrink:0;color:var(--home-accent)}
.directory-home .directory-finder input{border:0;border-radius:0;background:transparent;color:var(--home-ink);box-shadow:none;outline:none;padding:.9rem .25rem;min-height:3.15rem;font-size:1rem}
.directory-finder input::-webkit-search-cancel-button{display:none}
.directory-finder input::placeholder{color:var(--home-muted);opacity:1}
.directory-finder kbd{font-family:inherit;font-size:.8rem;border:1px solid var(--home-line);border-radius:.35rem;color:var(--home-muted);padding:0 .4rem}
.directory-home .directory-finder [data-clear-search]{display:grid;place-items:center;width:2.75rem;height:2.75rem;padding:0;flex-shrink:0;border:0;background:transparent;color:var(--home-muted)}
.directory-finder [data-clear-search]:hover{background:var(--home-canvas)}
.directory-finder [data-clear-search] svg{width:1.1rem;height:1.1rem;stroke-width:1.8}
.finder-hint{margin:.7rem .2rem 0;color:var(--home-muted);font-size:.8rem;line-height:1.7}
.directory-results{margin-top:1rem;border:1px solid var(--home-line);border-radius:1rem;background:var(--home-surface);overflow:hidden;box-shadow:0 12px 35px #17233b08}
.results-heading{display:flex;align-items:center;justify-content:space-between;gap:.75rem;padding:1rem 1.2rem;border-bottom:1px solid var(--home-line);background:var(--home-canvas)}
.results-heading h2{margin:0;font-size:.95rem;font-weight:800}
.directory-home .results-heading .tool-finder-status{margin:0;min-height:0;color:var(--home-muted);font-size:.75rem;line-height:1.6}
.search-result-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
.home-tool-card.search-result{display:flex;flex-direction:column;align-items:flex-start;position:relative;min-width:0;padding:1rem 1.2rem;padding-inline-end:2.75rem;text-decoration:none;color:var(--home-ink);background:var(--home-surface);border-bottom:1px solid var(--home-line);gap:.35rem;transition:background .15s}
.search-result:nth-child(odd){border-inline-end:1px solid var(--home-line)}
.search-result:hover{background:var(--home-canvas)}
.search-result:focus-visible{outline-offset:-4px}
.search-result strong{font-size:.9rem;line-height:1.6;font-weight:800;overflow-wrap:anywhere}
.search-result-category{font-size:.7rem;line-height:1.5;color:var(--home-accent);font-weight:700}
.search-result-description{font-size:.77rem;line-height:1.75;color:var(--home-muted);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin:0}
.search-result-arrow{position:absolute;inset-inline-end:1.1rem;top:1.1rem;color:var(--home-muted);font-size:1rem}
.search-empty{padding:2rem;text-align:center;color:var(--home-muted)}
.search-empty>svg{display:block;width:2rem;height:2rem;stroke-width:1.5;margin:0 auto 1rem;color:var(--home-accent)}
.search-empty strong{color:var(--home-ink);font-size:.95rem}
.search-empty p{font-size:.85rem;margin:.5rem 0 0;line-height:1.8}
.directory-home .directory-finder .search-more{display:flex;justify-content:center;align-items:center;gap:.7rem;width:100%;border:0;border-radius:0;background:var(--home-surface);color:var(--home-accent);font-size:.85rem;font-weight:700;min-height:3rem}
.search-more:hover{background:var(--home-canvas)!important}
.home-section{padding:1.8rem 0 2rem;scroll-margin-top:6rem}
.home-section+.home-section{border-top:1px solid var(--home-line)}
.directory-section-heading{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:1.25rem}
.directory-section-heading h2{margin:0 0 .3rem;font-size:1.3rem;line-height:1.6;font-weight:850}
.directory-section-heading p{margin:0;color:var(--home-muted);font-size:.85rem;line-height:1.8}
.directory-jump{display:inline-flex;align-items:center;gap:.5rem;text-decoration:none;color:var(--home-accent);font-size:.8rem;font-weight:750;flex-shrink:0;min-height:2.75rem}
.essential-grid,.directory-category-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.8rem}
.essential-card,.directory-category{display:flex;align-items:center;gap:.85rem;min-width:0;text-decoration:none;color:var(--home-ink);background:var(--home-surface);border:1px solid var(--home-line);border-radius:.9rem;padding:1.1rem;transition:border-color .18s,box-shadow .18s,transform .18s}
.essential-card:hover,.directory-category:hover{border-color:#a9bfe7;box-shadow:0 6px 18px #1e40af08;transform:translateY(-2px)}
.directory-icon{display:grid;place-items:center;width:2.8rem;height:2.8rem;flex-shrink:0;border-radius:.8rem;background:var(--category-soft);color:var(--category-ink)}
.directory-icon svg{width:1.4rem;height:1.4rem}
.essential-copy,.category-copy{min-width:0;flex:1}
.essential-copy strong,.category-copy h3{display:block;margin:0;font-size:.9rem;font-weight:800;line-height:1.65;overflow-wrap:anywhere}
.essential-copy>span,.category-copy>span{display:block;margin-top:.2rem;font-size:.73rem;color:var(--home-muted);line-height:1.5}
.directory-arrow{font-size:1.15rem;line-height:1;color:var(--home-muted);flex-shrink:0}
.directory-category{padding:1rem 1.1rem;min-height:5.5rem}
.directory-category-total{font-size:.8rem;color:var(--home-muted);flex-shrink:0}
.directory-home .recent-strip{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.75rem}
.directory-home .recent-item{display:flex;align-items:center;justify-content:flex-start;gap:.6rem;min-width:0;border:1px solid var(--home-line);border-radius:.75rem;padding:.85rem;background:var(--home-surface);color:var(--home-ink);text-decoration:none}
.recent-item>span:first-child{color:var(--home-accent);flex-shrink:0}
.recent-item-copy{min-width:0}
.directory-home .recent-item strong{font-size:.8rem;line-height:1.6;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.recent-item small{font-size:.68rem;color:var(--home-muted);line-height:1.5;display:block}
.directory-home .text-button{font-size:.75rem;min-height:2.75rem;padding:.4rem .7rem;border-radius:.6rem;flex-shrink:0;color:var(--home-muted);border:1px solid var(--home-line);background:var(--home-surface);font-family:inherit;cursor:pointer}
.quick-access-more{margin-top:.85rem}
html[data-theme=dark] .directory-home{--home-surface:#0f1b2e;--home-canvas:#080f1d;--home-ink:#edf3ff;--home-muted:#afbdd2;--home-line:#2c3b52;--home-accent:#91b5ff}
html[data-theme=dark] .directory-finder .tool-finder-row{background:var(--home-surface);border-color:#4c658b}
html[data-theme=dark] .directory-home .directory-finder input,html[data-theme=dark] .directory-home .directory-finder button{background:transparent;border-color:var(--home-line);color:var(--home-ink)}
html[data-theme=dark] .directory-icon{background:color-mix(in srgb,var(--category-ink) 18%,#17233b);color:color-mix(in srgb,var(--category-ink) 35%,#fff)}
html[data-theme=dark] .directory-home .home-tool-card{background:var(--home-surface)!important;border-color:var(--home-line)!important}
html[data-theme=dark] .directory-home .home-tool-card:hover{background:#15243c!important}
html[data-theme=dark] .directory-home .search-more{color:var(--home-accent)}
@media(max-width:900px){.directory-hero{padding-top:3rem}.essential-grid,.directory-category-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.directory-home .recent-strip{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.home-shell{padding-inline:1rem}.directory-hero{padding:2.25rem 0 1.75rem}.directory-hero h1{font-size:2rem;line-height:1.55}.directory-intro{font-size:.88rem}.directory-home .directory-finder{margin-top:1.5rem}.directory-finder kbd{display:none}.directory-finder input{font-size:.9rem}.search-result-list{grid-template-columns:1fr}.search-result:nth-child(odd){border-inline-end:0}.results-heading{padding:.85rem 1rem;align-items:flex-start}.directory-home .results-heading .tool-finder-status{max-width:50%;text-align:end}.directory-section-heading{align-items:flex-start;gap:.65rem;flex-wrap:wrap}.directory-section-heading h2{font-size:1.15rem}.directory-section-heading p{font-size:.78rem}.directory-jump{min-height:2rem}.essential-card,.directory-category{padding:.8rem;gap:.65rem;min-height:5rem}.directory-icon{width:2.25rem;height:2.25rem;border-radius:.65rem}.directory-icon svg{width:1.2rem;height:1.2rem}.essential-copy strong,.category-copy h3{font-size:.8rem}.essential-copy>span{font-size:.65rem}.directory-arrow{display:none}.directory-category-total{font-size:.73rem}.home-section{padding:1.25rem 0 1.6rem}.directory-eyebrow{font-size:.73rem}.directory-home .recent-item{padding:.75rem}.directory-home .recent-item strong{font-size:.73rem}}
@media(max-width:360px){.essential-grid,.directory-category-grid{grid-template-columns:1fr}.directory-hero h1{font-size:1.8rem}}
@media(prefers-reduced-motion:reduce){.directory-home *, .directory-home *::before{transition:none!important;scroll-behavior:auto!important}.essential-card:hover,.directory-category:hover{transform:none}}

/* The original colorful category tiles, with less padding and distinct symbols. */
.directory-categories .directory-category-grid{grid-template-columns:repeat(auto-fill,minmax(185px,1fr));gap:.85rem}
.directory-categories .directory-category{flex-direction:column;justify-content:center;gap:.65rem;min-height:9.25rem;padding:1rem .8rem;border:1.5px solid var(--category-border);border-radius:1rem;background:linear-gradient(145deg,var(--home-surface) 15%,var(--category-soft));text-align:center}
.directory-categories .directory-icon{width:3.35rem;height:3.35rem;border:1.5px solid var(--category-border);border-radius:1rem;background:var(--category-soft);box-shadow:0 3px 8px #17233b05,inset 0 1px 0 #ffffffb3}
.directory-categories .directory-icon svg{width:1.9rem;height:1.9rem;stroke-width:1.7}
.directory-categories .category-copy{flex:0 1 auto;width:100%}
.directory-categories .category-copy h3{font-size:.9rem;line-height:1.55;font-weight:800;text-wrap:balance}
.directory-categories .category-copy>span{display:inline-block;margin-top:.45rem;padding:.12rem .7rem;border:1px solid var(--category-border);border-radius:999px;background:var(--category-soft);color:color-mix(in srgb,var(--category-ink) 60%,#0f172a);font-size:.7rem;font-weight:700;line-height:1.5}
.directory-categories .directory-category:hover{border-color:color-mix(in srgb,var(--category-ink) 65%,var(--category-border));box-shadow:0 7px 20px color-mix(in srgb,var(--category-ink) 10%,transparent)}
html[data-theme=dark] .directory-categories .directory-category{border-color:color-mix(in srgb,var(--category-ink) 38%,var(--home-line));background:linear-gradient(145deg,var(--home-surface),color-mix(in srgb,var(--category-ink) 9%,var(--home-surface)))}
html[data-theme=dark] .directory-categories .directory-icon{border-color:color-mix(in srgb,var(--category-ink) 45%,var(--home-line));background:color-mix(in srgb,var(--category-ink) 17%,var(--home-surface));box-shadow:inset 0 1px 0 #ffffff08}
html[data-theme=dark] .directory-categories .category-copy>span{border-color:color-mix(in srgb,var(--category-ink) 28%,var(--home-line));background:color-mix(in srgb,var(--category-ink) 10%,var(--home-surface));color:color-mix(in srgb,var(--category-ink) 30%,#fff)}
@media(max-width:600px){.directory-categories .directory-category-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:.65rem}.directory-categories .directory-category{min-height:8.5rem;padding:.8rem .55rem;gap:.55rem;border-radius:.9rem}.directory-categories .directory-icon{width:3rem;height:3rem;border-radius:.85rem}.directory-categories .directory-icon svg{width:1.7rem;height:1.7rem}.directory-categories .category-copy h3{font-size:.8rem}.directory-categories .category-copy>span{font-size:.65rem;margin-top:.4rem;padding:.12rem .6rem}}