*{box-sizing:border-box}:root{--bg:#030817;--card:rgba(255,255,255,.075);--line:rgba(255,255,255,.12);--text:#fff;--muted:rgba(255,255,255,.66);--blue:#00caff;--cyan:#38e8ff;--green:#22c55e;--yellow:#facc15;--shadow:0 30px 120px rgba(0,0,0,.38)}html,body{margin:0;min-height:100%;background:radial-gradient(circle at 15% 10%,rgba(56,232,255,.16),transparent 30%),radial-gradient(circle at 85% 10%,rgba(250,204,21,.10),transparent 30%),radial-gradient(circle at 50% 100%,rgba(59,130,246,.16),transparent 36%),linear-gradient(135deg,#030817 0%,#06132b 50%,#020617 100%);color:var(--text);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;overflow:hidden}body:before{content:"";position:fixed;inset:0;pointer-events:none;background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:48px 48px;mask-image:radial-gradient(circle at center,black,transparent 76%)}.app-shell{position:relative;z-index:1;height:100vh;padding:clamp(18px,2vw,34px);display:flex;flex-direction:column;gap:clamp(14px,1.5vw,24px)}.topbar{display:flex;align-items:center;justify-content:space-between;gap:18px;flex:0 0 auto}.brand-area{display:flex;align-items:center;gap:16px;min-width:0}.brand-logo{max-width:180px;max-height:64px;object-fit:contain}.brand-mark{width:54px;height:54px;display:grid;place-items:center;border-radius:18px;background:linear-gradient(135deg,var(--cyan),#2563eb);color:#02111f;font-weight:1000;font-size:28px;box-shadow:0 18px 50px rgba(0,202,255,.25)}.eyebrow,.section-label{color:var(--muted);font-size:clamp(10px,.75vw,12px);text-transform:uppercase;letter-spacing:.18em;font-weight:900}h1,h2{margin:0;letter-spacing:-.04em}h1{font-size:clamp(25px,2.5vw,44px);line-height:.95}h2{font-size:clamp(18px,1.3vw,26px)}.top-actions{display:flex;align-items:center;gap:12px}.date-pill,.sound-button,.muted-pill,.live-dot,.connection-status{border:1px solid var(--line);background:rgba(255,255,255,.075);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px)}.date-pill{display:grid;gap:2px;min-width:150px;padding:10px 14px;border-radius:18px;text-align:right}.date-pill span{color:var(--muted);font-size:11px;font-weight:800}.date-pill strong{font-size:15px}.sound-button{appearance:none;border-radius:999px;color:#fff;padding:12px 16px;display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:900;cursor:pointer;box-shadow:0 16px 50px rgba(0,0,0,.24)}.sound-button.active{background:rgba(34,197,94,.16);color:#bbf7d0}.dashboard-grid{min-height:0;flex:1 1 auto;display:grid;grid-template-columns:minmax(0,1.75fr) minmax(330px,.95fr);grid-template-rows:auto minmax(0,1fr);gap:clamp(14px,1.3vw,22px);grid-template-areas:"hero ranking" "sectors side"}.card{border:1px solid var(--line);background:linear-gradient(135deg,rgba(255,255,255,.105),rgba(255,255,255,.045));box-shadow:var(--shadow);border-radius:clamp(22px,1.6vw,32px);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);overflow:hidden}.hero-card{grid-area:hero;padding:clamp(24px,2.2vw,44px)}.hero-value{margin-top:8px;color:var(--blue);font-size:clamp(54px,6vw,118px);line-height:.86;font-weight:1000;letter-spacing:-.08em;white-space:nowrap}.goal-row{margin-top:clamp(18px,1.5vw,28px);display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.goal-row div{padding:14px 16px;border:1px solid var(--line);background:rgba(255,255,255,.06);border-radius:20px}.goal-row span{display:block;color:var(--muted);font-size:12px;font-weight:800;margin-bottom:4px}.goal-row strong{font-size:clamp(16px,1.3vw,24px)}.main-progress{height:14px;margin-top:18px;overflow:hidden;border-radius:999px;background:rgba(255,255,255,.08)}.main-progress div{width:0;height:100%;min-width:0;border-radius:inherit;background:linear-gradient(90deg,#2563eb,var(--cyan),var(--green));box-shadow:0 0 25px rgba(56,232,255,.36);transition:width .75s ease}.ranking-card{grid-area:ranking;padding:clamp(18px,1.5vw,28px);min-height:0}.card-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:14px;margin-bottom:18px}.live-dot{position:relative;border-radius:999px;padding:7px 10px 7px 24px;color:#bbf7d0;font-size:11px;font-weight:1000;text-transform:uppercase;letter-spacing:.08em}.live-dot:before{content:"";width:8px;height:8px;background:var(--green);border-radius:999px;position:absolute;left:10px;top:50%;transform:translateY(-50%);box-shadow:0 0 14px rgba(34,197,94,.9);animation:livePulse 1.2s infinite}@keyframes livePulse{0%,100%{opacity:.45;transform:translateY(-50%) scale(.92)}50%{opacity:1;transform:translateY(-50%) scale(1.12)}}.ranking-list{list-style:none;margin:0;padding:0;display:grid;gap:10px;max-height:calc(100vh - 230px);overflow:hidden}.rank-item{display:grid;grid-template-columns:44px minmax(0,1fr) auto;align-items:center;gap:12px;padding:12px;border-radius:20px;background:rgba(255,255,255,.075);}.rank-item.rank-1{background:linear-gradient(135deg,rgba(250,204,21,.34),rgba(255,255,255,.08));border-color:rgba(250,204,21,.45);box-shadow:0 0 44px rgba(250,204,21,.12)}.rank-item.rank-2{background:linear-gradient(135deg,rgba(226,232,240,.24),rgba(255,255,255,.07))}.rank-item.rank-3{background:linear-gradient(135deg,rgba(251,146,60,.25),rgba(255,255,255,.07))}.rank-pos{width:42px;height:42px;border-radius:16px;display:grid;place-items:center;font-weight:1000;background:rgba(0,0,0,.22)}.rank-profile{display:flex;align-items:center;gap:10px;min-width:0}.avatar,.avatar-fallback{width:42px;height:42px;border-radius:999px;flex:0 0 auto;object-fit:cover;display:grid;place-items:center;background:linear-gradient(135deg,rgba(255,255,255,.24),rgba(255,255,255,.08));color:#fff;font-weight:1000;border:1px solid rgba(255,255,255,.12)}.rank-name{min-width:0}.rank-name strong,.sale-info strong{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.rank-name span,.sale-info span{display:block;color:var(--muted);font-size:12px;margin-top:2px}.rank-total{text-align:right;white-space:nowrap}.rank-total strong{display:block;font-size:15px}.rank-total span{color:var(--muted);font-size:12px}.sectors-card{grid-area:sectors;padding:clamp(18px,1.5vw,28px);min-height:0}.muted-pill{border-radius:999px;padding:8px 11px;color:var(--muted);font-size:12px;font-weight:900}.sectors-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;min-height:0;max-height:calc(100vh - 460px);overflow:hidden}.sector-card{padding:16px;border:1px solid rgba(255,255,255,.10);border-radius:22px;background:rgba(255,255,255,.06);min-width:0}.sector-title{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:12px}.sector-title strong{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sector-title span{color:var(--cyan);font-weight:1000}.sector-money{color:#fff;font-size:clamp(20px,1.6vw,30px);font-weight:1000;letter-spacing:-.04em}.sector-meta{display:grid;gap:6px;margin-top:10px;color:var(--muted);font-size:12px}.sector-meta div{display:flex;justify-content:space-between;gap:10px}.sector-bar{height:9px;overflow:hidden;border-radius:999px;margin-top:12px;background:rgba(255,255,255,.08)}.sector-bar div{height:100%;width:0;border-radius:inherit;background:linear-gradient(90deg,#2563eb,var(--cyan));transition:width .7s ease}.side-column{grid-area:side;min-height:0;display:grid;grid-template-rows:auto minmax(0,1fr);gap:clamp(14px,1.3vw,22px)}.prize-card,.latest-card{padding:clamp(18px,1.5vw,28px)}.prize-box{display:grid;gap:14px;text-align:center;place-items:center}.prize-box img{width:100%;max-height:210px;object-fit:cover;border-radius:24px;border:1px solid rgba(255,255,255,.12)}.prize-box strong{display:inline-flex;justify-content:center;max-width:100%;border-radius:999px;padding:10px 16px;color:#101827;background:linear-gradient(135deg,#f59e0b,#facc15);font-size:15px;font-weight:1000}.prize-fallback{width:100%;min-height:155px;display:grid;place-items:center;border-radius:24px;font-size:70px;background:radial-gradient(circle,rgba(250,204,21,.2),rgba(255,255,255,.06));border:1px solid rgba(255,255,255,.12)}.latest-sales{display:grid;gap:10px;max-height:calc(100vh - 590px);overflow:hidden}.sale-item{display:grid;grid-template-columns:42px minmax(0,1fr) auto;align-items:center;gap:10px;border-radius:18px;padding:10px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08)}.sale-value{color:var(--green);font-weight:1000;white-space:nowrap}.empty-state{color:var(--muted);border:1px dashed rgba(255,255,255,.16);border-radius:20px;padding:18px;text-align:center}.connection-status{position:fixed;left:18px;bottom:18px;z-index:50;padding:8px 12px;border-radius:999px;color:var(--muted);font-size:12px;font-weight:900}.connection-status.ok{color:#bbf7d0}.connection-status.error{color:#fecdd3;background:rgba(251,113,133,.14)}.celebration-overlay{position:fixed;inset:0;z-index:999;display:grid;place-items:center;background:rgba(0,0,0,.72);opacity:0;visibility:hidden;pointer-events:none;transition:.35s ease;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}.celebration-overlay.show{opacity:1;visibility:visible}.celebration-box{width:min(760px,92vw);padding:clamp(28px,3vw,48px);border-radius:34px;text-align:center;border:1px solid rgba(255,255,255,.16);background:radial-gradient(circle at 50% 0%,rgba(0,202,255,.24),transparent 45%),linear-gradient(135deg,rgba(255,255,255,.13),rgba(255,255,255,.06));box-shadow:0 40px 140px rgba(0,0,0,.55),0 0 100px rgba(0,202,255,.14);transform:scale(.96);transition:.35s ease}.celebration-overlay.show .celebration-box{transform:scale(1)}.celebration-kicker{color:var(--cyan);text-transform:uppercase;letter-spacing:.22em;font-weight:1000;font-size:13px}.celebration-title{margin-top:8px;font-size:clamp(42px,5vw,82px);line-height:.9;font-weight:1000;letter-spacing:-.06em}.celebration-profile{margin:24px auto 0;width:fit-content;max-width:100%;display:grid;grid-template-columns:76px minmax(0,1fr);align-items:center;gap:16px;text-align:left;padding:16px 22px 16px 16px;border-radius:999px;background:rgba(255,255,255,.10);border:1px solid rgba(255,255,255,.14)}.celebration-profile img,.celebration-initials{width:76px;height:76px;border-radius:999px;object-fit:cover;display:grid;place-items:center;background:#fff;color:#030817;font-size:28px;font-weight:1000}.celebration-profile strong{display:block;font-size:22px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.celebration-profile span{display:block;color:var(--muted)}.celebration-profile b{display:block;color:var(--green);font-size:22px;margin-top:4px}@media(max-width:1400px){.dashboard-grid{grid-template-columns:minmax(0,1.6fr) minmax(310px,.9fr)}.sectors-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:1024px){body{overflow:auto}.app-shell{height:auto;min-height:100vh}.dashboard-grid{grid-template-columns:1fr;grid-template-areas:"hero" "ranking" "sectors" "side"}.sectors-grid,.ranking-list,.latest-sales{max-height:none;overflow:visible}.topbar,.top-actions,.goal-row{align-items:stretch;flex-direction:column}.date-pill{text-align:left}.hero-value{white-space:normal}.sectors-grid{grid-template-columns:1fr}}


/* =========================================================
   AJUSTE TV V2
   - ranking mais compacto e com limite visual
   - hero sem espaço morto
   - tela adaptada para 1080p sem cortar as seções de baixo
   ========================================================= */

@media (min-width: 1025px) {
  html,
  body {
    width: 100%;
    height: 100%;
    overflow: hidden;
  }

  .app-shell {
    height: 100vh;
    padding: clamp(14px, 1.35vw, 24px);
    gap: clamp(10px, 1vw, 16px);
  }

  .topbar {
    min-height: 70px;
  }

  .brand-logo {
    max-width: 170px;
    max-height: 58px;
  }

  h1 {
    font-size: clamp(28px, 2vw, 38px);
  }

  .dashboard-grid {
    flex: 1;
    min-height: 0;
    display: grid;
    grid-template-columns: minmax(0, 1.72fr) minmax(370px, .88fr);
    grid-template-rows: minmax(245px, 34vh) minmax(0, 1fr);
    grid-template-areas:
      "hero ranking"
      "sectors side";
    gap: clamp(12px, 1vw, 18px);
  }

  .card {
    border-radius: clamp(18px, 1.3vw, 26px);
  }

  .hero-card {
    min-height: 0;
    height: 100%;
    padding: clamp(20px, 1.75vw, 32px);
    display: flex;
    flex-direction: column;
    justify-content: center;
  }

  .hero-value {
    font-size: clamp(58px, 5.15vw, 98px);
    margin-top: 4px;
  }

  .goal-row {
    margin-top: clamp(14px, 1.2vw, 20px);
    gap: 12px;
  }

  .goal-row div {
    padding: 12px 14px;
    border-radius: 18px;
  }

  .goal-row span {
    font-size: 11px;
  }

  .goal-row strong {
    font-size: clamp(17px, 1.15vw, 22px);
  }

  .main-progress {
    height: 12px;
    margin-top: 16px;
  }

  .ranking-card {
    height: 100%;
    min-height: 0;
    padding: clamp(16px, 1.25vw, 24px);
    display: flex;
    flex-direction: column;
  }

  .ranking-card .card-heading {
    flex: 0 0 auto;
    margin-bottom: 12px;
  }

  .ranking-list {
    flex: 1;
    min-height: 0;
    max-height: none;
    overflow-y: auto;
    overflow-x: hidden;
    padding-right: 4px;
    gap: 8px;
    scrollbar-width: thin;
    scrollbar-color: rgba(255,255,255,.28) rgba(255,255,255,.06);
  }

  .ranking-list::-webkit-scrollbar {
    width: 6px;
  }

  .ranking-list::-webkit-scrollbar-track {
    background: rgba(255,255,255,.05);
    border-radius: 999px;
  }

  .ranking-list::-webkit-scrollbar-thumb {
    background: rgba(255,255,255,.22);
    border-radius: 999px;
  }

  .rank-item {
    grid-template-columns: 40px minmax(0, 1fr) auto;
    gap: 10px;
    padding: 9px 10px;
    border-radius: 17px;
    min-height: 68px;
  }

  .rank-pos {
    width: 38px;
    height: 38px;
    border-radius: 14px;
    font-size: 16px;
  }

  .avatar,
  .avatar-fallback {
    width: 38px;
    height: 38px;
  }

  .rank-name strong {
    font-size: 15px;
  }

  .rank-name span,
  .rank-total span {
    font-size: 11px;
  }

  .rank-total strong {
    font-size: 14px;
  }

  .sectors-card,
  .prize-card,
  .latest-card {
    padding: clamp(16px, 1.25vw, 24px);
  }

  .sectors-card {
    height: 100%;
    min-height: 0;
    display: flex;
    flex-direction: column;
  }

  .sectors-card .card-heading {
    flex: 0 0 auto;
    margin-bottom: 12px;
  }

  .sectors-grid {
    flex: 1;
    min-height: 0;
    max-height: none;
    overflow-y: auto;
    overflow-x: hidden;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 12px;
    padding-right: 4px;
    scrollbar-width: thin;
    scrollbar-color: rgba(255,255,255,.26) rgba(255,255,255,.05);
  }

  .sectors-grid::-webkit-scrollbar {
    width: 6px;
  }

  .sectors-grid::-webkit-scrollbar-track {
    background: rgba(255,255,255,.05);
    border-radius: 999px;
  }

  .sectors-grid::-webkit-scrollbar-thumb {
    background: rgba(255,255,255,.22);
    border-radius: 999px;
  }

  .sector-card {
    padding: 14px;
    border-radius: 18px;
    min-height: 150px;
  }

  .sector-money {
    font-size: clamp(22px, 1.35vw, 28px);
  }

  .sector-meta {
    font-size: 11px;
  }

  .side-column {
    height: 100%;
    min-height: 0;
    display: grid;
    grid-template-rows: minmax(210px, .82fr) minmax(0, 1.18fr);
    gap: clamp(12px, 1vw, 18px);
  }

  .prize-card,
  .latest-card {
    min-height: 0;
  }

  .prize-box {
    gap: 10px;
  }

  .prize-box img {
    max-height: 145px;
  }

  .prize-fallback {
    min-height: 125px;
    font-size: 58px;
  }

  .latest-card {
    display: flex;
    flex-direction: column;
  }

  .latest-card .card-heading {
    flex: 0 0 auto;
    margin-bottom: 12px;
  }

  .latest-sales {
    flex: 1;
    min-height: 0;
    max-height: none;
    overflow-y: auto;
    overflow-x: hidden;
    gap: 8px;
    padding-right: 4px;
    scrollbar-width: thin;
    scrollbar-color: rgba(255,255,255,.26) rgba(255,255,255,.05);
  }

  .latest-sales::-webkit-scrollbar {
    width: 6px;
  }

  .latest-sales::-webkit-scrollbar-track {
    background: rgba(255,255,255,.05);
    border-radius: 999px;
  }

  .latest-sales::-webkit-scrollbar-thumb {
    background: rgba(255,255,255,.22);
    border-radius: 999px;
  }

  .sale-item {
    grid-template-columns: 36px minmax(0, 1fr) auto;
    padding: 8px;
    border-radius: 15px;
  }

  .sale-item .avatar,
  .sale-item .avatar-fallback {
    width: 36px;
    height: 36px;
  }

  .sale-info strong {
    font-size: 13px;
  }

  .sale-info span {
    font-size: 11px;
  }

  .sale-value {
    font-size: 13px;
  }

  .connection-status {
    left: 12px;
    bottom: 12px;
    font-size: 11px;
    padding: 7px 10px;
  }
}

/* Ajuste extra para telas 1366x768, notebooks e TVs menores */
@media (min-width: 1025px) and (max-height: 850px) {
  .app-shell {
    padding: 12px 18px;
    gap: 10px;
  }

  .topbar {
    min-height: 56px;
  }

  .brand-logo {
    max-height: 46px;
    max-width: 145px;
  }

  .eyebrow,
  .section-label {
    font-size: 9px;
  }

  h1 {
    font-size: 28px;
  }

  h2 {
    font-size: 17px;
  }

  .date-pill {
    padding: 8px 11px;
    min-width: 126px;
  }

  .sound-button {
    padding: 9px 12px;
    font-size: 12px;
  }

  .dashboard-grid {
    grid-template-rows: minmax(210px, 32vh) minmax(0, 1fr);
    grid-template-columns: minmax(0, 1.72fr) minmax(340px, .88fr);
    gap: 10px;
  }

  .hero-card {
    padding: 18px 22px;
  }

  .hero-value {
    font-size: clamp(48px, 5vw, 82px);
  }

  .goal-row div {
    padding: 9px 11px;
    border-radius: 15px;
  }

  .goal-row strong {
    font-size: 17px;
  }

  .main-progress {
    height: 10px;
    margin-top: 12px;
  }

  .ranking-card,
  .sectors-card,
  .prize-card,
  .latest-card {
    padding: 14px 16px;
  }

  .card-heading {
    margin-bottom: 9px;
  }

  .rank-item {
    min-height: 58px;
    padding: 7px 8px;
    border-radius: 14px;
  }

  .rank-pos {
    width: 34px;
    height: 34px;
    border-radius: 12px;
  }

  .avatar,
  .avatar-fallback {
    width: 34px;
    height: 34px;
  }

  .rank-name strong {
    font-size: 13px;
  }

  .rank-total strong {
    font-size: 13px;
  }

  .sectors-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 9px;
  }

  .sector-card {
    min-height: 124px;
    padding: 11px;
  }

  .sector-money {
    font-size: 20px;
  }

  .sector-bar {
    height: 7px;
    margin-top: 8px;
  }

  .sector-meta {
    margin-top: 8px;
    gap: 4px;
  }

  .side-column {
    grid-template-rows: minmax(160px, .74fr) minmax(0, 1.26fr);
    gap: 10px;
  }

  .prize-box img {
    max-height: 105px;
    border-radius: 18px;
  }

  .prize-fallback {
    min-height: 92px;
    font-size: 44px;
    border-radius: 18px;
  }

  .prize-box strong {
    padding: 8px 12px;
    font-size: 12px;
  }
}


/* =========================================================
   AJUSTE TV V3
   - ticker horizontal no topo
   - ranking maior
   - prêmio sem crop
   ========================================================= */

.sales-ticker {
  flex: 0 0 auto;
  padding: 10px 0;
  overflow: hidden;
}

.ticker-marquee {
  position: relative;
  overflow: hidden;
  width: 100%;
  mask-image: linear-gradient(90deg, transparent, black 4%, black 96%, transparent);
  -webkit-mask-image: linear-gradient(90deg, transparent, black 4%, black 96%, transparent);
}

.ticker-track {
  display: flex;
  align-items: center;
  gap: 18px;
  width: max-content;
  padding: 0 16px;
  animation: destyTickerMove 34s linear infinite;
  will-change: transform;
}

.ticker-item {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 430px;
  max-width: 520px;
  padding: 12px 16px;
  border-radius: 999px;
  background: rgba(255,255,255,.07);
  border: 1px solid rgba(255,255,255,.10);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.04);
}

.ticker-item .ticker-avatar {
  width: 42px;
  height: 42px;
}

.ticker-info {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  width: 100%;
  font-size: 13px;
}

.ticker-info strong,
.ticker-info span,
.ticker-info b,
.ticker-info small {
  white-space: nowrap;
}

.ticker-info strong {
  font-size: 14px;
}

.ticker-info span {
  color: var(--muted);
}

.ticker-info b {
  color: #fff;
  font-size: 14px;
}

.ticker-info small {
  color: rgba(255,255,255,.62);
  font-size: 12px;
  margin-left: auto;
}

@keyframes destyTickerMove {
  from { transform: translateX(0); }
  to { transform: translateX(calc(-50% - 9px)); }
}

@media (min-width: 1025px) {
  .dashboard-grid {
    grid-template-columns: minmax(0, 1.68fr) minmax(420px, .94fr);
    grid-template-rows: minmax(310px, 39vh) minmax(0, 1fr);
    grid-template-areas:
      "hero ranking"
      "sectors prize";
  }

  .ranking-card {
    min-height: 310px;
    display: flex;
    flex-direction: column;
  }

  .ranking-list {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
  }

  .prize-card {
    min-height: 0;
    display: flex;
    flex-direction: column;
    padding: clamp(16px, 1.25vw, 24px);
  }

  .prize-card .card-heading {
    margin-bottom: 10px;
  }

  .prize-box {
    flex: 1;
    min-height: 0;
    gap: 12px;
  }

  .prize-box img {
    width: 100%;
    height: clamp(190px, 29vh, 340px);
    max-height: none;
    object-fit: contain;
    background: rgba(0,0,0,.18);
    padding: 8px;
  }

  .prize-fallback {
    width: 100%;
    min-height: 180px;
  }

  .rank-item {
    min-height: 72px;
  }

  .side-column,
  .latest-card,
  .latest-sales {
    display: none !important;
  }
}

@media (min-width: 1025px) and (max-height: 850px) {
  .sales-ticker {
    padding: 8px 0;
  }

  .ticker-item {
    min-width: 360px;
    max-width: 450px;
    padding: 10px 14px;
  }

  .ticker-item .ticker-avatar {
    width: 36px;
    height: 36px;
  }

  .ticker-info {
    font-size: 12px;
    gap: 6px;
  }

  .ticker-info strong,
  .ticker-info b {
    font-size: 13px;
  }

  .ticker-info small,
  .ticker-info span {
    font-size: 11px;
  }

  .dashboard-grid {
    grid-template-columns: minmax(0, 1.66fr) minmax(410px, .94fr);
    grid-template-rows: minmax(285px, 38vh) minmax(0, 1fr);
  }

  .rank-item {
    min-height: 64px;
  }

  .prize-box img {
    height: clamp(165px, 25vh, 260px);
  }
}


/* =========================================================
   AJUSTE TV V4
   - ticker mais lento
   - ranking ocupa mais altura e mostra 6 vendedores
   - prêmio fica abaixo sem sobrepor ranking
   - setores não cortam no final da tela
   - remove pill quando prêmio não tiver título
   ========================================================= */

#prizeTitle[hidden] {
  display: none !important;
}

@media (min-width: 1025px) {
  .ticker-track {
    animation-duration: 85s !important;
  }

  .sales-ticker {
    padding: 7px 0 !important;
  }

  .ticker-item {
    min-width: 470px;
    max-width: 580px;
    padding: 10px 15px;
  }

  .ticker-info {
    gap: 7px;
  }

  .app-shell {
    height: 100vh;
    padding: 14px 20px 12px !important;
    gap: 10px !important;
    overflow: hidden;
  }

  .topbar {
    min-height: 62px !important;
  }

  .dashboard-grid {
    flex: 1;
    min-height: 0;
    display: grid !important;
    grid-template-columns: minmax(0, 1.68fr) minmax(420px, .94fr) !important;
    grid-template-rows: minmax(250px, 34%) minmax(230px, 34%) minmax(145px, 1fr) !important;
    grid-template-areas:
      "hero ranking"
      "sectors ranking"
      "sectors prize" !important;
    gap: 10px !important;
  }

  .hero-card {
    grid-area: hero !important;
    min-height: 0 !important;
    height: 100% !important;
    padding: 22px 28px !important;
    justify-content: center !important;
  }

  .hero-value {
    font-size: clamp(56px, 5.1vw, 96px) !important;
    margin-top: 4px !important;
  }

  .goal-row {
    margin-top: 16px !important;
    gap: 10px !important;
  }

  .goal-row div {
    padding: 10px 13px !important;
    border-radius: 16px !important;
  }

  .main-progress {
    margin-top: 13px !important;
    height: 9px !important;
  }

  .ranking-card {
    grid-area: ranking !important;
    height: 100% !important;
    min-height: 0 !important;
    padding: 16px 18px !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
    z-index: 2;
  }

  .ranking-card .card-heading {
    flex: 0 0 auto !important;
    margin-bottom: 10px !important;
  }

  .ranking-list {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    gap: 8px !important;
    padding-right: 4px !important;
  }

  .rank-item {
    min-height: 61px !important;
    padding: 8px 10px !important;
    grid-template-columns: 38px minmax(0, 1fr) auto !important;
    gap: 9px !important;
    border-radius: 16px !important;
  }

  .rank-pos {
    width: 36px !important;
    height: 36px !important;
    border-radius: 13px !important;
    font-size: 15px !important;
  }

  .rank-item .avatar,
  .rank-item .avatar-fallback {
    width: 36px !important;
    height: 36px !important;
  }

  .rank-name strong {
    font-size: 14px !important;
  }

  .rank-name span,
  .rank-total span {
    font-size: 11px !important;
  }

  .rank-total strong {
    font-size: 13px !important;
  }

  .sectors-card {
    grid-area: sectors !important;
    height: 100% !important;
    min-height: 0 !important;
    padding: 16px 20px !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
  }

  .sectors-card .card-heading {
    flex: 0 0 auto !important;
    margin-bottom: 10px !important;
  }

  .sectors-grid {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    max-height: none !important;
    overflow-y: auto !important;
    overflow-x: hidden !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    gap: 9px !important;
    padding-right: 4px !important;
  }

  .sector-card {
    min-height: 128px !important;
    padding: 12px 13px !important;
    border-radius: 17px !important;
  }

  .sector-title {
    margin-bottom: 8px !important;
  }

  .sector-title strong {
    font-size: 15px !important;
  }

  .sector-title span {
    font-size: 15px !important;
  }

  .sector-money {
    font-size: 23px !important;
    line-height: 1 !important;
  }

  .sector-bar {
    height: 7px !important;
    margin-top: 9px !important;
  }

  .sector-meta {
    margin-top: 8px !important;
    gap: 3px !important;
    font-size: 11px !important;
  }

  .prize-card {
    grid-area: prize !important;
    height: 100% !important;
    min-height: 0 !important;
    padding: 14px 18px !important;
    display: flex !important;
    flex-direction: column !important;
    overflow: hidden !important;
    z-index: 1;
  }

  .prize-card .card-heading {
    flex: 0 0 auto !important;
    margin-bottom: 8px !important;
  }

  .prize-box {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    display: grid !important;
    place-items: center !important;
    gap: 8px !important;
  }

  .prize-box img {
    width: 100% !important;
    height: 100% !important;
    max-height: 100% !important;
    object-fit: contain !important;
    padding: 6px !important;
    background: rgba(0,0,0,.18) !important;
    border-radius: 18px !important;
  }

  .prize-box strong {
    display: none !important;
  }

  .latest-card,
  .latest-sales,
  .side-column {
    display: none !important;
  }
}

/* Ajuste fino para altura menor, como tela 1600x900 / 1366x768 */
@media (min-width: 1025px) and (max-height: 930px) {
  .topbar {
    min-height: 54px !important;
  }

  .brand-logo {
    max-height: 46px !important;
    max-width: 150px !important;
  }

  h1 {
    font-size: 28px !important;
  }

  .eyebrow,
  .section-label {
    font-size: 9px !important;
  }

  .date-pill {
    padding: 8px 12px !important;
    min-width: 128px !important;
  }

  .sound-button {
    padding: 9px 12px !important;
    font-size: 12px !important;
  }

  .ticker-item {
    min-width: 420px !important;
    padding: 8px 13px !important;
  }

  .ticker-item .ticker-avatar {
    width: 34px !important;
    height: 34px !important;
  }

  .ticker-info strong,
  .ticker-info b {
    font-size: 12px !important;
  }

  .ticker-info span,
  .ticker-info small {
    font-size: 10px !important;
  }

  .dashboard-grid {
    grid-template-rows: minmax(230px, 32%) minmax(220px, 35%) minmax(130px, 1fr) !important;
  }

  .hero-card {
    padding: 18px 22px !important;
  }

  .hero-value {
    font-size: clamp(48px, 5vw, 82px) !important;
  }

  .goal-row div {
    padding: 8px 11px !important;
  }

  .goal-row strong {
    font-size: 17px !important;
  }

  .ranking-card {
    padding: 13px 16px !important;
  }

  .rank-item {
    min-height: 55px !important;
    padding: 6px 8px !important;
  }

  .rank-pos {
    width: 32px !important;
    height: 32px !important;
  }

  .rank-item .avatar,
  .rank-item .avatar-fallback {
    width: 32px !important;
    height: 32px !important;
  }

  .rank-name strong {
    font-size: 13px !important;
  }

  .rank-total strong {
    font-size: 12px !important;
  }

  .sector-card {
    min-height: 112px !important;
    padding: 10px 12px !important;
  }

  .sector-title strong,
  .sector-title span {
    font-size: 14px !important;
  }

  .sector-money {
    font-size: 20px !important;
  }

  .sector-meta {
    font-size: 10px !important;
  }

  .prize-card {
    padding: 12px 16px !important;
  }
}


/* =========================================================
   AJUSTE TV V5
   - topo só com a logo
   - ticker com nome maior e setor embaixo
   - prêmio 100% encaixado
   - remove status Online
   ========================================================= */

@media (min-width: 1025px) {
  /* Topo: deixa só a logo/marca, remove textos do título */
  .brand-area > div:last-child {
    display: none !important;
  }

  .brand-area {
    gap: 0 !important;
  }

  .brand-logo {
    max-height: 64px !important;
    max-width: 230px !important;
  }

  /* Remove o label Online do canto inferior */
  .connection-status {
    display: none !important;
  }

  /* Ticker mais visual */
  .ticker-track {
    animation-duration: 90s !important;
  }

  .ticker-item {
    min-width: 460px !important;
    max-width: 560px !important;
    display: grid !important;
    grid-template-columns: 44px minmax(0, 1fr) auto !important;
    align-items: center !important;
    gap: 14px !important;
    padding: 10px 16px !important;
  }

  .ticker-item .ticker-avatar {
    width: 44px !important;
    height: 44px !important;
  }

  .ticker-copy {
    min-width: 0 !important;
    display: grid !important;
    gap: 2px !important;
  }

  .ticker-copy strong {
    display: block !important;
    font-size: 17px !important;
    line-height: 1.05 !important;
    font-weight: 950 !important;
    color: #fff !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  .ticker-copy span {
    display: block !important;
    font-size: 12px !important;
    line-height: 1.15 !important;
    font-weight: 700 !important;
    color: rgba(255,255,255,.62) !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  .ticker-money {
    display: grid !important;
    gap: 2px !important;
    text-align: right !important;
    white-space: nowrap !important;
  }

  .ticker-money b {
    display: block !important;
    color: #fff !important;
    font-size: 15px !important;
    line-height: 1.05 !important;
    font-weight: 950 !important;
  }

  .ticker-money small {
    display: block !important;
    color: rgba(255,255,255,.58) !important;
    font-size: 11px !important;
    line-height: 1.05 !important;
    font-weight: 750 !important;
  }

  /* Desativa estilos antigos do ticker */
  .ticker-info {
    display: none !important;
  }

  /* Prêmio: encaixe real dentro do card sem cortar */
  .prize-card {
    overflow: hidden !important;
  }

  .prize-box {
    flex: 1 1 auto !important;
    min-height: 0 !important;
    height: 100% !important;
    width: 100% !important;
    overflow: hidden !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  .prize-box img {
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    min-height: 0 !important;
    object-fit: contain !important;
    object-position: center center !important;
    padding: 6px !important;
    background: rgba(0,0,0,.18) !important;
    border-radius: 18px !important;
  }

  .prize-box strong {
    display: none !important;
  }

  /* Dá um pouco mais de respiro para o prêmio na última linha */
  .dashboard-grid {
    grid-template-rows: minmax(240px, 32%) minmax(215px, 32%) minmax(170px, 1fr) !important;
  }
}

/* Ajuste específico para telas com menos altura */
@media (min-width: 1025px) and (max-height: 930px) {
  .brand-logo {
    max-height: 54px !important;
    max-width: 200px !important;
  }

  .sales-ticker {
    padding: 6px 0 !important;
  }

  .ticker-item {
    min-width: 425px !important;
    max-width: 510px !important;
    grid-template-columns: 38px minmax(0, 1fr) auto !important;
    gap: 11px !important;
    padding: 8px 14px !important;
  }

  .ticker-item .ticker-avatar {
    width: 38px !important;
    height: 38px !important;
  }

  .ticker-copy strong {
    font-size: 15px !important;
  }

  .ticker-copy span {
    font-size: 11px !important;
  }

  .ticker-money b {
    font-size: 13px !important;
  }

  .ticker-money small {
    font-size: 10px !important;
  }

  .dashboard-grid {
    grid-template-rows: minmax(225px, 31%) minmax(205px, 33%) minmax(165px, 1fr) !important;
  }

  .prize-card {
    padding: 10px 14px !important;
  }

  .prize-card .card-heading {
    margin-bottom: 6px !important;
  }

  .prize-box img {
    padding: 4px !important;
    border-radius: 16px !important;
  }
}


/* =========================================================
   AJUSTE TV V6
   Correção do popup de venda:
   - remove bolinha duplicada com inicial quando existe foto
   - corrige texto quebrado
   - centraliza e organiza vendedor/setor/valor
   ========================================================= */

.celebration-profile img[hidden],
.celebration-initials[hidden] {
  display: none !important;
}

.celebration-overlay.show {
  display: grid !important;
}

.celebration-box {
  width: min(840px, 88vw) !important;
  min-height: auto !important;
  padding: clamp(34px, 4vw, 58px) clamp(36px, 4.5vw, 70px) !important;
  border-radius: 36px !important;
  text-align: center !important;
}

.celebration-kicker {
  font-size: clamp(13px, 1.1vw, 18px) !important;
  letter-spacing: .24em !important;
  margin-bottom: 12px !important;
}

.celebration-title {
  font-size: clamp(52px, 6vw, 96px) !important;
  line-height: .9 !important;
  margin: 0 auto 28px !important;
  max-width: 760px !important;
  text-align: center !important;
}

.celebration-profile {
  margin: 0 auto !important;
  width: min(620px, 100%) !important;
  max-width: 100% !important;
  display: grid !important;
  grid-template-columns: 92px minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 20px !important;
  text-align: left !important;
  padding: 18px 26px 18px 18px !important;
  border-radius: 999px !important;
  background: rgba(255,255,255,.10) !important;
  border: 1px solid rgba(255,255,255,.16) !important;
}

.celebration-profile img,
.celebration-initials {
  width: 92px !important;
  height: 92px !important;
  border-radius: 999px !important;
  flex: 0 0 auto !important;
}

.celebration-profile img {
  object-fit: cover !important;
  display: block !important;
}

.celebration-initials {
  display: grid !important;
  place-items: center !important;
  background: #fff !important;
  color: #030817 !important;
  font-size: 34px !important;
  font-weight: 1000 !important;
}

.celebration-profile > div:last-child {
  min-width: 0 !important;
  display: grid !important;
  gap: 4px !important;
}

.celebration-profile strong {
  display: block !important;
  font-size: clamp(24px, 2vw, 34px) !important;
  line-height: 1.05 !important;
  font-weight: 1000 !important;
  color: #fff !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

.celebration-profile span {
  display: block !important;
  font-size: clamp(16px, 1.35vw, 22px) !important;
  line-height: 1.15 !important;
  color: rgba(255,255,255,.72) !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

.celebration-profile b {
  display: block !important;
  color: var(--green) !important;
  font-size: clamp(26px, 2.4vw, 40px) !important;
  line-height: 1.05 !important;
  font-weight: 1000 !important;
  margin-top: 4px !important;
  white-space: nowrap !important;
}

/* Em telas menores, mantém o popup confortável */
@media (max-width: 1024px) {
  .celebration-box {
    width: min(92vw, 720px) !important;
    padding: 28px 24px !important;
  }

  .celebration-title {
    font-size: clamp(40px, 12vw, 72px) !important;
  }

  .celebration-profile {
    grid-template-columns: 74px minmax(0, 1fr) !important;
    gap: 14px !important;
    padding: 14px 18px 14px 14px !important;
  }

  .celebration-profile img,
  .celebration-initials {
    width: 74px !important;
    height: 74px !important;
  }
}


/* =========================================================
   AJUSTE TV V7
   Força layout de TV quando detectar navegador de TV ou ?tv=1.
   Resolve TV que reporta viewport pequeno e cai no layout mobile.
   ========================================================= */

html.is-tv,
html.is-tv body {
  width: 100%;
  height: 100%;
  overflow: hidden !important;
}

html.is-tv body {
  min-width: 1600px;
  background-size: cover;
}

html.is-tv .app-shell {
  height: 100vh !important;
  min-height: 100vh !important;
  width: 100vw !important;
  padding: 24px 28px 22px !important;
  gap: 14px !important;
  overflow: hidden !important;
  display: flex !important;
  flex-direction: column !important;
}

html.is-tv .topbar {
  min-height: 62px !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: space-between !important;
}

html.is-tv .brand-area > div:last-child {
  display: none !important;
}

html.is-tv .brand-logo {
  max-height: 62px !important;
  max-width: 230px !important;
}

html.is-tv .top-actions {
  flex-direction: row !important;
  align-items: center !important;
  gap: 12px !important;
}

html.is-tv .date-pill {
  min-width: 145px !important;
  padding: 9px 13px !important;
  text-align: right !important;
}

html.is-tv .sound-button {
  width: auto !important;
  padding: 10px 14px !important;
  border-radius: 999px !important;
}

html.is-tv .sales-ticker {
  flex: 0 0 auto !important;
  height: 72px !important;
  padding: 7px 0 !important;
  overflow: hidden !important;
}

html.is-tv .ticker-track {
  animation-duration: 160s !important;
}

html.is-tv .ticker-item {
  min-width: 460px !important;
  max-width: 560px !important;
  display: grid !important;
  grid-template-columns: 42px minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 9px 15px !important;
  border-radius: 999px !important;
}

html.is-tv .ticker-item .ticker-avatar {
  width: 42px !important;
  height: 42px !important;
}

html.is-tv .ticker-copy {
  min-width: 0 !important;
  display: grid !important;
  gap: 2px !important;
}

html.is-tv .ticker-copy strong {
  font-size: 16px !important;
  line-height: 1.05 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

html.is-tv .ticker-copy span {
  font-size: 11px !important;
  line-height: 1.1 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

html.is-tv .ticker-money {
  display: grid !important;
  text-align: right !important;
  gap: 2px !important;
  white-space: nowrap !important;
}

html.is-tv .ticker-money b {
  font-size: 14px !important;
  line-height: 1.05 !important;
}

html.is-tv .ticker-money small {
  font-size: 10px !important;
  line-height: 1.05 !important;
}

html.is-tv .dashboard-grid {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1.68fr) minmax(420px, .94fr) !important;
  grid-template-rows: minmax(230px, 31%) minmax(205px, 33%) minmax(165px, 1fr) !important;
  grid-template-areas:
    "hero ranking"
    "sectors ranking"
    "sectors prize" !important;
  gap: 14px !important;
}

html.is-tv .hero-card {
  grid-area: hero !important;
  min-height: 0 !important;
  height: 100% !important;
  padding: 22px 28px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
}

html.is-tv .hero-value {
  font-size: clamp(58px, 5.2vw, 96px) !important;
  margin-top: 4px !important;
  white-space: nowrap !important;
}

html.is-tv .goal-row {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  margin-top: 16px !important;
  gap: 12px !important;
}

html.is-tv .goal-row div {
  padding: 10px 13px !important;
  border-radius: 16px !important;
}

html.is-tv .main-progress {
  height: 10px !important;
  margin-top: 14px !important;
}

html.is-tv .ranking-card {
  grid-area: ranking !important;
  height: 100% !important;
  min-height: 0 !important;
  padding: 16px 18px !important;
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
}

html.is-tv .ranking-card .card-heading {
  flex: 0 0 auto !important;
  margin-bottom: 10px !important;
}

html.is-tv .ranking-list {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  gap: 8px !important;
  padding-right: 4px !important;
}

html.is-tv .rank-item {
  min-height: 55px !important;
  padding: 7px 9px !important;
  grid-template-columns: 34px minmax(0, 1fr) auto !important;
  gap: 9px !important;
  border-radius: 15px !important;
}

html.is-tv .rank-pos {
  width: 32px !important;
  height: 32px !important;
  border-radius: 12px !important;
  font-size: 14px !important;
}

html.is-tv .rank-item .avatar,
html.is-tv .rank-item .avatar-fallback {
  width: 32px !important;
  height: 32px !important;
}

html.is-tv .rank-name strong {
  font-size: 13px !important;
}

html.is-tv .rank-name span,
html.is-tv .rank-total span {
  font-size: 10px !important;
}

html.is-tv .rank-total strong {
  font-size: 12px !important;
}

html.is-tv .sectors-card {
  grid-area: sectors !important;
  height: 100% !important;
  min-height: 0 !important;
  padding: 16px 20px !important;
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
}

html.is-tv .sectors-card .card-heading {
  flex: 0 0 auto !important;
  margin-bottom: 10px !important;
}

html.is-tv .sectors-grid {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 9px !important;
  padding-right: 4px !important;
}

html.is-tv .sector-card {
  min-height: 112px !important;
  padding: 10px 12px !important;
  border-radius: 16px !important;
}

html.is-tv .sector-title {
  margin-bottom: 7px !important;
}

html.is-tv .sector-title strong,
html.is-tv .sector-title span {
  font-size: 14px !important;
}

html.is-tv .sector-money {
  font-size: 20px !important;
  line-height: 1 !important;
}

html.is-tv .sector-bar {
  height: 7px !important;
  margin-top: 8px !important;
}

html.is-tv .sector-meta {
  margin-top: 7px !important;
  gap: 3px !important;
  font-size: 10px !important;
}

html.is-tv .prize-card {
  grid-area: prize !important;
  height: 100% !important;
  min-height: 0 !important;
  padding: 12px 16px !important;
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
}

html.is-tv .prize-card .card-heading {
  flex: 0 0 auto !important;
  margin-bottom: 6px !important;
}

html.is-tv .prize-box {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  height: 100% !important;
  width: 100% !important;
  overflow: hidden !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

html.is-tv .prize-box img {
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  max-height: 100% !important;
  object-fit: contain !important;
  object-position: center center !important;
  padding: 4px !important;
  border-radius: 16px !important;
}

html.is-tv .prize-box strong,
html.is-tv .latest-card,
html.is-tv .latest-sales,
html.is-tv .side-column,
html.is-tv .connection-status {
  display: none !important;
}


/* =========================================================
   AJUSTE TV V8 - MODO TV REAL
   Baseado na lógica antiga: .is-tv + initial-scale=0.6
   Resolve TV que informa viewport pequeno e empilha os blocos.
   ========================================================= */

html.is-tv,
html.is-tv body {
  width: 100% !important;
  height: 100% !important;
  min-height: 100% !important;
  overflow: hidden !important;
}

html.is-tv body {
  font-size: 15px !important;
}

html.is-tv .app-shell {
  width: 100vw !important;
  height: 100vh !important;
  min-height: 100vh !important;
  padding: 28px 34px 26px !important;
  gap: 16px !important;
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
}

html.is-tv .topbar {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 18px !important;
  min-height: 72px !important;
  flex: 0 0 auto !important;
}

html.is-tv .brand-area {
  display: flex !important;
  align-items: center !important;
}

html.is-tv .brand-area > div:last-child {
  display: none !important;
}

html.is-tv .brand-logo {
  max-width: 230px !important;
  max-height: 70px !important;
  object-fit: contain !important;
}

html.is-tv .top-actions {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 14px !important;
  flex: 0 0 auto !important;
}

html.is-tv .date-pill,
html.is-tv .sound-button {
  width: auto !important;
  max-width: none !important;
}

html.is-tv .date-pill {
  min-width: 155px !important;
  padding: 11px 15px !important;
  text-align: right !important;
  border-radius: 18px !important;
}

html.is-tv .sound-button {
  padding: 12px 16px !important;
  border-radius: 999px !important;
  white-space: nowrap !important;
}

html.is-tv .sales-ticker {
  flex: 0 0 76px !important;
  height: 76px !important;
  min-height: 76px !important;
  max-height: 76px !important;
  padding: 8px 0 !important;
  overflow: hidden !important;
}

html.is-tv .ticker-track {
  animation-duration: 180s !important;
}

html.is-tv .ticker-item {
  min-width: 520px !important;
  max-width: 620px !important;
  display: grid !important;
  grid-template-columns: 46px minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 14px !important;
  padding: 10px 16px !important;
  border-radius: 999px !important;
}

html.is-tv .ticker-item .ticker-avatar {
  width: 46px !important;
  height: 46px !important;
}

html.is-tv .ticker-copy {
  display: grid !important;
  min-width: 0 !important;
  gap: 3px !important;
}

html.is-tv .ticker-copy strong {
  font-size: 17px !important;
  line-height: 1.05 !important;
  font-weight: 950 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

html.is-tv .ticker-copy span {
  font-size: 12px !important;
  line-height: 1.05 !important;
  color: rgba(255,255,255,.64) !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

html.is-tv .ticker-money {
  display: grid !important;
  gap: 3px !important;
  text-align: right !important;
  white-space: nowrap !important;
}

html.is-tv .ticker-money b {
  font-size: 15px !important;
  line-height: 1.05 !important;
}

html.is-tv .ticker-money small {
  font-size: 11px !important;
  line-height: 1.05 !important;
  color: rgba(255,255,255,.58) !important;
}

html.is-tv .ticker-info {
  display: none !important;
}

html.is-tv .dashboard-grid {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  height: auto !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1.65fr) minmax(410px, .92fr) !important;
  grid-template-rows: minmax(250px, 32%) minmax(220px, 33%) minmax(160px, 1fr) !important;
  grid-template-areas:
    "hero ranking"
    "sectors ranking"
    "sectors prize" !important;
  gap: 16px !important;
}

html.is-tv .hero-card {
  grid-area: hero !important;
  min-height: 0 !important;
  height: 100% !important;
  padding: 24px 30px !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: center !important;
  overflow: hidden !important;
}

html.is-tv .hero-value {
  font-size: clamp(58px, 5.1vw, 98px) !important;
  line-height: .86 !important;
  margin-top: 4px !important;
  white-space: nowrap !important;
}

html.is-tv .goal-row {
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  margin-top: 16px !important;
  gap: 12px !important;
}

html.is-tv .goal-row div {
  padding: 11px 14px !important;
  border-radius: 17px !important;
}

html.is-tv .main-progress {
  height: 10px !important;
  margin-top: 15px !important;
}

html.is-tv .ranking-card {
  grid-area: ranking !important;
  height: 100% !important;
  min-height: 0 !important;
  padding: 17px 18px !important;
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
}

html.is-tv .ranking-card .card-heading {
  flex: 0 0 auto !important;
  margin-bottom: 11px !important;
}

html.is-tv .ranking-list {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  gap: 8px !important;
  padding-right: 4px !important;
}

html.is-tv .rank-item {
  min-height: 58px !important;
  padding: 7px 9px !important;
  grid-template-columns: 36px minmax(0, 1fr) auto !important;
  gap: 9px !important;
  border-radius: 16px !important;
}

html.is-tv .rank-pos {
  width: 34px !important;
  height: 34px !important;
  border-radius: 12px !important;
  font-size: 14px !important;
}

html.is-tv .rank-item .avatar,
html.is-tv .rank-item .avatar-fallback {
  width: 34px !important;
  height: 34px !important;
}

html.is-tv .rank-name strong {
  font-size: 13px !important;
}

html.is-tv .rank-name span,
html.is-tv .rank-total span {
  font-size: 10px !important;
}

html.is-tv .rank-total strong {
  font-size: 12px !important;
}

html.is-tv .sectors-card {
  grid-area: sectors !important;
  height: 100% !important;
  min-height: 0 !important;
  padding: 17px 20px !important;
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
}

html.is-tv .sectors-card .card-heading {
  flex: 0 0 auto !important;
  margin-bottom: 10px !important;
}

html.is-tv .sectors-grid {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 10px !important;
  padding-right: 4px !important;
}

html.is-tv .sector-card {
  min-height: 116px !important;
  padding: 11px 13px !important;
  border-radius: 16px !important;
}

html.is-tv .sector-title {
  margin-bottom: 7px !important;
}

html.is-tv .sector-title strong,
html.is-tv .sector-title span {
  font-size: 14px !important;
}

html.is-tv .sector-money {
  font-size: 21px !important;
  line-height: 1 !important;
}

html.is-tv .sector-bar {
  height: 7px !important;
  margin-top: 8px !important;
}

html.is-tv .sector-meta {
  margin-top: 7px !important;
  gap: 3px !important;
  font-size: 10px !important;
}

html.is-tv .prize-card {
  grid-area: prize !important;
  height: 100% !important;
  min-height: 0 !important;
  padding: 12px 16px !important;
  display: flex !important;
  flex-direction: column !important;
  overflow: hidden !important;
}

html.is-tv .prize-card .card-heading {
  flex: 0 0 auto !important;
  margin-bottom: 6px !important;
}

html.is-tv .prize-box {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  height: 100% !important;
  width: 100% !important;
  overflow: hidden !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

html.is-tv .prize-box img {
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  max-height: 100% !important;
  object-fit: contain !important;
  object-position: center center !important;
  padding: 4px !important;
  border-radius: 16px !important;
}

html.is-tv .prize-box strong,
html.is-tv .latest-card,
html.is-tv .latest-sales,
html.is-tv .side-column,
html.is-tv .connection-status {
  display: none !important;
}


/* =========================================================
   AJUSTE TV V9
   - Mais respiro nas bordas da TV
   - Prêmio maior
   - Ticker mais compacto, com valor mais perto do nome
   ========================================================= */

html.is-tv .app-shell {
  padding: 40px 48px 38px !important;
  gap: 16px !important;
}

/* ticker: cards menores e valor mais próximo */
html.is-tv .sales-ticker {
  flex-basis: 72px !important;
  height: 72px !important;
  min-height: 72px !important;
  max-height: 72px !important;
}

html.is-tv .ticker-track {
  gap: 14px !important;
  animation-duration: 185s !important;
}

html.is-tv .ticker-item {
  min-width: 390px !important;
  max-width: 430px !important;
  grid-template-columns: 42px minmax(0, 1fr) max-content !important;
  gap: 10px !important;
  padding: 9px 13px !important;
}

html.is-tv .ticker-item .ticker-avatar {
  width: 42px !important;
  height: 42px !important;
}

html.is-tv .ticker-copy strong {
  font-size: 15px !important;
}

html.is-tv .ticker-copy span {
  font-size: 10.5px !important;
}

html.is-tv .ticker-money {
  min-width: auto !important;
}

html.is-tv .ticker-money b {
  font-size: 13px !important;
}

html.is-tv .ticker-money small {
  font-size: 9.5px !important;
}

/* redistribui altura: tira um pouco do topo e entrega mais para o prêmio */
html.is-tv .dashboard-grid {
  grid-template-rows: minmax(220px, 29%) minmax(190px, 29%) minmax(230px, 1fr) !important;
  gap: 16px !important;
}

/* resumo fica um pouco mais compacto para liberar altura ao prêmio */
html.is-tv .hero-card {
  padding: 20px 28px !important;
}

html.is-tv .hero-value {
  font-size: clamp(54px, 4.8vw, 90px) !important;
}

html.is-tv .goal-row {
  margin-top: 13px !important;
}

html.is-tv .main-progress {
  margin-top: 12px !important;
}

/* setores ligeiramente mais compactos para caber com respiro */
html.is-tv .sectors-card {
  padding: 15px 19px !important;
}

html.is-tv .sector-card {
  min-height: 105px !important;
  padding: 10px 12px !important;
}

html.is-tv .sector-title {
  margin-bottom: 6px !important;
}

html.is-tv .sector-money {
  font-size: 20px !important;
}

html.is-tv .sector-meta {
  margin-top: 6px !important;
}

/* prêmio maior e melhor encaixado */
html.is-tv .prize-card {
  padding: 12px 16px 14px !important;
}

html.is-tv .prize-card .card-heading {
  margin-bottom: 8px !important;
}

html.is-tv .prize-box {
  align-items: stretch !important;
  justify-content: stretch !important;
}

html.is-tv .prize-box img {
  width: 100% !important;
  height: 100% !important;
  object-fit: contain !important;
  object-position: center center !important;
  padding: 2px !important;
  border-radius: 16px !important;
}

/* Se a TV for bem baixa, mantém tudo dentro da tela */
@media (max-height: 760px) {
  html.is-tv .app-shell {
    padding: 34px 42px 32px !important;
    gap: 13px !important;
  }

  html.is-tv .dashboard-grid {
    grid-template-rows: minmax(205px, 28%) minmax(180px, 28%) minmax(220px, 1fr) !important;
    gap: 13px !important;
  }

  html.is-tv .sales-ticker {
    flex-basis: 66px !important;
    height: 66px !important;
    min-height: 66px !important;
    max-height: 66px !important;
  }

  html.is-tv .ticker-item {
    min-width: 370px !important;
    max-width: 410px !important;
    padding: 8px 12px !important;
  }

  html.is-tv .prize-card {
    padding: 10px 14px 12px !important;
  }
}


/* =========================================================
   AJUSTE TV V10
   - Corrige respiro inferior real
   - Evita ticker "sobrepor" o caminho
   - Mantém prêmio maior
   ========================================================= */

html.is-tv .app-shell {
  padding: 34px 44px 48px !important;
  gap: 13px !important;
}

/* Ticker com trilho mais controlado */
html.is-tv .sales-ticker {
  flex: 0 0 64px !important;
  height: 64px !important;
  min-height: 64px !important;
  max-height: 64px !important;
  padding: 0 !important;
  display: flex !important;
  align-items: center !important;
  overflow: hidden !important;
}

html.is-tv .ticker-marquee {
  height: 100% !important;
  display: flex !important;
  align-items: center !important;
  overflow: hidden !important;
}

html.is-tv .ticker-track {
  height: 100% !important;
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 0 18px !important;
  animation-duration: 190s !important;
}

html.is-tv .ticker-item {
  flex: 0 0 auto !important;
  height: 50px !important;
  min-height: 50px !important;
  max-height: 50px !important;
  min-width: 385px !important;
  max-width: 410px !important;
  grid-template-columns: 38px minmax(0, 1fr) max-content !important;
  gap: 9px !important;
  padding: 7px 12px !important;
  overflow: hidden !important;
}

html.is-tv .ticker-item .ticker-avatar {
  width: 38px !important;
  height: 38px !important;
}

html.is-tv .ticker-copy strong {
  font-size: 14px !important;
}

html.is-tv .ticker-copy span {
  font-size: 10px !important;
}

html.is-tv .ticker-money b {
  font-size: 12.5px !important;
}

html.is-tv .ticker-money small {
  font-size: 9px !important;
}

/* Alturas recalculadas para sobrar margem real embaixo */
html.is-tv .dashboard-grid {
  grid-template-rows: minmax(205px, 28%) minmax(178px, 27%) minmax(205px, 1fr) !important;
  gap: 13px !important;
}

/* Compacta um pouco o resumo e setores para liberar rodapé */
html.is-tv .hero-card {
  padding: 18px 26px !important;
}

html.is-tv .hero-value {
  font-size: clamp(50px, 4.55vw, 86px) !important;
}

html.is-tv .goal-row {
  margin-top: 11px !important;
  gap: 10px !important;
}

html.is-tv .goal-row div {
  padding: 9px 12px !important;
}

html.is-tv .main-progress {
  margin-top: 10px !important;
  height: 8px !important;
}

html.is-tv .sectors-card {
  padding: 14px 18px !important;
}

html.is-tv .sector-card {
  min-height: 98px !important;
  padding: 9px 11px !important;
}

html.is-tv .sector-money {
  font-size: 19px !important;
}

html.is-tv .sector-meta {
  font-size: 9.5px !important;
}

/* Mantém prêmio grande, mas sem empurrar o layout para fora */
html.is-tv .prize-card {
  padding: 10px 14px 12px !important;
}

html.is-tv .prize-card .card-heading {
  margin-bottom: 5px !important;
}

html.is-tv .prize-box img {
  padding: 2px !important;
}

/* TV com altura menor: reserva mais rodapé ainda */
@media (max-height: 760px) {
  html.is-tv .app-shell {
    padding: 30px 40px 46px !important;
    gap: 11px !important;
  }

  html.is-tv .sales-ticker {
    flex-basis: 58px !important;
    height: 58px !important;
    min-height: 58px !important;
    max-height: 58px !important;
  }

  html.is-tv .ticker-item {
    height: 46px !important;
    min-height: 46px !important;
    max-height: 46px !important;
    min-width: 360px !important;
    max-width: 390px !important;
    padding: 6px 11px !important;
  }

  html.is-tv .ticker-item .ticker-avatar {
    width: 34px !important;
    height: 34px !important;
  }

  html.is-tv .dashboard-grid {
    grid-template-rows: minmax(190px, 27%) minmax(165px, 27%) minmax(200px, 1fr) !important;
    gap: 11px !important;
  }
}


/* =========================================================
   AJUSTE TV V11
   Ranking:
   - remove texto de vendas abaixo do nome
   - aumenta nome do vendedor
   - aumenta valor vendido no mês
   ========================================================= */

.rank-name span {
  display: none !important;
}

.rank-name strong {
  font-size: 18px !important;
  line-height: 1.1 !important;
  font-weight: 950 !important;
}

.rank-total strong {
  font-size: 18px !important;
  line-height: 1.1 !important;
  font-weight: 950 !important;
}

.rank-total span {
  font-size: 11px !important;
  opacity: .72 !important;
}

/* TV */
html.is-tv .rank-name span {
  display: none !important;
}

html.is-tv .rank-name strong {
  font-size: 15px !important;
  line-height: 1.1 !important;
  font-weight: 950 !important;
}

html.is-tv .rank-total strong {
  font-size: 14.5px !important;
  line-height: 1.1 !important;
  font-weight: 950 !important;
}

html.is-tv .rank-total span {
  font-size: 10px !important;
  opacity: .72 !important;
}

/* Dá mais espaço para o nome respirar depois que removemos a segunda linha */
html.is-tv .rank-profile {
  align-items: center !important;
}

html.is-tv .rank-item {
  min-height: 56px !important;
}

/* Telas menores/TV baixa */
@media (max-height: 760px) {
  html.is-tv .rank-name strong {
    font-size: 14.5px !important;
  }

  html.is-tv .rank-total strong {
    font-size: 14px !important;
  }
}


/* =========================================================
   AJUSTE TV V12
   Pódio com mais destaque visual + coroa do líder
   ========================================================= */

/* Base do pódio mais forte */
.rank-item.rank-1,
.rank-item.rank-2,
.rank-item.rank-3 {
  position: relative !important;
  overflow: visible !important;
}

.rank-item.rank-1 {
  background:
    linear-gradient(135deg, rgba(255, 210, 70, .92), rgba(230, 174, 22, .92)) !important;
  border-color: rgba(255, 226, 120, .9) !important;
  box-shadow:
    0 10px 30px rgba(245, 158, 11, .22),
    0 0 0 1px rgba(255, 228, 138, .28) inset !important;
}

.rank-item.rank-1 .rank-name strong,
.rank-item.rank-1 .rank-total strong,
.rank-item.rank-1 .rank-total span,
.rank-item.rank-1 .rank-pos {
  color: #fff !important;
}

.rank-item.rank-1 .rank-name strong {
  text-shadow: 0 1px 8px rgba(0,0,0,.15) !important;
}

.rank-item.rank-1 .rank-pos {
  background: rgba(169, 116, 8, .28) !important;
  border: 1px solid rgba(255,255,255,.16) !important;
}

.rank-item.rank-2 {
  background:
    linear-gradient(135deg, rgba(209, 213, 219, .92), rgba(156, 163, 175, .92)) !important;
  border-color: rgba(229, 231, 235, .85) !important;
  box-shadow:
    0 8px 24px rgba(148, 163, 184, .18),
    0 0 0 1px rgba(255,255,255,.12) inset !important;
}

.rank-item.rank-2 .rank-name strong,
.rank-item.rank-2 .rank-total strong,
.rank-item.rank-2 .rank-total span,
.rank-item.rank-2 .rank-pos {
  color: #fff !important;
}

.rank-item.rank-2 .rank-pos {
  background: rgba(107, 114, 128, .26) !important;
  border: 1px solid rgba(255,255,255,.14) !important;
}

.rank-item.rank-3 {
  background:
    linear-gradient(135deg, rgba(201, 124, 45, .96), rgba(176, 96, 22, .94)) !important;
  border-color: rgba(234, 179, 120, .8) !important;
  box-shadow:
    0 8px 24px rgba(180, 83, 9, .18),
    0 0 0 1px rgba(255,255,255,.10) inset !important;
}

.rank-item.rank-3 .rank-name strong,
.rank-item.rank-3 .rank-total strong,
.rank-item.rank-3 .rank-total span,
.rank-item.rank-3 .rank-pos {
  color: #fff !important;
}

.rank-item.rank-3 .rank-pos {
  background: rgba(120, 53, 15, .26) !important;
  border: 1px solid rgba(255,255,255,.14) !important;
}

/* Coroa do líder */
.rank-item.rank-1 .rank-profile {
  position: relative !important;
}

.rank-item.rank-1 .rank-profile::before {
  content: "👑";
  position: absolute;
  left: 18px;
  top: -17px;
  font-size: 24px;
  line-height: 1;
  transform: rotate(-10deg);
  filter: drop-shadow(0 4px 10px rgba(0,0,0,.25));
  z-index: 3;
  pointer-events: none;
}

.rank-item.rank-1 .avatar,
.rank-item.rank-1 .avatar-fallback {
  box-shadow:
    0 0 0 2px rgba(255,255,255,.34),
    0 0 18px rgba(255, 222, 89, .45) !important;
}

.rank-item.rank-2 .avatar,
.rank-item.rank-2 .avatar-fallback {
  box-shadow:
    0 0 0 2px rgba(255,255,255,.20),
    0 0 14px rgba(203, 213, 225, .20) !important;
}

.rank-item.rank-3 .avatar,
.rank-item.rank-3 .avatar-fallback {
  box-shadow:
    0 0 0 2px rgba(255,255,255,.18),
    0 0 14px rgba(251, 146, 60, .22) !important;
}

/* Pequeno brilho lateral no líder */
.rank-item.rank-1::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: linear-gradient(90deg, rgba(255,255,255,.12), rgba(255,255,255,0));
  pointer-events: none;
  opacity: .85;
}

/* TV */
html.is-tv .rank-item.rank-1 .rank-profile::before {
  left: 15px !important;
  top: -15px !important;
  font-size: 20px !important;
}

html.is-tv .rank-item.rank-1 {
  box-shadow:
    0 8px 22px rgba(245, 158, 11, .22),
    0 0 0 1px rgba(255, 228, 138, .26) inset !important;
}

html.is-tv .rank-item.rank-2 {
  box-shadow:
    0 6px 18px rgba(148, 163, 184, .18),
    0 0 0 1px rgba(255,255,255,.10) inset !important;
}

html.is-tv .rank-item.rank-3 {
  box-shadow:
    0 6px 18px rgba(180, 83, 9, .18),
    0 0 0 1px rgba(255,255,255,.10) inset !important;
}


/* =========================================================
   AJUSTE TV V13
   Cores do pódio mais fortes, seguindo o exemplo enviado:
   - 1º ouro vivo
   - 2º prata/cinza forte
   - 3º bronze/laranja queimado
   ========================================================= */

.rank-item.rank-1 {
  background:
    linear-gradient(135deg, #f6a800 0%, #ffc400 48%, #f2b600 100%) !important;
  border-color: rgba(255, 226, 98, .95) !important;
  box-shadow:
    0 10px 32px rgba(255, 190, 0, .28),
    inset 0 1px 0 rgba(255,255,255,.28),
    inset 0 -1px 0 rgba(111, 74, 0, .18) !important;
}

.rank-item.rank-1 .rank-pos {
  background: rgba(255,255,255,.16) !important;
  border: 1px solid rgba(255,255,255,.24) !important;
  color: #fff !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.18) !important;
}

.rank-item.rank-1 .rank-name strong,
.rank-item.rank-1 .rank-total strong,
.rank-item.rank-1 .rank-total span {
  color: #fff !important;
  text-shadow: 0 1px 7px rgba(93, 58, 0, .28) !important;
}

.rank-item.rank-1::after {
  background:
    linear-gradient(90deg, rgba(255,255,255,.20), rgba(255,255,255,0) 48%) !important;
  opacity: .9 !important;
}

.rank-item.rank-2 {
  background:
    linear-gradient(135deg, #9aa1aa 0%, #c3c7ce 48%, #969da7 100%) !important;
  border-color: rgba(232, 236, 242, .75) !important;
  box-shadow:
    0 8px 26px rgba(148, 163, 184, .22),
    inset 0 1px 0 rgba(255,255,255,.20),
    inset 0 -1px 0 rgba(40, 48, 60, .22) !important;
}

.rank-item.rank-2 .rank-pos {
  background: rgba(255,255,255,.14) !important;
  border: 1px solid rgba(255,255,255,.20) !important;
  color: #fff !important;
}

.rank-item.rank-2 .rank-name strong,
.rank-item.rank-2 .rank-total strong,
.rank-item.rank-2 .rank-total span {
  color: #fff !important;
  text-shadow: 0 1px 6px rgba(20, 25, 35, .22) !important;
}

.rank-item.rank-3 {
  background:
    linear-gradient(135deg, #b35a12 0%, #d06a12 48%, #a94d09 100%) !important;
  border-color: rgba(255, 177, 94, .70) !important;
  box-shadow:
    0 8px 26px rgba(194, 85, 12, .25),
    inset 0 1px 0 rgba(255,255,255,.16),
    inset 0 -1px 0 rgba(70, 30, 0, .24) !important;
}

.rank-item.rank-3 .rank-pos {
  background: rgba(255,255,255,.13) !important;
  border: 1px solid rgba(255,255,255,.18) !important;
  color: #fff !important;
}

.rank-item.rank-3 .rank-name strong,
.rank-item.rank-3 .rank-total strong,
.rank-item.rank-3 .rank-total span {
  color: #fff !important;
  text-shadow: 0 1px 6px rgba(56, 25, 0, .28) !important;
}

/* Coroa mais parecida com destaque de campeão */
.rank-item.rank-1 .rank-profile::before {
  content: "👑" !important;
  font-size: 28px !important;
  left: 16px !important;
  top: -22px !important;
  transform: rotate(-12deg) !important;
  filter:
    drop-shadow(0 3px 5px rgba(0,0,0,.32))
    drop-shadow(0 0 8px rgba(255, 215, 0, .42)) !important;
}

.rank-item.rank-1 .avatar,
.rank-item.rank-1 .avatar-fallback {
  box-shadow:
    0 0 0 2px rgba(255,255,255,.42),
    0 0 18px rgba(255, 213, 0, .60) !important;
}

/* TV */
html.is-tv .rank-item.rank-1 {
  background:
    linear-gradient(135deg, #f6a800 0%, #ffc400 48%, #f2b600 100%) !important;
}

html.is-tv .rank-item.rank-2 {
  background:
    linear-gradient(135deg, #9aa1aa 0%, #c3c7ce 48%, #969da7 100%) !important;
}

html.is-tv .rank-item.rank-3 {
  background:
    linear-gradient(135deg, #b35a12 0%, #d06a12 48%, #a94d09 100%) !important;
}

html.is-tv .rank-item.rank-1 .rank-profile::before {
  font-size: 23px !important;
  left: 14px !important;
  top: -17px !important;
}


/* =========================================================
   AJUSTE TV V14
   Pódio com cores um pouco mais escuras para melhorar a leitura
   ========================================================= */

.rank-item.rank-1 {
  background:
    linear-gradient(135deg, #d99200 0%, #e7ab00 48%, #cf9400 100%) !important;
  border-color: rgba(245, 206, 88, .88) !important;
  box-shadow:
    0 8px 24px rgba(201, 138, 0, .24),
    inset 0 1px 0 rgba(255,255,255,.18),
    inset 0 -1px 0 rgba(80, 54, 0, .22) !important;
}

.rank-item.rank-2 {
  background:
    linear-gradient(135deg, #858d98 0%, #a5acb5 48%, #7c858f 100%) !important;
  border-color: rgba(216, 222, 229, .68) !important;
  box-shadow:
    0 7px 22px rgba(107, 114, 128, .20),
    inset 0 1px 0 rgba(255,255,255,.14),
    inset 0 -1px 0 rgba(28, 33, 41, .24) !important;
}

.rank-item.rank-3 {
  background:
    linear-gradient(135deg, #9c4c0c 0%, #b75b10 48%, #904307 100%) !important;
  border-color: rgba(226, 155, 84, .64) !important;
  box-shadow:
    0 7px 22px rgba(146, 64, 14, .22),
    inset 0 1px 0 rgba(255,255,255,.12),
    inset 0 -1px 0 rgba(54, 22, 0, .26) !important;
}

/* brilho lateral mais sutil */
.rank-item.rank-1::after {
  background:
    linear-gradient(90deg, rgba(255,255,255,.10), rgba(255,255,255,0) 48%) !important;
  opacity: .72 !important;
}

/* TV */
html.is-tv .rank-item.rank-1 {
  background:
    linear-gradient(135deg, #d99200 0%, #e7ab00 48%, #cf9400 100%) !important;
}

html.is-tv .rank-item.rank-2 {
  background:
    linear-gradient(135deg, #858d98 0%, #a5acb5 48%, #7c858f 100%) !important;
}

html.is-tv .rank-item.rank-3 {
  background:
    linear-gradient(135deg, #9c4c0c 0%, #b75b10 48%, #904307 100%) !important;
}


/* =========================================================
   AJUSTE TV V15
   - Nomes dos vendedores com font-weight 600
   - Fotos maiores no ranking
   - Remove título "Prêmio do mês" do card de prêmio
   - Ticker mais compacto entre nome e valor
   - Metas dos setores mais legíveis
   ========================================================= */

/* Peso dos nomes dos vendedores em todos os pontos principais */
.rank-name strong,
.ticker-copy strong,
.celebration-profile strong,
.sale-info strong {
  font-weight: 600 !important;
}

/* Ranking: foto maior */
.rank-item .avatar,
.rank-item .avatar-fallback {
  width: 48px !important;
  height: 48px !important;
}

.rank-profile {
  gap: 13px !important;
}

/* Prêmio: remove cabeçalho/título "Prêmio do mês" e libera mais área para a imagem */
.prize-card .card-heading {
  display: none !important;
}

.prize-card {
  padding-top: 14px !important;
}

/* Ticker: aproxima o preço do nome */
.ticker-item {
  min-width: 340px !important;
  max-width: 380px !important;
  grid-template-columns: 42px minmax(130px, 190px) max-content !important;
  gap: 8px !important;
}

.ticker-copy {
  max-width: 190px !important;
}

.ticker-copy strong {
  font-size: 15px !important;
}

.ticker-money {
  margin-left: 0 !important;
}

.ticker-money b {
  font-size: 13px !important;
}

/* Setores: metas mais legíveis */
.sector-meta {
  font-size: 13px !important;
}

.sector-meta strong {
  font-size: 13px !important;
  font-weight: 800 !important;
}

.sector-meta span {
  font-size: 13px !important;
}

/* TV */
html.is-tv .rank-name strong,
html.is-tv .ticker-copy strong,
html.is-tv .celebration-profile strong,
html.is-tv .sale-info strong {
  font-weight: 600 !important;
}

html.is-tv .rank-item .avatar,
html.is-tv .rank-item .avatar-fallback {
  width: 40px !important;
  height: 40px !important;
}

html.is-tv .rank-profile {
  gap: 11px !important;
}

html.is-tv .rank-item {
  grid-template-columns: 36px minmax(0, 1fr) auto !important;
}

html.is-tv .rank-name strong {
  font-size: 15px !important;
}

/* Reposiciona a coroa por causa da foto maior */
html.is-tv .rank-item.rank-1 .rank-profile::before {
  left: 18px !important;
  top: -16px !important;
  font-size: 23px !important;
}

/* Remove o texto em cima do prêmio na TV */
html.is-tv .prize-card .card-heading {
  display: none !important;
}

html.is-tv .prize-card {
  padding: 12px 14px !important;
}

html.is-tv .prize-box {
  height: 100% !important;
}

/* Ticker TV: preço mais perto do nome */
html.is-tv .ticker-item {
  min-width: 335px !important;
  max-width: 365px !important;
  grid-template-columns: 38px minmax(125px, 175px) max-content !important;
  gap: 7px !important;
  padding: 7px 11px !important;
}

html.is-tv .ticker-copy {
  max-width: 175px !important;
}

html.is-tv .ticker-copy strong {
  font-size: 14px !important;
}

html.is-tv .ticker-copy span {
  font-size: 10px !important;
}

html.is-tv .ticker-money b {
  font-size: 12.5px !important;
}

html.is-tv .ticker-money small {
  font-size: 9px !important;
}

/* Setores TV: aumenta metas/falta/lançamentos */
html.is-tv .sector-meta {
  font-size: 11.5px !important;
  gap: 4px !important;
}

html.is-tv .sector-meta strong {
  font-size: 11.5px !important;
  font-weight: 800 !important;
}

html.is-tv .sector-meta span {
  font-size: 11.5px !important;
}

@media (max-height: 760px) {
  html.is-tv .rank-item .avatar,
  html.is-tv .rank-item .avatar-fallback {
    width: 37px !important;
    height: 37px !important;
  }

  html.is-tv .rank-name strong {
    font-size: 14.5px !important;
  }

  html.is-tv .ticker-item {
    min-width: 320px !important;
    max-width: 350px !important;
    grid-template-columns: 34px minmax(120px, 165px) max-content !important;
  }

  html.is-tv .ticker-copy {
    max-width: 165px !important;
  }

  html.is-tv .sector-meta,
  html.is-tv .sector-meta strong,
  html.is-tv .sector-meta span {
    font-size: 11px !important;
  }
}


/* =========================================================
   AJUSTE TV V16
   - live-dot com font-weight 300
   - fotos maiores no ranking
   - metas/falta/lançamentos dos setores maiores
   ========================================================= */

.live-dot {
  font-weight: 300 !important;
}

/* Fotos maiores no ranking */
.rank-item .avatar,
.rank-item .avatar-fallback {
  width: 54px !important;
  height: 54px !important;
}

.rank-profile {
  gap: 14px !important;
}

/* Ajuste da coroa por causa da foto maior */
.rank-item.rank-1 .rank-profile::before {
  left: 22px !important;
  top: -22px !important;
  font-size: 29px !important;
}

/* Setores: textos de Meta, Falta e Lançamentos maiores */
.sector-meta {
  font-size: 14px !important;
  gap: 7px !important;
}

.sector-meta span,
.sector-meta strong {
  font-size: 14px !important;
}

.sector-meta strong {
  font-weight: 800 !important;
}

/* TV */
html.is-tv .live-dot {
  font-weight: 300 !important;
}

html.is-tv .rank-item .avatar,
html.is-tv .rank-item .avatar-fallback {
  width: 44px !important;
  height: 44px !important;
}

html.is-tv .rank-profile {
  gap: 12px !important;
}

html.is-tv .rank-item {
  grid-template-columns: 36px minmax(0, 1fr) auto !important;
  min-height: 60px !important;
}

html.is-tv .rank-item.rank-1 .rank-profile::before {
  left: 20px !important;
  top: -18px !important;
  font-size: 24px !important;
}

/* Setores na TV */
html.is-tv .sector-meta {
  font-size: 12.5px !important;
  gap: 5px !important;
}

html.is-tv .sector-meta span,
html.is-tv .sector-meta strong {
  font-size: 12.5px !important;
}

html.is-tv .sector-meta strong {
  font-weight: 800 !important;
}

/* Telas menores */
@media (max-height: 760px) {
  html.is-tv .rank-item .avatar,
  html.is-tv .rank-item .avatar-fallback {
    width: 40px !important;
    height: 40px !important;
  }

  html.is-tv .rank-item.rank-1 .rank-profile::before {
    left: 18px !important;
    top: -17px !important;
    font-size: 23px !important;
  }

  html.is-tv .sector-meta,
  html.is-tv .sector-meta span,
  html.is-tv .sector-meta strong {
    font-size: 12px !important;
  }
}


/* =========================================================
   AJUSTE TV V17
   Remove background linear-gradient dos cards
   ========================================================= */

.card {
  background: rgba(255, 255, 255, .055) !important;
}

html.is-tv .card {
  background: rgba(255, 255, 255, .055) !important;
}


/* =========================================================
   AJUSTE TV V18
   - Card transparente na TV
   - Fotos maiores no ranking
   - Barra de progresso dos setores mais alta
   ========================================================= */

html.is-tv .card {
  background: transparent !important;
}

/* Fotos dos vendedores um pouco maiores no ranking */
html.is-tv .rank-item .avatar,
html.is-tv .rank-item .avatar-fallback {
  width: 49px !important;
  height: 49px !important;
}

html.is-tv .rank-item {
  min-height: 66px !important;
}

html.is-tv .rank-profile {
  gap: 13px !important;
}

/* Reposiciona a coroa por causa da foto maior */
html.is-tv .rank-item.rank-1 .rank-profile::before {
  left: 22px !important;
  top: -19px !important;
  font-size: 25px !important;
}

/* Barra de progresso dos setores mais grossa */
html.is-tv .sector-bar {
  height: 11px !important;
  border-radius: 999px !important;
  margin-top: 9px !important;
}

html.is-tv .sector-bar > div,
html.is-tv .sector-bar span {
  height: 100% !important;
  border-radius: 999px !important;
}

/* Desktop também acompanha o ajuste */
.rank-item .avatar,
.rank-item .avatar-fallback {
  width: 58px !important;
  height: 58px !important;
}

.sector-bar {
  height: 12px !important;
  border-radius: 999px !important;
}

.sector-bar > div,
.sector-bar span {
  height: 100% !important;
  border-radius: 999px !important;
}

@media (max-height: 760px) {
  html.is-tv .rank-item .avatar,
  html.is-tv .rank-item .avatar-fallback {
    width: 45px !important;
    height: 45px !important;
  }

  html.is-tv .rank-item {
    min-height: 62px !important;
  }

  html.is-tv .sector-bar {
    height: 10px !important;
  }

  html.is-tv .rank-item.rank-1 .rank-profile::before {
    left: 20px !important;
    top: -18px !important;
    font-size: 24px !important;
  }
}


/* =========================================================
   AJUSTE TV V19
   - Coroa SVG no líder
   - Labels coloridas no nome dos setores
   ========================================================= */

/* Remove a coroa emoji anterior */
.rank-item.rank-1 .rank-profile::before {
  content: none !important;
  display: none !important;
}

html.is-tv .rank-item.rank-1 .rank-profile::before {
  content: none !important;
  display: none !important;
}

/* Nova coroa SVG */
.rank-profile {
  position: relative !important;
}

.rank-item.rank-1 .crown {
  position: absolute !important;
  left: 23px !important;
  top: -20px !important;
  width: 30px !important;
  height: 30px !important;
  display: grid !important;
  place-items: center !important;
  color: #facc15 !important;
  filter:
    drop-shadow(0 3px 5px rgba(0,0,0,.35))
    drop-shadow(0 0 9px rgba(250,204,21,.40)) !important;
  transform: rotate(-10deg) !important;
  z-index: 5 !important;
  pointer-events: none !important;
}

.rank-item.rank-1 .crown svg {
  width: 100% !important;
  height: 100% !important;
  display: block !important;
}

html.is-tv .rank-item.rank-1 .crown {
  left: 7px !important;
  top: -12px !important;
  width: 27px !important;
  height: 27px !important;
}

/* Labels dos setores */
.sector-title {
  align-items: center !important;
}

.sector-label {
  display: inline-flex !important;
  align-items: center !important;
  width: fit-content !important;
  max-width: 100% !important;
  padding: 6px 10px !important;
  border-radius: 999px !important;
  font-size: 13px !important;
  line-height: 1 !important;
  font-weight: 600 !important;
  letter-spacing: .01em !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  border: 1px solid rgba(255,255,255,.14) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.10) !important;
}

.sector-label-bling {
  color: #dcfce7 !important;
  background: rgba(34, 197, 94, .22) !important;
  border-color: rgba(34, 197, 94, .42) !important;
}

.sector-label-kommo {
  color: #f3e8ff !important;
  background: rgba(147, 51, 234, .26) !important;
  border-color: rgba(168, 85, 247, .45) !important;
}

.sector-label-nuvem {
  color: #dbeafe !important;
  background: rgba(37, 99, 235, .26) !important;
  border-color: rgba(59, 130, 246, .45) !important;
}

.sector-label-blu {
  color: #ffffff !important;
  background: rgba(255,255,255,.18) !important;
  border-color: rgba(255,255,255,.34) !important;
}

.sector-label-fly {
  color: #ffedd5 !important;
  background: rgba(249, 115, 22, .27) !important;
  border-color: rgba(251, 146, 60, .46) !important;
}

.sector-label-default {
  color: #e5e7eb !important;
  background: rgba(148, 163, 184, .18) !important;
  border-color: rgba(148, 163, 184, .32) !important;
}

html.is-tv .sector-label {
  padding: 5px 9px !important;
  font-size: 12.5px !important;
}

@media (max-height: 760px) {
  html.is-tv .rank-item.rank-1 .crown {
    left: 7px !important;
    top: -12px !important;
    width: 25px !important;
    height: 25px !important;
  }

  html.is-tv .sector-label {
    padding: 5px 8px !important;
    font-size: 12px !important;
  }
}


/* =========================================================
   AJUSTE TV V20
   Valores dos setores maiores e com mais respiro
   ========================================================= */

html.is-tv .sector-money {
  font-size: 24px !important;
  margin-top: 15px !important;
}


/* =========================================================
   AJUSTE TV V21
   Valor dos setores com margin-top menor
   ========================================================= */

html.is-tv .sector-money {
  margin-top: 10px !important;
}


/* =========================================================
   AJUSTE TV V22
   - Ranking maior para exibir pelo menos 6 vendedores
   - Prêmio mais compacto
   ========================================================= */

html.is-tv .dashboard-grid {
  grid-template-rows: minmax(235px, 35%) minmax(230px, 35%) minmax(120px, 1fr) !important;
}

/* Ranking ganha mais altura e comporta melhor 6 vendedores */
html.is-tv .ranking-card {
  padding: 14px 16px !important;
}

html.is-tv .ranking-card .card-heading {
  margin-bottom: 9px !important;
}

html.is-tv .ranking-list {
  gap: 7px !important;
  overflow-y: hidden !important;
}

html.is-tv .rank-item {
  min-height: 62px !important;
  padding: 6px 9px !important;
}

html.is-tv .rank-item .avatar,
html.is-tv .rank-item .avatar-fallback {
  width: 46px !important;
  height: 46px !important;
}

html.is-tv .rank-profile {
  gap: 12px !important;
}

html.is-tv .rank-name strong {
  font-size: 14.5px !important;
}

html.is-tv .rank-total strong {
  font-size: 14px !important;
}

/* Coroa reposicionada no líder */
html.is-tv .rank-item.rank-1 .crown {
  left: 20px !important;
  top: -17px !important;
  width: 25px !important;
  height: 25px !important;
}

/* Prêmio menor, mas ainda visível */
html.is-tv .prize-card {
  padding: 8px 12px !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

html.is-tv .prize-box {
  height: 100% !important;
  min-height: 0 !important;
}

html.is-tv .prize-box img {
  padding: 1px !important;
  max-height: 100% !important;
  object-fit: contain !important;
}

/* Ajuste para TVs mais baixas */
@media (max-height: 760px) {
  html.is-tv .dashboard-grid {
    grid-template-rows: minmax(218px, 35%) minmax(214px, 35%) minmax(105px, 1fr) !important;
  }

  html.is-tv .rank-item {
    min-height: 58px !important;
    padding: 5px 8px !important;
  }

  html.is-tv .rank-item .avatar,
  html.is-tv .rank-item .avatar-fallback {
    width: 42px !important;
    height: 42px !important;
  }

  html.is-tv .rank-name strong {
    font-size: 14px !important;
  }

  html.is-tv .rank-total strong {
    font-size: 13.5px !important;
  }

  html.is-tv .rank-item.rank-1 .crown {
    left: 18px !important;
    top: -16px !important;
    width: 24px !important;
    height: 24px !important;
  }
}


/* =========================================================
   AJUSTE TV V23
   - Ranking volta para 5 vendedores visíveis
   - Prêmio ganha mais espaço
   - Valor do setor com weight 800
   - Corrige infos do setor saindo do card
   ========================================================= */

html.is-tv .dashboard-grid {
  grid-template-rows: minmax(222px, 33%) minmax(252px, 39%) minmax(110px, 1fr) !important;
}

/* Ranking mais compacto = 5 vendedores visíveis */
html.is-tv .ranking-card {
  padding: 13px 15px !important;
}

html.is-tv .ranking-card .card-heading {
  margin-bottom: 8px !important;
}

html.is-tv .ranking-list {
  gap: 6px !important;
  overflow-y: auto !important;
}

html.is-tv .rank-item {
  min-height: 56px !important;
  padding: 5px 8px !important;
}

html.is-tv .rank-item .avatar,
html.is-tv .rank-item .avatar-fallback {
  width: 44px !important;
  height: 44px !important;
}

html.is-tv .rank-name strong {
  font-size: 14px !important;
}

html.is-tv .rank-total strong {
  font-size: 13.5px !important;
}

html.is-tv .rank-item.rank-1 .crown {
  left: 19px !important;
  top: -16px !important;
  width: 24px !important;
  height: 24px !important;
}

/* Prêmio com mais área */
html.is-tv .prize-card {
  padding: 10px 13px !important;
  min-height: 0 !important;
}

html.is-tv .prize-box {
  height: 100% !important;
  min-height: 0 !important;
}

html.is-tv .prize-box img {
  width: 100% !important;
  height: 100% !important;
  max-height: none !important;
  object-fit: contain !important;
}

/* Setores */
html.is-tv .sector-card {
  min-height: 168px !important;
  padding: 14px 16px !important;
  overflow: hidden !important;
}

html.is-tv .sector-title {
  margin-bottom: 10px !important;
}

html.is-tv .sector-money {
  font-size: 24px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  margin-top: 10px !important;
}

html.is-tv .sector-bar {
  height: 10px !important;
  margin-top: 10px !important;
}

html.is-tv .sector-meta {
  margin-top: 10px !important;
  gap: 4px !important;
  font-size: 13px !important;
  line-height: 1.15 !important;
}

html.is-tv .sector-meta div {
  align-items: center !important;
}

/* TVs mais baixas */
@media (max-height: 760px) {
  html.is-tv .dashboard-grid {
    grid-template-rows: minmax(210px, 33%) minmax(238px, 39%) minmax(100px, 1fr) !important;
  }

  html.is-tv .rank-item {
    min-height: 53px !important;
    padding: 5px 7px !important;
  }

  html.is-tv .rank-item .avatar,
  html.is-tv .rank-item .avatar-fallback {
    width: 40px !important;
    height: 40px !important;
  }

  html.is-tv .rank-name strong {
    font-size: 13.5px !important;
  }

  html.is-tv .rank-total strong {
    font-size: 13px !important;
  }

  html.is-tv .sector-card {
    min-height: 156px !important;
    padding: 13px 14px !important;
  }

  html.is-tv .sector-money {
    font-size: 22px !important;
  }

  html.is-tv .sector-meta {
    font-size: 12px !important;
    gap: 3px !important;
  }
}


/* =========================================================
   ANIMAÇÕES TV - Nova venda + ultrapassagem top 5
   ========================================================= */

.celebration-overlay {
  z-index: 90000 !important;
  display: none !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 28px !important;
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: none !important;
  background:
    radial-gradient(circle at 50% 42%, rgba(0,202,255,.26), transparent 30%),
    radial-gradient(circle at 20% 22%, rgba(34,197,94,.18), transparent 26%),
    radial-gradient(circle at 82% 76%, rgba(250,204,21,.16), transparent 28%),
    rgba(2,6,23,.86) !important;
  backdrop-filter: blur(12px) !important;
  -webkit-backdrop-filter: blur(12px) !important;
  overflow: hidden !important;
  transition: none !important;
}

.celebration-overlay.show {
  display: flex !important;
}

.celebration-overlay::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  pointer-events: none !important;
  background-image:
    linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px) !important;
  background-size: 76px 76px !important;
  opacity: .48 !important;
}

.sale-burst {
  position: absolute !important;
  inset: -10% !important;
  pointer-events: none !important;
  opacity: 0;
  background:
    radial-gradient(circle at 50% 50%, rgba(255,255,255,.70) 0 3%, rgba(0,202,255,.35) 4% 12%, transparent 13%),
    conic-gradient(from 0deg, transparent 0 8deg, rgba(250,204,21,.35) 9deg 13deg, transparent 14deg 32deg, rgba(34,197,94,.28) 33deg 38deg, transparent 39deg 360deg) !important;
  filter: blur(.3px) !important;
  transform: scale(.65) rotate(0deg);
  z-index: 1 !important;
}

.celebration-box {
  position: relative !important;
  z-index: 3 !important;
  width: min(860px, 92vw) !important;
  min-height: auto !important;
  border-radius: 38px !important;
  padding: clamp(32px, 4vw, 62px) !important;
  text-align: center !important;
  background:
    radial-gradient(circle at 50% 0%, rgba(0,202,255,.18), transparent 38%),
    linear-gradient(180deg, rgba(15,23,42,.95), rgba(3,7,18,.95)) !important;
  border: 1px solid rgba(255,255,255,.16) !important;
  box-shadow:
    0 34px 120px rgba(0,0,0,.52),
    inset 0 1px 0 rgba(255,255,255,.10) !important;
  overflow: hidden !important;
  transform: translateY(28px) scale(.94) !important;
  opacity: 0;
  transition: none !important;
}

.celebration-box::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  pointer-events: none !important;
  background: linear-gradient(110deg, transparent 0 28%, rgba(255,255,255,.16) 44%, transparent 58% 100%) !important;
  transform: translateX(-120%);
}

.celebration-kicker {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 10px !important;
  padding: 10px 16px !important;
  border-radius: 999px !important;
  color: #bbf7d0 !important;
  background: rgba(34,197,94,.14) !important;
  border: 1px solid rgba(34,197,94,.28) !important;
  font-size: clamp(13px, .9vw, 18px) !important;
  font-weight: 1000 !important;
  letter-spacing: .16em !important;
  text-transform: uppercase !important;
  margin: 0 !important;
}

.celebration-title {
  margin: 18px 0 0 !important;
  font-size: clamp(54px, 7vw, 132px) !important;
  line-height: .82 !important;
  font-weight: 1000 !important;
  letter-spacing: -.08em !important;
  text-transform: uppercase !important;
  color: #fff !important;
  text-shadow: 0 12px 44px rgba(0,0,0,.42) !important;
}

.celebration-title span {
  color: #00caff !important;
  text-shadow: 0 0 36px rgba(0,202,255,.36) !important;
}

.celebration-profile {
  margin: clamp(26px, 3vw, 44px) auto 0 !important;
  display: grid !important;
  grid-template-columns: auto minmax(0,1fr) !important;
  align-items: center !important;
  gap: clamp(16px, 2vw, 28px) !important;
  width: min(650px, 100%) !important;
  text-align: left !important;
  padding: clamp(16px, 1.6vw, 24px) !important;
  border-radius: 30px !important;
  background: rgba(255,255,255,.075) !important;
  border: 1px solid rgba(255,255,255,.12) !important;
}

.celebration-profile img,
.celebration-initials {
  width: clamp(108px, 9vw, 164px) !important;
  height: clamp(108px, 9vw, 164px) !important;
  border-radius: 34px !important;
  padding: 7px !important;
  object-fit: cover !important;
  background: linear-gradient(135deg, rgba(0,202,255,.92), rgba(34,197,94,.72)) !important;
  box-shadow: 0 22px 60px rgba(0,202,255,.20) !important;
  color: #fff !important;
  font-size: clamp(38px, 4vw, 74px) !important;
  font-weight: 1000 !important;
  border: 0 !important;
}

.celebration-profile img {
  display: block !important;
}

.celebration-initials {
  display: grid !important;
  place-items: center !important;
}

.celebration-profile img[hidden],
.celebration-initials[hidden],
.celebration-profile img.is-hidden,
.celebration-initials.is-hidden {
  display: none !important;
}

.celebration-profile > div:last-child {
  min-width: 0 !important;
  display: block !important;
}

.celebration-profile strong {
  display: block !important;
  color: #fff !important;
  font-size: clamp(25px, 2.5vw, 48px) !important;
  line-height: .98 !important;
  font-weight: 1000 !important;
  letter-spacing: -.055em !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

.celebration-profile span {
  display: block !important;
  margin-top: 8px !important;
  color: rgba(255,255,255,.62) !important;
  font-size: clamp(14px, 1.05vw, 20px) !important;
  font-weight: 850 !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

.celebration-profile b {
  display: block !important;
  margin-top: 16px !important;
  color: #facc15 !important;
  font-size: clamp(34px, 4vw, 78px) !important;
  line-height: .9 !important;
  font-weight: 1000 !important;
  letter-spacing: -.065em !important;
  text-shadow: 0 0 34px rgba(250,204,21,.22) !important;
  white-space: nowrap !important;
}

.sale-coins {
  position: absolute !important;
  inset: 0 !important;
  pointer-events: none !important;
  z-index: 2 !important;
  overflow: hidden !important;
}

.sale-coins span {
  position: absolute !important;
  top: -44px !important;
  left: var(--x) !important;
  width: 34px !important;
  height: 34px !important;
  border-radius: 50% !important;
  display: grid !important;
  place-items: center !important;
  color: #422006 !important;
  font-weight: 1000 !important;
  font-size: 18px !important;
  background: radial-gradient(circle at 32% 28%, #fff7ad, #facc15 46%, #b45309 100%) !important;
  box-shadow: 0 10px 22px rgba(0,0,0,.22) !important;
  opacity: 0;
}

.celebration-overlay.animate .celebration-box {
  animation: saleCardIn .72s cubic-bezier(.22,1.35,.36,1) both, saleCardPulse .95s ease-in-out .92s both !important;
}

.celebration-overlay.animate .celebration-box::before {
  animation: saleCardShine 1.45s ease-in-out .46s both !important;
}

.celebration-overlay.animate .sale-burst {
  animation: saleBurst 1.45s cubic-bezier(.18,1,.22,1) .18s both !important;
}

.celebration-overlay.animate .celebration-profile img,
.celebration-overlay.animate .celebration-initials {
  animation: saleAvatarPop .82s cubic-bezier(.22,1.3,.32,1) .34s both !important;
}

.celebration-overlay.animate .celebration-profile b {
  animation: saleAmountPop .82s cubic-bezier(.22,1.3,.32,1) .58s both, saleAmountGlow 1.6s ease-in-out 1.25s infinite !important;
}

.celebration-overlay.animate .sale-coins span {
  animation: coinRain 3.4s ease-in var(--delay) both !important;
}

.battle-overlay {
  position: fixed;
  inset: 0;
  z-index: 100000;
  display: none;
  align-items: center;
  justify-content: center;
  background:
    radial-gradient(circle at 50% 42%, rgba(250,204,21,.18), transparent 30%),
    radial-gradient(circle at 20% 50%, rgba(0,202,255,.20), transparent 28%),
    radial-gradient(circle at 80% 50%, rgba(239,68,68,.20), transparent 28%),
    rgba(2,6,23,.88);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  overflow: hidden;
}

.battle-overlay.show {
  display: flex;
}

.battle-overlay::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background-image:
    linear-gradient(rgba(255,255,255,.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,.035) 1px, transparent 1px);
  background-size: 80px 80px;
  opacity: .55;
}

.battle-stage {
  position: relative;
  width: min(1380px, 96vw);
  height: min(760px, 88vh);
  display: grid;
  grid-template-rows: auto 1fr auto;
  align-items: center;
  padding: clamp(22px, 2vw, 36px);
}

.battle-topline {
  position: relative;
  z-index: 5;
  text-align: center;
}

.battle-kicker {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 10px 16px;
  border-radius: 999px;
  background: rgba(249,115,22,.16);
  border: 1px solid rgba(251,146,60,.30);
  color: #fed7aa;
  font-size: clamp(13px, .9vw, 17px);
  font-weight: 1000;
  letter-spacing: .15em;
  text-transform: uppercase;
  box-shadow: 0 16px 40px rgba(249,115,22,.12);
}

.battle-title {
  margin: 14px 0 0;
  font-size: clamp(44px, 5.5vw, 108px);
  line-height: .88;
  font-weight: 1000;
  letter-spacing: -.075em;
  text-transform: uppercase;
  text-shadow: 0 12px 50px rgba(0,0,0,.45);
}

.battle-title span {
  color: #facc15;
  text-shadow: 0 0 34px rgba(250,204,21,.34);
}

.battle-arena {
  position: relative;
  z-index: 3;
  width: 100%;
  height: 100%;
  min-height: 360px;
}

.battle-seller {
  position: absolute;
  top: 50%;
  width: clamp(220px, 21vw, 360px);
  transform: translateY(-50%);
  text-align: center;
  will-change: transform, opacity, filter;
}

.battle-seller.winner { left: 8%; }
.battle-seller.loser { right: 8%; }

.battle-avatar {
  position: relative;
  width: clamp(170px, 14vw, 250px);
  height: clamp(170px, 14vw, 250px);
  margin: 0 auto;
  border-radius: 50%;
  padding: 9px;
  background: linear-gradient(135deg, rgba(0,202,255,.88), rgba(37,99,235,.72));
  box-shadow: 0 34px 90px rgba(0,0,0,.40);
}

.battle-seller.loser .battle-avatar {
  background: linear-gradient(135deg, rgba(239,68,68,.84), rgba(249,115,22,.64));
}

.battle-avatar img,
.battle-avatar span {
  width: 100%;
  height: 100%;
  border-radius: 50%;
  object-fit: cover;
  place-items: center;
  background: #111827;
  color: #fff;
  font-size: clamp(52px, 5vw, 88px);
  font-weight: 1000;
  border: 4px solid rgba(255,255,255,.16);
}

.battle-avatar img { display: block; }
.battle-avatar span { display: grid; }
.battle-avatar img[hidden],
.battle-avatar span[hidden],
.battle-avatar img.is-hidden,
.battle-avatar span.is-hidden { display: none !important; }

.battle-name {
  margin-top: 18px;
  font-size: clamp(22px, 2vw, 40px);
  line-height: 1;
  font-weight: 1000;
  letter-spacing: -.045em;
  text-shadow: 0 4px 22px rgba(0,0,0,.36);
}

.battle-rank {
  display: inline-flex;
  margin-top: 10px;
  padding: 8px 12px;
  border-radius: 999px;
  color: #dbeafe;
  background: rgba(59,130,246,.16);
  border: 1px solid rgba(59,130,246,.28);
  font-size: 13px;
  font-weight: 950;
}

.battle-seller.loser .battle-rank {
  color: #fee2e2;
  background: rgba(239,68,68,.15);
  border-color: rgba(239,68,68,.28);
}

.battle-impact {
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: 4;
  width: clamp(150px, 15vw, 260px);
  height: clamp(150px, 15vw, 260px);
  transform: translate(-50%, -50%) scale(0);
  opacity: 0;
  pointer-events: none;
}

.battle-impact::before,
.battle-impact::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255,255,255,.94) 0 10%, rgba(250,204,21,.84) 11% 18%, rgba(249,115,22,.66) 19% 31%, transparent 32%);
  filter: drop-shadow(0 0 34px rgba(250,204,21,.62));
  clip-path: polygon(50% 0, 61% 33%, 96% 24%, 68% 50%, 98% 74%, 61% 67%, 50% 100%, 39% 67%, 2% 74%, 32% 50%, 4% 24%, 39% 33%);
}

.battle-impact::after {
  transform: rotate(24deg) scale(.72);
  opacity: .72;
}

.winner-crown {
  position: absolute;
  left: 50%;
  top: -36px;
  transform: translateX(-50%) scale(0);
  font-size: clamp(42px, 4vw, 76px);
  filter: drop-shadow(0 10px 20px rgba(0,0,0,.30));
  z-index: 2;
  display: none;
}

.battle-seller.is-first-place .winner-crown {
  display: block;
}

.battle-footer {
  position: relative;
  z-index: 5;
  text-align: center;
}

.battle-message {
  display: inline-grid;
  grid-template-columns: 1fr;
  gap: 8px;
  max-width: 1060px;
  padding: 18px 28px;
  border-radius: 24px;
  background: rgba(255,255,255,.09);
  border: 1px solid rgba(255,255,255,.14);
  box-shadow: 0 18px 50px rgba(0,0,0,.25);
  color: rgba(255,255,255,.90);
  line-height: 1.15;
  font-weight: 900;
  text-align: center;
}

.battle-message-main {
  color: #fff;
  font-size: clamp(22px, 2vw, 38px);
  font-weight: 1000;
  letter-spacing: -.035em;
}

.battle-message-main strong {
  color: #facc15;
}

.battle-message-sub {
  color: rgba(255,255,255,.76);
  font-size: clamp(15px, 1.15vw, 22px);
  font-weight: 850;
}

.battle-message-position {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin: 0 4px;
  padding: 3px 10px;
  border-radius: 999px;
  color: #bbf7d0;
  background: rgba(34,197,94,.15);
  border: 1px solid rgba(34,197,94,.28);
  white-space: nowrap;
}

.battle-overlay.animate .battle-stage { animation: stageShake .42s ease-in-out 1.35s both; }
.battle-overlay.animate .battle-seller.winner { animation: winnerCharge 1.58s cubic-bezier(.2,1,.25,1) both, winnerVictory 1.55s ease-in-out 1.82s both; }
.battle-overlay.animate .battle-seller.loser { animation: loserCharge 1.58s cubic-bezier(.2,1,.25,1) both, loserDefeat 1.55s ease-in-out 1.82s both; }
.battle-overlay.animate .battle-impact { animation: impactPop .72s cubic-bezier(.18,1,.22,1) 1.22s both; }
.battle-overlay.animate .battle-seller.is-first-place .winner-crown { animation: crownWin .74s cubic-bezier(.22,1.4,.32,1) 2.1s both, crownFloat 1.8s ease-in-out 2.85s infinite; }
.battle-overlay.animate .battle-title { animation: titlePunch .56s ease-in-out 1.25s both; }
.battle-overlay.animate .confetti span { animation: confettiFall 2.7s ease-out var(--delay) both; }

.confetti {
  position: absolute;
  inset: 0;
  pointer-events: none;
  overflow: hidden;
  z-index: 2;
}

.confetti span {
  position: absolute;
  top: -30px;
  left: var(--x);
  width: 10px;
  height: 18px;
  border-radius: 4px;
  background: var(--c);
  opacity: 0;
  transform: rotate(var(--r));
}

@keyframes saleCardIn { 0% { opacity: 0; transform: translateY(36px) scale(.90); filter: blur(8px); } 100% { opacity: 1; transform: translateY(0) scale(1); filter: blur(0); } }
@keyframes saleCardPulse { 0%, 100% { transform: translateY(0) scale(1); } 42% { transform: translateY(-4px) scale(1.025); } }
@keyframes saleCardShine { 0% { transform: translateX(-120%); } 100% { transform: translateX(130%); } }
@keyframes saleBurst { 0% { opacity: 0; transform: scale(.55) rotate(0deg); } 26% { opacity: .88; } 100% { opacity: 0; transform: scale(1.4) rotate(32deg); } }
@keyframes saleAvatarPop { 0% { transform: scale(.76) rotate(-7deg); filter: brightness(.8); } 64% { transform: scale(1.09) rotate(3deg); filter: brightness(1.08); } 100% { transform: scale(1) rotate(0); filter: brightness(1); } }
@keyframes saleAmountPop { 0% { opacity: 0; transform: translateY(18px) scale(.86); } 100% { opacity: 1; transform: translateY(0) scale(1); } }
@keyframes saleAmountGlow { 0%, 100% { text-shadow: 0 0 34px rgba(250,204,21,.22); } 50% { text-shadow: 0 0 46px rgba(250,204,21,.42), 0 0 18px rgba(255,255,255,.16); } }
@keyframes coinRain { 0% { opacity: 0; transform: translateY(-44px) rotate(0deg) scale(.7); } 12% { opacity: 1; } 100% { opacity: 0; transform: translateY(105vh) rotate(calc(var(--r) + 720deg)) scale(1); } }
@keyframes winnerCharge { 0% { transform: translate(-76vw, -50%) scale(.88); opacity: 0; } 22% { opacity: 1; } 70% { transform: translate(32vw, -50%) scale(1.02); } 100% { transform: translate(28vw, -50%) scale(1.04); } }
@keyframes loserCharge { 0% { transform: translate(76vw, -50%) scale(.88); opacity: 0; } 22% { opacity: 1; } 70% { transform: translate(-32vw, -50%) scale(1.02); } 100% { transform: translate(-28vw, -50%) scale(1.04); } }
@keyframes winnerVictory { 0% { filter: brightness(1); } 35% { transform: translate(12vw, -50%) scale(1.06); } 100% { transform: translate(26vw, -50%) scale(1.18); filter: brightness(1.12) drop-shadow(0 0 34px rgba(250,204,21,.32)); } }
@keyframes loserDefeat { 0% { filter: brightness(1); opacity: 1; } 35% { transform: translate(-12vw, -50%) scale(.98) rotate(-3deg); } 100% { transform: translate(-34vw, -50%) scale(.78) rotate(-7deg); filter: grayscale(.65) brightness(.72); opacity: .72; } }
@keyframes impactPop { 0% { transform: translate(-50%, -50%) scale(0) rotate(0); opacity: 0; } 28% { transform: translate(-50%, -50%) scale(1.2) rotate(8deg); opacity: 1; } 100% { transform: translate(-50%, -50%) scale(2.2) rotate(-10deg); opacity: 0; } }
@keyframes stageShake { 0%, 100% { transform: translate(0,0); } 20% { transform: translate(-10px, 6px); } 40% { transform: translate(10px, -7px); } 60% { transform: translate(-7px, -5px); } 80% { transform: translate(6px, 5px); } }
@keyframes crownWin { 0% { transform: translateX(-50%) translateY(30px) scale(0) rotate(-14deg); opacity: 0; } 70% { transform: translateX(-50%) translateY(-8px) scale(1.16) rotate(5deg); opacity: 1; } 100% { transform: translateX(-50%) translateY(0) scale(1) rotate(-3deg); opacity: 1; } }
@keyframes crownFloat { 0%, 100% { transform: translateX(-50%) translateY(0) rotate(-3deg); } 50% { transform: translateX(-50%) translateY(-6px) rotate(4deg); } }
@keyframes titlePunch { 0%, 100% { transform: scale(1); } 35% { transform: scale(1.08) rotate(-1deg); } 70% { transform: scale(.98) rotate(1deg); } }
@keyframes confettiFall { 0% { opacity: 0; transform: translateY(-30px) rotate(var(--r)); } 12% { opacity: 1; } 100% { opacity: 0; transform: translateY(100vh) rotate(calc(var(--r) + 520deg)); } }

@media (max-width: 1024px) {
  .celebration-box { width: min(92vw, 720px) !important; padding: 28px 24px !important; }
  .celebration-title { font-size: clamp(42px, 12vw, 78px) !important; }
  .celebration-profile { grid-template-columns: 82px minmax(0, 1fr) !important; gap: 14px !important; padding: 14px 18px 14px 14px !important; }
  .celebration-profile img, .celebration-initials { width: 82px !important; height: 82px !important; border-radius: 26px !important; }
}

/* =========================================================
   AJUSTE TV V24
   Volta visual antigo:
   - ranking mais compacto
   - scroll no ranking para ver mais vendedores
   - prêmio maior e mais chamativo
   - total vendido do mês maior
   ========================================================= */

/* Total vendido no mês mais protagonista */
.hero-value {
  font-size: clamp(68px, 6.6vw, 132px) !important;
}

html.is-tv .hero-value {
  font-size: clamp(70px, 6.35vw, 126px) !important;
  line-height: .84 !important;
  letter-spacing: -5px !important;
}

/* TV: devolve mais área para o prêmio e deixa o ranking compacto */
html.is-tv .dashboard-grid {
  grid-template-rows: minmax(205px, 28%) minmax(178px, 27%) minmax(205px, 1fr) !important;
  grid-template-areas:
    "hero ranking"
    "sectors ranking"
    "sectors prize" !important;
}

/* Ranking com cards menores e rolagem */
html.is-tv .ranking-card {
  padding: 15px 17px !important;
  overflow: hidden !important;
}

html.is-tv .ranking-card .card-heading {
  margin-bottom: 9px !important;
}

html.is-tv .ranking-list {
  flex: 1 1 auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
  gap: 7px !important;
  padding-right: 6px !important;
  scrollbar-width: thin !important;
  scrollbar-color: rgba(255,255,255,.30) rgba(255,255,255,.07) !important;
}

html.is-tv .ranking-list::-webkit-scrollbar {
  width: 7px !important;
}

html.is-tv .ranking-list::-webkit-scrollbar-track {
  background: rgba(255,255,255,.06) !important;
  border-radius: 999px !important;
}

html.is-tv .ranking-list::-webkit-scrollbar-thumb {
  background: rgba(255,255,255,.28) !important;
  border-radius: 999px !important;
}

/* Cards do ranking no estilo mais compacto da versão antiga */
html.is-tv .rank-item {
  min-height: 52px !important;
  padding: 5px 8px !important;
  grid-template-columns: 32px minmax(0, 1fr) auto !important;
  gap: 8px !important;
  border-radius: 15px !important;
}

html.is-tv .rank-pos {
  width: 30px !important;
  height: 30px !important;
  border-radius: 11px !important;
  font-size: 13px !important;
}

html.is-tv .rank-profile {
  gap: 10px !important;
}

html.is-tv .rank-item .avatar,
html.is-tv .rank-item .avatar-fallback {
  width: 38px !important;
  height: 38px !important;
}

html.is-tv .rank-name strong {
  font-size: 13px !important;
  line-height: 1.05 !important;
  font-weight: 700 !important;
}

html.is-tv .rank-total strong {
  font-size: 13px !important;
  line-height: 1.05 !important;
  font-weight: 800 !important;
}

html.is-tv .rank-total span {
  font-size: 9px !important;
  line-height: 1.05 !important;
}

/* Coroa reposicionada para o avatar menor */
html.is-tv .rank-item.rank-1 .crown {
  left: 7px !important;
  top: -12px !important;
  width: 21px !important;
  height: 21px !important;
}

/* Prêmio maior e mais chamativo */
html.is-tv .prize-card {
  padding: 12px 15px 16px !important;
  overflow: hidden !important;
}

html.is-tv .prize-box {
  height: 100% !important;
  min-height: 0 !important;
  width: 100% !important;
  display: flex !important;
  align-items: stretch !important;
  justify-content: stretch !important;
}

html.is-tv .prize-box img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  max-height: none !important;
  object-fit: contain !important;
  object-position: center center !important;
  padding: 2px !important;
  border-radius: 18px !important;
  background: rgba(0,0,0,.18) !important;
}

/* Dá um pouco mais de presença ao card do prêmio */
html.is-tv .prize-card {
  box-shadow:
    0 24px 80px rgba(0,0,0,.32),
    inset 0 1px 0 rgba(255,255,255,.06) !important;
}

/* Telas/TVs mais baixas */
@media (max-height: 760px) {
  html.is-tv .dashboard-grid {
    grid-template-rows: minmax(190px, 27%) minmax(165px, 27%) minmax(200px, 1fr) !important;
  }

  html.is-tv .hero-value {
    font-size: clamp(56px, 5.4vw, 104px) !important;
  }

  html.is-tv .rank-item {
    min-height: 48px !important;
    padding: 4px 7px !important;
  }

  html.is-tv .rank-pos {
    width: 28px !important;
    height: 28px !important;
    font-size: 12px !important;
  }

  html.is-tv .rank-item .avatar,
  html.is-tv .rank-item .avatar-fallback {
    width: 35px !important;
    height: 35px !important;
  }

  html.is-tv .rank-name strong {
    font-size: 12.5px !important;
  }

  html.is-tv .rank-total strong {
    font-size: 12.5px !important;
  }

  html.is-tv .rank-item.rank-1 .crown {
    left: 14px !important;
    top: -13px !important;
    width: 20px !important;
    height: 20px !important;
  }
}

/* =========================================================
   AJUSTE TV V25
   Ranking com cores mais próximas do pódio:
   - ouro mais realista
   - prata mais metálica
   - bronze mais profundo
   ========================================================= */

/* 1º lugar - Ouro realista */
.rank-item.rank-1,
html.is-tv .rank-item.rank-1 {
  background:
    radial-gradient(circle at 22% 18%, rgba(255,255,255,.30), transparent 24%),
    linear-gradient(180deg, rgba(255, 231, 112, .98) 0%, rgba(197, 158, 35, .96) 44%, rgba(105, 81, 7, .98) 100%) !important;
  border-color: rgba(255, 223, 79, .76) !important;
  box-shadow:
    0 18px 42px rgba(250, 204, 21, .18),
    inset 0 1px 0 rgba(255,255,255,.34),
    inset 0 -18px 42px rgba(73, 52, 0, .25) !important;
}

.rank-item.rank-1::after,
html.is-tv .rank-item.rank-1::after {
  background:
    linear-gradient(110deg, rgba(255,255,255,.18), rgba(255,255,255,0) 46%) !important;
  opacity: .75 !important;
}

/* 2º lugar - Prata realista */
.rank-item.rank-2,
html.is-tv .rank-item.rank-2 {
  background:
    radial-gradient(circle at 22% 18%, rgba(255,255,255,.36), transparent 24%),
    linear-gradient(180deg, rgba(232, 239, 247, .98) 0%, rgba(151, 163, 178, .97) 45%, rgba(61, 72, 89, .98) 100%) !important;
  border-color: rgba(229, 236, 245, .72) !important;
  box-shadow:
    0 16px 38px rgba(148, 163, 184, .16),
    inset 0 1px 0 rgba(255,255,255,.34),
    inset 0 -18px 42px rgba(18, 24, 35, .24) !important;
}

/* 3º lugar - Bronze realista */
.rank-item.rank-3,
html.is-tv .rank-item.rank-3 {
  background:
    radial-gradient(circle at 22% 18%, rgba(255,214,171,.26), transparent 24%),
    linear-gradient(180deg, rgba(211, 130, 70, .98) 0%, rgba(143, 73, 30, .97) 48%, rgba(75, 31, 11, .98) 100%) !important;
  border-color: rgba(234, 154, 86, .68) !important;
  box-shadow:
    0 16px 38px rgba(194, 85, 12, .16),
    inset 0 1px 0 rgba(255,255,255,.20),
    inset 0 -18px 42px rgba(42, 16, 2, .28) !important;
}

/* Textos do pódio/ranking com melhor contraste */
.rank-item.rank-1 .rank-name strong,
.rank-item.rank-1 .rank-total strong,
.rank-item.rank-1 .rank-total span,
.rank-item.rank-1 .rank-pos,
.rank-item.rank-2 .rank-name strong,
.rank-item.rank-2 .rank-total strong,
.rank-item.rank-2 .rank-total span,
.rank-item.rank-2 .rank-pos,
.rank-item.rank-3 .rank-name strong,
.rank-item.rank-3 .rank-total strong,
.rank-item.rank-3 .rank-total span,
.rank-item.rank-3 .rank-pos,
html.is-tv .rank-item.rank-1 .rank-name strong,
html.is-tv .rank-item.rank-1 .rank-total strong,
html.is-tv .rank-item.rank-1 .rank-total span,
html.is-tv .rank-item.rank-1 .rank-pos,
html.is-tv .rank-item.rank-2 .rank-name strong,
html.is-tv .rank-item.rank-2 .rank-total strong,
html.is-tv .rank-item.rank-2 .rank-total span,
html.is-tv .rank-item.rank-2 .rank-pos,
html.is-tv .rank-item.rank-3 .rank-name strong,
html.is-tv .rank-item.rank-3 .rank-total strong,
html.is-tv .rank-item.rank-3 .rank-total span,
html.is-tv .rank-item.rank-3 .rank-pos {
  color: #fff !important;
  text-shadow: 0 2px 8px rgba(0,0,0,.28) !important;
}

/* Numeração mais integrada às cores */
.rank-item.rank-1 .rank-pos,
html.is-tv .rank-item.rank-1 .rank-pos {
  background: rgba(255, 244, 199, .22) !important;
  border: 1px solid rgba(255,255,255,.28) !important;
}

.rank-item.rank-2 .rank-pos,
html.is-tv .rank-item.rank-2 .rank-pos {
  background: rgba(255,255,255,.18) !important;
  border: 1px solid rgba(255,255,255,.24) !important;
}

.rank-item.rank-3 .rank-pos,
html.is-tv .rank-item.rank-3 .rank-pos {
  background: rgba(255, 194, 138, .18) !important;
  border: 1px solid rgba(255,255,255,.20) !important;
}

/* Avatares com moldura mais parecida com pódio */
.rank-item.rank-1 .avatar,
.rank-item.rank-1 .avatar-fallback,
html.is-tv .rank-item.rank-1 .avatar,
html.is-tv .rank-item.rank-1 .avatar-fallback {
  box-shadow:
    0 0 0 3px rgba(255, 224, 69, .86),
    0 0 22px rgba(250, 204, 21, .30) !important;
}

.rank-item.rank-2 .avatar,
.rank-item.rank-2 .avatar-fallback,
html.is-tv .rank-item.rank-2 .avatar,
html.is-tv .rank-item.rank-2 .avatar-fallback {
  box-shadow:
    0 0 0 3px rgba(226, 232, 240, .76),
    0 0 18px rgba(203, 213, 225, .22) !important;
}

.rank-item.rank-3 .avatar,
.rank-item.rank-3 .avatar-fallback,
html.is-tv .rank-item.rank-3 .avatar,
html.is-tv .rank-item.rank-3 .avatar-fallback {
  box-shadow:
    0 0 0 3px rgba(251, 146, 60, .72),
    0 0 18px rgba(251, 146, 60, .22) !important;
}

/* =========================================================
   AJUSTE TV V26
   Performance TV:
   - remove moedas da nova venda
   - remove confetes da ultrapassagem
   - remove burst de partículas
   ========================================================= */

.sale-coins,
.sale-coins span,
[data-sale-coins],
[data-sale-coins] span,
.sale-burst,
[data-sale-burst],
.confetti,
.confetti span,
#battleConfettiLayer,
#battleConfettiLayer span {
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
  animation: none !important;
  transform: none !important;
  pointer-events: none !important;
}

.celebration-overlay.animate .sale-coins span,
.celebration-overlay.animate [data-sale-coins] span,
.celebration-overlay.animate .sale-burst,
.celebration-overlay.animate [data-sale-burst],
.battle-overlay.animate .confetti span,
.battle-overlay.animate #battleConfettiLayer span {
  display: none !important;
  animation: none !important;
}

/* Blur mais leve para TV */
.celebration-overlay,
.battle-overlay {
  backdrop-filter: blur(7px) !important;
  -webkit-backdrop-filter: blur(7px) !important;
}