/* HOME-PROFILE-APP-V3B */

#tab-home{
  --home-surface:rgba(255,255,255,.018);
  --home-surface-hover:rgba(255,255,255,.030);
  --home-border:rgba(255,255,255,.070);
  --home-divider:rgba(255,255,255,.052);
  --home-text:#edf2f6;
  --home-muted:#707b86;
  --home-soft:#9da8b2;
}


/* ---------- primary Home modules ---------- */

#tab-home .grid-2{
  gap:14px;
}

#tab-home .panel:has(#home-latest-runs),
#tab-home .panel:has(#home-points-leaders),
#tab-home .community-chat-v2,
#tab-home .panel:has(.home-activity-v2),
#tab-home .panel:has(#home-vip-players),
#tab-home .panel:has(#home-runs-chart){
  overflow:hidden;

  border:1px solid var(--home-border);
  border-radius:12px;

  background:
    linear-gradient(
      180deg,
      rgba(255,255,255,.020),
      rgba(255,255,255,.010)
    );

  box-shadow:none;
}


/* ---------- headers ---------- */

#tab-home .panel:has(#home-latest-runs) > .panel-head,
#tab-home .panel:has(#home-points-leaders) > .panel-head,
#tab-home .panel:has(.home-activity-v2) > .panel-head,
#tab-home .panel:has(#home-vip-players) > .panel-head,
#tab-home .panel:has(#home-runs-chart) > .panel-head,
#tab-home .community-chat-v2-head{
  min-height:58px;

  padding:0 18px;

  border-bottom:
    1px solid var(--home-divider);

  background:
    rgba(255,255,255,.006);

  color:var(--home-text);

  font-family:'Inter',system-ui,sans-serif;
  font-size:14px;
  font-weight:650;
  letter-spacing:-.01em;
}

#tab-home .panel-head-extra,
#tab-home .community-chat-v2-live{
  color:var(--home-muted);

  font-size:9px;
  font-weight:600;

  letter-spacing:.09em;
  text-transform:uppercase;
}


/* ---------- neutral clickable player names ---------- */

#tab-home [data-home-player]:not([data-home-player="0"]){
  cursor:pointer;
}

#tab-home .home-player-link-v3{
  display:inline-flex;
  align-items:center;

  min-width:0;


  font-weight:550;


  transition:
    color .15s ease,
    opacity .15s ease;
}

#tab-home .home-player-link-v3 > span{
  color:inherit;
  text-shadow:none!important;
}

#tab-home .home-player-link-v3:hover{
  opacity:.88;
}

#tab-home [data-home-player]:focus-visible{
  outline:
    1px solid rgba(255,255,255,.24);

  outline-offset:3px;
}


/* ---------- Latest Runs + Leaders ---------- */

#home-latest-runs,
#home-points-leaders{
  padding:0 14px!important;
  background:transparent;
}

#tab-home .home-feed-row-v3{
  min-height:64px!important;
  height:auto!important;

  padding:10px 4px!important;

  border-bottom:
    1px solid var(--home-divider)!important;

  transition:
    background .15s ease;
}

#tab-home .home-feed-row-v3:last-child{
  border-bottom:0!important;
}

#tab-home .home-feed-row-v3:hover{
  background:var(--home-surface-hover);
}

#tab-home .home-run-row-v3,
#tab-home .home-leader-row-v3{
  border-radius:7px;
}

#home-latest-runs img[title]{
  width:62px!important;
  height:36px!important;

  border:
    1px solid rgba(255,255,255,.075)!important;

  border-radius:6px;

  opacity:.92;

  transition:
    opacity .15s ease;
}

#tab-home .home-run-row-v3:hover img[title]{
  opacity:1;
}

#tab-home .home-run-row-v3 > div:last-child{
  color:#e9eef3!important;

  font-size:13px!important;
  font-weight:650;

  font-variant-numeric:tabular-nums;
}

#tab-home .home-leader-row-v3{
  grid-template-columns:
    28px minmax(0,1fr) auto!important;
}

#tab-home .home-leader-row-v3 > div:first-child{
  color:#626e79!important;

  font-size:10px!important;
  font-weight:600!important;

  font-variant-numeric:tabular-nums;
}

#tab-home .home-leader-btn{
  min-height:30px;

  padding:0 10px!important;

  border-radius:7px!important;

  transition:
    background .15s ease,
    border-color .15s ease,
    color .15s ease;
}


/* ---------- Chat ---------- */

#tab-home .community-chat-v2{
  margin-top:16px;
}

#tab-home .community-chat-v2-list{
  height:390px;

  padding:5px 16px;

  background:
    rgba(0,0,0,.055);
}

#tab-home .community-chat-v2-row{
  grid-template-columns:
    38px minmax(0,1fr);

  gap:11px;

  padding:12px 2px;

  border-bottom:
    1px solid var(--home-divider);
}

#tab-home .community-chat-v2-row:last-child{
  border-bottom:0;
}

#tab-home .community-chat-v2-avatar{
  width:38px;
  height:38px;

  border:
    1px solid rgba(255,255,255,.075);

  border-radius:9px;

  background:
    rgba(255,255,255,.028);

  color:#a8b2bc;

  font-size:12px;
  font-weight:650;

  transition:
    border-color .15s ease,
    background .15s ease;
}

#tab-home
.community-chat-v2-avatar[data-home-player]:not([data-home-player="0"]):hover{
  border-color:
    rgba(255,255,255,.14);

  background:
    rgba(255,255,255,.045);
}

#tab-home .community-chat-v2-avatar img{
  border-radius:8px;
}

#tab-home .community-chat-v2-meta{
  gap:7px;
}

#tab-home .community-chat-v2-name{
  font-size:12px;
}

#tab-home .community-chat-v2-time{
  margin-left:auto;

  color:#59646f;

  font-size:9px;
}

#tab-home .community-chat-v2-message{
  margin-top:5px;

  color:#aab4bd;

  font-size:12px;
  line-height:1.55;
}

#tab-home .community-chat-v2-compose{
  padding:13px 16px 14px;

  gap:9px;

  border-top:
    1px solid var(--home-divider);

  background:
    rgba(0,0,0,.08);
}

#tab-home .community-chat-v2-input-wrap{
  border:
    1px solid rgba(255,255,255,.075);

  border-radius:9px;

  background:
    rgba(255,255,255,.022);
}

#tab-home .community-chat-v2-input{
  min-height:42px;

  color:#e3e9ee;

  background:transparent;
}

#tab-home .community-chat-v2-input:focus{
  box-shadow:none;
}

#tab-home .community-chat-v2-input-wrap:focus-within{
  border-color:
    rgba(255,255,255,.15);

  background:
    rgba(255,255,255,.030);
}

#tab-home .community-chat-v2-send{
  min-width:76px;
  min-height:42px;

  border-radius:9px;

  font-size:11px;
  font-weight:650;
}


/* ---------- Active Players ---------- */

#tab-home .home-activity-v2{
  display:grid;

  grid-template-columns:
    repeat(2,minmax(0,1fr));

  gap:0;

  padding:0;
}

#tab-home .home-activity-section-v2{
  min-width:0;

  padding:16px 18px 18px;
}

#tab-home
.home-activity-section-v2
+
.home-activity-section-v2{
  border-left:
    1px solid var(--home-divider);
}

#tab-home .home-activity-head-v2{
  min-height:30px;

  margin-bottom:5px;
  padding-bottom:10px;

  border-bottom:
    1px solid var(--home-divider);
}

#tab-home .home-activity-title-v2{
  color:#828e99;

  font-size:9px;
  font-weight:650;

  letter-spacing:.095em;
  text-transform:uppercase;
}

#tab-home .home-activity-count-v2{
  color:#626e79;

  font-size:9px;
  font-weight:600;

  letter-spacing:.06em;
}

#tab-home .home-player-v2{
  display:flex;
  align-items:center;

  gap:8px;

  min-height:48px;

  padding:7px 2px;

  border-bottom:
    1px solid rgba(255,255,255,.045);

  background:transparent;

  border-radius:0;
}

#tab-home .home-player-v2:last-child{
  border-bottom:0;
}

#tab-home .home-player-v2:hover{
  background:
    rgba(255,255,255,.018);
}

#tab-home .home-player-flag-v2{
  width:15px;
  height:10px;

  border-radius:1px;

  opacity:.82;
}

#tab-home .home-player-source-v2{
  margin-left:auto;

  padding:3px 6px;

  border:
    1px solid rgba(255,255,255,.055);

  border-radius:5px;

  background:
    rgba(255,255,255,.018);

  color:#68747f;

  font-size:8px;
  font-weight:650;

  letter-spacing:.06em;
}

#tab-home .home-player-time-v2{
  min-width:48px;

  color:#59646e;

  font-size:9px;

  text-align:right;
}


/* ---------- Hall of VIP ---------- */

#home-vip-players{
  padding:18px!important;

  min-height:0!important;
}

#tab-home .home-vip-marquee{
  overflow:hidden;

  mask-image:
    linear-gradient(
      90deg,
      transparent,
      #000 5%,
      #000 95%,
      transparent
    );
}

#tab-home .home-vip-track{
  gap:9px;
}

#tab-home .home-vip-card{
  display:inline-flex;
  align-items:center;

  gap:8px;

  min-height:42px;

  padding:0 13px;

  border:
    1px solid rgba(255,255,255,.065);

  border-radius:9px;

  background:
    rgba(255,255,255,.020);

  color:var(--home-text);

  box-shadow:none;

  transition:
    background .15s ease,
    border-color .15s ease;
}

#tab-home .home-vip-card:hover{
  border-color:
    rgba(244,152,47,.16);

  background:
    rgba(255,255,255,.034);
}


/* ---------- Runs per Mode ---------- */

#tab-home
.panel:has(#home-runs-chart)
>
div:has(> #home-runs-chart){
  height:330px!important;

  padding:
    20px 18px 8px!important;

  background:
    rgba(0,0,0,.055);
}

#home-runs-chart{
  max-height:305px;
}

#home-runs-chart-loader{
  background:
    rgba(8,11,15,.82)!important;

  color:#707b86!important;

  font-size:10px!important;

  letter-spacing:.05em;
}


/* =========================================================
   MOBILE — designed as an application surface
   ========================================================= */

@media(max-width:760px){

  #tab-home{
    -webkit-tap-highlight-color:
      transparent;

    overscroll-behavior:
      contain;
  }

  #tab-home .grid-2{
    grid-template-columns:
      1fr!important;

    gap:12px!important;
  }

  #tab-home .panel:has(#home-latest-runs),
  #tab-home .panel:has(#home-points-leaders),
  #tab-home .community-chat-v2,
  #tab-home .panel:has(.home-activity-v2),
  #tab-home .panel:has(#home-vip-players),
  #tab-home .panel:has(#home-runs-chart){
    border-radius:11px;
  }

  #tab-home .panel:has(#home-latest-runs) > .panel-head,
  #tab-home .panel:has(#home-points-leaders) > .panel-head,
  #tab-home .panel:has(.home-activity-v2) > .panel-head,
  #tab-home .panel:has(#home-vip-players) > .panel-head,
  #tab-home .panel:has(#home-runs-chart) > .panel-head,
  #tab-home .community-chat-v2-head{
    min-height:54px!important;

    padding:
      0 13px!important;
  }

  #home-latest-runs,
  #home-points-leaders{
    padding:
      0 10px!important;
  }

  #tab-home .home-feed-row-v3{
    min-height:62px!important;

    padding:
      9px 2px!important;
  }

  #home-latest-runs img[title]{
    width:52px!important;
    height:32px!important;
  }

  #tab-home .community-chat-v2-list{
    height:min(52vh,360px)!important;

    padding:
      4px 11px!important;
  }

  #tab-home .community-chat-v2-row{
    grid-template-columns:
      34px minmax(0,1fr)!important;

    gap:9px!important;

    padding:
      10px 0!important;
  }

  #tab-home .community-chat-v2-avatar{
    width:34px!important;
    height:34px!important;

    border-radius:8px;
  }

  #tab-home .community-chat-v2-compose{
    padding:11px!important;
  }

  #tab-home .community-chat-v2-input,
  #tab-home .community-chat-v2-send{
    min-height:44px;
  }

  #tab-home .home-activity-v2{
    grid-template-columns:
      1fr!important;
  }

  #tab-home
  .home-activity-section-v2
  +
  .home-activity-section-v2{
    border-left:0;

    border-top:
      1px solid var(--home-divider);
  }

  #tab-home .home-activity-section-v2{
    padding:13px;
  }

  #tab-home .home-player-v2{
    min-height:50px;
  }

  #home-vip-players{
    padding:
      14px 12px!important;
  }

  #tab-home .home-vip-card{
    min-height:44px;
  }

  #tab-home
  .panel:has(#home-runs-chart)
  >
  div:has(> #home-runs-chart){
    height:255px!important;

    padding:
      14px 8px 6px!important;
  }

  #home-runs-chart{
    max-height:235px!important;
  }
}


@media(max-width:480px){

  #tab-home .home-run-row-v3{
    grid-template-columns:
      minmax(0,1fr) auto!important;

    gap:8px!important;
  }

  #home-latest-runs img[title]{
    width:48px!important;
    height:30px!important;
  }

  #tab-home .home-leader-row-v3{
    grid-template-columns:
      24px minmax(0,1fr) auto!important;

    gap:6px!important;
  }

  #tab-home .home-player-source-v2{
    padding:
      3px 5px;

    font-size:7px;
  }

  #tab-home .home-player-time-v2{
    min-width:42px;
  }
}