.profile4-hero{overflow:hidden;border:1px solid rgba(0,234,212,.3);border-radius:20px;background:#07131d}
.profile4-banner{position:relative;height:240px;background:radial-gradient(circle at 65% 25%,rgba(76,55,156,.44),transparent 32rem),linear-gradient(135deg,#092832,#16162d 55%,#073b3a);background-size:cover;background-position:center}
.profile4-banner:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 40%,rgba(3,12,18,.68))}
.profile4-banner.has-image:after{background:linear-gradient(180deg,rgba(2,10,15,.06),rgba(2,10,15,.68))}
.profile4-head{position:relative;display:flex;align-items:flex-end;gap:20px;padding:0 28px 24px;margin-top:-62px;z-index:2}
.profile4-avatar{position:relative;display:grid;place-items:center;flex:0 0 auto;width:132px;height:132px;border:6px solid #07131d;border-radius:50%;overflow:visible;background:linear-gradient(145deg,#57e9e0,#26cfc3);box-shadow:0 0 0 2px rgba(0,234,212,.55)}
.profile4-avatar img{width:100%;height:100%;object-fit:cover;border-radius:50%}
.profile4-avatar>span{font-size:42px;font-weight:950;color:#042226}
.profile4-avatar>i{position:absolute;right:4px;bottom:10px;width:22px;height:22px;border:4px solid #07131d;border-radius:50%;background:#45df9a}
.profile4-avatar .status-away{background:#ffbe50}.profile4-avatar .status-busy{background:#ff5f78}.profile4-avatar .status-offline{background:#667985}
.profile4-head>div:nth-child(2){flex:1;min-width:0}
.profile4-head small{color:var(--accent,#00ead4);font-weight:950;letter-spacing:.14em}
.profile4-head h1{margin:5px 0 9px;font-size:clamp(32px,4vw,54px);letter-spacing:-.04em}
.profile4-head a,.profile4-button,.profile4-save{display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:10px 16px;border:1px solid rgba(0,234,212,.4);border-radius:10px;background:linear-gradient(135deg,#51e9df,#1ed7cc);color:#032025;font-weight:950;text-decoration:none;cursor:pointer}
.profile4-badges{display:flex;flex-wrap:wrap;gap:7px}.profile4-badges span{padding:5px 9px;border:1px solid rgba(0,234,212,.23);border-radius:999px;color:#92b3bd;background:rgba(0,234,212,.045);font-size:9px;font-weight:850}.profile4-badges .status{color:#45df9a}
.profile4-status-text{margin:10px 0 0;color:#88a6b0}
.profile4-xp-line{max-width:720px;margin-top:16px}.profile4-xp-line>div:first-child{display:flex;justify-content:space-between;gap:12px;color:#71919c;font-size:9px}.profile4-xp-line b{color:#a6c1c9}
.profile4-xp{height:8px;margin-top:7px;overflow:hidden;border-radius:999px;background:#14262e}.profile4-xp i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#14bdb8,#38eee0)}
.profile4-grid{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(280px,.6fr);gap:14px;margin-top:14px}.profile4-grid main,.profile4-grid aside{display:grid;align-content:start;gap:14px}.profile4-grid .card{margin-top:0}.profile4-bio{white-space:pre-wrap;line-height:1.65}
.profile4-socials{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.profile4-socials div{padding:11px;border:1px solid var(--line);border-radius:9px;background:#06151f}.profile4-socials strong,.profile4-socials span{display:block}.profile4-socials span{margin-top:4px;color:var(--muted);overflow-wrap:anywhere}
.profile4-stats{display:grid;grid-template-columns:1fr 1fr;gap:8px}.profile4-stats div{padding:14px;border:1px solid var(--line);border-radius:9px;text-align:center}.profile4-stats strong,.profile4-stats span{display:block}.profile4-stats strong{font-size:24px}.profile4-stats span{color:var(--muted)}
.profile4-links{display:grid;gap:8px}.profile4-links a{padding:10px;border:1px solid var(--line);border-radius:9px;color:#dce9ee;text-decoration:none}
.profile4-edit{display:grid;gap:14px;margin-top:16px}.profile4-edit .card{margin-top:0}.profile4-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.profile4-form label{display:grid;gap:6px;color:var(--muted);font-size:11px}.profile4-form label.full{grid-column:1/-1}.profile4-form input,.profile4-form select,.profile4-form textarea{width:100%;padding:11px;border:1px solid var(--line);border-radius:9px;background:#041019;color:#fff}.profile4-form .check{display:flex;align-items:center;flex-direction:row}.profile4-form .check input{width:auto}.profile4-save{width:220px}
.profile-media-editor{display:grid;grid-template-columns:minmax(280px,.72fr) minmax(420px,1.28fr);gap:14px;margin-top:16px}
.profile-media-card{display:grid;align-content:start;gap:14px;margin:0!important;overflow:hidden}
.profile-media-title small{color:#00ead4;font-weight:950;letter-spacing:.16em}.profile-media-title h2{margin:4px 0}.profile-media-title p{margin:0;color:#748f99;font-size:10px}
.profile-media-avatar-preview{width:160px;height:160px;display:grid;place-items:center;overflow:hidden;border:5px solid #06151d;border-radius:50%;background:linear-gradient(145deg,#59e9df,#2ad0c7);box-shadow:0 0 0 2px rgba(0,234,212,.32)}
.profile-media-avatar-preview img{width:100%;height:100%;object-fit:cover}.profile-media-avatar-preview span{color:#03262a;font-size:48px;font-weight:950}
.profile-media-banner-preview{position:relative;display:grid;place-items:center;min-height:180px;overflow:hidden;border:1px solid rgba(0,234,212,.18);border-radius:14px;background:radial-gradient(circle at 70% 20%,rgba(72,53,160,.45),transparent 20rem),linear-gradient(135deg,#092831,#15152d 55%,#073a39);background-size:cover;background-position:center}
.profile-media-banner-preview:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent,rgba(3,12,17,.5))}.profile-media-banner-preview span{position:relative;z-index:1;color:rgba(255,255,255,.24);font-weight:950;letter-spacing:.15em;text-transform:uppercase}.profile-media-banner-preview.has-image span{display:none}
.profile-media-upload{display:grid;gap:10px}
.profile-media-drop{position:relative;display:grid;gap:3px;padding:18px;border:1px dashed rgba(0,234,212,.34);border-radius:12px;background:rgba(0,234,212,.025);cursor:pointer;transition:.18s ease}
.profile-media-drop:hover,.profile-media-drop.is-dragging{border-color:#00ead4;background:rgba(0,234,212,.07)}
.profile-media-drop input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
.profile-media-drop strong{color:#dcecef}.profile-media-drop span,.profile-media-drop small{color:#738f99;font-size:10px}
.profile-media-delete{min-height:38px;padding:8px 12px;border:1px solid rgba(255,91,115,.25);border-radius:9px;color:#ff8395;background:rgba(255,91,115,.045);font-weight:800;cursor:pointer}
.profile-media-file{margin-top:4px;color:#00ead4!important}
@media(max-width:950px){.profile-media-editor,.profile4-grid{grid-template-columns:1fr}.profile4-head{align-items:center;flex-wrap:wrap}}
@media(max-width:700px){.profile4-banner{height:170px}.profile4-avatar{width:100px;height:100px}.profile4-head{padding:0 16px 18px}.profile4-head a{width:100%}.profile4-socials,.profile4-form{grid-template-columns:1fr}.profile4-form label.full{grid-column:auto}.profile-media-avatar-preview{width:128px;height:128px}}