/* A quiet match preview, anchored in the space beside the competition rails. */
.match-hover[hidden] { display:none !important; }
.match-hover {
  position:fixed; inset:auto; margin:0; padding:0; width:332px; max-width:calc(100vw - 24px);
  max-height:calc(100dvh - 24px); border:1px solid rgba(226,233,239,.12); border-radius:14px;
  background:rgba(24,33,41,.98); color:#eeede8; box-shadow:0 12px 40px #0005;
  font:14px/1.5 var(--ui-font,system-ui,sans-serif); z-index:1400; overflow:hidden;
  box-sizing:border-box; display:grid; grid-template-rows:auto minmax(0,1fr) auto;
  opacity:0; transform:translateX(var(--match-hover-offset,-4px));
  transition:opacity 140ms var(--ui-ease-out,cubic-bezier(.23,1,.32,1)),transform 140ms var(--ui-ease-out,cubic-bezier(.23,1,.32,1));
}
.match-hover[data-open=true] { opacity:1; transform:translateX(0); }
.match-hover[data-instant=true] { transition:none; }
.match-hover::backdrop { background:transparent; pointer-events:none; }
.match-hover-head { display:flex; gap:12px; align-items:flex-start; padding:15px 16px 12px; }
.match-hover-heading { display:none; }
.match-hover-head { justify-content:flex-end; }
.match-hover h2 { margin:0; font:600 16px/1.4 var(--ui-font,system-ui,sans-serif); letter-spacing:0; text-wrap:balance; }
.match-hover-meta { margin:5px 0 0; font-size:12px; line-height:1.4; color:#a3aeb9; }
.match-hover-close { display:grid; place-items:center; width:28px; height:28px; padding:0; margin:-3px -5px 0 0; flex:none; border:0; border-radius:7px; background:transparent; color:#aeb8c3; cursor:pointer; }
.match-hover-close svg { width:15px; height:15px; }
.match-hover-body { min-height:0; max-height:none; overflow:auto; overscroll-behavior:contain; scrollbar-width:thin; scrollbar-color:#6b798750 transparent; padding:0 16px 5px; }
.match-hover-columns { display:grid; grid-template-columns:minmax(0,1fr) 55px 70px; gap:12px; padding:9px 0 7px; border-top:1px solid #e2e9ef12; font-size:12px; color:#9faab6; }
.match-hover-columns span:first-child { color:#c9b486; font-weight:500; }
.match-hover-columns span:not(:first-child) { text-align:right; }
.match-hover-group + .match-hover-group { margin-top:13px; }
.match-hover-group h3 { margin:10px 0 4px; font-size:12px; line-height:1.5; font-weight:500; color:#aeb9c6; }
.match-hover-list { list-style:none; margin:0; padding:0; }
.match-hover-line { display:grid; grid-template-columns:minmax(0,1fr) 55px 70px; gap:12px; align-items:baseline; min-height:30px; padding:5px 0; font-variant-numeric:tabular-nums; }
.match-hover-line > :first-child { color:#e7e8e8; font-size:14px; }
.match-hover-odds { font-size:14px; text-align:right; color:#bec8d2; }
.match-hover-odds { font-family:"DM Sans","Avenir Next","Segoe UI Variable",sans-serif; font-variant-numeric:tabular-nums; }
.match-hover-kelly { font-size:14px; font-weight:500; text-align:right; color:#dfc69a; }
.match-hover-message { margin:0; padding:19px 0 23px; font-size:14px; line-height:1.7; color:#bac5d0; }
.match-hover-partial { margin:12px 0 6px; font-size:12px; line-height:1.5; color:#a8b3bf; }
.match-hover-foot { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:10px 16px 12px; color:#929fab; font-size:12px; line-height:1.4; }
.match-hover-foot:empty { display:none; }
.match-hover-retry { min-height:32px; margin:0 0 12px; padding:5px 12px; border:1px solid #e2e9ef1c; border-radius:8px; background:#ffffff06; color:#eee9df; font:inherit; font-size:13px; cursor:pointer; }
.match-hover :is(button,[tabindex]):focus-visible { outline:2px solid #d2b781; outline-offset:2px; }
.match-hover-body:focus { outline:none; }
@media (hover:hover) and (pointer:fine) {
  .match-hover-close:hover,.match-hover-retry:hover { color:#f1ede4; background:#ffffff0a; }
}
@media (prefers-reduced-motion:reduce) { .match-hover,.match-hover[data-open=true] { transition:none; transform:none; } }
@media (max-width:800px) { .match-hover { display:none !important; } }
@media (min-width:801px) {
  .match-hover { width:350px;border-radius:22px;background:linear-gradient(135deg,rgba(53,67,80,.62),rgba(18,28,40,.8));border-color:rgba(226,242,255,.18);backdrop-filter:blur(24px) saturate(1.2);box-shadow:inset 0 1px rgba(255,255,255,.14),0 18px 44px #0004; }
  .match-hover-head { padding:20px 20px 14px; }
  .match-hover h2 { font-size:18px;font-weight:500; }
  .match-hover-meta,.match-hover-columns,.match-hover-group h3,.match-hover-partial,.match-hover-foot { font-size:14px; }
  .match-hover-body { padding:0 20px 8px; }
  .match-hover-line { grid-template-columns:minmax(0,1fr) 66px;gap:10px; }
  .match-hover-line>:first-child,.match-hover-odds { font-size:16px; }
  .match-hover-foot { padding:10px 20px 16px; }
}
