.supporter-match-dock{z-index:58;right:max(1rem, env(safe-area-inset-right));bottom:max(1rem, env(safe-area-inset-bottom));border:1px solid color-mix(in srgb, var(--gold) 28%, var(--border));background:radial-gradient(circle at 84% 5%, color-mix(in srgb, var(--gold) 14%, transparent), transparent 40%), linear-gradient(145deg, color-mix(in srgb, var(--card) 96%, #07150e), color-mix(in srgb, var(--card) 88%, #020805));-webkit-backdrop-filter:blur(18px)saturate(1.12);backdrop-filter:blur(18px)saturate(1.12);border-radius:1rem;width:min(28rem,100vw - 2rem);animation:.46s cubic-bezier(.2,.85,.3,1) both supporter-dock-enter;position:fixed;overflow:hidden;box-shadow:0 1.25rem 4rem #00000061,inset 0 1px #ffffff0d}.supporter-match-dock:before{content:"";background:linear-gradient(90deg, transparent, var(--gold), var(--green), transparent);opacity:.8;width:100%;height:2px;position:absolute;inset:0 auto auto 0}.supporter-match-dock.is-live{border-color:color-mix(in srgb, var(--green) 58%, var(--gold));box-shadow:0 1.25rem 4rem #0000006b, 0 0 2.5rem color-mix(in srgb, var(--green) 18%, transparent)}.supporter-match-dock.is-live:after{content:"";pointer-events:none;background:linear-gradient(110deg,#0000 20%,#ffffff0a 45%,#0000 70%);animation:5.5s ease-in-out infinite supporter-live-sweep;position:absolute;inset:0;transform:translate(-120%)}.supporter-match-dock.is-final{border-color:color-mix(in srgb, var(--gold) 45%, var(--border))}.supporter-dock-close{z-index:2;width:2rem;height:2rem;color:var(--muted-foreground);border:1px solid #0000;border-radius:999px;place-items:center;transition:border-color .16s,color .16s,background .16s;display:grid;position:absolute;top:.55rem;right:.55rem}.supporter-dock-close:hover,.supporter-dock-close:focus-visible{border-color:var(--border);color:var(--foreground);background:#ffffff0d}.supporter-dock-kicker{border-bottom:1px solid var(--border);min-height:2.8rem;color:var(--muted-foreground);letter-spacing:.12em;text-transform:uppercase;align-items:center;gap:.45rem;padding:.7rem 3rem .6rem 1rem;font-size:.67rem;font-weight:800;display:flex}.supporter-dock-kicker svg{color:var(--gold)}.supporter-match-dock.is-live .supporter-dock-kicker svg{color:var(--green);filter:drop-shadow(0 0 .45rem color-mix(in srgb, var(--green) 45%, transparent));animation:1.55s ease-in-out infinite supporter-live-pulse}.supporter-dock-kicker strong{color:var(--foreground);letter-spacing:.04em;margin-left:auto}.supporter-dock-match{grid-template-columns:minmax(0,1fr) minmax(7rem,auto) minmax(0,1fr);align-items:center;gap:.6rem;padding:1rem;display:grid}.supporter-dock-team{min-width:0;color:var(--muted-foreground);align-items:center;gap:.55rem;font-size:.76rem;transition:color .18s,transform .18s;display:flex}.supporter-dock-team strong{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.supporter-dock-team.is-away{text-align:right;flex-direction:row-reverse}.supporter-dock-team.is-favourite{color:var(--foreground)}.supporter-dock-team.is-favourite .team-badge{box-shadow:0 0 0 2px color-mix(in srgb, var(--gold) 48%, transparent), 0 .4rem 1rem #0003}.supporter-dock-score{text-align:center;min-width:0}.supporter-dock-score>strong,.supporter-dock-score>span{font-family:var(--font-display,inherit);font-variant-numeric:tabular-nums;letter-spacing:-.04em;font-size:clamp(1.85rem,5vw,2.65rem);font-weight:900;line-height:.95;display:block}.supporter-dock-score small{color:var(--muted-foreground);text-overflow:ellipsis;white-space:nowrap;margin-top:.4rem;font-size:.62rem;line-height:1.35;display:block;overflow:hidden}.supporter-dock-actions{grid-template-columns:1fr auto;gap:.55rem;padding:0 1rem 1rem;display:grid}.supporter-dock-primary,.supporter-dock-secondary{border-radius:.55rem;justify-content:center;align-items:center;min-height:2.65rem;padding:.65rem .85rem;font-size:.73rem;font-weight:850;transition:transform .16s,border-color .16s,background .16s,box-shadow .16s;display:inline-flex}.supporter-dock-primary{border:1px solid color-mix(in srgb, var(--gold) 55%, transparent);color:#07120d;background:linear-gradient(135deg, var(--gold), color-mix(in srgb, var(--gold) 70%, white));box-shadow:0 .55rem 1.6rem color-mix(in srgb, var(--gold) 15%, transparent)}.is-live .supporter-dock-primary{border-color:color-mix(in srgb, var(--green) 72%, white);color:#fff;background:linear-gradient(135deg, color-mix(in srgb, var(--green) 80%, #06351d), var(--green));box-shadow:0 .55rem 1.8rem color-mix(in srgb, var(--green) 20%, transparent)}.supporter-dock-secondary{border:1px solid var(--border);color:var(--foreground);background:#ffffff09}.supporter-dock-primary:hover,.supporter-dock-primary:focus-visible,.supporter-dock-secondary:hover,.supporter-dock-secondary:focus-visible{transform:translateY(-1px)}.supporter-dock-secondary:hover,.supporter-dock-secondary:focus-visible{border-color:color-mix(in srgb, var(--gold) 42%, var(--border));background:#ffffff0f}@keyframes supporter-dock-enter{0%{opacity:0;transform:translateY(1.1rem)scale(.97)}to{opacity:1;transform:translate(0)scale(1)}}@keyframes supporter-live-sweep{0%,68%{transform:translate(-120%)}88%,to{transform:translate(120%)}}@keyframes supporter-live-pulse{0%,to{opacity:.72;transform:scale(.92)}50%{opacity:1;transform:scale(1.08)}}@media (width<=767px){.supporter-match-dock{right:.7rem;bottom:calc(5.45rem + env(safe-area-inset-bottom));border-radius:.85rem;width:calc(100vw - 1.4rem)}.supporter-dock-match{grid-template-columns:minmax(0,1fr) minmax(5.8rem,auto) minmax(0,1fr);padding:.85rem}.supporter-dock-team{text-align:center;flex-direction:column;gap:.3rem}.supporter-dock-team.is-away{text-align:center;flex-direction:column}.supporter-dock-team strong{max-width:6.3rem}.supporter-dock-actions{padding:0 .85rem .85rem}}@media (prefers-reduced-motion:reduce){.supporter-match-dock,.supporter-match-dock:after,.supporter-match-dock.is-live .supporter-dock-kicker svg{animation:none!important}.supporter-dock-primary,.supporter-dock-secondary,.supporter-dock-team{transition:none!important}}html[data-low-data=true] .supporter-match-dock{-webkit-backdrop-filter:none;backdrop-filter:none}html[data-low-data=true] .supporter-match-dock:after,html[data-low-data=true] .supporter-match-dock.is-live .supporter-dock-kicker svg{animation:none!important}
