:root { color-scheme: dark; --gold:#bba264; --panel:#111115; --line:#24242a; --muted:#77777f; --text:#f1f0f2; }
* { box-sizing: border-box; }
body { min-height:100vh; margin:0; overflow-x:hidden; display:grid; place-items:center; background:#070708; color:var(--text); font-family:"DM Sans", sans-serif; }
body::before { content:""; position:fixed; inset:0; pointer-events:none; opacity:.3; background-image:linear-gradient(rgba(255,255,255,.016) 1px, transparent 1px),linear-gradient(90deg,rgba(255,255,255,.016) 1px, transparent 1px); background-size:38px 38px; mask-image:radial-gradient(circle at center, black, transparent 72%); }
.ambient { position:fixed; width:35rem; height:35rem; border-radius:50%; filter:blur(110px); opacity:.15; pointer-events:none; }
.ambient-one { background:#b48d32; top:-22rem; right:-12rem; }.ambient-two { background:#4d3aa1; bottom:-22rem; left:-15rem; }
.profile-shell { width:min(100%, 520px); padding:32px 18px; position:relative; }
.profile-card { min-height:650px; padding:38px 24px 20px; border:1px solid #202025; border-radius:4px; background:linear-gradient(150deg,rgba(24,24,29,.98),rgba(12,12,15,.98) 60%); box-shadow:0 24px 80px rgba(0,0,0,.5), inset 0 1px rgba(255,255,255,.02); }
.profile-header { text-align:center; }.avatar-wrap { position:relative; width:108px; height:108px; margin:-88px auto 19px; border-radius:50%; padding:4px; background:linear-gradient(145deg,#bd9e59,#4c432d); box-shadow:0 8px 24px rgba(0,0,0,.55); }
.avatar { width:100%; height:100%; overflow:hidden; border-radius:50%; border:3px solid #151517; background:#111; }.avatar img { display:block; width:100%; height:100%; object-fit:cover; }
.online-dot { position:absolute; right:4px; bottom:8px; width:18px; height:18px; border-radius:50%; background:#2fc578; border:4px solid #19191d; }
h1 { margin:0; font:700 31px/1 "Space Grotesk", sans-serif; letter-spacing:-1.2px; }.identity { margin:9px 0 14px; display:flex; justify-content:center; gap:8px; color:#85858d; font-size:14px; }.identity i { color:var(--gold); font-size:13px; }
.badges { display:flex; justify-content:center; gap:7px; }.badge { display:grid; place-items:center; width:26px; height:26px; border-radius:5px; color:#fff; font-size:13px; box-shadow:inset 0 1px rgba(255,255,255,.24); }.coral{background:#eb7865}.violet{background:#d869df}.blue{background:#6076d6}
.divider { height:1px; background:linear-gradient(90deg,transparent,var(--line),transparent); margin:38px 10px 21px; }.bio { margin:0 0 24px; text-align:center; color:#9a9aa1; font-size:14px; }.bio b { color:#c3a869; font-weight:700; }
.links { display:grid; gap:11px; }.link-card { min-height:72px; padding:11px 15px; display:flex; align-items:center; gap:13px; text-decoration:none; color:inherit; border:1px solid #29292f; border-radius:14px; background:linear-gradient(105deg,#151519,#131317); transition:transform .2s ease,border-color .2s ease,background .2s ease; }.link-card:hover { transform:translateY(-2px); border-color:#6a5a35; background:#18181e; }.link-icon { display:grid; flex:none; place-items:center; width:34px; height:34px; border-radius:9px; background:#1e1d18; color:#c4a761; box-shadow:inset 0 0 0 1px #343024; }.link-icon.discord{color:#e5cc77}.link-icon.github{color:#e2c978}.link-copy { display:grid; gap:1px; text-align:left; }.link-copy strong{font-size:15px;line-height:1.15}.link-copy small{font-size:12px;color:#72727a}.arrow { margin-left:auto; color:#696970; font-size:13px; }
.socials { display:flex; justify-content:center; gap:10px; margin:18px 0; }.socials a { width:39px; height:39px; display:grid; place-items:center; border:1px solid #29292f; border-radius:10px; background:#17171b; color:#96969c; text-decoration:none; transition:color .2s, border-color .2s, transform .2s; }.socials a:hover{color:#d2b66e;border-color:#675a38;transform:translateY(-2px)}
.player { display:flex; align-items:center; gap:12px; padding:12px 15px; min-height:63px; border:1px solid #29292f; border-radius:14px; background:#151519; }.play { display:grid; place-items:center; width:37px; height:37px; border:0; border-radius:50%; background:#2e2b20; color:#c6a65b; cursor:pointer; transition:transform .2s, background .2s; }.play:hover{transform:scale(1.07);background:#3b3626}.play i{margin-left:2px}.volume{color:#7e7e85;font-size:14px}input[type=range]{appearance:none; width:100%; height:3px; border-radius:2px; background:linear-gradient(90deg,#bba264 38%,#5a5133 38%); outline:none;}input[type=range]::-webkit-slider-thumb{appearance:none;width:14px;height:14px;border-radius:50%;background:#cfb56e;box-shadow:0 0 0 3px rgba(207,181,110,.12);cursor:pointer}input[type=range]::-moz-range-thumb{width:14px;height:14px;border:0;border-radius:50%;background:#cfb56e;cursor:pointer}
.youtube-player { position:fixed; width:240px; height:135px; left:-260px; top:-155px; border:0; opacity:.01; pointer-events:none; }
footer { margin-top:19px; display:flex; justify-content:space-between; color:#5c5c64; font-size:10px; letter-spacing:.7px; text-transform:uppercase; }footer i{color:#777}
@media (max-width:480px){.profile-shell{padding:76px 12px 18px}.profile-card{padding:34px 18px 17px;min-height:620px}.avatar-wrap{width:96px;height:96px;margin-top:-79px}.divider{margin-top:32px}.link-card{min-height:68px}}