.team-page { margin:0; background:#050505; color:#f8f5f2; font-family:Arial,Helvetica,sans-serif; overflow-x:clip; }
.team-page *, .team-page *::before, .team-page *::after { box-sizing:border-box; }
.team-page header.liquid-glass-nav { opacity:1!important; }
.team-main { width:min(1100px,calc(100% - 48px)); margin:auto; padding:160px 0 40px; }
.team-hero { position:relative; padding:0 0 64px; max-width:760px; }
.team-hero::before { content:''; position:absolute; width:650px; height:500px; top:-150px; left:-220px; background:radial-gradient(ellipse,rgba(255,118,77,.11),transparent 65%); pointer-events:none; z-index:-1; }
.team-kicker { color:#f6b29b; text-transform:uppercase; font-size:11px; letter-spacing:.2em; font-weight:600; }
.team-hero h1 { font-size:clamp(42px,6.3vw,78px); font-weight:600; line-height:1.05; letter-spacing:-.055em; margin:20px 0; }
.team-hero h1 span { background:linear-gradient(150deg,#ffe8dd,#ff7959); background-clip:text; color:transparent; }
.team-hero > p:last-child { max-width:480px; color:#a6a09d; line-height:1.7; font-size:16px; }
.team-section { margin-bottom:56px; }
.team-section-heading { display:flex; align-items:baseline; gap:15px; margin-bottom:22px; }
.team-section-heading h2 { font-size:20px; font-weight:500; letter-spacing:-.025em; margin:0; }
.team-section-heading::after { content:''; flex:1; height:1px; background:rgba(255,255,255,.1); }
.team-leads { display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:20px; }
.team-lead { position:relative; padding:30px; border-radius:24px; border:1px solid rgba(255,255,255,.14); background:linear-gradient(130deg,rgba(255,224,207,.075),rgba(255,255,255,.015)); box-shadow:inset 0 1px 0 rgba(255,255,255,.1); }
.team-lead:nth-child(2) { background:linear-gradient(130deg,rgba(186,162,221,.1),rgba(255,255,255,.015)); }
.team-monogram { width:58px; height:58px; border-radius:19px; display:grid; place-items:center; color:#ffd3be; background:linear-gradient(135deg,#57372e,#231c19); border:1px solid #765141; font-size:23px; font-weight:500; transform:rotate(-6deg); margin-bottom:28px; }
.team-lead:nth-child(2) .team-monogram { transform:rotate(6deg); background:linear-gradient(135deg,#41364e,#211d27); border-color:#665471; color:#e1caf4; }
.team-lead h3 { margin:0 0 7px; font-size:26px; font-weight:500; letter-spacing:-.04em; }
.team-role { color:#b7a299; font-size:13px; margin:0; }
.team-profile { display:inline-flex; gap:8px; color:#e2d9d4; text-decoration:none; font-size:12px; margin-top:20px; }
.team-profile:hover { color:#ffb59a; }
.team-roster { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); column-gap:54px; }
.team-person { display:grid; grid-template-columns:40px minmax(0,1fr) auto; gap:14px; align-items:center; padding:23px 0; border-bottom:1px solid rgba(255,255,255,.08); }
.team-person-mark { width:36px; height:36px; display:grid; place-items:center; border-radius:12px; background:rgba(255,186,159,.07); color:#ddb7a8; font-size:14px; }
.team-person:nth-child(3n+2) .team-person-mark { background:rgba(172,161,213,.09); color:#c2b6e4; }
.team-person h3 { margin:0 0 5px; font-size:16px; font-weight:500; }
.team-handle { margin:0; font-size:12px; color:#84807c; overflow-wrap:anywhere; }
.team-person .team-role { font-size:12px; text-align:right; max-width:90px; line-height:1.5; }
.team-join { display:flex; align-items:center; justify-content:space-between; gap:24px; padding:30px 0; border-top:1px solid rgba(255,255,255,.12); }
.team-join h2 { font-size:24px; letter-spacing:-.03em; font-weight:500; margin:0 0 8px; }
.team-join p { color:#92908d; font-size:14px; margin:0; }
.team-join a { display:inline-flex; align-items:center; gap:12px; white-space:nowrap; color:#ffe0d3; text-decoration:none; font-size:13px; padding:13px 20px; border-radius:30px; border:1px solid rgba(255,190,164,.3); background:linear-gradient(130deg,rgba(255,190,164,.14),rgba(255,255,255,.025)); box-shadow:inset 0 1px 0 rgba(255,255,255,.2); }
.team-page a:focus-visible { outline:2px solid #ffc4ae; outline-offset:5px; }
@keyframes team-arrive { from { opacity:0; transform:translateY(18px); } to { opacity:1; transform:none; } }
.team-main { animation:team-arrive .8s cubic-bezier(.16,1,.3,1) both; }
html.page-intro-skipped .team-main { animation:none; }
@media(max-width:650px) { .team-main { width:calc(100% - 36px); padding-top:125px; } .team-hero { padding-bottom:36px; } .team-roster { grid-template-columns:1fr; } .team-leads { grid-template-columns:1fr; } .team-lead { padding:24px; } .team-monogram { margin-bottom:20px; } .team-section { margin-bottom:38px; } .team-join { align-items:flex-start; flex-direction:column; } }
@media(prefers-reduced-motion:reduce) { .team-main { animation:none; } }
@media(max-width:650px) { .team-hero::before { left:-18px; width:100vw; } }
.team-page a[aria-current="page"] { color:#ffc4ae; }
.team-monogram { position:relative; overflow:hidden; width:72px; height:72px; }
.team-avatar { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
/* Decorations extend beyond the avatar, as they do on Discord. */
.team-monogram, .team-lead:nth-child(2) .team-monogram { overflow:visible; border-radius:50%; transform:none; }
.team-avatar { border-radius:50%; }
.team-decoration { position:absolute; z-index:1; width:121%; height:121%; max-width:none; left:-10.5%; top:-10.5%; object-fit:contain; pointer-events:none; }
.team-nameplate { position:relative; isolation:isolate; min-height:58px; display:flex; align-items:center; margin:0 -12px 12px; padding:10px 12px; border-radius:10px; overflow:hidden; }
.team-nameplate h3 { position:relative; z-index:1; margin:0; text-shadow:0 1px 8px #000; }
.team-nameplate-media { position:absolute; inset:0; z-index:-1; background:#14141a; }
.team-nameplate-media::after { content:''; position:absolute; inset:0; background:linear-gradient(90deg,rgba(0,0,0,.65),rgba(0,0,0,.12)); }
.team-nameplate-media img,.team-nameplate-media video { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.team-profile-links { display:flex; gap:9px; margin-top:20px; }
.team-profile-icon { display:grid; place-items:center; width:36px; height:36px; border:0; border-radius:0; color:#d3c8c3; background:transparent; transition:color .2s; }
.team-profile-icon svg { width:25px; height:25px; }
.team-profile-icon:hover { color:#ffd1bb; background:transparent; }
@media(prefers-reduced-motion:reduce) { .team-nameplate-media video { display:none; } .team-profile-icon { transition:none; } }
/* Roster identities share the live Discord treatment, with roles on the right. */
.team-person { grid-template-columns:minmax(0,1fr) auto; gap:16px; padding:14px 0; }
.team-person-identity.team-nameplate { margin:0; min-height:70px; padding:12px; gap:14px; }
.team-person .team-monogram { flex-shrink:0; width:40px; height:40px; margin:0; font-size:15px; z-index:1; }
.team-person-names { position:relative; z-index:1; min-width:0; }
.team-person .team-discord-name { font-size:15px; margin:0 0 5px; overflow-wrap:anywhere; letter-spacing:0; }
.team-person .team-handle { font-size:12px; }
@media(max-width:400px) { .team-person { gap:8px; } .team-person-identity.team-nameplate { padding:10px 4px; gap:10px; } .team-person .team-role { max-width:76px; font-size:11px; } }

.team-page [hidden] { display:none !important; }

/* Compact Discord identity details inside leadership nameplates. */
.team-lead-identity { position:relative; z-index:1; min-width:0; width:100%; }
.team-display-row { display:flex; align-items:center; flex-wrap:wrap; gap:8px; }
.team-discord-flair { display:inline-flex; align-items:center; flex-wrap:wrap; gap:5px; }
.team-guild-tag { display:inline-flex; align-items:center; gap:4px; padding:3px 5px; border-radius:5px; background:rgba(35,35,42,.85); font-size:10px; font-weight:600; color:#eee; }
.team-guild-tag img { width:14px; height:14px; object-fit:contain; }
.team-discord-badge { width:19px; height:19px; object-fit:contain; }
.team-copy-username { display:block; max-width:100%; margin-top:4px; padding:2px 0; border:0; background:none; color:#beb8b7; font:inherit; font-size:12px; text-align:left; overflow-wrap:anywhere; cursor:pointer; text-shadow:0 1px 5px #000; }
.team-copy-username:hover { color:#ffd1bb; }
.team-copy-username:focus-visible { outline:2px solid #ffc4ae; outline-offset:3px; border-radius:2px; }
.team-copy-status { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
