.video-modal { width: min(960px, 100%); padding: 12px; color: #f4f7f3; background: #102019; border: 1px solid rgba(255,255,255,.1); border-radius: 20px; box-shadow: 0 34px 100px rgba(0,0,0,.5); }
.video-modal .video-frame { height: min(66vh, 600px); min-height: 290px; background: radial-gradient(ellipse at 50% 0%, #263d32 0%, #111d17 54%, #080d0a 100%); border-color: rgba(214,255,63,.16); border-radius: 13px; }
.video-frame::before { position: absolute; inset: 10px; z-index: 0; content: ''; border: 1px solid rgba(255,255,255,.055); border-radius: 8px; pointer-events: none; }
.video-frame video { z-index: 1; }
.player-state { position: absolute; inset: 0; z-index: 2; display: flex; align-items: center; justify-content: center; flex-direction: column; gap: 10px; padding: 25px; color: #f4f7f3; background: rgba(8,13,10,.64); text-align: center; backdrop-filter: blur(3px); }
.player-state[hidden] { display: none; }
.player-state strong { font: 600 17px var(--font-display); }
.player-state small { max-width: 340px; color: #bdc9c1; font-size: 11px; line-height: 1.55; }
.player-spinner { width: 31px; height: 31px; margin-bottom: 4px; border: 3px solid rgba(214,255,63,.2); border-top-color: var(--lime); border-radius: 50%; animation: player-spin .8s linear infinite; }
.player-state.is-error .player-spinner { display: none; }
.player-state.is-error strong { color: #ffad91; }
@keyframes player-spin { to { transform: rotate(360deg); } }
.video-modal .modal-info { align-items: center; padding: 17px 7px 5px; }
.video-modal .modal-info .eyebrow { color: var(--lime); }
.video-modal .modal-info h2 { color: #f4f7f3; }
.video-modal .modal-info p:last-child { color: #aab7ad; }
.video-modal .ready-pill { color: #e1f29b; background: rgba(214,255,63,.1); border-color: rgba(214,255,63,.2); }
@media (max-width: 500px) {
  .video-modal { padding: 8px; border-radius: 16px; }
  .video-modal .video-frame { height: min(58vh, 360px); min-height: 220px; border-radius: 10px; }
  .video-modal .modal-info { align-items: flex-start; flex-direction: column; gap: 10px; }
  .video-modal .modal-info h2 { font-size: 21px; }
}
.hero-live-button { display: inline-flex; align-items: center; gap: 9px; min-height: 46px; margin: 0 0 0 8px; padding: 0 17px; color: #f4f7f3; background: #102019; border: 1px solid rgba(16,32,25,.28); border-radius: 12px; box-shadow: 0 9px 22px rgba(16,32,25,.13); font: 700 12px var(--font-body); cursor: pointer; transition: transform .18s ease, box-shadow .18s ease, background .18s ease; }
.hero-live-button:hover { transform: translateY(-2px); background: #1a3026; box-shadow: 0 13px 25px rgba(16,32,25,.2); }
.hero-live-button[hidden] { display: none; }
.hero-live-dot { width: 8px; height: 8px; background: #ff685a; border-radius: 50%; box-shadow: 0 0 0 4px rgba(255,104,90,.16), 0 0 13px rgba(255,104,90,.65); animation: live-pulse 1.7s ease-out infinite; }
.live-video-frame { background: #050907; }
@keyframes live-pulse { 50% { box-shadow: 0 0 0 7px rgba(255,104,90,0), 0 0 17px rgba(255,104,90,.7); } }
@media (max-width: 500px) { .hero-live-button { min-height: 44px; margin-left: 0; margin-top: 10px; } }