:root{--bg:#183f3b;--bg-2:#0f2a27;--text:#fff;--muted:#b8c7c4;--accent:#e3fff7;--card:color-mix(in oklab,var(--bg)92%,white 8%);--outline:1.4px solid rgba(227,255,247,.7);--shadow:0 8px 28px rgba(0,0,0,.22);--radius:16px;--container:1200px}
.fidu{color:var(--text);font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Arial}
.fidu a{color:inherit;text-decoration:none}
.hero{max-width:var(--container);margin:0 auto 6px;padding:0 0 18px}
.hero h1{font-size:clamp(28px,5vw,44px);margin:.2rem 0 .6rem}
.hero p{color:var(--muted);max-width:70ch}
.tools{max-width:var(--container);margin:18px auto;display:flex;flex-wrap:wrap;gap:10px;align-items:center}
.chip{padding:10px 14px;border-radius:999px;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.04);cursor:pointer;font-weight:700}
.chip[aria-pressed="true"]{border:var(--outline);background:rgba(255,255,255,.08)}
.search{margin-left:auto;display:flex;gap:8px;padding:10px 12px;border-radius:12px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08)}
.search input{background:transparent;border:0;color:var(--text);width:220px}
.grid{max-width:var(--container);margin:8px auto 0;display:grid;grid-template-columns:repeat(12,1fr);gap:18px}
.card{grid-column:span 12;background:var(--card);border:1px solid rgba(255,255,255,.06);border-radius:var(--radius);overflow:hidden;display:grid}
.media{aspect-ratio:4/3;background:linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,.02));display:grid;place-items:center}
.avatar{width:112px;height:112px;border-radius:18px;overflow:hidden;border:var(--outline);box-shadow:var(--shadow)}
.body{padding:16px 16px 18px;display:grid;gap:8px}
.role{color:var(--muted);font-weight:600}
.tags{display:flex;flex-wrap:wrap;gap:8px}
.tag{padding:6px 10px;border-radius:999px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);font-weight:600;font-size:.9rem}
.links{display:flex;gap:10px;margin-top:2px}
.btn{display:inline-flex;gap:8px;padding:10px 12px;border-radius:12px;border:1.4px solid rgba(255,255,255,.14);background:transparent;font-weight:700}
.btn:hover{border:var(--outline)}
@media(min-width:640px){.card{grid-template-columns:180px 1fr}}
@media(min-width:860px){.card{grid-column:span 6}}
@media(min-width:1100px){.card{grid-column:span 4}}
