*{box-sizing:border-box} :root{color-scheme:dark} body{margin:0;background:#070b0e;color:#f4f4f4;font-family:Arial,Helvetica,sans-serif;font-size:14px}.site-header{background:#b90910;border-bottom:1px solid #ed272d}.topbar{height:38px;max-width:1180px;margin:auto;padding:0 16px;display:flex;align-items:center;justify-content:space-between}.brand{display:flex;align-items:center;gap:4px;color:#fff;text-decoration:none;font-weight:900;font-size:17px}.brand-dot{width:6px;height:6px;background:#26e26b;border-radius:50%}.brand-tv{font-size:9px}.top-actions{display:flex;gap:5px}.top-btn{padding:5px 8px;border-radius:2px;font-size:9px;font-weight:800;text-decoration:none;color:#111;background:#fff}.signup-top{background:#26e26b}.title-strip{text-align:center;background:#d41219;padding:10px 12px}.title-strip h1{font-size:13px;letter-spacing:.2px;margin:0;font-weight:800}.player-section{width:min(100%,1180px);margin:0 auto;background:#050709}.player{position:relative;aspect-ratio:16/8.1;max-height:560px;overflow:hidden;background:#101820}.player>img{display:block;width:100%;height:100%;object-fit:cover}.badge{position:absolute;top:9px;padding:3px 6px;font-size:8px;font-weight:800;border-radius:2px}.live-badge{left:10px;background:#e3131b}.hd-badge{right:10px;background:#087f50}.online-counter{position:absolute;right:12px;top:30px;background:#07110eaf;padding:5px 7px;border-radius:3px;font-size:10px;display:flex;align-items:center;gap:5px}.online-dot,.live-dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:#22e86a}.online-label{font-size:8px;color:#b9c5c5}.play-button{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:44px;height:30px;border:0;border-radius:7px;background:#f3242d;cursor:pointer}.play-button:after{content:"";display:block;margin:auto;border-top:7px solid transparent;border-bottom:7px solid transparent;border-left:11px solid #fff;margin-left:18px}.controls{height:18px;display:flex;align-items:center;gap:9px;padding:0 10px;background:#101215;color:#ddd;font-size:9px}.progress{height:3px;background:#343a40;flex:1}.progress span{display:block;width:18%;height:100%;background:#e21b23}.live-text{color:#f33;font-weight:800}.buttons{display:flex;justify-content:center;gap:10px;padding:12px;background:#070b0e}.btn{display:flex;align-items:center;gap:6px;padding:8px 12px;border-radius:2px;text-decoration:none;font-size:10px;font-weight:900;color:white}.watch{background:#ed1b24}.signup{background:#16b968}.btn-arrow{font-size:15px}.info-area{background:linear-gradient(#17191b,#780b10);padding:12px 10px 25px;border-bottom:1px solid #b40e15}.info-grid{max-width:1180px;margin:auto;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.info-box{text-align:center;min-height:65px}.info-head{display:flex;align-items:center;justify-content:center;gap:9px}.icon{width:28px;height:28px;background:#f4f4f4;color:#151515;border-radius:5px;display:grid;place-items:center;font-size:17px;font-weight:bold}.info-title{font-size:11px;font-weight:700}.info-box p{font-size:9px;color:#d0c5c5;margin:9px 0 0}.schedule-section{max-width:1180px;margin:0 auto;padding:20px 12px 30px}.section-heading{display:flex;align-items:center;gap:8px;margin:0 0 14px}.heading-mark{height:19px;width:4px;background:#ef2229}.section-heading h2{font-size:15px;margin:0;font-weight:900;letter-spacing:.3px}.schedule-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px 14px}.fight-card{display:block;color:#f2f2f2;text-decoration:none;min-width:0}.thumb{position:relative;aspect-ratio:16/9;overflow:hidden;border-radius:6px;background:#202326}.thumb img{width:100%;height:100%;display:block;object-fit:cover;transition:transform .2s}.fight-card:hover .thumb img{transform:scale(1.035)}.date-tag{position:absolute;left:7px;top:7px;background:#f5f5f5;color:#222;padding:3px 5px;font-size:8px;font-weight:900;border-radius:2px}.card-play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:30px;height:30px;border-radius:50%;background:#ffffffed;color:#e21b23;display:grid;place-items:center;padding-left:2px;font-size:12px}.fight-card h3{font-size:12px;line-height:1.35;margin:8px 0 4px;font-weight:700}.fight-card p{font-size:10px;color:#92999d;margin:0}.footer{background:#080b0e;border-top:1px solid #202529;padding:20px 14px}.footer-inner{max-width:1180px;margin:auto;display:flex;justify-content:space-between;align-items:center;gap:20px}.copyright{font-size:10px;line-height:1.7;color:#aab0b4}.footer-links{display:flex;flex-wrap:wrap;gap:14px}.footer-links a{font-size:10px;color:#c4c8ca;text-decoration:none}.footer-links a:hover{color:#fff}@media(min-width:900px){.player{aspect-ratio:16/7}.player-section{padding:0 12px}.title-strip h1{font-size:14px}}@media(max-width:620px){.topbar{height:34px;padding:0 10px}.brand{font-size:14px}.title-strip{padding:8px 5px}.title-strip h1{font-size:10px}.player{aspect-ratio:16/9}.online-counter{top:28px;right:7px;font-size:8px}.controls{gap:5px}.buttons{padding:10px}.btn{padding:7px 9px;font-size:9px}.info-grid{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:16px}.info-area{padding-bottom:18px}.schedule-section{padding:16px 9px 24px}.schedule-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:17px 9px}.fight-card h3{font-size:10px}.fight-card p{font-size:9px}.section-heading h2{font-size:12px}.footer-inner{align-items:flex-start;flex-direction:column;gap:10px}}@media(max-width:360px){.schedule-grid{grid-template-columns:1fr}.fight-card h3{font-size:12px}}

/* Responsive/player/button corrections */
.player {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  max-height: none;
  isolation: isolate;
}
.player > img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}
.online-counter {
  position: absolute;
  z-index: 3;
  top: 12px;
  right: 12px;
  left: auto;
  bottom: auto;
  white-space: nowrap;
  line-height: 1;
  border: 1px solid rgba(40, 255, 150, .35);
  background: rgba(0, 10, 12, .82);
  box-shadow: 0 2px 8px rgba(0,0,0,.35);
}
.play-button {
  z-index: 4;
  display: grid;
  place-items: center;
  padding: 0;
  width: 46px;
  height: 32px;
  cursor: pointer;
  box-shadow: 0 2px 10px rgba(0,0,0,.35);
  transition: transform .15s ease, background .15s ease;
}
.play-button::after {
  content: "";
  display: block;
  width: 0;
  height: 0;
  margin: 0 0 0 3px;
  border-top: 7px solid transparent;
  border-bottom: 7px solid transparent;
  border-left: 11px solid #fff;
}
.play-button:hover { background: #ff343c; transform: translate(-50%, -50%) scale(1.06); }
.play-button:focus-visible, .btn:focus-visible, .top-btn:focus-visible, .fight-card:focus-visible {
  outline: 2px solid #fff;
  outline-offset: 3px;
}
.btn { cursor: pointer; justify-content: center; min-height: 32px; }
.btn:hover { filter: brightness(1.12); }
.fight-card { cursor: pointer; }
.top-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 22px; }
.controls { width: 100%; }
.progress { min-width: 12px; }
@media (min-width: 900px) {
  .player-section { width: min(100%, 1180px); padding: 0 12px; }
  .player { aspect-ratio: 16 / 9; }
}
@media (max-width: 620px) {
  .player-section { width: 100%; padding: 0; }
  .player { aspect-ratio: 16 / 9; max-height: none; }
  .online-counter { top: 8px; right: 8px; padding: 5px 6px; gap: 4px; font-size: 8px; }
  .badge { top: 8px; }
  .live-badge { left: 8px; }
  .hd-badge { right: 8px; }
  .play-button { width: 42px; height: 29px; }
  .controls { height: 20px; padding: 0 7px; }
  .buttons { gap: 8px; }
  .btn { min-height: 32px; }
}
@media (max-width: 380px) {
  .online-counter { top: 7px; right: 7px; }
  .online-label { display: none; }
  .controls { gap: 4px; font-size: 8px; }
  .btn { padding: 7px 8px; }
}


/* Larger play control and bottom "Ways to Watch" feature */
.play-button {
  width: 64px;
  height: 46px;
  border-radius: 9px;
}
.play-button::after {
  border-top-width: 10px;
  border-bottom-width: 10px;
  border-left-width: 16px;
  margin-left: 4px;
}
.ways-watch {
  margin: 0 auto;
  width: 100%;
  background: #fff;
  color: #26303a;
  padding: 24px clamp(16px, 4vw, 42px) 28px;
}
.ways-watch-heading { text-align: center; margin-bottom: 20px; }
.ways-watch-heading h2 { margin: 0; font-size: clamp(20px, 2.2vw, 28px); font-weight: 500; color: #303944; }
.ways-watch-heading span { display: block; width: 30px; height: 2px; margin: 9px auto 0; background: #ff604b; }
.ways-watch-main {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr);
  align-items: center;
  gap: clamp(18px, 4vw, 50px);
  max-width: 1100px;
  margin: 0 auto 24px;
}
.ways-watch-visual { min-width: 0; }
.ways-watch-visual img { display: block; width: 100%; max-height: 300px; object-fit: contain; }
.ways-watch-copy { text-align: center; }
.ways-watch-copy h3 { margin: 0 0 12px; font-size: clamp(18px, 2vw, 26px); line-height: 1.35; font-weight: 400; color: #34404d; }
.ways-watch-copy p { margin: 0 auto 14px; max-width: 360px; font-size: 12px; line-height: 1.7; color: #6b727a; }
.platform-icons { display: flex; justify-content: center; align-items: center; gap: 16px; margin: 12px 0 15px; color: #128ac7; font-weight: 900; font-size: 17px; }
.create-account { display: inline-block; padding: 8px 13px; border: 1px solid #37b8e7; border-radius: 3px; color: #33404a; text-decoration: none; font-size: 11px; }
.create-account:hover { background: #eafaff; }
.ways-watch-benefits { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; max-width: 1100px; margin: 0 auto; text-align: center; }
.ways-watch-benefits article { min-width: 0; }
.benefit-icon { display: grid; place-items: center; margin: 0 auto 8px; width: 40px; height: 40px; border-radius: 50%; background: #ff624c; color: #fff; font-size: 18px; font-weight: 700; }
.ways-watch-benefits h4 { margin: 0 0 5px; font-size: 12px; font-weight: 500; color: #424a52; }
.ways-watch-benefits p { margin: 0; font-size: 10px; line-height: 1.5; color: #80858a; }
@media (max-width: 620px) {
  .play-button { width: 56px; height: 40px; }
  .play-button::after { border-top-width: 9px; border-bottom-width: 9px; border-left-width: 14px; }
  .ways-watch { padding: 20px 14px 24px; }
  .ways-watch-main { grid-template-columns: 1fr; gap: 12px; margin-bottom: 22px; }
  .ways-watch-visual img { max-height: 220px; }
  .ways-watch-copy h3 { max-width: 330px; margin-left: auto; margin-right: auto; }
  .ways-watch-benefits { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 20px; }
  .benefit-icon { width: 36px; height: 36px; }
}
@media (min-width: 621px) and (max-width: 900px) {
  .ways-watch-main { gap: 20px; }
  .ways-watch-visual img { max-height: 230px; }
}

/* Requested final sizing and top-corner badge placement */
.live-badge {
  left: 10px;
  top: 10px;
  padding: 6px 10px;
  font-size: 12px;
  line-height: 1.2;
  z-index: 5;
}
.online-counter {
  top: 10px;
  right: 48px;
  left: auto;
  padding: 7px 9px;
  font-size: 11px;
  z-index: 5;
}
.online-label { font-size: 9px; }
.hd-badge {
  top: 9px;
  right: 10px;
  padding: 5px 7px;
  font-size: 10px;
  z-index: 5;
}
.play-button { width: 70px; height: 50px; }
.play-button::after {
  border-top-width: 11px;
  border-bottom-width: 11px;
  border-left-width: 18px;
}
.btn {
  min-height: 40px;
  padding: 10px 17px;
  font-size: 12px;
  gap: 8px;
}
.btn-arrow { font-size: 17px; }
@media (max-width: 620px) {
  .live-badge { left: 8px; top: 8px; padding: 5px 8px; font-size: 11px; }
  .online-counter { top: 8px; right: 42px; padding: 5px 6px; font-size: 8px; }
  .hd-badge { top: 8px; right: 8px; padding: 4px 5px; font-size: 9px; }
  .play-button { width: 60px; height: 43px; }
  .btn { min-height: 38px; padding: 9px 12px; font-size: 10px; }
}
@media (max-width: 380px) {
  .online-counter { right: 39px; }
  .online-label { display: none; }
}