/* RAIET v1.48.5.5 — public profile UI consolidation.
   This page-specific file is the authoritative visual layer for /profile.php.
   Keep future public-profile polish here instead of stacking more rules in
   main.css. Gameplay, social permissions and profile visibility are unchanged. */

.public-profile-page{
  padding:36px 24px 58px;
  background:
    radial-gradient(ellipse at 13% 7%,rgba(237,23,23,.115),transparent 29%),
    radial-gradient(ellipse at 88% 28%,rgba(38,52,68,.07),transparent 32%),
    #05070a;
}
.public-profile-page .public-profile-shell{width:min(1080px,100%);margin:0 auto}

.public-profile-page .public-profile-identity{
  position:relative;
  min-height:132px;
  padding:23px 25px!important;
  display:flex;
  align-items:center;
  gap:18px;
  overflow:hidden;
  border:1px solid rgba(237,23,23,.18)!important;
  border-radius:15px!important;
  background:
    radial-gradient(circle at 10% 42%,rgba(237,23,23,.19),transparent 25%),
    linear-gradient(116deg,rgba(17,21,27,.995),rgba(8,11,15,.995) 60%,rgba(29,7,10,.58))!important;
  box-shadow:0 24px 68px rgba(0,0,0,.28),inset 0 1px rgba(255,255,255,.025)!important;
}
.public-profile-page .public-profile-identity:before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(96deg,rgba(255,255,255,.015),transparent 34%);
  pointer-events:none;
}
.public-profile-page .public-profile-identity:after{
  content:"";
  position:absolute;
  left:0;
  top:19px;
  bottom:19px;
  width:3px;
  border-radius:0 4px 4px 0;
  background:linear-gradient(#ff4c51,#87090e);
  box-shadow:0 0 22px rgba(237,23,23,.31);
}
.public-profile-page .public-profile-identity>*{position:relative;z-index:1}
.public-profile-page .public-profile-identity .profile-avatar{
  width:76px!important;
  height:76px!important;
  flex:0 0 76px!important;
  margin:0!important;
  border:1px solid rgba(255,83,88,.46)!important;
  border-radius:50%!important;
  background:linear-gradient(145deg,rgba(157,14,20,.72),rgba(18,23,29,.99))!important;
  box-shadow:0 0 0 5px rgba(237,23,23,.07),0 14px 31px rgba(0,0,0,.27)!important;
  color:#fff!important;
  font-size:29px!important;
  text-transform:uppercase;
}
.public-profile-page .public-profile-name{min-width:0}
.public-profile-page .public-profile-name>span{
  color:#ff6065!important;
  font-size:9.5px!important;
  font-weight:950;
  letter-spacing:.13em!important;
}
.public-profile-page .public-profile-name h1{
  margin:4px 0 2px!important;
  color:#fff;
  font-size:29px!important;
  line-height:1.08;
  letter-spacing:-.02em;
  overflow-wrap:anywhere;
}
.public-profile-page .public-profile-name>p{margin:0;color:#96a1ab!important;font-size:11.5px!important}
.public-profile-page .public-profile-hero-meta{margin-top:10px;display:flex;gap:7px;flex-wrap:wrap}
.public-profile-page .public-profile-hero-meta>span{
  min-height:27px;
  padding:0 9px;
  display:inline-flex;
  align-items:center;
  gap:6px;
  border:1px solid rgba(255,255,255,.085);
  border-radius:999px;
  background:rgba(0,0,0,.16);
  color:#acb6bf;
  font-size:10px;
  font-weight:850;
}
.public-profile-page .public-profile-presence i{width:6px;height:6px;border-radius:50%;background:#737e88}
.public-profile-page .public-profile-presence.is-online{color:#dff5e5!important;border-color:rgba(111,202,135,.2)!important}
.public-profile-page .public-profile-presence.is-online i{background:#66c17e;box-shadow:0 0 10px rgba(102,193,126,.45)}

/* Social actions: message/friend are primary; block remains visible but tertiary. */
.public-profile-page .public-profile-actions{
  margin-left:auto!important;
  align-self:center!important;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:8px!important;
  flex-wrap:wrap;
}
.public-profile-page .public-profile-actions form{display:flex;flex:0 0 auto;margin:0}
.public-profile-page .public-profile-message,
.public-profile-page .public-profile-add-friend,
.public-profile-page .public-profile-edit{
  min-height:36px!important;
  height:36px!important;
  padding:0 14px!important;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:8px!important;
  font-size:9.5px!important;
  font-weight:950;
  letter-spacing:.035em;
  text-decoration:none;
  white-space:nowrap;
  transition:border-color .15s ease,background .15s ease,filter .15s ease,transform .15s ease;
}
.public-profile-page .public-profile-message,
.public-profile-page .public-profile-add-friend{
  border:1px solid rgba(237,23,23,.54)!important;
  background:linear-gradient(180deg,rgba(169,15,21,.86),rgba(91,8,12,.82))!important;
  color:#fff!important;
  clip-path:none!important;
  box-shadow:0 9px 22px rgba(120,8,13,.13)!important;
}
.public-profile-page .public-profile-message:hover,
.public-profile-page .public-profile-add-friend:hover{border-color:rgba(255,76,82,.8)!important;filter:brightness(1.08);transform:translateY(-1px)}
.public-profile-page .public-profile-edit{margin-left:auto;border:1px solid rgba(255,255,255,.14);background:#0a0e13;color:#eef2f5}
.public-profile-page .public-profile-edit:hover{border-color:rgba(255,255,255,.25);background:#10151b}
.public-profile-page .public-profile-friend-state{
  min-height:32px!important;
  height:32px!important;
  min-width:0!important;
  padding:0 9px!important;
  display:inline-flex;
  align-items:center;
  border:1px solid rgba(102,193,126,.17);
  border-radius:7px!important;
  background:rgba(102,193,126,.04);
  color:#a8d7b5;
  font-size:8.5px!important;
  font-weight:900;
}
.public-profile-page .public-profile-friend-state.pending{border-color:rgba(255,184,72,.17);background:rgba(255,184,72,.035);color:#d8ba82}
.public-profile-page .public-profile-block{margin-left:2px}
.public-profile-page .public-profile-block-button,
.public-profile-page .public-profile-unblock{
  min-width:0!important;
  min-height:32px!important;
  height:32px!important;
  padding:0 7px!important;
  border:0!important;
  border-radius:6px!important;
  background:transparent!important;
  box-shadow:none!important;
  color:#83676a!important;
  font-size:8.5px!important;
  font-weight:900;
  cursor:pointer;
}
.public-profile-page .public-profile-block-button:hover{background:rgba(237,23,23,.045)!important;color:#e08d91!important}
.public-profile-page .public-profile-unblock{color:#8d969e!important}
.public-profile-page .public-profile-unblock:hover{background:rgba(255,255,255,.035)!important;color:#dce2e7!important}

.public-profile-page .public-profile-stats{
  margin-top:13px;
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:9px;
}
.public-profile-page .public-profile-stats>div{
  position:relative;
  min-height:78px;
  padding:13px 15px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.072);
  border-radius:11px;
  background:linear-gradient(155deg,rgba(14,19,25,.97),rgba(7,10,14,.985));
}
.public-profile-page .public-profile-stats>div:before{content:"";position:absolute;left:0;top:0;bottom:0;width:2px;background:rgba(237,23,23,.67)}
.public-profile-page .public-profile-stats span,
.public-profile-page .public-profile-stats strong,
.public-profile-page .public-profile-stats small{display:block}
.public-profile-page .public-profile-stats span{color:#7f8a94;font-size:9px;font-weight:900;letter-spacing:.055em;text-transform:uppercase}
.public-profile-page .public-profile-stats strong{margin-top:7px;color:#f0f3f5;font-size:16px;line-height:1.2;overflow-wrap:anywhere}
.public-profile-page .public-profile-stats small{margin-top:4px;color:#77828c;font-size:8.5px;font-weight:800;letter-spacing:.025em;text-transform:uppercase}
.public-profile-page .public-profile-stat-reputation strong{color:#eaf4ed}

.public-profile-page .public-profile-grid{
  margin-top:13px!important;
  display:grid;
  grid-template-columns:minmax(0,1fr) 310px!important;
  gap:13px!important;
  align-items:start;
}
.public-profile-page .public-profile-main,
.public-profile-page .public-profile-info{
  padding:20px!important;
  border:1px solid rgba(255,255,255,.073)!important;
  border-radius:12px!important;
  background:linear-gradient(150deg,rgba(12,17,23,.985),rgba(6,9,13,.995))!important;
  box-shadow:0 18px 48px rgba(0,0,0,.19);
}
.public-profile-page .public-profile-section+.public-profile-section{margin-top:22px;padding-top:19px;border-top:1px solid rgba(255,255,255,.06)}
.public-profile-page .public-profile-section h2,
.public-profile-page .public-profile-info h2{margin:0 0 12px;color:#f1f3f5;font-size:15px!important;letter-spacing:.02em}
.public-profile-page .public-profile-bio,
.public-profile-page .public-empty{margin:0;color:#adb7c0!important;font-size:11.5px!important;line-height:1.72!important}

/* Game identity cards: visual enough to scan quickly, still compact. */
.public-profile-page .public-game-list{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:8px!important;
  overflow:visible!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
}
.public-profile-page .public-game-row{
  position:relative;
  min-height:68px!important;
  padding:9px 10px!important;
  display:grid!important;
  grid-template-columns:46px minmax(0,1fr) auto!important;
  gap:10px!important;
  align-items:center!important;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.073)!important;
  border-radius:10px!important;
  background:linear-gradient(145deg,rgba(8,12,17,.91),rgba(5,8,12,.78))!important;
}
.public-profile-page .public-game-row:after{content:"";position:absolute;inset:auto 0 0 0;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.04),transparent)}
.public-profile-page .public-game-row.is-primary{border-color:rgba(237,23,23,.19)!important;background:linear-gradient(145deg,rgba(20,10,13,.92),rgba(6,9,13,.83))!important}
.public-profile-page .public-game-visual{
  width:46px;
  height:46px;
  display:grid;
  place-items:center;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.075);
  border-radius:8px;
  background:#080b0f;
  color:#c7d0d7;
  font-size:10px;
  font-weight:950;
  letter-spacing:.04em;
}
.public-profile-page .public-game-visual img{width:100%;height:100%;display:block;object-fit:cover;filter:saturate(.88) brightness(.82) contrast(1.05)}
.public-profile-page .public-game-row.is-primary .public-game-visual{border-color:rgba(237,23,23,.22)}
.public-profile-page .public-game-copy{min-width:0}
.public-profile-page .public-game-copy strong{display:block;color:#f0f3f5!important;font-size:11.5px!important;line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.public-profile-page .public-game-copy span{display:block;margin-top:4px;color:#87939d!important;font-size:9.5px!important;line-height:1.3}
.public-profile-page .public-game-row em{
  align-self:start;
  grid-column:auto!important;
  width:auto!important;
  margin:0;
  padding:4px 6px;
  border:1px solid rgba(237,23,23,.28);
  border-radius:5px!important;
  background:rgba(237,23,23,.045);
  color:#ff6f74;
  font-size:7.5px!important;
  font-style:normal;
  font-weight:950;
  letter-spacing:.04em;
}

/* Hero already carries region + communication languages. Keep the side card
   focused on complementary information instead of repeating the same facts. */
.public-profile-page .public-profile-info{padding-top:19px!important}
.public-profile-page .public-info-row{
  min-height:52px!important;
  padding:10px 0!important;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  border-bottom:1px solid rgba(255,255,255,.052);
}
.public-profile-page .public-info-row:last-child{border-bottom:0}
.public-profile-page .public-info-row span{color:#82909a!important;font-size:9.5px!important;font-weight:900;text-transform:uppercase;letter-spacing:.05em}
.public-profile-page .public-info-row strong{max-width:175px!important;color:#e9edf0!important;font-size:11px!important;line-height:1.4;text-align:right;overflow-wrap:anywhere}
.public-profile-page .public-info-row-featured strong{color:#fff!important}

.public-profile-page .public-profile-private{border-radius:12px!important}
.public-profile-page .public-profile-bottom{padding-top:16px}
.public-profile-page .public-profile-bottom a{color:#7f8a94;font-size:10px!important;font-weight:900}
.public-profile-page .public-profile-bottom a:hover{color:#e7ecef}

@media(max-width:820px){
  .public-profile-page .public-profile-stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .public-profile-page .public-profile-grid{grid-template-columns:1fr!important}
  .public-profile-page .public-profile-info{order:-1}
}

@media(max-width:620px){
  .public-profile-page{padding:18px 11px 40px}
  .public-profile-page .public-profile-identity{padding:18px!important;gap:14px;align-items:flex-start;flex-wrap:wrap}
  .public-profile-page .public-profile-identity .profile-avatar{width:62px!important;height:62px!important;flex-basis:62px!important;font-size:23px!important}
  .public-profile-page .public-profile-name h1{font-size:24px!important}
  .public-profile-page .public-profile-name>p{font-size:10.5px!important}
  .public-profile-page .public-profile-hero-meta{gap:6px}
  .public-profile-page .public-profile-hero-meta>span{min-height:25px;padding:0 8px;font-size:9px}
  .public-profile-page .public-profile-actions{width:100%;margin-left:0!important;justify-content:flex-start!important}
  .public-profile-page .public-profile-message,
  .public-profile-page .public-profile-add-friend{flex:1 1 125px}
  .public-profile-page .public-profile-actions form:not(.public-profile-block){flex:1 1 125px}
  .public-profile-page .public-profile-actions form:not(.public-profile-block) button{width:100%!important}
  .public-profile-page .public-profile-block{margin-left:auto}
  .public-profile-page .public-profile-edit{width:100%;margin-left:0;text-align:center}
  .public-profile-page .public-profile-stats{grid-template-columns:1fr 1fr;gap:8px}
  .public-profile-page .public-profile-stats>div{min-height:70px;padding:11px 12px}
  .public-profile-page .public-profile-stats strong{font-size:14px}
  .public-profile-page .public-profile-main,
  .public-profile-page .public-profile-info{padding:16px!important}
  .public-profile-page .public-game-list{grid-template-columns:1fr!important}
  .public-profile-page .public-game-row{min-height:66px!important}
  .public-profile-page .public-info-row strong{max-width:58% !important}
}

@media(max-width:390px){
  .public-profile-page .public-profile-stats{grid-template-columns:1fr}
  .public-profile-page .public-profile-stats>div{min-height:64px}
}

/* Compact social discovery additions: invitation action + mutual friends. */
.public-profile-page .profile-avatar.has-image{overflow:hidden;padding:0!important}
.public-profile-page .profile-avatar.has-image img{width:100%;height:100%;display:block;object-fit:cover;border-radius:inherit}
.public-profile-page .public-profile-invite{
  min-height:36px;height:36px;padding:0 13px;border:1px solid rgba(91,222,172,.32);border-radius:8px;
  background:linear-gradient(180deg,rgba(25,101,75,.66),rgba(11,52,39,.74));color:#eafff7;
  font-size:9.5px;font-weight:950;letter-spacing:.035em;cursor:pointer;white-space:nowrap;box-shadow:none;
}
.public-profile-page .public-profile-invite:hover{border-color:rgba(112,240,191,.55);filter:brightness(1.08)}
.public-profile-page .public-profile-invite-state{
  min-height:32px;padding:0 9px;display:inline-flex;align-items:center;border:1px solid rgba(255,255,255,.08);
  border-radius:7px;background:rgba(255,255,255,.025);color:#7f8a94;font-size:8.5px;font-weight:900;white-space:nowrap
}
.public-profile-page .public-mutual-friends{margin-top:11px;padding-top:11px;border-top:1px solid rgba(255,255,255,.055)}
.public-profile-page .public-mutual-head{display:flex;align-items:center;justify-content:space-between;gap:10px}
.public-profile-page .public-mutual-head span{color:#82909a;font-size:9.5px;font-weight:900;letter-spacing:.05em}
.public-profile-page .public-mutual-head strong{min-width:24px;height:22px;padding:0 7px;display:inline-flex;align-items:center;justify-content:center;border:1px solid rgba(255,255,255,.09);border-radius:999px;color:#dbe2e7;font-size:9.5px}
.public-profile-page .public-mutual-list{display:flex;align-items:center;gap:7px;margin-top:9px;overflow:hidden}
.public-profile-page .public-mutual-list a{min-width:0;max-width:72px;display:flex;flex-direction:column;align-items:center;gap:5px;color:#aeb8c0;text-decoration:none}
.public-profile-page .public-mutual-list a:hover{color:#fff}
.public-profile-page .public-mutual-avatar{width:30px;height:30px;display:grid;place-items:center;overflow:hidden;border:1px solid rgba(255,255,255,.1);border-radius:50%;background:linear-gradient(145deg,#27313a,#11171d);color:#aef1d7;font-size:10px;font-weight:950}
.public-profile-page .public-mutual-avatar.has-image{padding:0}
.public-profile-page .public-mutual-avatar img{width:100%;height:100%;display:block;object-fit:cover}
.public-profile-page .public-mutual-list small{width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:center;font-size:8.5px}
@media(max-width:620px){
  .public-profile-page .public-profile-invite{flex:1 1 125px}
  .public-profile-page .public-mutual-list{justify-content:flex-start}
}
