/* Арена — запълнена страница без промо-блокове.
   Зарежда се след app.css и печели старите правила за .arenagrid/.arwrap. */

.arena-wrap { max-width: 1560px; }

.arena-view .arhead {
  display: flex;
  align-items: center;
  gap: 18px;
  flex-wrap: wrap;
  margin: 6px 0 20px;
  padding-bottom: 16px;
  border-bottom: 1px solid rgba(236, 229, 211, .09);
}

.archips { display: flex; gap: 8px; margin-left: auto; flex-wrap: wrap; }
.archip {
  display: inline-flex;
  align-items: baseline;
  gap: 5px;
  padding: 7px 12px;
  border-radius: 999px;
  border: 1px solid rgba(236, 229, 211, .12);
  background: rgba(255, 255, 255, .025);
  font-size: 11.5px;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: #9aa39a;
}
.archip b { color: #f2dd9b; font-size: 14px; letter-spacing: 0; text-transform: none; font-variant-numeric: tabular-nums; }

/* три колони на цялата ширина */
.arena-view .arcols {
  display: grid;
  grid-template-columns: 330px minmax(0, 1fr) 306px;
  gap: 20px;
  align-items: start;
}
.arena-view .arcol { min-width: 0; }
.arcol-t { margin: 0 0 10px; }

/* лява: „сега играеш“ */
.arena-view .arnow {
  position: sticky;
  top: 92px;
  margin: 0;
  padding: 22px 20px 18px;
  border-radius: 16px;
  border: 1px solid rgba(201, 162, 39, .26);
  background:
    radial-gradient(120% 80% at 50% -10%, rgba(201, 162, 39, .1), transparent 62%),
    rgba(255, 255, 255, .022);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .05);
}
.arena-view .arnow-n { font-size: 58px; line-height: .95; margin: 2px 0 2px; }
.arena-view .arnow h3 { margin: 0 0 12px; font-size: 21px; }
.arena-view .arnow-meta { display: grid; gap: 7px; margin: 0 0 16px; padding: 0; list-style: none; }
.arena-view .arnow-meta li { font-size: 12.5px; color: #b9b2a2; line-height: 1.35; }
.arena-view .arnow-meta b { color: #e9dfc6; }
.arena-view .arnow-btn { width: 100%; }
.arena-view .arnow-hint { margin: 10px 0 0; font-size: 11.5px; color: #8f8878; }

/* режими */
.arena-view .modes { display: grid; gap: 6px; margin-bottom: 14px; }
.arena-view .modebtn {
  display: grid;
  gap: 2px;
  text-align: left;
  padding: 9px 11px;
  border-radius: 10px;
  border: 1px solid rgba(236, 229, 211, .12);
  background: rgba(255, 255, 255, .02);
  cursor: pointer;
  transition: border-color .15s, background .15s;
}
.arena-view .modebtn b { font-size: 12.5px; color: #ded6c3; letter-spacing: .02em; }
.arena-view .modebtn span { font-size: 10.5px; color: #8f8878; }
.arena-view .modebtn:hover { border-color: rgba(201, 162, 39, .45); }
.arena-view .modebtn.on {
  border-color: rgba(201, 162, 39, .55);
  background: rgba(201, 162, 39, .09);
}
.arena-view .modebtn.on b { color: #f2dd9b; }

/* среда: стълбицата */
.arena-view .ladder { display: grid; gap: 9px; max-width: none; }
.arena-view .ladder-row {
  display: grid;
  grid-template-columns: 46px minmax(0, 1fr) auto;
  align-items: center;
  gap: 14px;
  width: 100%;
  min-height: 64px;
  padding: 10px 16px;
  border-radius: 12px;
  border: 1px solid rgba(236, 229, 211, .1);
  background: rgba(255, 255, 255, .022);
  text-align: left;
  cursor: pointer;
  transition: transform .14s, border-color .14s, background .14s;
}
.arena-view .ladder-row:hover { transform: translateX(3px); border-color: rgba(201, 162, 39, .4); background: rgba(201, 162, 39, .05); }
.arena-view .ladder-row .medal {
  display: grid;
  place-items: center;
  width: 38px;
  height: 38px;
  border-radius: 50%;
  border: 1px solid rgba(236, 229, 211, .16);
  font: 600 13px/1 Georgia, serif;
  color: #cfc7b4;
}
.arena-view .ladder-row .name { font: 600 15.5px/1.2 Georgia, serif; color: #ece5d3; }
.arena-view .ladder-row .stat { font-size: 11.5px; letter-spacing: .04em; color: #8f8878; white-space: nowrap; }
.arena-view .ladder-row.passed { border-color: rgba(127, 168, 135, .3); background: rgba(127, 168, 135, .06); }
.arena-view .ladder-row.passed .medal { color: #9fd0a8; border-color: rgba(127, 168, 135, .5); }
.arena-view .ladder-row.current { border-color: rgba(201, 162, 39, .55); background: rgba(201, 162, 39, .08); }
.arena-view .ladder-row.current .medal { color: #0f1512; background: #d8b25a; border-color: #d8b25a; }
.arena-view .ladder-row.locked { opacity: .62; }
.arena-view .ladder-row.locked .stat { color: #6f6a5e; }

/* дясно: карти */
.arena-view .arcol-side { display: grid; gap: 12px; position: sticky; top: 92px; }
.side-card {
  border: 1px solid rgba(236, 229, 211, .1);
  border-radius: 14px;
  padding: 14px;
  background:
    radial-gradient(120% 90% at 50% -20%, rgba(201, 162, 39, .06), transparent 60%),
    rgba(255, 255, 255, .022);
}
.side-card .label { margin: 0 0 8px; }
.side-card h4 { margin: 0 0 6px; font: 600 16px/1.25 Georgia, serif; color: #f2e9d6; }
.side-card .muted { margin: 0 0 10px; font-size: 12px; line-height: 1.45; color: #9aa39a; }
.side-card .mini-btn { width: 100%; }
.side-card-quiet { background: rgba(255, 255, 255, .014); }
.side-card-quiet .muted { margin-bottom: 0; }
.side-list { margin: 0; padding: 0; list-style: none; display: grid; gap: 7px; }
.side-list li { font-size: 12px; color: #a8a192; line-height: 1.4; }
.side-list b { color: #e9dfc6; }

/* адаптив */
@media (max-width: 1250px) {
  .arena-view .arcols { grid-template-columns: 300px minmax(0, 1fr); }
  .arena-view .arcol-side {
    grid-column: 1 / -1;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    position: static;
  }
}
@media (max-width: 900px) {
  .arena-view .arcols { grid-template-columns: minmax(0, 1fr); }
  .arena-view .arnow { position: static; }
  .arena-view .arcol-side { grid-template-columns: minmax(0, 1fr); }
  .archips { margin-left: 0; }
  .arena-view .ladder-row { grid-template-columns: 42px minmax(0, 1fr); }
  .arena-view .ladder-row .side { grid-column: 2; }
}

@media (prefers-reduced-motion: reduce) {
  .arena-view .ladder-row { transition: none; }
  .arena-view .ladder-row:hover { transform: none; }
}

/* CTA-то да се вижда без скрол */
.arena-view .arnow-btn { margin-bottom: 4px; }
.arena-view .arnow-hint { margin: 0 0 12px; }
.arnow-modes-t { margin: 12px 0 6px; font-size: 10px; }
.arena-view .modes { margin-bottom: 6px; }

/* стълбицата в две колони — целият екран се събира без скрол */
@media (min-width: 1100px) {
  .arena-view .ladder { grid-template-columns: 1fr 1fr; gap: 8px; }
  .arena-view .ladder-row { grid-template-columns: 40px minmax(0, 1fr); min-height: 58px; padding: 8px 14px; }
  .arena-view .ladder-row .side { grid-column: 2; }
  .arena-view .ladder-row .stat { font-size: 10.5px; }
}

/* режимите — само имена, без подзаглавия */
.arena-view .modebtn { display: block; text-align: center; padding: 10px 8px; }
.arena-view .modebtn b { font-size: 12px; }
.arena-view .modes { grid-template-columns: repeat(3, minmax(0, 1fr)); }

/* кръговете — компактни, за да се съберат 10 без скрол */
@media (min-width: 1100px) {
  .arena-view .ladder { gap: 6px; }
  .arena-view .ladder-row {
    grid-template-columns: 34px minmax(0, 1fr) auto;
    min-height: 52px;
    padding: 6px 12px;
    gap: 10px;
  }
  .arena-view .ladder-row .side { grid-column: auto; }
  .arena-view .ladder-row .medal { width: 30px; height: 30px; font-size: 12px; }
  .arena-view .ladder-row .name { font-size: 14.5px; }
  .arena-view .ladder-row .stat { font-size: 10.5px; }
}
.arena-view .arcol-ladder { padding-bottom: 0; }
.arena-view #arenaNote { margin: 6px 0 0; }

/* дневният въпросник — централен, най-горе */
.daily-hero {
  grid-column: 1 / -1;
  display: grid;
  justify-items: center;
  gap: 6px;
  text-align: center;
  margin: 0 auto 20px;
  padding: 22px 24px 20px;
  max-width: 720px;
  border-radius: 18px;
  border: 1px solid rgba(201, 162, 39, .32);
  background:
    radial-gradient(120% 90% at 50% -10%, rgba(201, 162, 39, .13), transparent 62%),
    rgba(255, 255, 255, .025);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .06), 0 18px 40px -32px #000;
}
.daily-hero .label { margin: 0; }
.daily-hero-n { margin: 2px 0 0; font: 600 30px/1.1 Georgia, serif; color: #f6eeda; letter-spacing: -.01em; }
.daily-hero-sub { margin: 0 0 12px; font-size: 13px; color: #a8a192; }
.daily-hero-sub b { color: #f2dd9b; }
.daily-hero-btn { min-width: 260px; }

@media (max-width: 700px) {
  .daily-hero { padding: 18px 16px 16px; margin-bottom: 16px; }
  .daily-hero-n { font-size: 24px; }
  .daily-hero-btn { width: 100%; min-width: 0; }
}

/* компактна височина — Арената да се събира на един екран */
.arena-wrap { padding-top: 10px; }
.arena-view .hero.small { font-size: clamp(28px, 3vw, 38px); margin: 4px 0 6px; }
.arena-view .sub { margin: 0 0 12px; max-width: 620px; font-size: 13px; }
.arena-view .eyebrow { margin-bottom: 2px; }

.daily-hero { padding: 15px 20px 14px; margin-bottom: 14px; gap: 3px; }
.daily-hero-n { font-size: 25px; }
.daily-hero-sub { margin-bottom: 9px; font-size: 12px; }
.daily-hero-btn { min-width: 230px; padding: 10px 18px; }

.arena-view .arhead { margin: 0 0 12px; padding-bottom: 10px; }
.arena-view .arnow { padding: 16px 16px 14px; }
.arena-view .arnow-n { font-size: 46px; }
.arena-view .arnow h3 { font-size: 18px; margin-bottom: 8px; }
.arena-view .arnow-meta { gap: 5px; margin-bottom: 10px; }
.arena-view .arnow-meta li { font-size: 11.5px; }
.arena-view .arnow-btn { padding: 10px 14px; }

@media (min-width: 1100px) {
  .arena-view .ladder { gap: 5px; }
  .arena-view .ladder-row { min-height: 46px; padding: 5px 11px; }
  .arena-view .ladder-row .medal { width: 26px; height: 26px; font-size: 11px; }
  .arena-view .ladder-row .name { font-size: 14px; }
}
.side-card { padding: 11px 12px; }
.side-card h4 { font-size: 14.5px; }
.side-card .muted { font-size: 11.5px; margin-bottom: 8px; }
.side-list li { font-size: 11.5px; }

/* без новинарските колони в Арената */
body:has(#view-arena.active) #railLeft,
body:has(#view-arena.active) #railRight { display: none !important; }

/* чип „България“ */
.bgchip {
  display: inline-flex; align-items: center; gap: 6px;
  margin-left: 10px; padding: 6px 12px;
  border-radius: 999px; border: 1px solid rgba(201,162,39,.45);
  background: rgba(201,162,39,.1); color: #f2dd9b;
  font: 600 11.5px/1 system-ui, sans-serif; letter-spacing: .04em;
  cursor: pointer; transition: background .15s, border-color .15s;
}
.bgchip:hover { background: rgba(201,162,39,.18); border-color: rgba(201,162,39,.7); }
@media (max-width: 700px) { .bgchip { margin: 8px 0 0; } }