.tools-directory{max-width:1180px;margin:0 auto;padding:0 30px 94px}.directory-heading{border-top:1px solid var(--line);padding:50px 0 26px}.directory-heading h2{margin:9px 0 0;color:var(--text);font:500 clamp(32px,4vw,52px)/1 Newsreader,serif;letter-spacing:-.05em}.directory-heading p{max-width:520px;margin:15px 0 0;color:var(--muted);font-size:13px;line-height:1.7}.directory-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.directory-card{min-height:146px;display:flex;align-items:stretch;position:relative;overflow:hidden;color:var(--text);background:var(--panel);border:1px solid var(--line);border-radius:9px;text-decoration:none;transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease}.directory-card:hover{transform:translateY(-3px);border-color:var(--card-accent,#9b8cff);box-shadow:0 14px 35px #00000026}.directory-card:focus-visible{outline:3px solid var(--violet);outline-offset:3px}.directory-thumb,.directory-mark{width:104px;height:104px;flex:0 0 104px;align-self:center;object-fit:cover;border-radius:6px;margin-left:14px;background:linear-gradient(135deg,#252235,#121218)}.directory-mark{display:flex;align-items:center;justify-content:center;color:var(--card-accent,#9b8cff);font:500 20px 'DM Mono';letter-spacing:-.08em}.directory-content{min-width:0;display:flex;flex:1;flex-direction:column;padding:19px 38px 16px 17px}.directory-content strong{font-size:17px;line-height:1.2;letter-spacing:-.025em}.directory-content small{display:-webkit-box;overflow:hidden;margin-top:8px;color:var(--muted);font-size:12px;line-height:1.45;-webkit-line-clamp:2;-webkit-box-orient:vertical}.directory-content em{margin-top:auto;color:var(--card-accent,#9b8cff);font:10px 'DM Mono';font-style:normal;letter-spacing:.02em}.directory-arrow{position:absolute;right:15px;bottom:15px;color:var(--muted);font:20px/1 Newsreader,serif;transition:transform .2s,color .2s}.directory-card:hover .directory-arrow{color:var(--card-accent,#9b8cff);transform:translateX(3px)}.accent-cipher{--card-accent:#e879b9}.accent-binary{--card-accent:#8c9eff}.accent-signal{--card-accent:#83e6bd}.accent-base{--card-accent:#f7c973}.accent-url{--card-accent:#75c7f5}.accent-text{--card-accent:#c8a6ff}.theme-light .directory-card{background:#fff}.theme-light .directory-card:hover{box-shadow:0 14px 34px #17203312}.theme-light .directory-mark{background:linear-gradient(135deg,#f2f5ff,#fff)}@media(max-width:920px){.directory-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:700px){.tools-directory{padding:0 22px 64px}.directory-heading{padding-top:38px}.directory-heading p{margin-top:13px}.directory-grid{grid-template-columns:1fr;gap:10px}.directory-card{min-height:126px}.directory-thumb,.directory-mark{width:94px;height:94px;flex-basis:94px;margin-left:10px}.directory-content{padding:16px 38px 14px 15px}.directory-content strong{font-size:16px}}
/* Brand accent system: keep directory metadata and interaction states to three colors. */
.directory-card.accent-cipher,.directory-card.accent-base{--card-accent:#ed4699}
.directory-card.accent-binary,.directory-card.accent-text{--card-accent:#9b8eff}
.directory-card.accent-signal,.directory-card.accent-url{--card-accent:#84e7be}
.directory-card:focus-visible{outline-color:#9b8eff}
.directory-content em{height:20px;display:flex;align-items:center;line-height:1}
.directory-arrow{bottom:15px;height:20px;display:flex;align-items:center}