/* Svarahi's established light-gold theme, sized for a single TV viewport. */
:root {
  color-scheme: light;
  --gold: #dfa81d;
  --gold-deep: #986000;
  --ink: #17130c;
  --muted: #705729;
  --up: #087a39;
  --down: #bd2530;
  --gold-bar: linear-gradient(100deg, #dca51d 0%, #fff19a 21%, #d39a12 52%, #ffe786 76%, #d59d18 100%);
  --unit: min(1vw, 1.78vh);
}
* { box-sizing: border-box; }
html, body { width: 100%; height: 100%; margin: 0; overflow: hidden; }
body { color: var(--ink); background: #fffaf0; font-family: Arial, Helvetica, sans-serif; }
button, a { -webkit-tap-highlight-color: transparent; }
a { color: inherit; text-decoration: none; }
button { font: inherit; cursor: pointer; }
button:hover { background: #fff1be; }
a:focus-visible, button:focus-visible { outline: 3px solid #775000; outline-offset: 3px; }
[hidden] { display: none !important; }
.tv-screen {
  width: 100%; height: 100vh; height: var(--screen-height, 100dvh);
  display: grid; grid-template-rows: auto minmax(0, 1fr) auto;
  gap: calc(var(--unit) * .4); padding: calc(var(--unit) * .6);
  background: linear-gradient(180deg, #fff 0%, #fffaf0 100%);
}
.tv-header { display: flex; align-items: center; gap: 1.5vw; min-width: 0; }
.tv-brand { display: flex; align-items: center; gap: 16px; min-width: 0; }
.tv-brand img { display: block; width: clamp(120px, 14vw, 180px); height: auto; flex-shrink: 0; }
.tv-brand-name { color: #a96900; font-family: Georgia, 'Times New Roman', serif; font-size: clamp(2.5rem, 5vw, 4.5rem); font-weight: 700; line-height: 1.1; letter-spacing: .04em; text-transform: uppercase; }
.tv-menu { display: flex; align-items: center; justify-content: flex-start; flex: 1; gap: .5em; min-width: 0; font-size: clamp(12px, 1.1vw, 30px); font-weight: 700; }
.tv-menu a { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: .55em .65em; border-radius: 8px; color: var(--muted); white-space: nowrap; }
.tv-menu a:hover { background: #fff1c5; color: var(--ink); }
.tv-menu a[aria-current="page"] { background: var(--gold-bar); color: var(--ink); }
.fullscreen-button { display: flex; flex-shrink: 0; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; padding: .7em; border: 1px solid var(--gold); border-radius: 8px; background: #fff; font-size: calc(var(--unit) * .9); }
.fullscreen-button span { display: none; }
.fullscreen-button svg { width: 1.4em; height: 1.4em; fill: none; stroke: currentColor; stroke-width: 1.7; }
.tv-board { min-height: 0; display: grid; grid-template-rows: auto minmax(0, 1fr); gap: calc(var(--unit) * .4); }
.tv-board.has-futures { grid-template-rows: auto minmax(0, var(--product-track, 1fr)) auto minmax(0, var(--future-track, 1fr)); }
.products-panel, .futures-panel { min-width: 0; min-height: 0; display: grid; grid-template-rows: minmax(0, 1fr); }
.futures-panel { display: contents; }
.board-columns, .quote-row { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr) minmax(0, 1fr); align-items: center; gap: .4em; padding: .15em .4em; border: 2px solid #e2ae28; border-radius: 8px; font-size: var(--rate-font, 32px); }
.board-columns { margin: 0; background: var(--gold-bar); line-height: 1.2; }
.board-columns span { font-size: clamp(12px, .55em, 48px); }
.board-columns span:not(:first-child) { text-align: center; }
.panel-title { margin: 0; padding: .25em .65em; border-radius: 8px; background: var(--gold-bar); font-size: clamp(12px, calc(var(--unit) * 1.35), 40px); line-height: 1.1; }
.products-grid, .futures-grid { min-height: 0; display: grid; grid-template-columns: minmax(0, 1fr); grid-template-rows: repeat(var(--rows, 1), minmax(0, 1fr)); gap: var(--row-gap, 4px); }
.quote-row { min-height: 0; min-width: 0; background: #fff; }
.product-name { margin: 0; min-width: 0; font-size: .8em; font-weight: 700; line-height: 1.14; overflow-wrap: anywhere; }
.quote-cell { min-width: 0; text-align: center; }
.quote-value { display: flex; align-items: center; justify-content: center; gap: .16em; min-width: 0; padding: .08em .12em; border-radius: 8px; color: var(--ink); background: transparent; font-size: 1.25em; font-weight: 700; line-height: 1.1; font-variant-numeric: tabular-nums; white-space: nowrap; }
.futures-grid .quote-value { font-size: 1em; }
.quote-value { transition: background-color 350ms ease-in-out, color 350ms ease-in-out; }
.quote-value[data-direction="up"] { color: #fff; background: var(--up); }
.quote-value[data-direction="down"] { color: #fff; background: var(--down); }
.quote-range { display: block; margin-top: .35em; color: var(--muted); font-size: .35em; line-height: 1; font-variant-numeric: tabular-nums; white-space: nowrap; }
.feed-status { margin-left: auto; text-align: right; }
.feed-status::before { content: ""; display: inline-block; width: .55em; height: .55em; margin-right: .45em; border-radius: 50%; background: #a78643; vertical-align: .06em; }
.feed-status[data-state="live"]::before { background: var(--up); }
.feed-status[data-state="error"] { color: var(--down); }
.feed-status[data-state="error"]::before { background: var(--down); }
.tv-footer { display: flex; align-items: center; gap: 2vw; min-width: 0; padding-top: .5em; border-top: 1px solid #e5c56f; font-size: calc(var(--unit) * .95); line-height: 1.25; }
.tv-footer a { white-space: nowrap; }
.tv-address { color: var(--muted); }
.empty-state { display: grid; place-content: center; grid-column: 1 / -1; margin: 0; padding: 1em; border: 1px solid var(--gold); border-radius: 14px; background: #fffdf5; text-align: center; font-size: calc(var(--unit) * 1.5); }
.no-script { position: fixed; inset: auto 0 0; margin: 0; padding: 1em; background: #fff1c5; text-align: center; }
@media (orientation: portrait) {
  :root { --unit: min(1.5vw, 1vh); }
  .tv-header { gap: calc(var(--unit) * .6); }
  .tv-menu { gap: 0; font-size: clamp(11px, 2vw, 24px); }
  .tv-menu a { padding-inline: .45em; }
  .fullscreen-button { font-size: calc(var(--unit) * 1.3); }
  .fullscreen-button span { display: none; }
  .fullscreen-button svg { width: 20px; height: 20px; }
  .panel-title { font-size: calc(var(--unit) * 2); }
  .tv-footer { flex-wrap: wrap; gap: .5em 1em; font-size: calc(var(--unit) * 1.4); }
  .tv-address { display: none; }
  .feed-status { flex-basis: 100%; text-align: left; }
}
@media (max-height: 480px) and (orientation: landscape) {
  .fullscreen-button { min-height: 30px; padding: .5em; }
}
@media (max-width: 1099.98px) {
  .tv-brand { gap: 10px; }
  .tv-brand img { width: clamp(64px, 19vw, 100px); }
  .tv-brand-name { font-size: clamp(1.6rem, 6.5vw, 2.5rem); }
}
@media (max-width: 600px) {
  .tv-brand { gap: 6px; }
  .tv-brand img { width: clamp(44px, 14vw, 64px); }
  .tv-brand-name { font-size: clamp(1.15rem, 5.5vw, 1.4rem); }
}
@media (forced-colors: active) { .quote-value { border: 1px solid; } }
@media (prefers-reduced-motion: reduce) { .quote-value { transition: none; } }