/* TV mode: navy 1920x1080 stage (64 x 36 cells of 30 px), scaled to fit by js/tv.js */
body.tv-on { overflow: hidden; }

.tv {
  position: fixed; inset: 0; z-index: 100; overflow: hidden;
  background: var(--lean-navy);
  --bg: var(--lean-navy);
  --surface: rgba(243, 243, 242, 0.06);
  --border: rgba(179, 180, 179, 0.25);
  --text: var(--lean-offwhite);
  --text-muted: var(--lean-lightgray);
  --accent: var(--lean-green);
  color: var(--text);
}

.tv__stage {
  position: absolute; top: 50%; left: 50%;
  width: 1920px; height: 1080px; transform-origin: center center;
  display: flex; flex-direction: column; overflow: hidden;
  padding: 0 60px;
}

.tv__bar {
  flex: none; height: 150px;
  display: grid; grid-template-columns: 1fr auto auto; align-items: center; gap: 60px;
  border-bottom: 1px solid var(--border);
}
/* Wide format: logo area stays in the right corner in both languages */
[dir="rtl"] .tv__bar { grid-template-columns: auto auto 1fr; }
[dir="rtl"] .tv__titles { order: 3; }
[dir="rtl"] .tv__clock { order: 2; }
[dir="rtl"] .tv__logo { order: 1; }
.tv__title { font-size: 48px; font-weight: var(--w-black); line-height: 1.1; }
.tv__view { font-size: 26px; font-weight: var(--w-semibold); color: var(--lean-green); }
.tv__clock { font-size: 56px; font-weight: var(--w-light); }
/* White logo 90 px tall: monogram ~53 px, clear space X ~27 px; 30 px reserved */
.tv__logo { padding: 30px; height: 150px; }
.tv__logo img { height: 90px; width: auto; display: block; }

.tv__alert {
  flex: none; display: flex; align-items: center; gap: 16px;
  margin-top: 30px; padding: 12px 30px; border-radius: var(--radius);
  background: var(--lean-yellow); color: var(--lean-navy); font-size: 26px;
}

.tv__slides { position: relative; flex: 1; min-height: 0; margin-top: 30px; }
.tv__slide {
  position: absolute; inset: 0; display: flex; gap: 60px; overflow: hidden;
  opacity: 0; transform: translateY(24px) scale(.985);
  transition: opacity .9s ease, transform .9s cubic-bezier(.2,.7,.2,1);
  pointer-events: none;
}
.tv__slide.is-active { opacity: 1; transform: none; }
.tv__h { font-size: 32px; font-weight: var(--w-bold); margin-bottom: 20px; }

.tv__slide--overview { align-items: stretch; }
.tv__kpis { flex: 1.6; display: grid; grid-template-columns: 1fr 1fr; gap: 30px; }
.tv__kpi {
  display: flex; flex-direction: column; justify-content: center; gap: 6px;
  padding: 30px 40px; border-radius: var(--radius);
  background: var(--surface); border: 1px solid var(--border); border-top: 6px solid var(--lean-green);
}
.tv__kpi-label { font-size: 28px; font-weight: var(--w-semibold); color: var(--text-muted); }
.tv__kpi-value { font-size: 104px; font-weight: var(--w-black); line-height: 1; white-space: nowrap; }
.tv__kpi-value small { font-size: 40px; font-weight: var(--w-bold); color: var(--text-muted); }
.tv__kpi .kpi__delta { align-self: flex-start; font-size: 22px; }
.tv__ring { flex: 1; display: flex; align-items: center; justify-content: center; }
.tv__ring svg { height: 100%; max-height: 640px; width: auto; }

.tv__slide--load, .tv__slide--summary { flex-direction: column; }
.tv__heat { flex: 1; min-height: 0; }
.tv__heat svg { width: 100%; height: 100%; }

.tv__col { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.tv__lead { flex: 1; min-height: 0; }
.tv__lead svg { width: 100%; height: 100%; }
.tv__feed { gap: 10px; }
.tv__feed .feed__item { padding: 12px 18px; }
.tv__feed .feed__issue { font-size: 24px; }
.tv__feed .feed__meta, .tv__feed .feed__time { font-size: 18px; }
.tv__feed .feed__prio { font-size: 16px; padding: 2px 10px; }

.tv__summary { font-size: 36px; line-height: 1.7; max-width: 1560px; font-weight: var(--w-regular); }

.tv__foot { flex: none; height: 90px; display: flex; align-items: center; gap: 30px; }
.tv__dots { display: flex; gap: 12px; }
.tv__dot { width: 14px; height: 14px; border-radius: 50%; background: rgba(243, 243, 242, 0.25); transition: background .4s; }
.tv__dot.is-active { background: var(--lean-green); }
.tv__progress { flex: 1; height: 6px; border-radius: 3px; background: rgba(243, 243, 242, 0.12); overflow: hidden; }
.tv__progress span { display: block; height: 100%; background: var(--lean-green); transform: scaleX(0); transform-origin: left; }
[dir="rtl"] .tv__progress span { transform-origin: right; }
.tv__exit { font-size: 18px; color: var(--text); opacity: .35; transition: opacity .3s; }
.tv__exit:hover, .tv__exit:focus-visible { opacity: 1; }