/* AE League matchmaking screen (/matchmaking). A standalone page: it loads this file and nothing else, and every
   selector carries the mm- prefix so nothing here can ever meet league.css. Colours are the league's own:
   gold for the league, and the three faction colours for the sides. */
html,body{margin:0;padding:0}
.mm{--mm-red:#FA503E;--mm-green:#1DD65C;--mm-blue:#4CB1EF;--mm-gold:#c9a227;--mm-gold2:#e8c34a;--mm-ink:#eceef0;--mm-ink2:#b6bcc3;--mm-ink3:#7e878f;--mm-bg:#08090a;--mm-panel:rgba(16,18,21,.9);--mm-line:rgba(255,255,255,.1);
  --mm-fd:'Barlow Condensed','Barlow',system-ui,sans-serif;--mm-ff:'Barlow',system-ui,sans-serif;--mm-fm:'JetBrains Mono',ui-monospace,Consolas,monospace;
  background:var(--mm-bg);color:var(--mm-ink);font:500 16px/1.4 var(--mm-ff);-webkit-font-smoothing:antialiased;min-height:100vh;overflow-x:hidden}
.mm *{box-sizing:border-box}
.mm a{color:inherit}
.mm img{max-width:100%}

/* the ground: a slow grid, scanlines and a vignette, all behind the page */
.mm::before{content:'';position:fixed;inset:-48px;z-index:0;pointer-events:none;
  background:linear-gradient(rgba(255,255,255,.03) 1px,transparent 1px) 0 0/48px 48px,linear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px) 0 0/48px 48px;
  animation:mm-drift 26s linear infinite}
.mm::after{content:'';position:fixed;inset:0;z-index:0;pointer-events:none;
  background:repeating-linear-gradient(0deg,rgba(0,0,0,.2) 0 1px,transparent 1px 3px),radial-gradient(ellipse at center,transparent 52%,rgba(0,0,0,.62) 100%)}

.mm-app{position:relative;z-index:1;min-height:100vh;min-height:100dvh;display:grid;grid-template-rows:auto 1fr auto;
  background:radial-gradient(1200px 520px at 50% -10%,rgba(201,162,39,.14),transparent 70%)}

/* ---- first paint ---- */
.mm-boot{grid-row:1/-1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;min-height:100vh;text-align:center}
.mm-boot img{opacity:.9;animation:mm-breathe 2s ease-in-out infinite}
.mm-boot b{font:800 28px/1 var(--mm-fd);letter-spacing:.14em}
.mm-boot i{font:700 12px/1 var(--mm-fd);font-style:normal;letter-spacing:.28em;text-transform:uppercase;color:var(--mm-ink3)}
.mm-boot-bar{position:relative;width:200px;height:2px;margin-top:8px;background:var(--mm-line);overflow:hidden}
.mm-boot-bar::after{content:'';position:absolute;top:0;bottom:0;left:0;width:40%;background:var(--mm-gold2);animation:mm-load 1.2s ease-in-out infinite}
.mm-nojs{position:relative;z-index:2;margin:0;padding:24px;text-align:center;color:var(--mm-ink2)}

/* ---- top bar ---- */
.mm-head{position:relative;z-index:3}
.mm-top{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:16px;padding:12px 24px;border-bottom:1px solid var(--mm-line);background:rgba(8,9,10,.72)}
.mm-brand{display:inline-flex;align-items:center;gap:12px;text-decoration:none;justify-self:start}
.mm-brand img{width:28px;height:28px;object-fit:contain}
.mm-brand b{font:800 20px/1 var(--mm-fd);letter-spacing:.08em;white-space:nowrap}
.mm-brand i{font:700 12px/1 var(--mm-fd);font-style:normal;letter-spacing:.28em;color:var(--mm-gold2);padding-left:12px;border-left:1px solid var(--mm-line)}
.mm-night{display:flex;align-items:center;gap:12px;font:700 14px/1 var(--mm-fd);letter-spacing:.16em;white-space:nowrap}
.mm-ph{display:inline-flex;align-items:center;gap:8px;padding:6px 10px;border:1px solid var(--mm-line);border-radius:2px;font:700 11px/1 var(--mm-fd);letter-spacing:.2em;color:var(--mm-ink3)}
.mm-ph i{width:6px;height:6px;border-radius:50%;background:currentColor}
.mm-ph-open{color:#2fbf6b;border-color:rgba(47,191,107,.5)}
.mm-ph-open i{animation:mm-pulse 1.4s infinite}
.mm-ph-countdown,.mm-ph-demo{color:var(--mm-gold2);border-color:rgba(201,162,39,.5)}
.mm-ph-warn{color:var(--mm-red);border-color:rgba(250,80,62,.5)}
.mm-tools{display:flex;align-items:center;gap:12px;justify-self:end}
.mm-et{font:500 13px/1 var(--mm-fm);color:var(--mm-ink2);white-space:nowrap}
.mm-chip{display:inline-flex;align-items:center;padding:8px 10px;border:1px solid var(--mm-line);border-radius:2px;background:transparent;color:var(--mm-ink2);font:700 11px/1 var(--mm-fd);letter-spacing:.2em;text-transform:uppercase;text-decoration:none;cursor:pointer;white-space:nowrap}
.mm-chip:hover,.mm-chip:focus-visible{border-color:var(--mm-gold2);color:var(--mm-gold2);outline:none}
.mm-chip[aria-pressed=true]{border-color:rgba(201,162,39,.6);color:var(--mm-gold2)}

/* the rehearsal strip, only with ?demo=1 */
.mm-demo{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:8px;padding:8px 16px;background:rgba(201,162,39,.09);border-bottom:1px solid rgba(201,162,39,.35)}
.mm-demo>span{font:700 11px/1 var(--mm-fd);letter-spacing:.2em;text-transform:uppercase;color:var(--mm-gold2);margin-right:8px}
.mm-demo button{padding:6px 10px;border:1px solid var(--mm-line);border-radius:2px;background:rgba(8,9,10,.6);color:var(--mm-ink2);font:700 11px/1 var(--mm-fd);letter-spacing:.14em;text-transform:uppercase;cursor:pointer}
.mm-demo button:hover{color:var(--mm-ink);border-color:var(--mm-ink3)}
.mm-demo button.is-on{background:var(--mm-gold);border-color:var(--mm-gold);color:#0a0b09}

/* ---- the stage ---- */
.mm-stage{position:relative;display:flex;align-items:center;justify-content:center;padding:24px;min-width:0}
.mm-scene{width:100%;max-width:1240px;margin:0 auto}
.mm-kicker{display:block;font:700 13px/1.2 var(--mm-fd);letter-spacing:.28em;text-transform:uppercase;color:var(--mm-gold2)}
.mm-title{margin:12px 0 0;font:800 clamp(40px,7vw,96px)/.92 var(--mm-fd);letter-spacing:.01em;text-transform:uppercase}
.mm-sub{margin:16px 0 0;max-width:62ch;color:var(--mm-ink2);font-size:17px}
.mm-note{margin:16px 0 0;color:var(--mm-ink3);font-size:14px}
.mm-center{text-align:center}
.mm-center .mm-sub,.mm-center .mm-note{margin-left:auto;margin-right:auto}
.mm-acts{display:flex;flex-wrap:wrap;gap:12px;margin-top:24px}
.mm-center .mm-acts,.mm-s-versus .mm-acts,.mm-s-live .mm-acts{justify-content:center}
.mm-btn{display:inline-flex;align-items:center;gap:8px;padding:12px 18px;border:1px solid var(--mm-line);border-radius:4px;background:rgba(255,255,255,.04);color:var(--mm-ink);font:700 13px/1 var(--mm-fd);letter-spacing:.18em;text-transform:uppercase;text-decoration:none;cursor:pointer}
.mm-btn:hover,.mm-btn:focus-visible{border-color:var(--mm-gold2);color:var(--mm-gold2);outline:none}
.mm-btn.is-gold{background:var(--mm-gold);border-color:var(--mm-gold);color:#0a0b09}
.mm-btn.is-gold:hover,.mm-btn.is-gold:focus-visible{background:var(--mm-gold2);border-color:var(--mm-gold2);color:#0a0b09}

.mm-pill{display:inline-flex;align-items:center;gap:6px;padding:5px 8px;border:1px solid var(--mm-line);border-radius:2px;font:700 10px/1 var(--mm-fd);letter-spacing:.18em;text-transform:uppercase;color:var(--mm-ink3);white-space:nowrap}
.mm-pill i{width:6px;height:6px;border-radius:50%;background:currentColor}
.mm-pill.st-live{color:#2fbf6b;border-color:rgba(47,191,107,.5)}
.mm-pill.st-live i{animation:mm-pulse 1.4s infinite}
.mm-pill.st-lobby,.mm-pill.st-prep{color:var(--mm-gold2);border-color:rgba(201,162,39,.5)}
.mm-pill.st-lobby i{animation:mm-pulse 1.4s infinite}

/* crests and names */
.mm-crest{display:inline-flex;align-items:center;justify-content:center;flex:none;width:64px;height:64px}
.mm-crest img{width:100%;height:100%;object-fit:contain}
.mm-crest-d{border:1px solid var(--mm-line);border-radius:6px;background:rgba(255,255,255,.04)}
.mm-crest-d img{width:56%;height:56%;opacity:.78}
.mm-tag{display:inline-block;margin-right:8px;padding:2px 6px;border:1px solid var(--mm-line);border-radius:2px;font:500 .5em/1.3 var(--mm-fm);font-style:normal;letter-spacing:.04em;color:var(--mm-ink2);vertical-align:middle}

/* ---- waiting for doors ---- */
.mm-seg{display:inline-flex;gap:12px;margin-top:24px}
.mm-seg span{min-width:clamp(68px,11vw,148px);padding:16px 8px 12px;background:var(--mm-panel);border:1px solid var(--mm-line);border-radius:6px;text-align:center}
.mm-seg b{display:block;font:500 clamp(38px,7.4vw,104px)/1 var(--mm-fm);letter-spacing:-.04em;font-variant-numeric:tabular-nums}
.mm-seg i{display:block;margin-top:8px;font:700 11px/1 var(--mm-fd);font-style:normal;letter-spacing:.24em;color:var(--mm-ink3)}
.mm-seg span:last-child b{color:var(--mm-gold2)}
.mm-mine{display:flex;align-items:center;gap:16px;max-width:580px;margin:32px auto 0;padding:16px 20px;background:var(--mm-panel);border:1px solid rgba(201,162,39,.45);border-radius:6px;text-align:left}
.mm-mine h3{margin:6px 0 0;font:800 28px/1.05 var(--mm-fd);text-transform:uppercase}
.mm-mine p{margin:6px 0 0;color:var(--mm-ink2);font-size:14px}
.mm-mine .mm-btn{margin-left:auto;flex:none}
.mm-field{position:relative;margin:32px auto 0;max-width:980px;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent)}
.mm-field-in{display:inline-flex;gap:32px;white-space:nowrap;animation:mm-roll 40s linear infinite}
.mm-field-in span{font:700 16px/1 var(--mm-fd);letter-spacing:.08em;text-transform:uppercase;color:var(--mm-ink3)}
.mm-field-h{margin:32px 0 -20px;font:700 11px/1 var(--mm-fd);letter-spacing:.24em;text-transform:uppercase;color:var(--mm-ink3)}

/* ---- in the queue ---- */
.mm-search{display:grid;grid-template-columns:minmax(260px,420px) 1fr;align-items:center;gap:clamp(24px,5vw,72px)}
.mm-radar{position:relative;width:100%;aspect-ratio:1;border-radius:50%;border:1px solid rgba(201,162,39,.45);overflow:hidden;
  background:linear-gradient(rgba(201,162,39,.16),rgba(201,162,39,.16)) 50% 0/1px 100% no-repeat,linear-gradient(rgba(201,162,39,.16),rgba(201,162,39,.16)) 0 50%/100% 1px no-repeat,
  radial-gradient(circle closest-side,transparent 0 32.6%,rgba(201,162,39,.2) 32.6% 33.2%,transparent 33.2% 65.9%,rgba(201,162,39,.2) 65.9% 66.5%,transparent 66.5%),
  radial-gradient(circle closest-side,rgba(201,162,39,.1),rgba(8,9,10,.92))}
.mm-radar::before{content:'';position:absolute;inset:0;border-radius:50%;background:conic-gradient(from 0deg,transparent 0 76%,rgba(232,195,74,.04) 80%,rgba(232,195,74,.5) 100%);animation:mm-sweep 4s linear infinite}
.mm-radar::after{content:'';position:absolute;left:50%;top:50%;width:8px;height:8px;margin:-4px;border-radius:50%;background:var(--mm-gold2);box-shadow:0 0 16px var(--mm-gold2)}
.mm-blip{position:absolute;width:8px;height:8px;margin:-4px;border-radius:50%;background:var(--mm-gold2);opacity:.28;animation:mm-ping 4s linear infinite;animation-delay:calc(var(--mm-a) * 4s - 4s)}
.mm-blip i{position:absolute;left:12px;top:-3px;font:500 10px/1 var(--mm-fm);font-style:normal;color:var(--mm-ink2);white-space:nowrap}
.mm-blip.is-mine{width:12px;height:12px;margin:-6px;background:#fff;opacity:1;animation:none;box-shadow:0 0 0 3px rgba(232,195,74,.5),0 0 22px #fff}
.mm-blip.is-mine i{left:16px;top:0;color:#fff;font-weight:700}
.mm-scan{display:flex;align-items:center;gap:12px;margin-top:20px;padding:12px 16px;background:var(--mm-panel);border:1px solid var(--mm-line);border-left:3px solid var(--mm-gold);border-radius:4px;min-height:52px;overflow:hidden}
.mm-scan>span{flex:none;font:700 11px/1 var(--mm-fd);letter-spacing:.22em;color:var(--mm-gold2)}
.mm-scan>div{font:700 20px/1.2 var(--mm-fd);text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

.mm-cells{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px;margin-top:24px}
.mm-cell{position:relative;padding:14px 16px;background:var(--mm-panel);border:1px solid var(--mm-line);border-radius:6px;min-width:0;text-align:left}
.mm-cell>span{display:block;font:700 11px/1 var(--mm-fd);letter-spacing:.22em;text-transform:uppercase;color:var(--mm-ink3)}
.mm-cell>b{display:block;margin-top:8px;font:500 30px/1.05 var(--mm-fm);letter-spacing:-.02em;font-variant-numeric:tabular-nums;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mm-cell>b.mm-t{font:700 26px/1.2 var(--mm-fd);letter-spacing:.02em;text-transform:uppercase}
.mm-cell>b small{font-size:.55em;color:var(--mm-ink3);letter-spacing:0}
.mm-cell>i{display:block;margin-top:6px;font:500 12px/1.3 var(--mm-fm);font-style:normal;color:var(--mm-ink3)}
.mm-cell.is-go{border-color:rgba(201,162,39,.65);box-shadow:0 0 32px rgba(201,162,39,.12)}
.mm-cell.is-go>b{color:var(--mm-gold2)}
.mm-cell.is-dim>b{color:var(--mm-ink3)}
.mm-cell .mm-chip{position:absolute;right:12px;top:10px;padding:6px 8px}
.mm-sel{-webkit-user-select:all;user-select:all}
.mm-cells-1{max-width:420px;margin-left:auto;margin-right:auto}

/* ---- the plates: one per side ---- */
.mm-vs-h{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.mm-vs-h .mm-kicker{font-size:15px}
.mm-plates{display:grid;align-items:stretch;margin-top:20px}
.mm-plates.mm-n3{grid-template-columns:1fr auto 1fr auto 1fr}
.mm-plates.mm-n2{grid-template-columns:1fr auto 1fr}
.mm-plates.mm-n1{grid-template-columns:minmax(0,420px);justify-content:center}
.mm-plate{--mm-c:var(--mm-ink3);position:relative;overflow:hidden;display:flex;flex-direction:column;align-items:center;gap:12px;min-width:0;min-height:clamp(250px,36vh,390px);padding:16px 16px 24px;border-radius:6px;text-align:center;
  background:rgba(14,16,18,.92);border:1px solid var(--mm-line);border-top:4px solid var(--mm-c)}
.mm-plate{background:linear-gradient(180deg,color-mix(in srgb,var(--mm-c) 24%,transparent),rgba(12,14,16,.94) 64%);border-color:color-mix(in srgb,var(--mm-c) 42%,transparent);border-top-color:var(--mm-c)}
.mm-plate::before{content:'';position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(-45deg,rgba(255,255,255,.035) 0 2px,transparent 2px 14px)}
.mm-f-red{--mm-c:var(--mm-red)}.mm-f-green{--mm-c:var(--mm-green)}.mm-f-blue{--mm-c:var(--mm-blue)}
.mm-plate-em{position:absolute;right:-16%;bottom:-14%;width:72%;opacity:.07;pointer-events:none}
.mm-plate-top{position:relative;display:flex;align-items:center;justify-content:space-between;gap:8px;width:100%;min-height:24px}
.mm-fac{font:700 12px/1 var(--mm-fd);letter-spacing:.22em;color:var(--mm-c)}
.mm-you{padding:4px 8px;border-radius:2px;background:var(--mm-gold2);color:#0a0b09;font:800 11px/1 var(--mm-fd);letter-spacing:.2em}
.mm-plate .mm-crest{position:relative;width:clamp(84px,10vw,128px);height:clamp(84px,10vw,128px);margin-top:auto}
.mm-plate-name{position:relative;max-width:100%}
.mm-plate-name b{display:block;font:800 clamp(24px,3vw,40px)/1 var(--mm-fd);text-transform:uppercase;overflow-wrap:anywhere}
.mm-plate-name .mm-tag{margin:0 0 8px;font-size:13px}
.mm-plate-foot{position:relative;display:flex;flex-direction:column;align-items:center;gap:4px;margin-bottom:auto;min-height:24px}
.mm-rate,.mm-pres,.mm-kd{font:500 13px/1 var(--mm-fm);color:var(--mm-ink3)}
.mm-rate b,.mm-pres b{color:var(--mm-ink)}
.mm-score{font:500 clamp(56px,8vw,112px)/1 var(--mm-fm);letter-spacing:-.04em;font-variant-numeric:tabular-nums;color:var(--mm-c)}
.mm-plate.is-mine{box-shadow:0 0 0 1px var(--mm-gold2),0 0 44px rgba(201,162,39,.16)}
.mm-plate.is-win::after{content:'WINNER';position:absolute;left:0;right:0;bottom:0;padding:6px;background:var(--mm-gold2);color:#0a0b09;font:800 12px/1 var(--mm-fd);letter-spacing:.24em}
.mm-v{position:relative;z-index:2;display:flex;align-items:center;justify-content:center;width:56px;margin:0 -14px}
.mm-v b{display:flex;align-items:center;justify-content:center;width:56px;height:56px;border-radius:50%;background:var(--mm-bg);border:2px solid var(--mm-gold2);color:var(--mm-gold2);font:800 26px/1 var(--mm-fd);box-shadow:0 0 24px rgba(201,162,39,.35)}
.mm-stake{margin:16px 0 0;font:600 15px/1.4 var(--mm-ff);color:var(--mm-ink2);text-align:center}

/* ---- the draw ---- */
.mm-s-draw .mm-found,.mm-s-draw .mm-roll,.mm-s-draw .mm-reels{display:none}
.mm-s-draw[data-step=found] .mm-found{display:flex}
.mm-s-draw[data-step=roll] .mm-roll,.mm-s-draw[data-step=reels] .mm-reels{display:block}
.mm-found{flex-direction:column;align-items:center;justify-content:center;gap:12px;min-height:46vh;text-align:center}
.mm-found b{font:800 clamp(56px,11vw,168px)/.9 var(--mm-fd);letter-spacing:.02em;text-shadow:0 0 60px rgba(232,195,74,.45);animation:mm-slam .5s cubic-bezier(.2,1.5,.3,1) both}
.mm-found i{font:700 14px/1 var(--mm-fd);font-style:normal;letter-spacing:.28em;text-transform:uppercase;color:var(--mm-ink2);animation:mm-fade .5s .35s both}
.mm-found .mm-kicker{animation:mm-fade .4s both}
.mm-flash{position:fixed;inset:0;z-index:6;pointer-events:none;background:var(--mm-gold2);opacity:0;animation:mm-flash .7s ease-out}
.mm-roll{animation:mm-fade .35s both}
.mm-reels{animation:mm-fade .35s both}
.mm-plate.is-spin{--mm-c:var(--mm-ink3)}
.mm-plate.is-spin>*:not(.mm-reel):not(.mm-spin-k){visibility:hidden}
.mm-spin-k{display:none;position:absolute;left:0;right:0;top:20px;font:700 12px/1 var(--mm-fd);letter-spacing:.24em;color:var(--mm-ink3)}
.mm-plate.is-spin .mm-spin-k{display:block;animation:mm-breathe 1s ease-in-out infinite}
.mm-reel{display:none;position:absolute;left:0;right:0;top:50%;height:72px;margin-top:-36px;overflow:hidden;-webkit-mask-image:linear-gradient(transparent,#000 32%,#000 68%,transparent);mask-image:linear-gradient(transparent,#000 32%,#000 68%,transparent)}
.mm-plate.is-spin .mm-reel{display:block}
.mm-reel-strip{will-change:transform}
.mm-reel-strip span{display:flex;align-items:center;justify-content:center;height:72px;padding:0 12px;font:800 clamp(20px,2.6vw,32px)/1 var(--mm-fd);text-transform:uppercase;white-space:nowrap;color:var(--mm-ink2)}
.mm-plate.is-lock{animation:mm-lock .7s cubic-bezier(.2,.8,.2,1)}
.mm-reels .mm-v b{opacity:0;transform:scale(.2)}
.mm-reels .is-vs .mm-v b{animation:mm-stamp .5s cubic-bezier(.2,1.5,.3,1) forwards}
.mm-reels .is-vs .mm-v+.mm-plate+.mm-v b{animation-delay:.18s}

/* ---- your team ---- */
.mm-lu-h{display:flex;align-items:center;gap:20px}
.mm-lu-h .mm-crest{width:88px;height:88px}
.mm-lu-h h2{margin:8px 0 0;font:800 clamp(30px,4.4vw,56px)/1 var(--mm-fd);text-transform:uppercase}
.mm-lu-h p{margin:8px 0 0;color:var(--mm-ink2);font:500 14px/1.3 var(--mm-fm)}
.mm-lu-g{list-style:none;margin:20px 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(176px,1fr));gap:8px}
.mm-lu-g li{display:flex;align-items:center;gap:10px;min-width:0;padding:8px 10px;background:var(--mm-panel);border:1px solid var(--mm-line);border-radius:4px}
.mm-lu-g img{flex:none;width:28px;height:28px;border-radius:3px;object-fit:cover}
.mm-lu-g img.mm-av-d{object-fit:contain;padding:5px;background:rgba(255,255,255,.05);opacity:.8}
.mm-lu-g span{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font:600 14px/1.2 var(--mm-ff)}
.mm-lu-g em{flex:none;padding:3px 5px;border:1px solid rgba(201,162,39,.45);border-radius:2px;font:700 10px/1 var(--mm-fd);font-style:normal;letter-spacing:.14em;color:var(--mm-gold2)}
.mm-lu-g .is-bench{opacity:.45}
.mm-lu-g .is-bench em{border-color:var(--mm-line);color:var(--mm-ink3)}

/* ---- tonight's draw, for anyone watching ---- */
.mm-board{display:grid;grid-template-columns:1fr minmax(240px,320px);align-items:start;gap:24px}
.mm-board h2{margin:8px 0 0;font:800 clamp(30px,4vw,52px)/1 var(--mm-fd);text-transform:uppercase}
.mm-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:12px;margin-top:20px}
.mm-card{display:block;background:var(--mm-panel);border:1px solid var(--mm-line);border-radius:6px;overflow:hidden;text-decoration:none}
.mm-card:hover,.mm-card:focus-visible{border-color:rgba(201,162,39,.55);outline:none}
.mm-card-h,.mm-card-f{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:10px 12px;font:700 11px/1 var(--mm-fd);letter-spacing:.18em;text-transform:uppercase;color:var(--mm-ink3)}
.mm-card-f{font:500 11px/1.3 var(--mm-fm);letter-spacing:0;text-transform:none;border-top:1px solid var(--mm-line)}
.mm-row{--mm-c:var(--mm-ink3);display:flex;align-items:center;gap:10px;padding:8px 12px;border-top:1px solid var(--mm-line);border-left:3px solid var(--mm-c);min-width:0}
.mm-row .mm-crest{width:28px;height:28px}
.mm-row-n{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font:700 18px/1.1 var(--mm-fd);text-transform:uppercase}
.mm-row-n b{font-weight:700}
.mm-row-s{flex:none;font:700 12px/1 var(--mm-fd);letter-spacing:.14em;color:var(--mm-c)}
.mm-card.st-live .mm-row-s,.mm-card.st-finished .mm-row-s{font:500 20px/1 var(--mm-fm);letter-spacing:-.02em}
.mm-row.is-mine{background:rgba(201,162,39,.1)}
.mm-row.is-win .mm-row-n{color:var(--mm-gold2)}
.mm-card.is-fresh{animation:mm-deal .6s calc(var(--mm-i) * 320ms + 200ms) cubic-bezier(.2,.9,.2,1) both}
.mm-empty{margin-top:20px;padding:20px;border:1px dashed var(--mm-line);border-radius:6px;color:var(--mm-ink3)}
.mm-q{background:var(--mm-panel);border:1px solid var(--mm-line);border-radius:6px;overflow:hidden}
.mm-q-h{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:12px;border-bottom:1px solid var(--mm-line);font:700 11px/1 var(--mm-fd);letter-spacing:.2em;text-transform:uppercase;color:var(--mm-gold2)}
.mm-q-h b{font:500 13px/1 var(--mm-fm);letter-spacing:0;color:var(--mm-ink)}
.mm-q ol{list-style:none;margin:0;padding:0;max-height:46vh;overflow:auto}
.mm-q li{display:flex;align-items:center;gap:10px;padding:8px 12px;border-top:1px solid var(--mm-line);font:700 16px/1.1 var(--mm-fd);text-transform:uppercase;min-width:0}
.mm-q li:first-child{border-top:0}
.mm-q li>i{flex:none;width:22px;font:500 12px/1 var(--mm-fm);font-style:normal;color:var(--mm-ink3)}
.mm-q li>span{flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mm-q li>em{flex:none;font:500 10px/1 var(--mm-fm);font-style:normal;text-transform:none;color:var(--mm-ink3)}
.mm-q li.is-in{box-shadow:inset 3px 0 0 var(--mm-gold)}
.mm-q li.is-mine{background:rgba(201,162,39,.12)}
.mm-q p{margin:0;padding:12px;color:var(--mm-ink3);font-size:13px}

/* ---- results ---- */
.mm-res .mm-crest{width:112px;height:112px;margin:0 auto 20px}
.mm-res-advance .mm-title,.mm-res-won .mm-title{color:var(--mm-gold2);text-shadow:0 0 60px rgba(232,195,74,.35)}
.mm-res-out .mm-title,.mm-res-lost .mm-title{color:var(--mm-red)}

/* ---- the night along the bottom ---- */
.mm-rail{position:relative;z-index:3;display:flex;align-items:flex-start;gap:24px;padding:14px 24px 12px;border-top:1px solid var(--mm-line);background:rgba(8,9,10,.72);overflow-x:auto}
.mm-rail:empty{display:none}
.mm-rail-l{flex:none;padding-top:2px;font:700 12px/1.2 var(--mm-fd);letter-spacing:.22em;color:var(--mm-gold2)}
.mm-rail-l i{display:block;margin-top:4px;font-size:10px;font-style:normal;letter-spacing:.14em;color:var(--mm-ink3)}
.mm-rail ol{flex:1;display:flex;list-style:none;margin:6px 0 0;padding:0}
.mm-rail li{position:relative;flex:1;min-width:128px;padding:12px 12px 0 0;border-top:2px solid var(--mm-line)}
.mm-rail li::before{content:'';position:absolute;left:0;top:-6px;width:10px;height:10px;border-radius:50%;background:var(--mm-bg);border:2px solid var(--mm-ink3)}
.mm-rail li b{display:block;font:500 15px/1 var(--mm-fm);font-variant-numeric:tabular-nums}
.mm-rail li span{display:block;margin-top:5px;font:600 11px/1.2 var(--mm-fd);letter-spacing:.12em;text-transform:uppercase;color:var(--mm-ink3)}
.mm-rail li.is-done{border-top-color:rgba(201,162,39,.55)}
.mm-rail li.is-done b{color:var(--mm-ink3)}
.mm-rail li.is-done::before{background:var(--mm-gold);border-color:var(--mm-gold)}
.mm-rail li.is-next b{color:var(--mm-gold2)}
.mm-rail li.is-next::before{border-color:var(--mm-gold2);animation:mm-pulse 1.4s infinite}

/* ---- arriving on a scene ---- */
.mm-in .mm-kicker,.mm-in .mm-vs-h{animation:mm-fade .4s both}
.mm-in .mm-title{animation:mm-up .5s .05s cubic-bezier(.2,.8,.2,1) both}
.mm-in .mm-sub,.mm-in .mm-note,.mm-in .mm-stake{animation:mm-fade .5s .25s both}
.mm-in .mm-seg span{animation:mm-up .5s cubic-bezier(.2,.8,.2,1) both}
.mm-in .mm-seg span:nth-child(2){animation-delay:.07s}.mm-in .mm-seg span:nth-child(3){animation-delay:.14s}.mm-in .mm-seg span:nth-child(4){animation-delay:.21s}
.mm-in .mm-mine,.mm-in .mm-field,.mm-in .mm-acts,.mm-in .mm-scan,.mm-in .mm-q,.mm-in .mm-lu-h{animation:mm-up .5s .3s cubic-bezier(.2,.8,.2,1) both}
.mm-in .mm-cell{animation:mm-up .45s .35s cubic-bezier(.2,.8,.2,1) both}
.mm-in .mm-cell:nth-child(2){animation-delay:.42s}.mm-in .mm-cell:nth-child(3){animation-delay:.49s}.mm-in .mm-cell:nth-child(4){animation-delay:.56s}
.mm-in .mm-radar{animation:mm-zoom .6s cubic-bezier(.2,.8,.2,1) both}
.mm-in .mm-plate{animation:mm-up .55s .1s cubic-bezier(.2,.8,.2,1) both}
.mm-in .mm-plate:first-child{animation-name:mm-left}
.mm-in .mm-plate:last-child{animation-name:mm-right}
.mm-in .mm-plates.mm-n1 .mm-plate{animation-name:mm-up}
.mm-in .mm-v b{animation:mm-stamp .5s .5s cubic-bezier(.2,1.5,.3,1) both}
.mm-in .mm-lu-g li{animation:mm-pop .32s calc(var(--mm-i) * 26ms + 180ms) both}
.mm-in .mm-card{animation:mm-up .45s .2s cubic-bezier(.2,.8,.2,1) both}
.mm-in .mm-res .mm-crest{animation:mm-stamp .6s cubic-bezier(.2,1.5,.3,1) both}
.mm-after .mm-cell,.mm-after .mm-stake,.mm-after .mm-acts{animation:mm-up .5s cubic-bezier(.2,.8,.2,1) both}

@keyframes mm-drift{to{transform:translate3d(48px,48px,0)}}
@keyframes mm-breathe{50%{opacity:.45}}
@keyframes mm-load{0%{left:-40%}100%{left:100%}}
@keyframes mm-pulse{0%{box-shadow:0 0 0 0 rgba(232,195,74,.55)}70%{box-shadow:0 0 0 8px rgba(232,195,74,0)}100%{box-shadow:0 0 0 0 rgba(232,195,74,0)}}
@keyframes mm-roll{to{transform:translateX(-50%)}}
@keyframes mm-sweep{to{transform:rotate(360deg)}}
@keyframes mm-ping{0%{opacity:1;box-shadow:0 0 0 0 rgba(232,195,74,.7),0 0 14px var(--mm-gold2)}22%{opacity:.6;box-shadow:0 0 0 10px rgba(232,195,74,0),0 0 0 transparent}100%{opacity:.28;box-shadow:none}}
@keyframes mm-fade{from{opacity:0}}
@keyframes mm-up{from{opacity:0;transform:translateY(18px)}}
@keyframes mm-left{from{opacity:0;transform:translateX(-64px)}}
@keyframes mm-right{from{opacity:0;transform:translateX(64px)}}
@keyframes mm-zoom{from{opacity:0;transform:scale(.86)}}
@keyframes mm-pop{from{opacity:0;transform:scale(.9)}}
@keyframes mm-stamp{from{opacity:0;transform:scale(2.4)}to{opacity:1;transform:none}}
@keyframes mm-slam{from{opacity:0;transform:scale(1.7);letter-spacing:.2em}}
@keyframes mm-flash{0%{opacity:.38}100%{opacity:0}}
@keyframes mm-lock{0%{transform:scale(1.06);filter:brightness(2.6)}100%{transform:none;filter:none}}
@keyframes mm-deal{from{opacity:0;transform:translateY(28px) rotateX(70deg)}}

/* ---- short monitors: keep the whole card and the night on one screen ---- */
.mm-s-live .mm-plate .mm-crest{width:clamp(56px,6vw,80px);height:clamp(56px,6vw,80px)}
@media (max-height:900px) and (min-width:861px){
  .mm-stage{padding:16px 24px}
  .mm-plates{margin-top:14px}
  .mm-plate{min-height:clamp(210px,31vh,330px);gap:10px}
  .mm-score{font-size:clamp(48px,6.2vw,84px)}
  .mm-cells,.mm-acts{margin-top:16px}
  .mm-stake{margin-top:12px}
}

/* ---- small screens: the page scrolls and the sides stack ---- */
@media (max-width:860px){
  .mm-top{grid-template-columns:1fr auto;padding:10px 16px;row-gap:10px}
  .mm-night{grid-column:1/-1;grid-row:2}
  .mm-brand i,.mm-et{display:none}
  .mm-stage{padding:20px 16px;align-items:flex-start}
  .mm-search,.mm-board{grid-template-columns:1fr}
  .mm-radar{max-width:260px;margin:0 auto}
  .mm-plates.mm-n3,.mm-plates.mm-n2{grid-template-columns:1fr}
  .mm-plate{min-height:0;padding:14px 14px 18px}
  .mm-plate .mm-crest{width:72px;height:72px;margin-top:0}
  .mm-plate-foot{margin-bottom:0}
  .mm-v{width:auto;height:28px;margin:-14px 0}
  .mm-v b{width:44px;height:44px;font-size:20px}
  .mm-seg{gap:8px}
  .mm-mine{flex-wrap:wrap}
  .mm-mine .mm-btn{margin-left:0}
  .mm-lu-h .mm-crest{width:64px;height:64px}
  .mm-lu-g{grid-template-columns:repeat(auto-fill,minmax(168px,1fr))}
  .mm-rail{padding:12px 16px}
  .mm-in .mm-plate:first-child,.mm-in .mm-plate:last-child{animation-name:mm-up}
}

/* ---- for anyone who has asked their system for less motion ---- */
@media (prefers-reduced-motion:reduce){
  .mm::before,.mm-radar::before,.mm-field-in,.mm-boot img,.mm-boot-bar::after{animation:none}
  .mm *,.mm *::before,.mm *::after{animation-duration:.01s!important;animation-delay:0s!important;animation-iteration-count:1!important}
  .mm-blip{opacity:.7}
  .mm-flash{display:none}
}