/* Compact GTA Online server rows. Session detail sheets keep their existing layout. */
body.online-portal .online-about-button,
body.online-portal .online-guide-open,
body.online-portal .online-session-tools{display:none!important}
body.online-portal #public-sessions .online-session-columns{display:none}
body.online-portal #online-session-list{display:grid;gap:8px;border-top:0;padding:5px 0 12px}

body.online-portal #online-session-list .online-session{
 position:relative;
 display:grid;
 grid-template-columns:minmax(0,1fr) 68px 70px;
 grid-template-rows:auto;
 align-items:center;
 column-gap:12px;
 row-gap:0;
 min-height:73px;
 margin:0;
 padding:12px 15px;
 border:1px solid #030303!important;
 border-radius:9px;
 background:linear-gradient(145deg,rgba(23,24,24,.96),rgba(12,13,13,.94));
 box-shadow:0 7px 24px rgba(0,0,0,.30),inset 0 1px 0 rgba(255,255,255,.03);
 isolation:isolate;
}
body.online-portal #online-session-list .online-session::before,
body.online-portal #online-session-list .online-session::after{display:none!important}
body.online-portal #online-session-list .online-session-host{grid-column:1;grid-row:1;min-width:0}
body.online-portal #online-session-list .session-row-title{display:flex;align-items:center;gap:8px;min-width:0}
body.online-portal #online-session-list h3{margin:0;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:700 14px/1.35 'DM Sans',Arial,sans-serif;letter-spacing:0;color:#f4f4f5}
body.online-portal #online-session-list .online-country-flag{font-size:15px}
body.online-portal #online-session-list small{display:block;margin:3px 0 0;font-size:9.5px;line-height:1.4;color:#929397;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
body.online-portal #online-session-list [data-live-build]{display:none}
body.online-portal #online-session-list .session-runtime{font-size:10px}
body.online-portal #online-session-list .online-session-players{grid-column:2;grid-row:1;align-self:center;margin:0;text-align:right;white-space:nowrap;font:650 11px/1.4 'DM Sans',Arial,sans-serif;color:#d2d2d4}

/* Static liquid-glass Join control. */
body.online-portal #online-session-list .session-open{
 grid-column:3;
 grid-row:1;
 align-self:center;
 justify-self:end;
 min-width:64px;
 min-height:36px;
 margin:0;
 padding:8px 13px;
 border:1px solid #050505!important;
 border-radius:999px!important;
 background:linear-gradient(180deg,rgba(255,255,255,.16),rgba(255,255,255,.055))!important;
 color:#fff!important;
 -webkit-backdrop-filter:blur(18px) saturate(155%);
 backdrop-filter:blur(18px) saturate(155%);
 box-shadow:inset 0 1px 0 rgba(255,255,255,.24),inset 0 -1px 0 rgba(255,255,255,.035),0 7px 20px rgba(0,0,0,.30)!important;
 font:700 11px/1.2 'DM Sans',Arial,sans-serif;
 letter-spacing:.01em;
 text-shadow:0 1px 8px rgba(0,0,0,.45);
 transition:none!important;
}
body.online-portal #online-session-list .session-open:hover,
body.online-portal #online-session-list .session-open:active{
 transform:none!important;
 background:linear-gradient(180deg,rgba(255,255,255,.16),rgba(255,255,255,.055))!important;
}
body.online-portal #online-session-list .session-open:focus-visible{outline:2px solid rgba(255,255,255,.78)!important;outline-offset:3px}

body.online-portal #online-session-list .session-popular-badge{display:inline-flex;align-items:center;flex:0 0 17px;color:#bdbdc0}
body.online-portal #online-session-list .session-popular-badge svg{width:17px;height:21px}

/* Every non-popular session must stay neutral, including Community Servers. */
body.online-portal #online-session-list .online-session:not(.is-busiest),
body.online-portal #online-session-list .online-session[data-community-host="true"]:not(.is-busiest){
 border-color:#030303!important;
 background:linear-gradient(145deg,rgba(23,24,24,.96),rgba(12,13,13,.94))!important;
 box-shadow:0 7px 24px rgba(0,0,0,.30),inset 0 1px 0 rgba(255,255,255,.03)!important;
 transform:none!important;
 filter:none!important;
}
body.online-portal #online-session-list .online-session:not(.is-busiest)::before,
body.online-portal #online-session-list .online-session:not(.is-busiest)::after,
body.online-portal #online-session-list .online-session[data-community-host="true"]:not(.is-busiest)::before,
body.online-portal #online-session-list .online-session[data-community-host="true"]:not(.is-busiest)::after{
 content:none!important;
 display:none!important;
 opacity:0!important;
 filter:none!important;
 box-shadow:none!important;
}
body.online-portal #online-session-list .online-session[data-community-host="true"]:not(.is-busiest):hover{
 border-color:#030303!important;
 background:linear-gradient(145deg,rgba(23,24,24,.96),rgba(12,13,13,.94))!important;
 box-shadow:0 7px 24px rgba(0,0,0,.30),inset 0 1px 0 rgba(255,255,255,.03)!important;
}

/* Whichever live session currently has the most players is pinned first and lifted. */
body.online-portal #online-session-list .online-session.is-busiest{
 order:-1;
 z-index:4;
 overflow:visible;
 border-color:#020202!important;
 transform:translateY(-2px);
 background:linear-gradient(145deg,rgba(22,22,23,.99),rgba(12,12,13,.98))!important;
 box-shadow:
  0 0 0 1px rgba(0,0,0,.98),
  0 0 11px rgba(78,7,13,.18),
  0 11px 30px rgba(0,0,0,.50),
  inset 0 1px 0 rgba(255,255,255,.045)!important;
}
body.online-portal #online-session-list .online-session.is-busiest>*{position:relative;z-index:2}

/* Dark-red edge halo. The visible card border itself stays black. */
body.online-portal #online-session-list .online-session.is-busiest::before{
 content:'';
 display:block!important;
 position:absolute;
 inset:-3px;
 z-index:-1;
 border-radius:11px;
 pointer-events:none;
 background:rgba(86,7,13,.30);
 filter:blur(6px);
 opacity:.58;
}

/* Dark-red underglow below the popular card, like a soft smoke/light wash. */
body.online-portal #online-session-list .online-session.is-busiest::after{
 content:'';
 display:block!important;
 position:absolute;
 left:10%;
 right:10%;
 bottom:-24px;
 height:34px;
 z-index:-2;
 border-radius:50%;
 pointer-events:none;
 background:
  radial-gradient(ellipse at 50% 22%,rgba(103,9,17,.46) 0%,rgba(75,6,12,.29) 36%,rgba(46,3,8,.13) 58%,transparent 80%),
  radial-gradient(ellipse at 30% 46%,rgba(80,6,13,.18) 0%,transparent 68%),
  radial-gradient(ellipse at 72% 46%,rgba(80,6,13,.17) 0%,transparent 68%);
 filter:blur(14px);
 opacity:.82;
 transform:scaleX(.96);
}
body.online-portal #online-session-list .online-session.is-busiest .session-popular-badge{
 color:#aa2a31;
 filter:drop-shadow(0 0 5px rgba(91,8,15,.30));
}

@media(max-width:760px){
 body.online-portal #online-session-list{gap:8px;padding-top:6px}
 body.online-portal #online-session-list .online-session{
  grid-template-columns:minmax(0,1fr) 59px 64px;
  grid-template-rows:auto;
  min-height:73px;
  padding:11px 12px;
  column-gap:7px;
  row-gap:0;
  border-radius:9px;
 }
 body.online-portal #online-session-list .online-session-host{
  grid-column:1;
  grid-row:1;
  min-width:0;
 }
 body.online-portal #online-session-list h3{font-size:13.5px;line-height:1.35}
 body.online-portal #online-session-list small{font-size:9px;margin-top:3px;line-height:1.35}
 body.online-portal #online-session-list .session-runtime{font-size:9px;color:#7f8088}
 body.online-portal #online-session-list .online-session-players{
  grid-column:2;
  grid-row:1;
  align-self:center;
  justify-self:center;
  width:auto;
  margin:0;
  font-size:10px;
  text-align:center;
 }
 body.online-portal #online-session-list .session-open{
  grid-column:3;
  grid-row:1;
  align-self:center;
  justify-self:end;
  min-width:62px;
  min-height:35px;
  padding:8px 10px;
  font-size:10px;
 }
 body.online-portal #online-session-list .session-popular-badge{flex:0 0 13px}
 body.online-portal #online-session-list .session-popular-badge svg{width:13px;height:17px}
 body.online-portal #online-session-list .online-country-flag{font-size:13px}
 body.online-portal #online-session-list .online-session.is-busiest{transform:translateY(-1px)}
 body.online-portal #online-session-list .online-session.is-busiest::before{inset:-3px;filter:blur(5px);opacity:.54}
 body.online-portal #online-session-list .online-session.is-busiest::after{left:11%;right:11%;bottom:-19px;height:29px;filter:blur(12px);opacity:.76}
}
/* Remove explanatory boilerplate from the community-host row. Session
   runtime and any non-community session notes remain available. */
body.online-portal #online-session-list .online-session[data-community-host="true"] .online-session-host>small:not(.session-runtime){
 display:none!important;
}
html body.online-portal[data-online-view="sessions"] #online-session-list .online-session-players{
 width:auto!important;
 min-width:0!important;
 justify-content:center!important;
}
@media(max-width:360px){
 body.online-portal #online-session-list .online-session{
  grid-template-columns:minmax(0,1fr) 54px 60px;
  padding-inline:10px;
  column-gap:5px;
 }
 body.online-portal #online-session-list .session-open{min-width:58px;padding-inline:8px}
}

@media(prefers-reduced-motion:reduce){
 body.online-portal #online-session-list .online-session.is-busiest{transform:none}
}


/* Transparent glass session ribbon with original black border and ranking glows. */
html body.online-portal[data-online-view="sessions"] #online-session-list .online-session,
html body.online-portal[data-online-view="sessions"] #online-session-list .online-session.is-busiest,
html body.online-portal[data-online-view="sessions"] #online-session-list .online-session.is-busiest[data-ranking-leader="true"],
html body.online-portal[data-online-view="sessions"] #online-session-list .online-session.is-rising-challenger:not(.is-busiest){
 --session-border-ink:#030303;
 --session-border-fill:linear-gradient(145deg,rgba(35,35,38,.36),rgba(15,15,17,.20));
 border-width:0!important;
 border-radius:0!important;
 background:transparent!important;
 box-shadow:none!important;
 overflow:visible!important;
 isolation:isolate;
}
html body.online-portal[data-online-view="sessions"] #online-session-list .online-session.is-busiest{
 --session-border-ink:#020202;
 --session-border-fill:linear-gradient(145deg,rgba(34,32,34,.40),rgba(13,13,15,.23));
}
html body.online-portal[data-online-view="sessions"] #online-session-list .online-session[data-community-host="true"]:not(.is-busiest){
 --session-border-ink:#030303;
 --session-border-fill:linear-gradient(145deg,rgba(35,35,38,.36),rgba(15,15,17,.20));
 background:transparent!important;
 box-shadow:none!important;
}
html body.online-portal[data-online-view="sessions"] #online-session-list .online-session.is-busiest:not([data-ranking-leader="true"]){
 --session-border-ink:#030303;
 --session-border-fill:linear-gradient(145deg,rgba(35,35,38,.36),rgba(15,15,17,.20));
}
html body.online-portal[data-online-view="sessions"] #online-session-list .online-session.is-busiest[data-ranking-leader="true"]{
 --session-border-ink:#020202;
 --session-border-fill:linear-gradient(145deg,rgba(37,31,33,.42),rgba(14,12,15,.23));
}
html body.online-portal[data-online-view="sessions"] #online-session-list .online-session.is-rising-challenger:not(.is-busiest){
 --session-border-ink:#030303;
 --session-border-fill:linear-gradient(145deg,rgba(37,35,29,.42),rgba(14,14,12,.23));
}
html body.online-portal[data-online-view="sessions"] #online-session-list .online-session>.online-session-surface{
 position:absolute!important;
 inset:0 12px 0 0!important;
 display:block!important;
 width:auto!important;
 height:auto!important;
 z-index:0!important;
 pointer-events:none!important;
 border:1px solid var(--session-border-ink)!important;
 border-radius:0!important;
 background:rgba(16,16,18,.23)!important;
 -webkit-backdrop-filter:blur(17px) saturate(135%);
 backdrop-filter:blur(17px) saturate(135%);
 clip-path:polygon(0 0,100% 0,calc(100% - 18px) 100%,0 100%);
 filter:drop-shadow(0 7px 15px rgba(0,0,0,.30));
}
html body.online-portal[data-online-view="sessions"] #online-session-list .online-session>.online-session-surface::before{
 content:"";
 position:absolute;
 inset:0!important;
 display:block;
 background:var(--session-border-fill)!important;
 clip-path:none!important;
 pointer-events:none;
}
html body.online-portal[data-online-view="sessions"] #online-session-list .online-session>.online-session-surface::after{
 content:"";
 position:absolute;
 top:0;
 right:0;
 height:100%;
 width:1px;
 background:var(--session-border-ink);
 transform:skewX(-14deg);
 transform-origin:top right;
 pointer-events:none;
}
html body.online-portal[data-online-view="sessions"] #online-session-list .online-session.is-busiest[data-ranking-leader="true"]>.online-session-surface{
 filter:drop-shadow(0 10px 24px rgba(0,0,0,.46)) drop-shadow(0 0 10px rgba(115,10,19,.27));
}
html body.online-portal[data-online-view="sessions"] #online-session-list .online-session.is-rising-challenger:not(.is-busiest)>.online-session-surface{
 filter:drop-shadow(0 10px 24px rgba(0,0,0,.46)) drop-shadow(0 0 10px rgba(154,103,15,.27));
}
html body.online-portal[data-online-view="sessions"] #online-session-list .online-session>:not(.online-session-surface){
 position:relative;
 z-index:2;
}
/* Limit glow to the glass ribbon rather than the full viewport width. */
html body.online-portal[data-online-view="sessions"] #online-session-list .online-session.is-busiest::before,
html body.online-portal[data-online-view="sessions"] #online-session-list .online-session.is-rising-challenger:not(.is-busiest)::before{
 right:12px!important;
 clip-path:polygon(0 0,100% 0,calc(100% - 18px) 100%,0 100%);
 border-radius:0!important;
}
html body.online-portal[data-online-view="sessions"] #online-session-list .online-session.is-busiest::after,
html body.online-portal[data-online-view="sessions"] #online-session-list .online-session.is-rising-challenger:not(.is-busiest)::after{
 left:14%!important;
 right:24%!important;
}
@media(max-width:760px){
 html body.online-portal[data-online-view="sessions"] #online-session-list .online-session{
  margin-left:-20px!important;
  width:calc(100% + 20px)!important;
  padding-left:32px!important;
  padding-right:36px!important;
  border-radius:0!important;
 }
}
@media(max-width:360px){
 html body.online-portal[data-online-view="sessions"] #online-session-list .online-session{
  padding-left:30px!important;
  padding-right:33px!important;
 }
}
@media(prefers-reduced-transparency:reduce){
 html body.online-portal[data-online-view="sessions"] #online-session-list .online-session>.online-session-surface{
  background:rgba(18,18,20,.92)!important;
  -webkit-backdrop-filter:none;
  backdrop-filter:none;
 }
}
