@import"https://fonts.googleapis.com/css2?family=DM+Serif+Display:ital@0;1&family=DM+Sans:ital,opsz,wght@0,9..40,300;0,9..40,400;0,9..40,500;0,9..40,600;1,9..40,400&display=swap";:root{--navy-950: #0c1520;--navy-900: #1a2a3a;--navy-800: #1e3348;--navy-700: #2c4c6c;--navy-600: #3a6080;--navy-100: #dce8f2;--navy-50: #eef4f9;--teal-600: #0f6e56;--teal-500: #1D9E75;--teal-100: #b0e6d4;--teal-50: #e1f5ee;--red-600: #b91c1c;--red-50: #fef2f2;--white: #ffffff;--gray-50: #f8fafc;--gray-100: #f1f5f9;--gray-200: #e2e8f0;--gray-300: #cbd5e1;--gray-400: #94a3b8;--gray-500: #64748b;--gray-700: #334155;--gray-900: #0f172a;--surface-page: #eef2f7;--surface-card: #ffffff;--surface-glass: rgba(255, 255, 255, .82);--font-sans: "DM Sans", system-ui, -apple-system, "Segoe UI", sans-serif;--font-serif: "DM Serif Display", Georgia, serif;--radius-sm: 8px;--radius-md: 12px;--radius-lg: 20px;--radius-xl: 28px;--radius-pill: 999px;--shadow-xs: 0 1px 3px rgba(0,0,0,.06), 0 1px 2px rgba(0,0,0,.04);--shadow-sm: 0 2px 8px rgba(0,0,0,.07), 0 1px 3px rgba(0,0,0,.05);--shadow-md: 0 4px 16px rgba(0,0,0,.08), 0 2px 6px rgba(0,0,0,.05);--shadow-lg: 0 12px 32px rgba(0,0,0,.1), 0 4px 12px rgba(0,0,0,.06);--ease-out: cubic-bezier(.2, 0, 0, 1);--duration-fast: .15s;--duration-normal: .22s;--duration-slow: .35s}*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}body{font-family:var(--font-sans);background:var(--surface-page);min-height:100vh;color:var(--gray-900);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.app{max-width:1400px;margin:0 auto;padding:0 28px 64px}.navbar{background:var(--navy-900);padding:0 36px;height:64px;display:flex;align-items:center;border-radius:0 0 var(--radius-xl) var(--radius-xl);margin:0 -28px 40px;box-shadow:var(--shadow-md);position:sticky;top:0;z-index:200}.navbar h2{color:var(--white);font-family:var(--font-sans);font-size:1.15rem;font-weight:600;letter-spacing:.02em;display:flex;align-items:center;gap:10px;-webkit-user-select:none;user-select:none}.navbar h2 span{display:inline-flex;align-items:center;justify-content:center;width:28px;height:28px;background:#ffffff1f;border-radius:8px;font-size:.95rem}.app h1{text-align:center;font-family:var(--font-serif);font-weight:400;font-size:clamp(2rem,5vw,3rem);color:var(--navy-900);margin-bottom:10px;letter-spacing:-.02em;line-height:1.15}.subtitle{text-align:center;font-size:1rem;color:var(--gray-500);margin-bottom:40px;font-weight:400;line-height:1.5}.controls{background:var(--surface-glass);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.65);border-radius:var(--radius-xl);padding:14px 18px;margin-bottom:40px;box-shadow:var(--shadow-sm);display:flex;flex-wrap:wrap;align-items:center;gap:12px}.controls input[type=search],.controls input[type=text]{flex:1;min-width:180px;height:42px;padding:0 18px 0 42px;border:1px solid var(--gray-200);border-radius:var(--radius-pill);font-size:.9rem;font-family:var(--font-sans);color:var(--gray-900);background:var(--white) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' viewBox='0 0 24 24'%3E%3Ccircle cx='11' cy='11' r='7' stroke='%2394a3b8' stroke-width='2'/%3E%3Cpath d='M16.5 16.5 21 21' stroke='%2394a3b8' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat 14px center;outline:none;transition:border-color var(--duration-fast) var(--ease-out),box-shadow var(--duration-fast) var(--ease-out)}.controls input:focus{border-color:var(--navy-700);box-shadow:0 0 0 3px #2c4c6c24}.controls input::placeholder{color:var(--gray-400)}.filters{display:flex;flex-wrap:wrap;gap:8px;align-items:center}.filters button{height:38px;padding:0 18px;border:1px solid var(--gray-200);border-radius:var(--radius-pill);font-size:.82rem;font-weight:500;font-family:var(--font-sans);color:var(--gray-700);background:var(--white);cursor:pointer;transition:background var(--duration-fast) var(--ease-out),border-color var(--duration-fast) var(--ease-out),color var(--duration-fast) var(--ease-out),box-shadow var(--duration-fast) var(--ease-out),transform var(--duration-fast) var(--ease-out);white-space:nowrap;-webkit-user-select:none;user-select:none}.filters button:hover{background:var(--navy-50);border-color:var(--navy-100);color:var(--navy-800);transform:translateY(-1px);box-shadow:var(--shadow-xs)}.filters button:active{transform:translateY(0);box-shadow:none}.filters button.active-btn{background:var(--navy-900);border-color:var(--navy-900);color:var(--white);box-shadow:0 4px 12px #1a2a3a47}.filters button.active-btn:hover{background:var(--navy-800);border-color:var(--navy-800)}.clear-btn{height:38px;padding:0 20px;border:1px solid rgba(185,28,28,.22);border-radius:var(--radius-pill);font-size:.82rem;font-weight:500;font-family:var(--font-sans);color:var(--red-600);background:var(--red-50);cursor:pointer;transition:background var(--duration-fast) var(--ease-out),border-color var(--duration-fast) var(--ease-out),color var(--duration-fast) var(--ease-out),transform var(--duration-fast) var(--ease-out),box-shadow var(--duration-fast) var(--ease-out);white-space:nowrap;-webkit-user-select:none;user-select:none}.clear-btn:hover{background:var(--red-600);border-color:var(--red-600);color:var(--white);transform:translateY(-1px);box-shadow:0 4px 12px #b91c1c47}.clear-btn:active{transform:translateY(0);box-shadow:none}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:24px}.card{--accent: #1D9E75;--accent-light: #e1f5ee;--accent-mid: #0f6e56;font-family:var(--font-sans);position:relative;background:var(--surface-card);border:1px solid var(--gray-200);border-radius:var(--radius-lg);padding:0 0 20px;text-align:center;overflow:hidden;cursor:pointer;transition:transform var(--duration-normal) var(--ease-out),box-shadow var(--duration-normal) var(--ease-out),border-color var(--duration-normal) var(--ease-out)}.card:before{content:"";position:absolute;top:0;left:0;right:0;height:88px;background:var(--navy-900);z-index:0}.card:after{content:"";position:absolute;inset:0;border-radius:var(--radius-lg);box-shadow:inset 0 0 0 2px var(--navy-700);opacity:0;transition:opacity var(--duration-normal) var(--ease-out);pointer-events:none;z-index:2}.card:hover{transform:translateY(-6px);box-shadow:var(--shadow-lg);border-color:transparent}.card:hover:after{opacity:1}.card:active{transform:translateY(-3px)}.avatar{position:relative;z-index:1;width:80px;height:80px;border-radius:50%;border:3px solid var(--white);object-fit:cover;display:block;margin:24px auto 16px;box-shadow:0 4px 12px #00000026;transition:transform var(--duration-normal) var(--ease-out)}.card:hover .avatar{transform:scale(1.05)}.card h3{font-family:var(--font-serif);font-size:1.18rem;font-weight:400;color:var(--gray-900);margin:0 0 4px;padding:0 16px}.role{font-size:.72rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--accent-mid);margin:0 0 18px}.skills{display:flex;flex-wrap:wrap;justify-content:center;gap:6px;padding:0 20px}.skills span{font-size:.72rem;font-weight:500;padding:4px 12px;border-radius:var(--radius-pill);background:var(--accent-light);color:var(--navy-900);border:1px solid rgba(15,110,86,.18);transition:background var(--duration-fast) var(--ease-out),color var(--duration-fast) var(--ease-out),border-color var(--duration-fast) var(--ease-out),transform var(--duration-fast) var(--ease-out);cursor:default}.skills span:hover{background:var(--accent);color:var(--white);border-color:var(--accent);transform:scale(1.04)}.profile-btn{background-color:#1a2a3a;color:#fff;padding:10px 16px;margin-top:10px;border:none;border-radius:25px;font-size:13px;font-weight:500;cursor:pointer;transition:all .3s ease;box-shadow:0 4px 10px #00000026}.profile-btn:hover{background-color:#e1f5ee;color:#1a2a3a;transform:translateY(-3px) scale(1.05);box-shadow:0 8px 18px #0003}.profile-btn:active{transform:scale(.98);box-shadow:0 3px 8px #00000026}.modal-backdrop{position:fixed;inset:0;background:#0f172a8c;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;padding:20px;z-index:1000;animation:backdrop-in var(--duration-normal) var(--ease-out) both}@keyframes backdrop-in{0%{opacity:0}to{opacity:1}}.modal{background:var(--white);border:1px solid var(--gray-200);border-radius:var(--radius-xl);padding:30px;width:100%;max-width:480px;overflow:hidden;position:relative;box-shadow:var(--shadow-lg);animation:modal-in var(--duration-slow) var(--ease-out) both}@keyframes modal-in{0%{opacity:0;transform:translateY(16px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}.modal-header{display:flex;align-items:center;gap:16px;padding:20px 20px 18px;border-bottom:1px solid var(--gray-100)}.modal-image{width:60px;height:60px;border-radius:50%;object-fit:cover;border:2px solid var(--gray-100);flex-shrink:0}.modal-header-text{flex:1;min-width:0}.modal-header h2{font-family:var(--font-serif);font-size:1.1rem;font-weight:400;color:var(--gray-900);margin:0 0 3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.modal-role{font-size:.78rem;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--teal-600);margin:0}.modal-content{padding:18px 20px}.modal-bio{font-size:.9rem;line-height:1.65;color:var(--gray-500);margin:0 0 18px}.modal-content h4{font-size:.68rem;font-weight:600;text-transform:uppercase;letter-spacing:.1em;color:var(--gray-400);margin:0 0 10px}.modal-skills{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:20px}.skill-tag{font-size:.77rem;font-weight:500;padding:4px 12px;border-radius:var(--radius-pill);background:var(--gray-100);border:1px solid var(--gray-200);color:var(--gray-700);transition:background var(--duration-fast) var(--ease-out)}.skill-tag:hover{background:var(--gray-200)}.social-links{display:flex;gap:8px;flex-wrap:wrap}.social-links a{font-size:.82rem;font-weight:500;padding:7px 16px;border-radius:var(--radius-sm);border:1px solid var(--gray-200);color:var(--gray-700);background:var(--white);text-decoration:none;transition:background var(--duration-fast) var(--ease-out),border-color var(--duration-fast) var(--ease-out),color var(--duration-fast) var(--ease-out),box-shadow var(--duration-fast) var(--ease-out)}.social-links a:hover{background:var(--gray-50);border-color:var(--gray-300);color:var(--gray-900);box-shadow:var(--shadow-xs)}.modal-footer{display:flex;justify-content:flex-end;padding:14px 20px;border-top:1px solid var(--gray-100);gap:8px}.close-btn{font-size:.82rem;font-weight:500;font-family:var(--font-sans);height:36px;padding:0 18px;border-radius:var(--radius-sm);border:1px solid var(--gray-200);background:var(--white);color:var(--gray-700);cursor:pointer;transition:background var(--duration-fast) var(--ease-out),border-color var(--duration-fast) var(--ease-out),box-shadow var(--duration-fast) var(--ease-out)}.close-btn:hover{background:var(--gray-50);border-color:var(--gray-300);box-shadow:var(--shadow-xs)}.close-icon-btn{position:absolute;top:16px;right:16px;width:30px;height:30px;border-radius:50%;border:1px solid var(--gray-200);background:var(--gray-50);color:var(--gray-500);font-size:.9rem;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background var(--duration-fast) var(--ease-out),color var(--duration-fast) var(--ease-out),border-color var(--duration-fast) var(--ease-out);z-index:10;line-height:1}.close-icon-btn:hover{background:var(--gray-200);color:var(--gray-900);border-color:var(--gray-300)}@keyframes fade-up{0%{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}.card{animation:fade-up var(--duration-slow) var(--ease-out) both}.card:nth-child(1){animation-delay:40ms}.card:nth-child(2){animation-delay:80ms}.card:nth-child(3){animation-delay:.12s}.card:nth-child(4){animation-delay:.16s}.card:nth-child(5){animation-delay:.2s}.card:nth-child(6){animation-delay:.24s}.card:nth-child(7){animation-delay:.28s}.card:nth-child(8){animation-delay:.32s}.empty-state{grid-column:1 / -1;text-align:center;padding:80px 24px;color:var(--gray-400)}.empty-state p:first-child{font-size:2.5rem;margin-bottom:12px}.empty-state p:last-child{font-size:.95rem;color:var(--gray-400)}::-webkit-scrollbar{width:7px;height:7px}::-webkit-scrollbar-track{background:var(--gray-100);border-radius:99px}::-webkit-scrollbar-thumb{background:var(--navy-700);border-radius:99px}::-webkit-scrollbar-thumb:hover{background:var(--navy-900)}:focus-visible{outline:2px solid var(--navy-700);outline-offset:2px}@media(max-width:900px){.app{padding:0 20px 48px}.navbar{margin:0 -20px 32px;padding:0 24px;height:58px}.navbar h2{font-size:1.05rem}.subtitle{margin-bottom:32px}.controls{border-radius:var(--radius-xl);padding:12px 16px;gap:10px}.grid{gap:20px;grid-template-columns:repeat(auto-fill,minmax(260px,1fr))}}@media(max-width:640px){.app{padding:0 14px 40px}.navbar{margin:0 -14px 28px;padding:0 18px;height:54px;border-radius:0 0 var(--radius-lg) var(--radius-lg)}.navbar h2{font-size:.97rem}.app h1{font-size:1.75rem}.subtitle{font-size:.88rem;margin-bottom:24px}.controls{flex-direction:column;align-items:stretch;border-radius:var(--radius-lg);padding:14px;gap:10px}.controls input[type=search],.controls input[type=text]{min-width:0;width:100%}.filters{justify-content:flex-start}.filters button{height:36px;font-size:.78rem;padding:0 14px}.clear-btn{width:100%;text-align:center;justify-content:center;display:flex;align-items:center}.grid{grid-template-columns:1fr;gap:16px}.card{border-radius:var(--radius-lg)}.modal{max-width:100%;border-radius:var(--radius-lg) var(--radius-lg) 0 0;margin-top:auto}.modal-backdrop{align-items:flex-end;padding:0}}@media(max-width:380px){.filters{gap:5px}.filters button{height:34px;font-size:.73rem;padding:0 11px}.modal-header{padding:16px 16px 14px}.modal-content{padding:14px 16px}.modal-footer{padding:12px 16px}}