/* ═══════════════════════════════════════════════════════════════════════════
   polish.css — ТИПОГРАФСКИ И ТЪЧ-ЕТАЖ (P2)
   ───────────────────────────────────────────────────────────────────────────
   Зарежда се ПОСЛЕДЕН. Не предефинира подредбата — само вдига долния праг:

     • текст        ≥ 11 px   (всичко, което се чете като изречение/число)
     • етикет       ≥ 12 px   (главни букви, навигация, чипове, бутони)
     • тъч-цел      ≥ 44 × 44 px на телефон/таблет (≤ 900 px или „груб“ показалец)

   Защо `!important`: файловете преди него слагат размери на 4–5 нива на
   влагане (app.css → home-v3.css → arena-deco.css → responsive-fix.css), често
   и с `!important` в мобилните блокове. Тук това е нарочно „етaж“, който не
   бива да бъде надписван отдолу — иначе следващото пипане на който и да е от
   тях връща 8 px текст. Всичко останало (цвят, тегло, подредба) се наследява.

   Мерено на 390 / 768 / 1440 — вж. docs/launch/polish.md.
   ═══════════════════════════════════════════════════════════════════════════ */

:root{
  --p-text: 11px;   /* долен праг за текст */
  --p-label: 12px;  /* долен праг за етикет/навигация/бутон */
  --p-touch: 44px;  /* минимална тъч-цел */
}

/* ─────────────────────────────────────────────────────────────
   1. НАВИГАЦИЯ И ТАБОВЕ → 12 px
   Хедърът (Рулетка/Новини/Форум/Арена/Дуел) и табовете в Арената.
   ═════════════════════════════════════════════════════════════ */
body.hv3 header.top nav.nav .tab,
body.hv3 header.top nav.nav .tab.active,
body.hv3 header.top nav.nav a.tab,
body.hv3 a.tab,
body.hv3 button.tab,
body.hv3 #newsTab.tab,
body.hv3 .tabs a,
body.hv3 nav.tabs a,
body.hv3 .tabs a.tab,
body.hv3 .nav a{
  font-size: var(--p-label) !important;
  letter-spacing: .12em !important;
}

/* табовете в класацията (ТОЧКИ / НИВО / ДНЕС) */
body.hv3 .lb-tab,
body.hv3 .dc-board .lb-tab,
body.hv3 .lb-tab.on,
body.hv3 .dc-board .lb-tab.on{
  font-size: var(--p-label) !important;
  letter-spacing: .1em !important;
  padding-left: 8px !important;
  padding-right: 8px !important;
}

/* ─────────────────────────────────────────────────────────────
   2. ЕТИКЕТИ, НАДЗАГЛАВИЯ, „КИКЕРИ“ → 12 px
   Дребните главни букви, които носеха 7.5–10 px.
   ═════════════════════════════════════════════════════════════ */

/* начална: надзаглавие на героя, подсказка, етикети на панелите */
body.hv3 .heroinner .eyebrow,
body.hv3 .eyebrow{
  font-size: var(--p-label) !important;
  letter-spacing: .18em !important;
  line-height: 1.2 !important;
}
@media (max-width: 520px){
  body.hv3 .heroinner .eyebrow{ letter-spacing: .1em !important; }
  /* петте таба да влязат в 380 px, без да се скролват настрани */
  body.hv3 header.top nav.nav{gap: 12px !important;}
  body.hv3 header.top nav.nav .tab,
  body.hv3 header.top nav.nav a.tab{
    padding-left: 2px !important;
    padding-right: 2px !important;
    letter-spacing: .06em !important;
  }
}
body.hv3 .herohint{
  font-size: var(--p-label) !important;
  letter-spacing: .12em !important;
  line-height: 1.2 !important;
}
body.hv3 .panel .label,
body.hv3 .panelhead .label,
body.hv3 .quote-band .label,
body.hv3 p.label{
  font-size: var(--p-label) !important;
  letter-spacing: .2em !important;
  line-height: 1.2 !important;
}
body.hv3 .panel .panelcount,
body.hv3 .panelhead .panelcount,
body.hv3 .wheelpanel .panelcount{
  font-size: var(--p-label) !important;
  letter-spacing: .1em !important;
  line-height: 1.3 !important;
}
body.hv3 .panel .mini{
  font-size: var(--p-label) !important;
  line-height: 1.3 !important;
}

/* темата на деня */
body.hv3 .topiccard .area,
body.hv3 #topicArea.area,
body.hv3 .topiccard .meta{
  font-size: var(--p-label) !important;
  letter-spacing: .16em !important;
  line-height: 1.3 !important;
}
body.hv3 .topiccard .meta{ font-size: var(--p-text) !important; }

/* цитатът */
body.hv3 .quote-band cite{ font-size: var(--p-label) !important; letter-spacing: .14em !important; }

/* щемпелът с броя на изданието и лентата с метаданни под героя */
body.hv3 .issue span{
  font-size: var(--p-text) !important;
  line-height: 1.45 !important;
  letter-spacing: .14em !important;
}
body.hv3 .hero-meta div{
  font-size: var(--p-label) !important;
  line-height: 1.45 !important;
  letter-spacing: .14em !important;
}

/* логото: подзаглавие и лента VIP */
body.hv3 header.top .brand .tag,
body.hv3 p.tag,
body.hv3 .tag{
  font-size: var(--p-label) !important;
  letter-spacing: .14em !important;
  line-height: 1.3 !important;
}

/* дневна лента, брояч на форума, VT */
body.hv3 .db-tag,
body.hv3 .ha-tag,
body.hv3 .dc-tag,
body.hv3 .dc-chip{ font-size: var(--p-label) !important; letter-spacing: .12em !important; }
body.hv3 .db-tag,
body.hv3 .ha-tag{ line-height: 1.4 !important; }

body.hv3 b#forumCount,
body.hv3 #forumCount,
body.hv3 #vtNum,
body.hv3 .vt-pill b,
body.hv3 .vt-pill .vt-badge,
body.hv3 .vt-badge,
body.hv3 .onlinebadge,
body.hv3 .onlinebadge b,
body.hv3 #onlineNum{
  font-size: var(--p-text) !important;
  line-height: 1.25 !important;
}

/* дребните „· единица“ добавки (· безплатен, / 20, · 2000 точки)
   ВАЖНО: `em` и `i` НЕ се пипат глобално — `h2.hero em` е 34–68 px и
   един гол `em` селектор би смалил заглавието. Затова само точните места. */
body.hv3 small,
body.hv3 p small,
body.hv3 b small,
body.hv3 span small,
body.hv3 .statrow small,
body.hv3 .bignum small,
body.hv3 .am-tourney-stat b i,
body.hv3 .dc-pnum i,
body.hv3 .num i{
  font-size: var(--p-text) !important;
  line-height: 1.3 !important;
}

/* стъпките и пътеките */
body.hv3 .paths .pn,
body.hv3 span.pn{
  font-size: var(--p-text) !important;
  letter-spacing: .1em !important;
  line-height: 1.3 !important;
  min-width: 40px !important;
}

/* ─────────────────────────────────────────────────────────────
   3. БУТОНИ И ЧИПОВЕ → 12 px
   ═════════════════════════════════════════════════════════════ */
body.hv3 .herocta .primary,
body.hv3 #heroSpin.primary,
body.hv3 .panel .primary.wide,
body.hv3 .topiccard .primary.wide,
body.hv3 #openTopic.primary.wide,
body.hv3 .herocta .bgchip,
body.hv3 #bgChip.bgchip,
body.hv3 .db-btn,
body.hv3 #dailyBandBtn.db-btn,
body.hv3 #dailyHeroBtn.dc-daily-btn,
body.hv3 .wheelcontrols .spinagain,
body.hv3 #spinBtn.spinagain,
body.hv3 .paths .pathmore,
body.hv3 .pathmore,
body.hv3 .ha-btn,
body.hv3 #haPlay.ha-btn,
body.hv3 #focusBtn,
body.hv3 #friendsBtn,
body.hv3 #logoutBtn,
body.hv3 #findBtn,
body.hv3 .topright .ghost,
body.hv3 .modebtn,
body.hv3 .dc-modes .modebtn,
body.hv3 .dc-arena .dc-modes .modebtn{
  font-size: var(--p-label) !important;
  letter-spacing: .12em !important;
  line-height: 1.15 !important;
}
/* чипът „България · 550 теми“ не е главни букви — чете се като текст */
body.hv3 .herocta .bgchip,
body.hv3 #bgChip.bgchip{
  letter-spacing: .04em !important;
  font-size: var(--p-label) !important;
}

/* превключвателят „Без повторения“ */
body.hv3 .wheelcontrols .switch,
body.hv3 label.switch{
  font-size: var(--p-label) !important;
  letter-spacing: .08em !important;
}

/* ─────────────────────────────────────────────────────────────
   4. АРЕНАТА: кръгове, статистика, лента за следващ
   ═════════════════════════════════════════════════════════════ */
body.hv3 .dc-kicker,
body.hv3 .dc-daily .dc-kicker,
body.hv3 .dc-head .dc-kicker{
  font-size: var(--p-label) !important;
  letter-spacing: .18em !important;
  line-height: 1.2 !important;
}
body.hv3 .dc-stat{ font-size: var(--p-text) !important; line-height: 1.25 !important; }
/* „още няма издание“ / „днес“ — дребните бележки в чиповете на режимите */
body.hv3 .modebtn-mark,
body.hv3 .modebtn i,
body.hv3 .modebtn span{ font-size: var(--p-text) !important; line-height: 1.25 !important; }
body.hv3 .dc-next,
body.hv3 .dc-daily-sub,
body.hv3 .dc-foot,
body.hv3 .dc-board .lb-me{ font-size: var(--p-text) !important; line-height: 1.3 !important; }

/* кръгчетата I–X: етикетът под номера
   (responsive-fix.css:75 го държи на 9 px при ≤480 с (0,3,1) — затова тук
   селекторът е също толкова дълбок, за да спечели етажът) */
body.hv3 .dc-cta,
body.hv3 .dc-card .dc-cta,
body.hv3 .dc-card .dc-cta span,
body.hv3 .dc-grid .dc-card .dc-cta{
  font-size: var(--p-text) !important;
  letter-spacing: 0 !important;
  line-height: 1.15 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  max-width: 100% !important;
}

/* класацията */
body.hv3 .dc-board .lb-name{ font-size: var(--p-label) !important; line-height: 1.15 !important; }
body.hv3 .dc-board .lb-name small,
body.hv3 .dc-board .lb-val small{ font-size: var(--p-text) !important; line-height: 1.3 !important; }

/* седмичната лига в дъската */
body.hv3 .am-league-eyebrow,
body.hv3 .am-league-next-label,
body.hv3 .am-league-next-val,
body.hv3 .am-league-days,
body.hv3 .am-league-cap,
body.hv3 .am-tourney-empty,
body.hv3 .dc-board .am-league p,
body.hv3 .dc-board .am-league-note{
  font-size: var(--p-text) !important;
  line-height: 1.35 !important;
}

/* турнирите: модулът е с 8–10.5 px и навсякъде `!important`, затова
   етажът минава по тип елемент, а не по клас. Числата (b) и бутонът
   (13 px) НЕ се пипат — иначе етажът би ги свалил. */
body.hv3 .am-tourney-stat span,
body.hv3 .am-tourney-empty,
body.hv3 .am-tourney-note,
body.hv3 .am-tourney b i,
body.hv3 .dc-left-side .am-tourney-stat span,
body.hv3 .dc-left-side .am-tourney-note,
body.hv3 .dc-left-side .am-tourney-empty{
  font-size: var(--p-text) !important;
  line-height: 1.35 !important;
}
body.hv3 .am-tourney-title em,
body.hv3 .dc-left-side .am-tourney-title em{
  font-size: var(--p-text) !important;
  letter-spacing: .1em !important;
  line-height: 1.2 !important;
}
/* „започва в 19:00“ е статусен етикет — 12 px, колкото останалите */
body.hv3 .am-tourney-done,
body.hv3 .dc-left-side .am-tourney-done{
  font-size: var(--p-label) !important;
  letter-spacing: .1em !important;
  line-height: 1.3 !important;
}

/* VIP лентата — стоеше на 7–8 px, за да влезе в 22 px аватарни редове */
body.hv3 .vip-ribbon,
body.hv3 .lb-nm .vip-ribbon,
body.hv3 .dc-board .lb-nm .vip-ribbon,
.vip-ribbon{
  font-size: var(--p-text) !important;
  letter-spacing: .1em !important;
  line-height: 1.1 !important;
  padding: 2px 5px !important;
}

/* ─────────────────────────────────────────────────────────────
   5. КОЛЕЛОТО (SVG): 20-те теми около диска — 9 px → 11 px
   Шрифтът е в единици на viewBox 400×400, т.е. мащабира се заедно с диска.
   ═════════════════════════════════════════════════════════════ */
body.hv3 .wheelwrap svg text,
body.hv3 #wheel text{
  font-size: 11px !important;
  letter-spacing: 0 !important;
}
/* центрът на колелото */
body.hv3 .hub .hub-label,
body.hv3 .hub-label{
  font-size: var(--p-label) !important;
  letter-spacing: .08em !important;
  line-height: 1.25 !important;
}

/* ─────────────────────────────────────────────────────────────
   6. ТЪЧ-ЦЕЛИ ≥ 44×44 — телефон и таблет
   ═════════════════════════════════════════════════════════════ */
@media (max-width: 1024px), (pointer: coarse){
  /* хедър: логото вече е 213×44 на таблет; на телефон остава колоната
     на грида (display НЕ се пипа — inline-flex го свива до 0) */
  body.hv3 header.top .brand,
  body.hv3 #brandHome.brand{
    min-height: var(--p-touch) !important;
  }
  body.hv3 header.top nav.nav .tab,
  body.hv3 header.top nav.nav a.tab,
  body.hv3 a.tab,
  body.hv3 button.tab,
  body.hv3 #newsTab.tab,
  body.hv3 .tabs a,
  body.hv3 nav.tabs a{
    min-height: var(--p-touch) !important;
    min-width: var(--p-touch) !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    padding-left: 6px !important;
    padding-right: 6px !important;
  }
  /* responsive-fix.css държи тези три на min-height:24px !important с
     (1,3,2) — затова селекторът тук е същият по дълбочина */
  body.hv3 header.top .topright #findBtn,
  body.hv3 header.top .topright #focusBtn,
  body.hv3 header.top .topright #friendsBtn,
  body.hv3 header.top .topright #logoutBtn,
  body.hv3 header.top .topright .ghost,
  body.hv3 header.top .topright .authbox,
  body.hv3 header.top .topright .vt-pill{
    min-height: var(--p-touch) !important;
    min-width: var(--p-touch) !important;
  }

  /* начална: чипове и бутони */
  body.hv3 .herocta .primary,
  body.hv3 #heroSpin.primary,
  body.hv3 .herocta .bgchip,
  body.hv3 #bgChip.bgchip,
  body.hv3 .db-btn,
  body.hv3 #dailyBandBtn.db-btn,
  body.hv3 .panel .primary.wide,
  body.hv3 .topiccard .primary.wide,
  body.hv3 #openTopic.primary.wide,
  body.hv3 .paths .pathmore,
  body.hv3 .pathmore,
  body.hv3 #haPlay.ha-btn,
  body.hv3 .ha-btn,
  body.hv3 .wheelcontrols .spinagain,
  body.hv3 #spinBtn.spinagain{
    min-height: var(--p-touch) !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }
  /* превключвателят е <label> — целият ред трябва да е цел */
  body.hv3 .wheelcontrols .switch,
  body.hv3 label.switch{
    min-height: var(--p-touch) !important;
    display: flex !important;
    align-items: center !important;
  }

  /* Арена: дневна лента, режими, табове на класацията, редове */
  body.hv3 #dailyHeroBtn.dc-daily-btn{
    min-height: var(--p-touch) !important;
    display: inline-flex !important;
    align-items: center !important;
  }
  body.hv3 .modebtn,
  body.hv3 .dc-modes .modebtn,
  body.hv3 .dc-arena .dc-modes .modebtn{
    min-height: var(--p-touch) !important;
    min-width: var(--p-touch) !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }
  body.hv3 .lb-tab,
  body.hv3 .dc-board .lb-tab{
    min-height: var(--p-touch) !important;
    min-width: var(--p-touch) !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }
  body.hv3 .dc-board .lb-list li,
  body.hv3 .dc-board .lb-list li.me{
    min-height: var(--p-touch) !important;
    display: flex !important;
    align-items: center !important;
  }
  body.hv3 .dc-board .lb-nm a,
  body.hv3 .dc-board .lb-ava{
    min-height: 36px !important;
    display: inline-flex !important;
    align-items: center !important;
  }

  /* турнирите: бутонът „влез с 50 VT“ стоеше на 40 px */
  body.hv3 .am-tourney button,
  body.hv3 .am-tourney .am-btn,
  body.hv3 .am-tourney-btn,
  body.hv3 .dc-left-side .am-tourney-btn,
  body.hv3 .dc-left-side .am-tourney-card .am-tourney-btn{
    min-height: var(--p-touch) !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
  }
}

/* ─────────────────────────────────────────────────────────────
   7. ПРЕДПАЗНИ: по-големият шрифт да не изяде подредбата
   ═════════════════════════════════════════════════════════════ */
/* редовете с етикет + брояч да могат да слязат на втори ред, вместо да
   изхвърчат извън панела */
body.hv3 .panelhead{ flex-wrap: wrap !important; row-gap: 6px !important; }
/* кръгчетата в Арената: „✓ ПОВТОРИ“ при 11 px иска 63 px в 58 px кутия.
   Мрежата си остава 5×2 — стягат се само отстъпите, за да влезе етикетът. */
@media (max-width: 480px){
  body.hv3 .dc-arena{ padding-left: 2px !important; padding-right: 2px !important; }
  body.hv3 .dc-grid{ gap: 3px !important; }
  body.hv3 .dc-card{ padding-left: 0 !important; padding-right: 0 !important; }
  /* при 66 px карта „✓ ПОВТОРИ“ се събира на косъм; ако не — да слезе на
     втори ред, вместо да се отреже с „…“ (както беше преди) */
  body.hv3 .dc-card .dc-cta,
  body.hv3 .dc-grid .dc-card .dc-cta{
    white-space: normal !important;
    overflow: visible !important;
    text-overflow: clip !important;
  }
}
/* кръгчетата в Арената: етикетът се събира цял, без „…“ */
body.hv3 .dc-cta{ white-space: nowrap !important; overflow: hidden !important; text-overflow: ellipsis !important; }

/* ─────────────────────────────────────────────────────────────
   8. ОСТАТЪЧНИ ДРЕБНИ ШРИФТОВЕ → 11 px
   Мерени на 1920 по начална и Арена: броячи, „заключен“, „натисни“,
   единицата „VT“ и номерата 01/02/03 на трите колони в Арената.
   Декоративните глифове (◆, ↻, буквите в монетата) НЕ се пипат —
   това са икони, не текст.
   ═════════════════════════════════════════════════════════════ */
body.hv3 span.am-ai-k,
body.hv3 .am-ai .am-ai-k{
  font-size: var(--p-text) !important;
  line-height: 1.15 !important;
}
/* „заключен“ под кръгчето в Арената (app.css го държи на 10 px през ::after) */
body.hv3 .dc-card .dc-stat::after{
  font-size: var(--p-text) !important;
  letter-spacing: .1em !important;
}
/* единицата „ VT“ след числото в хедъра */
body.hv3 b#vtNum::after,
body.hv3 .vt-pill b::after{
  font-size: var(--p-text) !important;
}
/* подсказката в центъра на колелото (появява се при hover) */
body.hv3 .hub::after,
body.hv3 #hubSpin.hub::after{
  font-size: var(--p-text) !important;
  letter-spacing: .1em !important;
  bottom: 18px !important;
}
/* номерата 01/02/03 на стъпките (Дневен ритуал) */
body.hv3 .steps li::before{
  font-size: var(--p-text) !important;
  letter-spacing: .06em !important;
  top: 10px !important;
}

/* ─────────────────────────────────────────────────────────────
   9. ПЛЪТНОСТ НА ШИРОК ЕКРАН (≥1101): началната
   Проблем (1920): .wrap е „разтегнат“ до 100vw-72 (=1756), темата на деня
   е 1434 широка и дясната ѝ половина стои празна (900 × 280 без текст),
   а колелото свършва на 1320 — под него остава 180 × 620 празна колона.
   Решение: контейнерът се връща към заложените 1400 px (редакционна
   ширина), а панелите се подреждат в ДВЕ колони с естествената си
   височина (columns, не grid — иначе по-късият панел се разпъва и
   празното място влиза вътре в картата). Няма нови блокове и нито дума
   ново съдържание.
   ═════════════════════════════════════════════════════════════ */
@media (min-width:1101px){
  body.hv3 #view-spin > .wrap,
  body.hv3 #view-spin .heroinner.wrap{
    max-width: 1400px !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
  body.hv3 .grid > .rightcol{
    display: block;
    columns: 2;
    column-gap: 26px;
  }
  /* двете ленти („Днес“ и „Арена“) стояха ПОД първия панел заради
     margin-top:-64px — на широк екран текстът им се виждаше само
     откъслечно до ръба на картата. Панелът вече не ги застъпва. */
  body.hv3 .grid{ margin-top: 10px; }
  /* лентите се стягат една към друга (22 → 14 px) — редът става по-плътен */
  body.hv3 .dailyband,
  body.hv3 .homearena{ margin-top: 14px; }
  body.hv3 .grid > .rightcol > .panel{
    break-inside: avoid;
    -webkit-column-break-inside: avoid;
    margin: 0 0 14px;
    width: 100%;
  }
  body.hv3 .grid > .rightcol > .panel:last-child{ margin-bottom: 0; }
  /* вътрешният отстъп на панелите се стяга с 4 px — двете колони стават
     по-плътни, без текстът да опира в рамката */
  body.hv3 .grid > .rightcol > .panel{ padding: 20px 22px; }
}

/* ─────────────────────────────────────────────────────────────
   10. ПЛЪТНОСТ НА ШИРОК ЕКРАН (≥1200): Арената
   Проблем (1920): трите колони са 269 / 1149 / 288, но левият стълб
   свършва на 494 — под него остава 260 × 840 празно. Плюс 220 px
   празни ъгли около центрираните чипове и режими в заглавието.
   (От 1200 px нагоре home-v3.css вече дава три колони — затова
   поправката започва оттам; при 1280 залата се събираше в 565 px.)
   Решение: турнирите излизат над залата като лента в две карти
   (същите две карти, само подредба), а отстоянията в заглавието се
   стягат с 24 px. Залата и класацията остават на местата си.
   ═════════════════════════════════════════════════════════════ */
@media (min-width:1200px){
  body.hv3 .dc-layout{
    grid-template-columns: minmax(0, 1fr) clamp(280px, 15vw, 360px) !important;
    grid-template-areas: "tours board" "zone board" !important;
    gap: 14px clamp(14px, 1.2vw, 26px) !important;
    align-items: start !important;
  }
  body.hv3 .dc-left-side{ grid-area: tours !important; min-width: 0; }
  body.hv3 .dc-zone{ grid-area: zone !important; min-width: 0; }
  body.hv3 .dc-board{ grid-area: board !important; }
  /* лентата не е лепкава — иначе при скрол застъпва залата */
  body.hv3 .arena-mods-tourney{ position: static !important; margin: 0 !important; }
  body.hv3 .dc-left-side .am-tourney-grid{
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 14px !important;
  }
  body.hv3 .dc-left-side .am-tourney{ padding: 12px 14px !important; }

  /* заглавието на залата: 362 → 338 px, ъглите падат под 200 px */
  body.hv3 .dc-arena .dc-head{ padding-bottom: 16px !important; }
  body.hv3 .dc-arena .dc-progress{ margin-top: 10px !important; }
  body.hv3 .dc-arena .dc-modes{ margin-top: 8px !important; }
  body.hv3 .dc-arena .dc-play{ margin-top: 0 !important; }
}