/* ── LAB ACTIVITY ── */

.lab-activity{
  position:relative; isolation:isolate;
  background:linear-gradient(180deg, #050505 0%, #020202 100%);
  border-top:1px solid rgba(255,255,255,.05);
  padding:clamp(3.5rem,7vw,6rem) clamp(1.2rem,5vw,3rem) clamp(3rem,6vw,5rem);
  overflow:hidden;
}
.lab-activity::before{
  content:''; position:absolute; inset:0; pointer-events:none; z-index:-1;
  background:
    radial-gradient(45% 50% at 18% 22%, rgba(79,195,247,.07),  transparent 62%),
    radial-gradient(42% 46% at 82% 18%, rgba(255,213,79,.055), transparent 62%),
    radial-gradient(46% 50% at 80% 82%, rgba(186,104,200,.06), transparent 62%),
    radial-gradient(44% 48% at 20% 80%, rgba(77,182,172,.06),  transparent 62%),
    radial-gradient(40% 44% at 52% 52%, rgba(255,90,95,.05),   transparent 64%);
}
.lab-activity{ padding-left:0; padding-right:0; }
.lab-activity__inner{ position:relative; z-index:1; }

/* ── header ── */
.la-head{ text-align:center; margin-bottom:clamp(2rem,4vw,3rem); }
.la-eyebrow{
  display:inline-flex; align-items:center; gap:.5rem;
  font-size:.7rem; font-weight:700; letter-spacing:.28em; text-transform:uppercase;
  color:rgba(255,255,255,.55); margin-bottom:1rem;
}
.la-live-dot{
  width:8px; height:8px; border-radius:50%; background:var(--red,var(--in-accent, #e92038));
  box-shadow:0 0 0 0 rgba(233,32,56,.6); animation:la-pulse 2s ease-out infinite;
}
@keyframes la-pulse{
  0%{ box-shadow:0 0 0 0 rgba(233,32,56,.55); }
  70%{ box-shadow:0 0 0 9px rgba(233,32,56,0); }
  100%{ box-shadow:0 0 0 0 rgba(233,32,56,0); }
}
.la-title{
  font-family:var(--sf,'Steelfish','Impact',sans-serif);
  font-size:clamp(2.8rem,7vw,5rem); line-height:.9; letter-spacing:.02em;
  color:#fff; margin:0 0 .9rem; text-transform:uppercase; font-weight:700;
}
.la-title em{ color:var(--red,var(--in-accent, #e92038)); font-style:normal; }
.la-sub{
  max-width:600px; margin:0 auto; font-family:var(--pp,'Poppins',sans-serif);
  font-size:clamp(.85rem,1.6vw,.98rem); line-height:1.6; color:rgba(255,255,255,.6);
}

/* ── stat counters ── */
.la-stats{
  display:grid; grid-template-columns:repeat(4,1fr); gap:clamp(.7rem,1.6vw,1.1rem);
  margin-bottom:clamp(2.2rem,4vw,3rem);
}
.la-stat{
  position:relative; overflow:hidden; border-radius:5px;
  background:linear-gradient(160deg, rgba(255,255,255,.045), rgba(255,255,255,.012));
  border:1px solid rgba(255,255,255,.07);
  padding:clamp(1.1rem,2.2vw,1.6rem) clamp(.9rem,2vw,1.3rem);
  text-align:center; transition:border-color .25s, transform .25s, background .25s;
}
.la-stat::before{
  content:''; position:absolute; left:0; top:0; right:0; height:2px;
  background:linear-gradient(90deg, transparent, var(--red,var(--in-accent, #e92038)), transparent);
  opacity:0; transition:opacity .25s;
}
.la-stat:hover{ border-color:rgba(233,32,56,.4);
  background:linear-gradient(160deg, rgba(233,32,56,.09), rgba(255,255,255,.012)); }
.la-stat:hover::before{ opacity:1; }
.la-stat__ic{
  display:inline-flex; align-items:center; justify-content:center;
  width:46px; height:46px; border-radius:50%; margin-bottom:.7rem;
  background:radial-gradient(120% 120% at 30% 25%, rgba(233,32,56,.28), rgba(233,32,56,.09));
  color:var(--red,var(--in-accent, #e92038)); font-size:1.1rem;
  border:1.5px solid rgba(233,32,56,.38);
}
.la-stat__n{
  display:block; font-family:var(--sf,'Steelfish',sans-serif);
  font-size:clamp(2rem,4.5vw,3rem); line-height:1; color:#fff; font-weight:400;
  letter-spacing:.01em;
}
.la-stat__l{
  display:block; margin-top:.45rem; font-size:.66rem; font-weight:600;
  letter-spacing:.14em; text-transform:uppercase; color:rgba(255,255,255,.5);
}
.la-stat.is-skeleton{ opacity:.4; }
.la-stat.is-skeleton .la-stat__n{ color:rgba(255,255,255,.25); }

/* ── iki sütunlu yerleşim ── */
.la-columns{
  display:grid; grid-template-columns:minmax(0,32fr) minmax(0,68fr);
  gap:clamp(1.4rem,3vw,2.4rem); align-items:start;
}

/* ── LEADERBOARD ── */
.la-board{
  position:relative; border-radius:5px; overflow:hidden;
  background:
    radial-gradient(140% 60% at 50% 0%, rgba(233,32,56,.12), transparent 70%),
    linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.012));
  border:1px solid rgba(255,255,255,.08);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05);
}
.la-board__head{
  display:flex; align-items:center; justify-content:space-between;
  padding:1rem 1.2rem .9rem;
}
.la-board__title{
  display:inline-flex; align-items:center; gap:.5rem;
  font-size:.82rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:#fff;
}
.la-board__title i{ color:var(--red,var(--in-accent, #e92038)); filter:drop-shadow(0 0 6px rgba(233,32,56,.5)); }
.la-board__chip{
  font-size:.6rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase;
  color:rgba(255,255,255,.55); background:rgba(255,255,255,.07);
  border:1px solid rgba(255,255,255,.1); padding:.28rem .6rem; border-radius:999px;
}
.la-board__body{ padding:.4rem 1rem 1rem; display:flex; flex-direction:column; gap:.55rem; }

.la-podium{
  position:relative; text-align:center;
  padding:1.5rem 1rem 1.3rem; border-radius:5px; overflow:hidden;
  background:
    radial-gradient(120% 90% at 50% -10%, color-mix(in srgb, var(--c,var(--in-accent, #e92038)) 28%, transparent), transparent 65%),
    linear-gradient(180deg, rgba(255,255,255,.05), rgba(0,0,0,.15));
  border:1px solid color-mix(in srgb, var(--c,var(--in-accent, #e92038)) 38%, transparent);
  box-shadow:0 10px 30px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.08);
}
.la-podium__crown{
  position:absolute; top:.6rem; left:50%; transform:translateX(-50%);
  color:var(--red,var(--in-accent, #e92038)); font-size:1rem; filter:drop-shadow(0 0 8px rgba(233,32,56,.6));
}
.la-podium__av{
  display:inline-flex; align-items:center; justify-content:center;
  width:64px; height:64px; border-radius:50%; margin:.4rem auto .7rem;
  font-family:var(--sf,'Steelfish',sans-serif); font-weight:700; font-size:1.7rem; line-height:1;
  color:#fff;
  background:radial-gradient(120% 120% at 30% 25%, color-mix(in srgb, var(--c,var(--in-accent, #e92038)) 70%, #000), color-mix(in srgb, var(--c,var(--in-accent, #e92038)) 35%, #000));
  border:2px solid color-mix(in srgb, var(--c,var(--in-accent, #e92038)) 60%, #fff);
  box-shadow:0 0 18px color-mix(in srgb, var(--c,var(--in-accent, #e92038)) 45%, transparent);
}
.la-podium__who{
  display:block; font-size:1.02rem; font-weight:700; color:#fff;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis; margin-bottom:.35rem;
}
.la-podium__game{
  display:inline-flex; align-items:center; gap:.35rem; text-decoration:none;
  font-size:.64rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase;
  color:var(--c,var(--in-accent, #e92038));
  background:color-mix(in srgb, var(--c,var(--in-accent, #e92038)) 16%, transparent);
  border:1px solid color-mix(in srgb, var(--c,var(--in-accent, #e92038)) 32%, transparent);
  padding:.25rem .6rem; border-radius:999px;
}
.la-podium__game:hover{ background:color-mix(in srgb, var(--c,var(--in-accent, #e92038)) 26%, transparent); }
.la-podium__metric{
  display:block; margin-top:.7rem; font-size:.56rem; font-weight:700;
  letter-spacing:.18em; text-transform:uppercase;
  color:color-mix(in srgb, var(--c,var(--in-accent, #e92038)) 72%, #fff);
}
.la-podium__score{
  display:block; margin-top:.2rem;
  font-family:var(--sf,'Steelfish',sans-serif); font-weight:700;
  font-size:clamp(2.4rem,5vw,3.1rem); line-height:.9; color:#fff;
  text-shadow:0 0 18px color-mix(in srgb, var(--c,var(--in-accent, #e92038)) 40%, transparent);
}
.la-podium__sub{
  display:block; margin-top:.2rem; font-size:.58rem; font-weight:700;
  letter-spacing:.16em; color:rgba(255,255,255,.45);
}

.la-rankrow{
  display:flex; align-items:center; gap:.7rem;
  padding:.6rem .7rem; border-radius:5px;
  background:rgba(255,255,255,.025); border:1px solid rgba(255,255,255,.06);
  transition:background .2s, border-color .2s, transform .2s;
}
.la-rankrow:hover{ background:color-mix(in srgb, var(--c,var(--in-accent, #e92038)) 9%, rgba(255,255,255,.02));
  border-color:color-mix(in srgb, var(--c,var(--in-accent, #e92038)) 30%, transparent); transform:translateX(2px); }
.la-rankrow__pos{
  flex:none; width:20px; text-align:center;
  font-family:var(--sf,'Steelfish',sans-serif); font-weight:700; font-size:1.1rem;
  color:rgba(255,255,255,.4);
}
.la-rankrow__av{
  flex:none; display:inline-flex; align-items:center; justify-content:center;
  width:34px; height:34px; border-radius:50%;
  font-size:.78rem; font-weight:700; color:#fff;
  background:color-mix(in srgb, var(--c,var(--in-accent, #e92038)) 30%, #000);
  border:1.5px solid color-mix(in srgb, var(--c,var(--in-accent, #e92038)) 45%, transparent);
}
.la-rankrow__body{ flex:1; min-width:0; display:flex; flex-direction:column; gap:.1rem; }
.la-rankrow__who{
  font-size:.82rem; font-weight:600; color:#fff;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.la-rankrow__game{
  font-size:.6rem; font-weight:600; letter-spacing:.05em; text-transform:uppercase;
  color:rgba(255,255,255,.42); text-decoration:none;
}
.la-rankrow__game:hover{ color:var(--c,var(--in-accent, #e92038)); }
.la-rankrow__score{
  flex:none; display:flex; flex-direction:column; align-items:flex-end; line-height:1;
  font-family:var(--sf,'Steelfish',sans-serif); font-weight:700;
  font-size:1.25rem; color:#fff;
}
.la-rankrow__unit{
  font-family:var(--pp,'Poppins',sans-serif); font-weight:600;
  font-size:.5rem; letter-spacing:.08em; text-transform:uppercase;
  color:rgba(255,255,255,.4); margin-top:.1rem;
}

.la-board__foot{
  display:flex; align-items:center; justify-content:center; gap:.5rem;
  padding:.85rem; text-decoration:none;
  font-size:.7rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase;
  color:rgba(255,255,255,.7);
  border-top:1px solid rgba(255,255,255,.07);
  background:rgba(0,0,0,.15); transition:background .2s, color .2s;
}
.la-board__foot:hover{ background:rgba(233,32,56,.14); color:#fff; }
.la-board__foot i{ color:var(--red,var(--in-accent, #e92038)); }

.la-podium.is-skeleton{ height:200px; opacity:.3; background:rgba(255,255,255,.03); border-color:rgba(255,255,255,.06); }
.la-rankrow.is-skeleton{ height:50px; opacity:.3; }
.la-board__empty{
  display:flex; flex-direction:column; align-items:center; gap:.5rem;
  padding:2.5rem 1rem; text-align:center; color:rgba(255,255,255,.5); font-size:.85rem;
}
.la-board__empty i{ font-size:1.8rem; color:rgba(255,255,255,.2); }
.la-board__empty small{ font-size:.7rem; color:rgba(255,255,255,.35); }

/* ── LIVE FEED ── */
.la-feed-wrap{
  position:relative; border-radius:5px; overflow:hidden;
  background:linear-gradient(180deg, rgba(255,255,255,.025), rgba(255,255,255,.008));
  border:1px solid rgba(255,255,255,.08);
}
.la-feed-bar{
  display:flex; align-items:center; gap:.8rem;
  padding:1rem 1.2rem .95rem;
  border-bottom:1px solid rgba(255,255,255,.07);
  background:linear-gradient(180deg, rgba(0,0,0,.22), transparent);
}
.la-feed-bar__t{
  display:inline-flex; align-items:center; gap:.55rem;
  font-size:.82rem; font-weight:800; letter-spacing:.08em; text-transform:uppercase; color:#fff;
}
.la-feed-bar__t i{ color:var(--red,var(--in-accent, #e92038)); }
.la-feed-bar__live{
  display:inline-flex; align-items:center; gap:.4rem; margin-right:auto;
  font-size:.6rem; font-weight:700; letter-spacing:.16em; text-transform:uppercase;
  color:#7ee787;
}
.la-feed-bar__live .la-live-dot{ width:7px; height:7px; background:#7ee787; box-shadow:0 0 0 0 rgba(126,231,135,.55); }
.la-refresh{
  display:inline-flex; align-items:center; gap:.45rem;
  background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.12);
  color:rgba(255,255,255,.72); font-size:.7rem; font-weight:600;
  padding:.45rem .8rem; border-radius:999px; cursor:pointer;
  transition:background .2s, color .2s, border-color .2s;
}
.la-refresh:hover{ background:rgba(233,32,56,.15); color:#fff; border-color:rgba(233,32,56,.45); }
.la-refresh i{ transition:transform .5s; }
.la-refresh.is-spinning i{ transform:rotate(360deg); }

.la-feed-viewport{
  position:relative; height:676px; overflow:hidden;
  -webkit-mask-image:linear-gradient(180deg, transparent 0, #000 22px, #000 calc(100% - 22px), transparent 100%);
  mask-image:linear-gradient(180deg, transparent 0, #000 22px, #000 calc(100% - 22px), transparent 100%);
}
.la-feed{ list-style:none; margin:0; padding:.5rem .7rem; }
.la-feed-viewport.is-scrolling .la-feed{
  animation:la-feed-scroll var(--la-scroll-dur,60s) linear infinite;
  will-change:transform;
}
.la-feed-viewport.is-scrolling:hover .la-feed{ animation-play-state:paused; }
@keyframes la-feed-scroll{
  from{ transform:translateY(0); }
  to{   transform:translateY(-50%); }
}

.la-row{
  display:flex; align-items:center; gap:.75rem;
  padding:.55rem .6rem; border-radius:5px;
  transition:background .18s, transform .18s; position:relative;
}
.la-row:hover{ background:color-mix(in srgb, var(--c,var(--in-accent, #e92038)) 7%, rgba(255,255,255,.025)); transform:translateX(2px); }
@keyframes la-in{ from{ opacity:0; transform:translateY(8px); } to{ opacity:1; transform:none; } }

.la-row__visual{ position:relative; flex:none; }
.la-row__ic, .la-row__thumb{
  display:inline-flex; align-items:center; justify-content:center;
  width:40px; height:40px; border-radius:50%; font-size:.98rem;
}
.la-row__ic{
  color:var(--c,var(--in-accent, #e92038));
  background:radial-gradient(120% 120% at 30% 25%,
            color-mix(in srgb, var(--c,var(--in-accent, #e92038)) 30%, transparent),
            color-mix(in srgb, var(--c,var(--in-accent, #e92038)) 10%, transparent));
  border:1.5px solid color-mix(in srgb, var(--c,var(--in-accent, #e92038)) 42%, transparent);
}
.la-row__thumb{ object-fit:cover; background:#111; border:1.5px solid color-mix(in srgb, var(--c,var(--in-accent, #e92038)) 42%, transparent); }
.la-row__dot{
  position:absolute; right:-2px; bottom:-2px;
  width:18px; height:18px; border-radius:50%;
  display:inline-flex; align-items:center; justify-content:center; font-size:.55rem;
  color:#fff; background:var(--c,var(--in-accent, #e92038));
  border:2px solid #060606;
}
.la-row__body{ flex:1; min-width:0; }
.la-row__txt{
  font-size:.76rem; line-height:1.35; color:rgba(255,255,255,.8);
}
.la-row__txt b{ color:#fff; font-weight:600; }
.la-row__txt .la-game{ color:var(--c,var(--in-accent, #e92038)); font-weight:600; text-decoration:none; }
.la-row__txt .la-game:hover{ text-decoration:underline; }
.la-row__meta{
  display:flex; align-items:center; gap:.45rem; margin-top:.28rem; flex-wrap:wrap;
  font-size:.6rem; color:rgba(255,255,255,.42);
}
.la-row__chip{
  display:inline-flex; align-items:center; gap:.28rem; text-decoration:none;
  font-size:.54rem; font-weight:700; letter-spacing:.04em; text-transform:uppercase;
  color:var(--c,var(--in-accent, #e92038));
  background:color-mix(in srgb, var(--c,var(--in-accent, #e92038)) 14%, transparent);
  border:1px solid color-mix(in srgb, var(--c,var(--in-accent, #e92038)) 28%, transparent);
  padding:.16rem .45rem; border-radius:999px;
}
.la-row__chip:hover{ background:color-mix(in srgb, var(--c,var(--in-accent, #e92038)) 24%, transparent); }
.la-row__time{ display:inline-flex; align-items:center; gap:.3rem; }
.la-row__right{ flex:none; }
.la-row__badge{
  display:inline-flex; align-items:center; gap:.3rem;
  font-size:.66rem; font-weight:700; color:#fff;
  background:color-mix(in srgb, var(--c,var(--in-accent, #e92038)) 22%, transparent);
  border:1px solid color-mix(in srgb, var(--c,var(--in-accent, #e92038)) 38%, transparent);
  padding:.28rem .58rem; border-radius:999px; white-space:nowrap;
}

.la-feed-load, .la-feed-empty, .la-feed-error{
  list-style:none; padding:2.6rem 1rem; text-align:center;
  color:rgba(255,255,255,.45); font-size:.85rem;
  display:flex; flex-direction:column; align-items:center; gap:.7rem;
}
.la-feed-empty i, .la-feed-error i{ font-size:1.8rem; color:rgba(255,255,255,.2); }
.la-feed-error i{ color:rgba(233,32,56,.5); }

/* ── responsive ── */
@media (max-width:980px){
  .la-columns{ grid-template-columns:1fr; gap:clamp(1.6rem,4vw,2.4rem); }
}
@media (max-width:760px){
  .la-stats{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:460px){
  .la-row__chip{ display:none; }
  .la-row__ic, .la-row__thumb{ width:42px; height:42px; }
  .la-feed-bar__live span:not(.la-live-dot){ display:none; }
  .la-refresh__txt{ display:none; }
}
@media (prefers-reduced-motion:reduce){
  .la-live-dot, .la-row, .la-refresh i, .la-rankrow,
  .la-feed-viewport.is-scrolling .la-feed{
    animation:none !important; transition:none !important; transform:none !important;
  }
  .la-feed-viewport{ overflow-y:auto !important; height:auto !important; max-height:676px; }
}

.la-stats-error, .la-stats-note{
  grid-column:1 / -1; margin:0;
  display:flex; align-items:center; justify-content:center; gap:.6rem; text-align:center;
  font-size:.78rem; line-height:1.5; color:rgba(255,255,255,.6);
}
.la-stats-error{
  padding:1.6rem 1rem; border:1px dashed rgba(233,32,56,.35); border-radius:5px;
  background:rgba(233,32,56,.05);
}
.la-stats-error i{ font-size:1.1rem; color:rgba(233,32,56,.75); }
.la-stats-note{ font-size:.68rem; color:rgba(255,255,255,.42); justify-content:flex-start; }
.la-feed-bar__live.is-offline{ color:rgba(255,255,255,.45); }
.la-feed-bar__live.is-offline .la-live-dot{ background:rgba(255,255,255,.3); box-shadow:none; animation:none; }
@media (prefers-reduced-motion:reduce){
  .la-feed-viewport{ overflow-y:auto; }
}