/* Half time: the live game's tile flips over to a dark "HALF TIME" tile (banner and Fixture cards).
   Our own design: club stripe flags, no AFL logos or artwork. */
@property --ht-a { syntax: "<angle>"; initial-value: 0deg; inherits: false; }
@keyframes ht-flip { from { transform: perspective(700px) rotateX(-90deg); opacity: 0; } 60% { opacity: 1; } to { transform: perspective(700px) rotateX(0); opacity: 1; } }
@keyframes ht-spin { to { --ht-a: 360deg; } }
.ht { position: absolute; inset: 0; z-index: 3; border-radius: inherit; overflow: hidden; isolation: isolate;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px;
  background: linear-gradient(160deg, #0f172a, #1e293b); color: #fff; text-decoration: none; text-align: center;
  transform-origin: 50% 0; animation: ht-flip .9s cubic-bezier(.2,.8,.2,1) both; }
.ht::before { content: ""; position: absolute; inset: 0; z-index: -1;
  background: conic-gradient(from var(--ht-a) at 50% 50%, transparent 0 15%, color-mix(in srgb, var(--c1, #dc2626) 45%, transparent) 30%,
              transparent 45% 65%, color-mix(in srgb, var(--c2, #1F3A93) 55%, transparent) 80%, transparent 95%);
  filter: blur(14px); opacity: .9; animation: ht-spin 6s linear infinite; }
.ht.seen { animation: none; }
.ht-clubs { display: flex; align-items: center; gap: 7px; font-weight: 800; font-size: 12px; letter-spacing: .05em; }
.ht-clubs i { color: #94a3b8; font-style: normal; font-weight: 600; }
.ht-clubs .flag { width: 12px; height: 17px; border-radius: 3px; flex: none; }
.ht b { font-size: 17px; white-space: nowrap; font-weight: 900; letter-spacing: .05em; line-height: 1.1; }
.ht-score { font-size: 11px; color: #cbd5e1; font-variant-numeric: tabular-nums; }
.fx .ht { border-radius: inherit; }
.fx .ht b { font-size: 26px; }
.fx .ht-clubs { font-size: 14px; }
.fx .ht-clubs .flag { width: 15px; height: 22px; }
.fx .ht-score { font-size: 13px; }
@media (prefers-reduced-motion: reduce) { .ht, .ht::before { animation: none; } }