html,body{max-width:100%;overflow-x:hidden}
body{font-family:system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;background-color:var(--bg)}
body::before,body::after{display:none}
header{background:rgba(11,18,32,.94)}
.container,.topbar,.header-tools,.directory-searchbar{max-width:1080px}
.topbar{flex-wrap:nowrap}
.brand-title{font-size:16px;font-weight:750}
.directory-searchbar{margin:0 auto;padding:0 20px 12px;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:end}
.header-tools{margin:0 auto;padding:0 20px 14px;display:grid;grid-template-columns:minmax(160px,1fr) minmax(150px,1fr) auto auto;gap:10px;align-items:end}
.header-tools .input-group:first-child{display:none}
.input-group{min-width:0;display:flex;flex-direction:column;gap:5px;color:var(--muted);font-size:12px}
.input-group>span{color:var(--muted)}
input[type="search"],select{min-width:0;width:100%;min-height:44px;padding:10px 12px;border:1px solid var(--border);border-radius:12px;background:#111b33;color:var(--text);-webkit-text-fill-color:var(--text);font:inherit}
select option{color:#0b1220;background:#fff}
input[type="search"]::placeholder{color:#91a0c9}
.filter-toggle{display:none;min-height:44px}
.listing-section{margin-top:18px}
.listing-header{display:flex;align-items:end;justify-content:space-between;gap:14px;flex-wrap:wrap}
.listing-header h1{font-size:clamp(24px,4vw,34px)}
.eyebrow{margin:0 0 4px;color:var(--accent2);font-size:12px;font-weight:750;letter-spacing:.08em;text-transform:uppercase}
.listing-grid{display:grid;gap:14px;margin-top:14px}
.listing-card{min-width:0;padding:16px;border:1px solid var(--border);border-radius:var(--radius);background:rgba(15,24,48,.9);box-shadow:0 10px 24px rgba(0,0,0,.25)}
.listing-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.listing-name{min-width:0;flex:1 1 260px;margin:0;color:var(--text);font-family:inherit;font-size:19px;overflow-wrap:anywhere}
.listing-summary{display:flex;gap:10px;align-items:flex-start;margin:9px 0 2px}
.listing-desc{flex:1;margin:1px 0 0;color:var(--muted);font-size:14px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.badge,.info-chip{flex:0 0 auto;max-width:100%;padding:5px 9px;border:1px solid var(--border);border-radius:999px;background:rgba(125,211,252,.09);color:var(--accent);font:700 11px/1.2 inherit;overflow-wrap:anywhere;white-space:normal}
.info-chip{color:var(--text);background:rgba(255,255,255,.04);text-transform:none}
.action{min-height:38px;padding:7px 10px;border:1px solid var(--border);border-radius:10px;background:rgba(255,255,255,.04);color:var(--text);font:650 12px/1 inherit;cursor:pointer}
.action.primary{border-color:rgba(125,211,252,.5);background:rgba(125,211,252,.12);color:var(--text)}
.listing-details{margin-top:12px;border-top:1px solid var(--border);padding-top:10px}
.detail-row{display:grid;grid-template-columns:minmax(80px,100px) minmax(0,1fr);gap:8px;color:var(--muted);font-size:13px}
.detail-value,.detail-block{min-width:0;color:var(--text);overflow-wrap:anywhere}
.detail-block{font-size:14px;font-weight:600}
.actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.related-result{margin-top:14px;padding:12px 14px;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;border:1px solid rgba(125,211,252,.28);border-radius:14px;background:rgba(125,211,252,.08)}
.related-result[hidden]{display:none}
.empty-state{background:rgba(15,24,48,.85);border-color:var(--border);color:var(--muted)}
.error-card{background:rgba(74,20,24,.92);border-color:rgba(252,165,165,.45);color:#fee2e2}
.to-top{background:linear-gradient(135deg,var(--accent),var(--accent2));color:#0b1220;border:0}

@media(max-width:900px){
  .directory-searchbar{padding-top:10px}
  .filter-toggle{display:inline-flex}
  .header-tools{display:none;grid-template-columns:1fr}
  .header-tools.is-open{display:grid}
  .header-tools .btn{min-height:44px}
}
@media(max-width:520px){
  .directory-searchbar,.header-tools{padding-left:14px;padding-right:14px}
  .directory-searchbar .input-group>span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
  .container{padding:16px 14px}
  .listing-header{align-items:center}
  .listing-header h1{font-size:25px}
  .listing-row{align-items:stretch}
  .listing-name{flex-basis:100%}
  .listing-row .action{flex:1 1 auto}
  .listing-summary{flex-direction:column}
  .detail-row{grid-template-columns:1fr;gap:2px}
}