/* Resource directories (web design inspiration, open-source software). Light, page-scoped (.dir). */
.dir{--ink:#0b0f17;--ink2:#3a4352;--mute:#5d6778;--line:#dde3ec;--mist:#f3f6fa;--blue:#1466ff;--blue-d:#0a49c4;background:#fff;color:var(--ink);font-family:var(--font-sans);line-height:1.55;overflow-x:clip}
.dir *{box-sizing:border-box}.dir :where(h1,h2,h3){margin:0;font-weight:600;letter-spacing:-.02em;line-height:1.1;color:var(--ink);text-wrap:balance}.dir :where(p,li,dd,dt,label){color:inherit}.dir :where(p){margin:0}
.dir :focus-visible{outline:2px solid var(--blue);outline-offset:3px}
.dir-wrap{width:var(--shell,calc(100% - 56px));margin-inline:auto}
.dir-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.dir-eyebrow{font:500 12px/1.4 var(--font-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--blue);margin-bottom:12px}
.dir-hero{padding-block:clamp(36px,5vw,72px) clamp(28px,4vw,48px);background:linear-gradient(#fff,#f4f7fc);border-bottom:1px solid var(--line)}
.dir-hero h1{font-size:clamp(34px,4.6vw,60px);margin-bottom:16px}
.dir-lead{font-size:clamp(17px,1.5vw,20px);color:var(--ink2);max-width:46rem}
.dir-crumb{display:flex;flex-wrap:wrap;gap:8px;align-items:center;font-size:13px;color:var(--mute);margin-bottom:20px}.dir-crumb a{color:var(--blue);text-decoration:none}.dir-crumb a:hover{text-decoration:underline}
.dir-search{position:relative;margin-top:26px;max-width:46rem}
.dir-search input{width:100%;min-height:56px;padding:0 54px 0 18px;font:400 17px var(--font-sans);border:1px solid var(--ink);background:#fff;color:var(--ink);border-radius:0}
.dir-search input:focus{outline:none;box-shadow:0 0 0 3px rgba(20,102,255,.3);border-color:var(--blue)}
.dir-search kbd{position:absolute;right:16px;top:50%;transform:translateY(-50%);font:500 12px var(--font-mono);border:1px solid var(--line);padding:2px 8px;color:var(--mute);background:var(--mist)}
.dir-stats{margin-top:14px;font-size:14px;color:var(--mute)}.dir-stats b{color:var(--ink)}
.dir-body{padding-block:clamp(24px,3.4vw,44px) clamp(40px,5vw,72px)}.dir-body--tint{background:var(--mist);border-top:1px solid var(--line)}
.dir-bar{display:flex;flex-wrap:wrap;gap:14px 24px;justify-content:space-between;align-items:flex-start}
.dir-chips{display:flex;flex-wrap:wrap;gap:8px;flex:1 1 420px}
.dir-chips button{display:inline-flex;gap:8px;align-items:center;padding:8px 14px;border:1px solid var(--line);background:#fff;font:600 13px var(--font-sans);color:var(--ink);cursor:pointer;transition:border-color .2s,background .2s,color .2s}
.dir-chips button i{font:500 11px var(--font-mono);font-style:normal;color:var(--mute)}
.dir-chips button:hover{border-color:var(--ink)}.dir-chips button[aria-pressed=true]{background:var(--ink);border-color:var(--ink);color:#fff}.dir-chips button[aria-pressed=true] i{color:#a9c4ff}
.dir-tools{display:flex;flex-wrap:wrap;gap:10px;align-items:end}
.dir-sel{display:grid;gap:3px;font:600 10px var(--font-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--mute)}
.dir-sel select{min-height:40px;padding:0 10px;border:1px solid var(--line);background:#fff;font:500 14px var(--font-sans);color:var(--ink);border-radius:0}
.dir-view{display:inline-flex;border:1px solid var(--line)}.dir-view button{width:40px;height:40px;background:#fff;border:0;cursor:pointer;display:grid;place-items:center}
.dir-view svg{width:18px;height:18px;fill:var(--mute)}.dir-view button[aria-pressed=true]{background:var(--ink)}.dir-view button[aria-pressed=true] svg{fill:#fff}
.dir-count{margin:18px 0 14px;font-size:14px;color:var(--mute);min-height:1.5em}
.dir-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:16px}
.dir-card{position:relative;display:grid;gap:10px;align-content:start;padding:20px;border:1px solid var(--line);background:#fff;transition:border-color .25s,box-shadow .25s,transform .25s}
.dir-card:hover{border-color:var(--blue);box-shadow:0 18px 36px -26px rgba(20,102,255,.55);transform:translateY(-3px)}
.dir-card[hidden]{display:none}
.dir-card__top{display:flex;gap:14px;align-items:center}
.dir-tile{flex:none;display:grid;place-items:center;width:48px;height:48px;background:#eaf0fb linear-gradient(#d9e3f4 1px,transparent 1px) 0 0/12px 12px;border:1px solid #cfd9ea;font:700 15px var(--font-mono);color:var(--blue);letter-spacing:.02em}
.dir-card__cat{font:500 10px var(--font-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--mute);margin-bottom:3px}
.dir-card h2,.dir-card h3{font-size:19px}
.dir-card__link{color:inherit;text-decoration:none}.dir-card__link::after{content:"";position:absolute;inset:0;z-index:1}
.dir-card:hover .dir-card__link{color:var(--blue)}
.dir-card__sum{font-size:15px;color:var(--ink2)}
.dir-card__meta{display:flex;flex-wrap:wrap;gap:6px}
.dir-chip{display:inline-block;padding:3px 9px;border:1px solid #cfd8e6;background:#fff;font:500 11px var(--font-mono);letter-spacing:.04em;color:var(--ink2);text-decoration:none}
.dir-chip--lic{background:#eef4ff;border-color:#c4d6fb;color:var(--blue-d);font-weight:600}
a.dir-chip:hover{border-color:var(--blue);color:var(--blue)}
.dir-card__ext{display:flex;gap:16px;margin-top:2px;position:relative;z-index:2}.dir-card__ext a{font-weight:600;font-size:13px;color:var(--blue);text-decoration:none}.dir-card__ext a:hover{text-decoration:underline}
.dir-grid.is-list{grid-template-columns:minmax(0,1fr);gap:0;border:1px solid var(--line)}
.is-list .dir-card{grid-template-columns:minmax(0,1.1fr) minmax(0,1.5fr) auto auto;align-items:center;gap:16px;border:0;border-top:1px solid var(--line);padding:14px 18px;box-shadow:none;transform:none}
.is-list .dir-card:first-child{border-top:0}.is-list .dir-card:hover{background:#f6f9ff}
.dir-empty{text-align:center;padding:clamp(32px,6vw,64px) 16px;border:1px dashed #b9c3d3;margin-top:8px;display:grid;gap:10px;justify-items:center}.dir-empty h2{font-size:24px}.dir-empty p{color:var(--ink2)}
.dir-btn{display:inline-flex;align-items:center;gap:8px;min-height:46px;padding:0 22px;background:var(--blue);color:#fff;border:1px solid var(--blue);font:600 15px var(--font-sans);text-decoration:none;cursor:pointer;transition:background .2s}
.dir-btn:hover{background:var(--blue-d)}.dir-btn--ghost{background:#fff;color:var(--ink);border-color:var(--ink)}.dir-btn--ghost:hover{background:var(--ink);color:#fff}
.dir-btn--light{background:#fff;color:var(--ink);border-color:#fff}.dir-btn--light:hover{background:#dbe7ff}
.dir-suggest{background:var(--mist);border-block:1px solid var(--line);padding-block:clamp(36px,5vw,64px)}
.dir-suggest__grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(24px,5vw,72px);align-items:start}.dir-suggest h2{font-size:clamp(24px,2.8vw,34px);margin-bottom:10px}.dir-suggest p{color:var(--ink2)}
.dir-form{display:grid;gap:14px;background:#fff;border:1px solid var(--ink);padding:clamp(16px,2.6vw,26px)}
.dir-f2{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.dir-form label{display:grid;gap:6px;font:600 12px var(--font-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--ink2)}.dir-form small{text-transform:none;letter-spacing:0;font-weight:400;font-family:var(--font-sans)}
.dir-form input,.dir-form textarea{width:100%;min-height:44px;padding:10px 12px;border:1px solid #b9c3d3;background:#fff;font:400 16px var(--font-sans);color:var(--ink);border-radius:0}
.dir-form input:focus,.dir-form textarea:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 2px rgba(20,102,255,.25)}.dir-form [aria-invalid=true]{border-color:#c62828}
.dir-form__msg{font-weight:600}.dir-form__msg.is-err{color:#b3261e}.dir-form__msg.is-ok{color:#0c8f5b}
.dir-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.dir-cta{background:#0b0f17;color:#fff;padding-block:clamp(32px,4vw,52px)}
.dir-cta__row{display:flex;flex-wrap:wrap;gap:18px 32px;justify-content:space-between;align-items:center}.dir-cta h2{color:#fff;font-size:clamp(22px,2.6vw,32px);max-width:40rem}
.dir-also{display:flex;flex-wrap:wrap;gap:8px 22px;margin-top:22px;padding-top:18px;border-top:1px solid #2a3340;font-size:14px;color:#aab6c8}.dir-also a{color:#9bbcff;text-decoration:none}.dir-also a:hover{text-decoration:underline}
/* detail */
.dir-badges{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}.dir-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:22px}
.dir-item{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:clamp(24px,4vw,64px);align-items:start}
.dir-prose h2{font-size:clamp(22px,2.2vw,28px);margin:34px 0 12px}.dir-prose h2:first-child{margin-top:0}.dir-prose p{color:var(--ink2);font-size:17px;max-width:46rem}
.dir-prose a{color:var(--blue)}.dir-fine{font-size:14px!important;color:var(--mute)!important;margin-top:10px}
.dir-steps{margin:8px 0 0;padding:0;list-style:none;counter-reset:s;display:grid;gap:0;max-width:46rem;border-top:1px solid var(--line)}
.dir-steps li{counter-increment:s;padding:14px 0 14px 46px;border-bottom:1px solid var(--line);position:relative;color:var(--ink2)}
.dir-steps li::before{content:"0" counter(s);position:absolute;left:0;top:14px;width:32px;height:32px;display:grid;place-items:center;background:var(--mist);border:1px solid var(--line);font:600 12px var(--font-mono);color:var(--blue)}
.dir-steps b{color:var(--ink)}
.dir-facts{position:sticky;top:96px;border:1px solid var(--ink);background:#fff;padding:20px}.dir-facts h2{font-size:18px;margin-bottom:10px}
.dir-facts dl{margin:0;display:grid}.dir-facts dl>div{padding:10px 0;border-top:1px solid var(--line)}.dir-facts dt{font:500 10px var(--font-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--mute);margin-bottom:2px}
.dir-facts dd{margin:0;font-size:15px;overflow-wrap:anywhere}.dir-facts a{color:var(--blue)}
.dir-facts__tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}.dir-facts__report{display:inline-block;margin-top:14px;font-size:13px;color:var(--mute)!important}
.dir-h2{font-size:clamp(22px,2.4vw,30px);margin-bottom:18px}
@media (max-width:1000px){.dir-item,.dir-suggest__grid{grid-template-columns:minmax(0,1fr)}.dir-facts{position:static;order:-1}.is-list .dir-card{grid-template-columns:minmax(0,1fr) auto}.is-list .dir-card__sum{grid-column:1/-1;order:3}}
@media (max-width:760px){.dir-grid{grid-template-columns:minmax(0,1fr)}.dir-f2{grid-template-columns:minmax(0,1fr)}.dir-chips{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin-inline:-2px;padding-bottom:4px}.dir-chips::-webkit-scrollbar{display:none}.dir-chips button{flex:none}.dir-tools{width:100%}.dir-sel{flex:1}.dir-sel select{width:100%}.dir-search kbd{display:none}.is-list .dir-card{grid-template-columns:minmax(0,1fr)}}
@media (prefers-reduced-motion:reduce){.dir *{transition:none!important}}