/* TV mode (body.tv): the wall display on a Google TV, driven by a remote. 10-foot scale, overscan-safe
   margins, a bold focus ring, no mouse cursor, and burn-in protection when idle. Only applies when
   web/core/tvnav.js adds the `tv` class, so touch and Portal behaviour is untouched. */
body.tv {
  /* Layout scale: tvnav.js sets `zoom` on the body so the page lays out as if the viewport were ~1366 CSS px
     wide (a Google TV browser reports ~960x540 at DPR 2), and fills --tv-h / --tv-pad-* in the zoomed units. */
  --touch: 52px;
  height: var(--tv-h, 100%);
  padding: var(--tv-pad-y, 3vh) var(--tv-pad-x, 3vw);   /* overscan-safe margins (TVs crop the edges) */
  overflow: hidden;
  user-select: none; -webkit-user-select: none; -webkit-touch-callout: none;
}
body.tv, body.tv * { cursor: none !important; }
body.tv .app { height: calc(var(--tv-h, 100vh) - 2 * var(--tv-pad-y, 3vh)); max-height: 100%; }
body.tv .scrim { padding: var(--tv-pad-y, 3vh) var(--tv-pad-x, 3vw); }
body.tv *::-webkit-scrollbar { display: none; }
body.tv * { scrollbar-width: none; }

/* bigger targets */
body.tv .rail { overflow-y: auto; padding-top: 4px; }
body.tv .rail-item { flex: none; }
body.tv .btn, body.tv .iconbtn { min-height: var(--touch); min-width: var(--touch); }
body.tv .sheet { width: min(760px, 100%); }
body.tv .fab { right: var(--tv-pad-x, 3vw); bottom: var(--tv-pad-y, 3vh); }
body.tv .tabbar { display: none; }

/* focus: a bold accent ring that scales up, so it reads from the sofa */
body.tv :is(button, a, input, select, textarea, summary, [tabindex], [role="button"], [role="tab"], [role="switch"]):focus {
  outline: 6px solid var(--accent); outline-offset: 3px; border-radius: var(--r-md);
  box-shadow: 0 0 0 12px color-mix(in oklab, var(--accent) 28%, transparent);
  transform: scale(1.06); position: relative; z-index: 3;
}
body.tv :is(button, a, input, select, textarea, summary, [tabindex], [role="button"], [role="tab"], [role="switch"]) {
  transition: transform var(--dur-1) var(--ease), box-shadow var(--dur-1) var(--ease);
}
body.tv .kd-overlay:focus, body.tv .ph-show:focus, body.tv [tabindex="-1"]:focus { outline: none; box-shadow: none; transform: none; }
body.tv .ph-hint { display: none; }

/* burn-in protection: after the idle time (Settings -> TV mode) the picture dims and drifts slowly.
   The clock keeps showing; any key press wakes it. */
body.tv.tv-idle .app { filter: brightness(.55); animation: tv-drift 90s ease-in-out infinite alternate; }
body.tv .app { transition: filter 2s var(--ease); }
@keyframes tv-drift { from { transform: translate(-14px, -9px); } to { transform: translate(14px, 9px); } }

/* TV: titles must read from the couch, so the floor is higher and four lines are allowed. */
body.tv .ev-title { font-size: clamp(15px, 5.6cqw, 28px); -webkit-line-clamp: 4; }
body.tv .ev-time { font-size: clamp(12px, 4cqw, 19px); }

/* Calm view: after a few seconds without a button press the side rail and the family/clock header tuck
   away so the calendar gets the whole screen. Any key brings them back. The view switcher stays. */
body.tv.tv-calm .rail, body.tv.tv-calm .board-head { display: none; }

/* TV: the page padding is the blank border; keep just a hairline so the calendar fills the screen. */
body.tv .screen { padding: 6px 8px; }
body.tv .fab { right: 20px; bottom: 20px; }