/* GoBall menu (Menu, Deslogado, Ranqueado). Source of truth for the look:
   docs/superpowers/design/goball-ui-direction-mockup-v2.html. Everything is scoped
   under #menuView so it never touches the game (styles.css). Served as /menu.css. */
#menuView{--bg:var(--gb-page);--card:var(--gb-card);--text:var(--gb-text);--muted:var(--gb-muted);--accent:#22c55e;--blue:#3b82f6;--gold:#fbbf24;--red:#f43f5e;
--glass:rgba(var(--gb-glass),.55);--glass-b:rgba(var(--gb-edge),.16);--glow:0 0 0 1px rgba(34,197,94,.55),0 0 24px rgba(34,197,94,.35);
--display:"Segoe UI Black","Arial Black","Helvetica Neue",system-ui,sans-serif;--r:20px;--ease:cubic-bezier(.34,1.56,.64,1);
position:fixed;inset:0;z-index:900;overflow-y:auto;overflow-x:hidden;color:var(--text);font:14px/1.45 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;background:
radial-gradient(1200px 600px at 15% -10%,rgba(34,197,94,.18),transparent 60%),
radial-gradient(900px 600px at 110% 20%,rgba(59,130,246,.20),transparent 60%),
radial-gradient(700px 500px at 50% 120%,rgba(251,191,36,.08),transparent 60%),var(--bg)}
#menuView[hidden],#gameView[hidden]{display:none!important}
#gameView{display:contents}
/* real portal shell (site.js nav, visible on body.game.at-menu): the menu starts below it, and above the mobile tab bar */
.sitenav~#menuView{top:var(--nav-h,60px)}
/* the portal header (and its account dropdown) must paint above the fixed menu layer (z-index 900) */
body.game .sitenav{z-index:950}
@media (max-width:760px){.sitenav~#menuView{padding-bottom:84px}}
#menuView *{box-sizing:border-box}
#menuView a{color:inherit;text-decoration:none}
/* animated background: field lines + particles */
#menuView .gbm-bgfx{position:fixed;inset:0;pointer-events:none;z-index:0;overflow:hidden}
#menuView .gbm-bgfx svg{position:absolute;left:50%;top:50%;width:160vmax;height:100vmax;transform:translate(-50%,-50%) perspective(900px) rotateX(58deg);opacity:.16;animation:mg-drift 40s linear infinite}
@keyframes mg-drift{to{transform:translate(-50%,-46%) perspective(900px) rotateX(58deg)}}
#menuView .gbm-p{position:absolute;width:4px;height:4px;border-radius:50%;background:var(--accent);box-shadow:0 0 10px var(--accent);opacity:0;animation:mg-rise 12s linear infinite}
#menuView .gbm-p:nth-child(2){left:12%}#menuView .gbm-p:nth-child(3){left:28%;animation-delay:3s;background:var(--blue);box-shadow:0 0 10px var(--blue)}#menuView .gbm-p:nth-child(4){left:47%;animation-delay:6s}#menuView .gbm-p:nth-child(5){left:66%;animation-delay:1.5s;background:var(--gold);box-shadow:0 0 10px var(--gold)}#menuView .gbm-p:nth-child(6){left:84%;animation-delay:8s}
@keyframes mg-rise{0%{top:105%;opacity:0}15%{opacity:.7}100%{top:-5%;opacity:0}}
#menuView main{position:relative;z-index:1;max-width:1160px;margin:0 auto;padding:28px 24px 60px}
#menuView .gbm-enter .gbm-screen{animation:mg-enter .45s cubic-bezier(.2,.8,.2,1)}
@keyframes mg-enter{from{opacity:0;transform:translateY(14px) scale(.985)}}
/* base */
#menuView .gbm-glass{background:linear-gradient(160deg,rgba(var(--gb-ink),.07),rgba(var(--gb-ink),.01) 40%),var(--glass);backdrop-filter:blur(18px) saturate(140%);-webkit-backdrop-filter:blur(18px) saturate(140%);border:1px solid var(--glass-b);border-radius:var(--r);box-shadow:0 20px 60px -20px rgba(0,0,0,.7),inset 0 1px 0 rgba(var(--gb-ink),.06)}
#menuView .gbm-top{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:26px}
#menuView .gbm-brand{font:900 26px/1 var(--display);letter-spacing:-.02em;font-style:italic;display:flex;align-items:center;gap:10px}
#menuView .gbm-brand b{background:linear-gradient(90deg,var(--accent),#86efac);-webkit-background-clip:text;background-clip:text;color:transparent}
#menuView .gbm-ball{width:22px;height:22px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff,#cbd5e1 45%,#475569);box-shadow:0 0 14px rgba(var(--gb-ink),.35)}
#menuView .gbm-back{font:500 13px system-ui;color:var(--muted);font-style:normal;margin-left:6px}
#menuView .gbm-back:hover{color:var(--text)}
#menuView .gbm-user{display:flex;gap:10px;align-items:center;padding:6px 14px 6px 6px;border-radius:999px}
#menuView .gbm-av{width:30px;height:30px;border-radius:50%;background:conic-gradient(from 200deg,var(--accent),var(--blue),var(--accent));padding:2px}#menuView .gbm-av i{display:block;width:100%;height:100%;border-radius:50%;background:var(--card)}
#menuView .gbm-muted{color:var(--muted)}
#menuView .gbm-tag{font:800 11px system-ui;letter-spacing:.12em;padding:4px 10px;border-radius:999px;display:inline-block}
#menuView .gbm-t-rank{background:rgba(34,197,94,.14);color:var(--gb-ok);box-shadow:inset 0 0 0 1px rgba(34,197,94,.4)}
#menuView .gbm-t-un{background:rgba(147,161,189,.1);color:var(--muted);box-shadow:inset 0 0 0 1px var(--glass-b)}
#menuView h1.gbm-title{font:900 34px/1.05 var(--display);letter-spacing:-.02em;margin:0}
/* buttons */
#menuView .gbm-mbtn{position:relative;overflow:hidden;display:inline-block;font:700 15px system-ui;border-radius:14px;padding:13px 22px;border:1px solid var(--glass-b);cursor:pointer;color:var(--text);background:rgba(var(--gb-ink),.04);transition:transform .2s var(--ease),box-shadow .2s,background .2s,border-color .2s;text-align:center}
#menuView .gbm-mbtn:hover:not(:disabled){transform:translateY(-2px);border-color:rgba(var(--gb-edge),.35);background:rgba(var(--gb-ink),.08)}
#menuView .gbm-mbtn:focus-visible,#menuView .gbm-mode:focus-visible,#menuView .gbm-chip:focus-visible,#menuView .gbm-sc:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(59,130,246,.6)}
#menuView .gbm-mbtn:disabled{opacity:.4;cursor:not-allowed}
#menuView .gbm-mbtn.gbm-pri{border:0;color:#04120a;background:linear-gradient(135deg,#4ade80,var(--accent) 50%,#16a34a);box-shadow:0 10px 30px -8px rgba(34,197,94,.7),inset 0 1px 0 rgba(var(--gb-ink),.4)}
#menuView .gbm-mbtn.gbm-pri:hover:not(:disabled){box-shadow:0 14px 36px -6px rgba(34,197,94,.85),0 0 0 1px rgba(134,239,172,.6)}
#menuView .gbm-mbtn.gbm-pri:not(:disabled):after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.55) 50%,transparent 70%);transform:translateX(-120%);animation:mg-shimmer 2.8s ease-in-out infinite}
@keyframes mg-shimmer{60%,100%{transform:translateX(120%)}}
#menuView .gbm-mbtn.gbm-xl{font:900 18px var(--display);letter-spacing:.02em;padding:18px 34px;border-radius:16px;text-transform:uppercase;font-style:italic}
/* home */
#menuView .gbm-hero{display:grid;grid-template-columns:1.35fr 1fr;gap:18px}
#menuView .gbm-mcard{position:relative;overflow:hidden;isolation:isolate;padding:28px;min-height:300px;display:flex;flex-direction:column;justify-content:flex-end;transition:transform .35s var(--ease),box-shadow .35s}
#menuView .gbm-mcard:hover{transform:translateY(-6px)}
#menuView .gbm-mcard.gbm-rank:hover{box-shadow:var(--glow),0 30px 70px -20px rgba(34,197,94,.45)}
#menuView .gbm-mcard .gbm-art{position:absolute;inset:0;width:100%;height:100%;z-index:-1}
#menuView .gbm-mcard h2{font:900 36px/1 var(--display);font-style:italic;letter-spacing:-.02em;margin:12px 0 8px}
#menuView .gbm-mcard p{margin:0 0 20px;max-width:340px}
#menuView .gbm-mcard.gbm-dim{filter:saturate(.35);opacity:.72}
#menuView .gbm-mcard .gbm-lock{position:absolute;top:22px;right:22px;width:40px;height:40px;border-radius:12px;display:grid;place-items:center;background:rgba(var(--gb-well),.6);border:1px solid var(--glass-b)}
#menuView .gbm-ver{margin:14px 2px 0;text-align:right;font:600 11px system-ui;letter-spacing:.04em;color:var(--gb-muted);font-variant-numeric:tabular-nums}
#menuView .gbm-ver:empty{display:none}
#menuView .gbm-shorts{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:18px}
#menuView .gbm-sc{display:flex;gap:14px;align-items:center;padding:16px 18px;cursor:pointer;color:var(--text);font:inherit;text-align:left;transition:transform .25s var(--ease),border-color .25s}
#menuView .gbm-sc:hover{transform:translateY(-3px);border-color:rgba(59,130,246,.5)}
#menuView .gbm-sc .gbm-ic{flex:none;width:42px;height:42px;border-radius:12px;display:grid;place-items:center;background:linear-gradient(135deg,rgba(59,130,246,.35),rgba(59,130,246,.05));box-shadow:inset 0 0 0 1px rgba(59,130,246,.4)}
#menuView .gbm-sc b{display:block;font-size:15px}#menuView .gbm-sc span{font-size:12px}
#menuView .gbm-sc.gbm-off{opacity:.45;pointer-events:none}
#menuView .gbm-banner{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:16px 20px;margin-bottom:20px;border-color:rgba(251,191,36,.35);background:linear-gradient(90deg,rgba(251,191,36,.14),rgba(var(--gb-glass),.55) 60%)}
#menuView .gbm-alert{padding:12px 16px;margin-bottom:16px;border-radius:14px;background:rgba(244,63,94,.12);border:1px solid rgba(244,63,94,.4);color:var(--gb-bad);font-weight:600}
/* find match */
#menuView .gbm-mp{display:grid;grid-template-columns:1fr 330px;gap:18px;align-items:start}
#menuView .gbm-label{font:800 11px system-ui;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin:0 0 12px}
#menuView .gbm-modes{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}
#menuView .gbm-mode{position:relative;overflow:hidden;border-radius:16px;aspect-ratio:1/1.08;padding:12px;display:flex;align-items:flex-end;font:800 15px/1.15 "Segoe UI Variable Display","Segoe UI",system-ui,sans-serif;letter-spacing:.015em;text-shadow:0 1px 8px rgba(0,0,0,.6);justify-content:center;text-align:center;color:var(--text);cursor:pointer;border:1px solid var(--glass-b);background:none;transition:transform .3s var(--ease),box-shadow .3s;isolation:isolate}
#menuView .gbm-mode:before{content:"";position:absolute;inset:0;z-index:-1;background:var(--g)}
#menuView .gbm-mode:after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,transparent 40%,rgba(var(--gb-well),.85))}
#menuView .gbm-mode svg{position:absolute;top:12%;left:50%;width:56%;transform:translateX(-50%);opacity:.92;transition:transform .4s var(--ease)}
#menuView .gbm-mode:hover{transform:translateY(-4px)}#menuView .gbm-mode:hover svg{transform:translateX(-50%) scale(1.1) rotate(-6deg)}
#menuView .gbm-mode .gbm-mname{display:flex;flex-direction:column;align-items:center;gap:3px}
#menuView .gbm-mode .gbm-mdesc{font:600 10px/1.2 "Segoe UI",system-ui,sans-serif;letter-spacing:0;opacity:.85}
#menuView .gbm-mode.gbm-sel{box-shadow:var(--glow);border-color:transparent}
#menuView .gbm-mode .gbm-ck{position:absolute;top:8px;right:8px;width:22px;height:22px;border-radius:50%;background:var(--accent);color:#04120a;display:none;place-items:center;font:900 13px system-ui;font-style:normal}
#menuView .gbm-mode.gbm-sel .gbm-ck{display:grid;animation:mg-pop .4s var(--ease)}
@keyframes mg-pop{from{transform:scale(0)}}
#menuView .gbm-side{padding:22px;position:sticky;top:20px}
#menuView .gbm-chips{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:18px}
#menuView .gbm-chip{font:800 14px system-ui;padding:9px 13px;border-radius:999px;cursor:pointer;color:var(--text);background:rgba(var(--gb-ink),.04);border:1px solid var(--glass-b);transition:transform .35s var(--ease),background .2s,box-shadow .2s}
#menuView .gbm-chip small{font-weight:500;font-size:12px;color:var(--muted);margin-left:5px}
#menuView .gbm-chip:hover{border-color:rgba(var(--gb-edge),.4)}
#menuView .gbm-chip.gbm-sel{background:rgba(34,197,94,.16);border-color:transparent;box-shadow:var(--glow);color:var(--gb-ok);animation:mg-spring .5s var(--ease)}
#menuView .gbm-chip.gbm-sel small{color:var(--gb-ok)}
@keyframes mg-spring{0%{transform:scale(.86)}60%{transform:scale(1.08)}100%{transform:scale(1)}}
#menuView .gbm-hide{display:none!important}
#menuView .gbm-go{width:100%}
#menuView .gbm-summary{display:flex;justify-content:space-between;padding:12px 14px;border-radius:12px;background:rgba(var(--gb-well),.5);margin-bottom:14px;font-weight:600}
#menuView .gbm-login{text-align:center}
#menuView .gbm-login p{margin:0 0 14px}
/* searching */
#menuView .gbm-searching{text-align:center;padding:8px 0}
#menuView .gbm-radar{position:relative;width:150px;height:150px;margin:6px auto 18px}
#menuView .gbm-radar i{position:absolute;inset:0;border-radius:50%;border:2px solid var(--accent);opacity:0;animation:mg-ring 2.4s ease-out infinite}
#menuView .gbm-radar i:nth-child(2){animation-delay:.8s}#menuView .gbm-radar i:nth-child(3){animation-delay:1.6s}
@keyframes mg-ring{0%{transform:scale(.3);opacity:.9}100%{transform:scale(1);opacity:0}}
#menuView .gbm-radar .gbm-bb{position:absolute;left:50%;top:22%;width:30px;height:30px;margin-left:-15px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff,#cbd5e1 50%,#64748b);animation:mg-bounce .9s cubic-bezier(.5,0,.5,1) infinite alternate}
#menuView .gbm-radar .gbm-sh{position:absolute;left:50%;bottom:22%;width:34px;height:8px;margin-left:-17px;border-radius:50%;background:rgba(0,0,0,.5);animation:mg-shadow .9s cubic-bezier(.5,0,.5,1) infinite alternate}
@keyframes mg-bounce{to{transform:translateY(58px) scaleY(.92)}}@keyframes mg-shadow{from{transform:scale(.5);opacity:.4}to{transform:scale(1.1);opacity:.8}}
#menuView .gbm-pill{display:inline-block;padding:6px 16px;border-radius:999px;font:800 18px system-ui;font-variant-numeric:tabular-nums;background:rgba(var(--gb-well),.55);border:1px solid var(--glass-b);margin:10px 0 18px}
#menuView .gbm-sh-title{font:900 22px var(--display);font-style:italic}
/* "back to menu" button injected into the game header */
.btn-menu-back{white-space:nowrap}
@media (max-width:900px){#menuView .gbm-hero,#menuView .gbm-mp{grid-template-columns:1fr}#menuView .gbm-modes{grid-template-columns:repeat(3,1fr)}#menuView .gbm-shorts{grid-template-columns:1fr}#menuView .gbm-side{position:static}}
@media (prefers-reduced-motion:reduce){#menuView *,#menuView *:before,#menuView *:after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition:none!important}#menuView .gbm-bgfx{display:none}}
/* Ranked match: the server runs the game, so host/admin/team controls are hidden */
body.ranked-mode #btnToggleRoomModal,body.ranked-mode #btnToggleOnline,body.ranked-mode #btnToggleAdmin,body.ranked-mode .nick-box,body.ranked-mode .quick-controls,body.ranked-mode #onlineStatusBadge{display:none!important}
body.ranked-mode .btn-menu-back{border-radius:12px;border:1px solid rgba(var(--gb-edge),.25);background:rgba(var(--gb-ink),.06);color:var(--gb-text);font-weight:700;backdrop-filter:blur(8px)}
body.ranked-mode .btn-menu-back:hover{border-color:rgba(244,63,94,.6);box-shadow:0 0 0 1px rgba(244,63,94,.35),0 8px 24px -10px rgba(244,63,94,.7)}
/* In-match overlays (ranked): AFK, end board, reconnect, invites. CSS-only animations. */
@property --n{syntax:"<integer>";inherits:false;initial-value:0}
.mo-overlay{position:absolute;inset:0;z-index:20;display:grid;place-items:center;background:rgba(7,11,20,.55);backdrop-filter:blur(6px);color:#eef2fb;font:14px/1.45 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
.mo-overlay[hidden],.mo-reconnect[hidden],.mo-delta[hidden]{display:none}
.mo-glass{background:linear-gradient(160deg,rgba(255,255,255,.07),rgba(255,255,255,.01) 40%),rgba(17,26,44,.78);backdrop-filter:blur(18px) saturate(140%);border:1px solid rgba(148,173,220,.16);border-radius:20px;box-shadow:0 20px 60px -20px rgba(0,0,0,.7),inset 0 1px 0 rgba(255,255,255,.06)}
.mo-modal{padding:28px 32px;text-align:center;width:min(340px,92%);animation:mo-enter .45s cubic-bezier(.2,.8,.2,1)}
.mo-modal h3{font:900 24px "Segoe UI Black","Arial Black",system-ui,sans-serif;font-style:italic;margin:0 0 14px}
@keyframes mo-enter{from{opacity:0;transform:translateY(14px) scale(.985)}}
.mo-muted{color:#93a1bd}
.mo-modal p.mo-muted{font-size:12px;margin:12px 0 0}
.mo-btn{font:800 14px system-ui;padding:12px 18px;border-radius:14px;cursor:pointer;color:#eef2fb;background:rgba(255,255,255,.06);border:1px solid rgba(148,173,220,.25);transition:transform .15s,box-shadow .15s}
.mo-btn:hover{transform:translateY(-1px);border-color:rgba(148,173,220,.5)}
.mo-btn:focus-visible,.mo-friend:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(59,130,246,.6)}
.mo-btn:disabled{opacity:.5;cursor:default}
.mo-pri{border:0;color:#04120a;background:linear-gradient(135deg,#4ade80,#22c55e 50%,#16a34a);box-shadow:0 10px 30px -8px rgba(34,197,94,.7),inset 0 1px 0 rgba(255,255,255,.4)}
.mo-xl{font:900 18px system-ui;font-style:italic;text-transform:uppercase;letter-spacing:.02em;padding:16px 32px;width:100%}
.mo-cd{position:relative;width:132px;height:132px;margin:0 auto 18px}
.mo-cd svg{width:100%;height:100%;transform:rotate(-90deg)}
.mo-cd circle{fill:none;stroke-width:8}.mo-cd .bgc{stroke:rgba(255,255,255,.08)}
.mo-cd .fg{stroke:#fbbf24;stroke-linecap:round;stroke-dasharray:364.4;filter:drop-shadow(0 0 6px rgba(251,191,36,.7));animation:mo-deplete 10s linear forwards}
@keyframes mo-deplete{to{stroke-dashoffset:364.4}}
.mo-cd b{position:absolute;inset:0;display:grid;place-items:center;font:900 34px "Segoe UI Black","Arial Black",system-ui;color:#fbbf24;font-variant-numeric:tabular-nums}
.mo-num{counter-reset:n var(--n);animation:mo-count 1.1s cubic-bezier(.2,.8,.2,1) forwards}
.mo-num::after{content:counter(n)}
@keyframes mo-count{from{--n:0}to{--n:var(--to)}}
.mo-end{width:min(480px,94%);text-align:left;padding:0;overflow:hidden}
.mo-head{padding:24px 26px 18px;text-align:center;background:linear-gradient(115deg,rgba(244,63,94,.38) 0 50%,rgba(59,130,246,.42) 50% 100%)}
.mo-tag{display:inline-block;font:800 11px system-ui;letter-spacing:.12em;padding:3px 10px;border-radius:999px;background:rgba(7,11,20,.45)}
.mo-res{font:900 44px/1 "Segoe UI Black","Arial Black",system-ui;font-style:italic;letter-spacing:-.02em;background:linear-gradient(180deg,#fff,#86efac);-webkit-background-clip:text;background-clip:text;color:transparent;margin:8px 0 6px}
.mo-res.mo-loss{background-image:linear-gradient(180deg,#fff,#fda4af)}
.mo-sc{font:900 54px/1 "Segoe UI Black","Arial Black",system-ui;font-variant-numeric:tabular-nums;display:flex;justify-content:center;gap:22px;align-items:center}
.mo-sc small{font:700 13px system-ui;opacity:.85;letter-spacing:.06em;text-transform:uppercase}
.mo-dash{opacity:.5}
.mo-teams{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px;padding:18px 26px 6px;font-size:13px}
.mo-teams div div{padding:5px 0;border-bottom:1px solid rgba(148,173,220,.08);overflow-wrap:anywhere}
.mo-teams .mo-me{font-weight:800}
.mo-red{color:#f87171}.mo-blue{color:#60a5fa}
.mo-delta{margin:12px 26px;display:flex;justify-content:space-between;align-items:center;padding:14px 16px;border-radius:14px;background:rgba(34,197,94,.1);box-shadow:inset 0 0 0 1px rgba(34,197,94,.35);animation:mo-enter .45s cubic-bezier(.2,.8,.2,1)}
.mo-delta b{font:900 30px "Segoe UI Black","Arial Black",system-ui;color:#4ade80;font-variant-numeric:tabular-nums;text-shadow:0 0 18px rgba(34,197,94,.6)}
.mo-delta.mo-neg{background:rgba(244,63,94,.1);box-shadow:inset 0 0 0 1px rgba(244,63,94,.35)}
.mo-delta.mo-neg b{color:#fb7185;text-shadow:0 0 18px rgba(244,63,94,.5)}
.mo-acts{display:flex;gap:12px;padding:6px 26px 24px}.mo-acts .mo-btn{flex:1}
.mo-reconnect{position:absolute;top:14px;left:50%;transform:translateX(-50%);z-index:21;padding:10px 18px;border-radius:999px;font:800 14px system-ui;color:#04120a;background:#fbbf24;box-shadow:0 10px 30px -8px rgba(251,191,36,.7);animation:mo-pulse 1.2s ease-in-out infinite alternate}
@keyframes mo-pulse{to{box-shadow:0 0 0 6px rgba(251,191,36,.18)}}
.mo-invite .mo-list{display:grid;gap:8px;max-height:260px;overflow:auto;margin-bottom:6px}
.mo-friend{font:700 14px system-ui;text-align:left;padding:10px 14px;border-radius:12px;cursor:pointer;color:#eef2fb;background:rgba(255,255,255,.05);border:1px solid rgba(148,173,220,.18);overflow-wrap:anywhere}
.mo-friend:hover{border-color:rgba(34,197,94,.6)}
.mo-friend:disabled{opacity:.5}
.mo-invite .mo-status{margin:8px 0 14px}
.btn-invite{display:none;white-space:nowrap}
body.ranked-mode .btn-invite{display:inline-block;border-radius:12px;border:1px solid rgba(148,173,220,.25);background:rgba(255,255,255,.06);color:#eef2fb;font-weight:700}
@media (prefers-reduced-motion:reduce){.mo-overlay *,.mo-overlay *::before,.mo-overlay *::after,.mo-reconnect{animation-duration:.001ms!important;animation-iteration-count:1!important;transition:none!important}.mo-cd .fg{animation:none!important}}
/* In-match chat panel (ranked): tabs Sala / Global / Privado. Treino keeps the bottom-bar chat. */
body.ranked-mode #chatContainer,body.ranked-mode #chatResizeHandle{display:none!important}
/* Docked in the bottom bar under the field: the bar grows with the panel and the canvas shrinks */
body.ranked-mode .bottom-bar{height:auto!important;min-height:0!important;max-height:none!important;padding-top:4px;padding-left:76px!important}
/* Constant width on every tab (Sala, Global, Privado; open or minimised): never sized by its content.
   --gb-chat-w is the width (a user resize may set it); the bar under/over the field may be shrink-to-fit. */
.gb-chat{position:relative;box-sizing:border-box;flex:0 0 auto;width:min(var(--gb-chat-w,480px),calc(100vw - 28px));max-width:none;min-width:0;align-self:flex-end;overflow:hidden;color:#eef2fb;font:13px/1.45 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
.gb-grip{height:10px;cursor:ns-resize;display:flex;align-items:center;justify-content:center;touch-action:none}
.gb-grip::before{content:"";width:42px;height:4px;border-radius:999px;background:rgba(148,173,220,.3)}
.gb-grip:hover::before,.gb-dragging .gb-grip::before{background:#22c55e;box-shadow:0 0 8px #22c55e}
.gb-tab .gb-chev{display:none;width:7px;height:7px;margin-left:7px;vertical-align:2px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg);transition:transform .25s ease}
.gb-tab.on .gb-chev{display:inline-block}
.gb-collapsed .gb-tab.on .gb-chev{transform:translateY(3px) rotate(-135deg)}
.gb-collapsed .gb-grip,.gb-collapsed .gb-msgs,.gb-collapsed .gb-dm,.gb-collapsed .gb-form,.gb-collapsed .gb-muted{display:none!important}
.gb-collapsed .gb-tabs{padding:6px 8px}
.gb-chat[hidden],.gb-chat [hidden]{display:none!important}
.gb-tabs{display:flex;gap:4px;padding:2px 8px 8px;width:100%;box-sizing:border-box}
.gb-chat>.gb-msgs,.gb-chat>.gb-dm,.gb-chat>.gb-form,.gb-chat>.gb-muted,.gb-chat .gb-friends,.gb-chat .gb-conv{box-sizing:border-box;width:auto;min-width:0}
.gb-tab{flex:1;text-align:center;padding:7px 0;border-radius:10px;font:700 13px system-ui;color:#93a1bd;cursor:pointer;position:relative;background:transparent;border:0}
.gb-tab.on{color:#eef2fb;background:rgba(34,197,94,.14);box-shadow:inset 0 0 0 1px rgba(34,197,94,.4)}
.gb-tab:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(59,130,246,.6)}
.gb-tab .gb-dot{display:none;position:absolute;top:6px;right:16px;width:7px;height:7px;border-radius:50%;background:#fbbf24;box-shadow:0 0 8px #fbbf24}
.gb-tab.unread .gb-dot{display:block}
.gb-msgs{-webkit-user-select:text;user-select:text;cursor:text;padding:4px 14px 10px;height:var(--gb-msgs-h,96px);overflow-y:auto;overflow-wrap:anywhere}
.gb-line .gb-name{color:#eef2fb}
.gb-system{color:#93a1bd;font-size:12px}
.gb-friends{padding:0 8px 8px;max-height:132px;overflow-y:auto;display:flex;flex-direction:column;gap:4px}
.gb-friend{display:flex;align-items:center;gap:8px;padding:7px 10px;border-radius:10px;background:rgba(255,255,255,.04);border:1px solid rgba(148,173,220,.14);color:#eef2fb;font:600 13px system-ui;cursor:pointer;text-align:left}
.gb-friend:hover{border-color:rgba(34,197,94,.45)}
.gb-friend .gb-fname{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.gb-on,.gb-off{width:7px;height:7px;border-radius:50%;flex:none}.gb-on{background:#22c55e;box-shadow:0 0 6px #22c55e}.gb-off{background:#4b5873}
.gb-badge{min-width:18px;padding:0 5px;border-radius:999px;background:#fbbf24;color:#1a1300;font:800 11px/18px system-ui;text-align:center}
.gb-empty{color:#93a1bd;font-size:12px;padding:6px 6px 2px}
.gb-conv-head{display:flex;align-items:center;gap:8px;padding:0 10px}
.gb-back{background:transparent;border:0;color:#93a1bd;font:700 12px system-ui;cursor:pointer;padding:2px 0}
.gb-back:hover{color:#eef2fb}
.gb-notice{margin:0 10px 8px;padding:9px 11px;font-size:12px;color:#c7d2e8;border-radius:10px;background:rgba(59,130,246,.1);border:1px solid rgba(59,130,246,.3)}
.gb-form{margin:0 10px 10px;display:flex;gap:6px;align-items:center}
.gb-form[hidden]{display:none}
.gb-form .gb-input{flex:1;min-width:0;width:auto}
.gb-chan{display:flex;flex:none;border:1px solid rgba(148,173,220,.16);border-radius:10px;overflow:hidden}
.gb-chan[hidden]{display:none}
.gb-chan-btn{padding:8px 9px;border:0;background:rgba(7,11,20,.45);color:#93a1bd;font:12px system-ui;cursor:pointer}
.gb-chan-btn.on{background:rgba(96,165,250,.25);color:#eef2fb}
.gb-chan-btn:disabled{opacity:.4;cursor:not-allowed}
.gb-team{color:#7dd3fc}
.gb-team .gb-tag{font-weight:700;color:#38bdf8}
.gb-input{width:100%;box-sizing:border-box;padding:9px 11px;border:1px solid rgba(148,173,220,.16);border-radius:10px;color:#eef2fb;background:rgba(7,11,20,.45);font:13px system-ui;outline:none}
.gb-input:focus{border-color:rgba(34,197,94,.55);box-shadow:0 0 0 1px rgba(34,197,94,.35)}
.gb-muted{margin:0 10px 10px;padding:9px 11px;border-radius:10px;font-size:12px;color:#fecdd3;background:rgba(244,63,94,.12);border:1px solid rgba(244,63,94,.35)}
#menuView .gbm-mode{white-space:nowrap;min-width:0;font-size:clamp(12.5px,1.05vw,15px)}
/* --- Servidores da Comunidade (P4): room list, create form, in-room admin ------------------------- */
#menuView .gbm-input{font:600 14px system-ui;color:var(--text);background:rgba(var(--gb-well),.55);border:1px solid var(--glass-b);border-radius:12px;padding:11px 12px;width:100%;box-sizing:border-box}
#menuView .gbm-input:focus{outline:none;box-shadow:var(--glow)}
#menuView select.gbm-input option{background:var(--gb-card);color:var(--gb-text)}
#menuView .gbm-cs-bar{display:flex;gap:10px;align-items:center;margin:18px 0 14px}
#menuView .gbm-cs-bar .gbm-input{max-width:240px}
#menuView .gbm-cs-bar .gbm-pri{margin-left:auto}
#menuView .gbm-cs-list{padding:8px;overflow:hidden}
#menuView .gbm-cs-row{display:grid;grid-template-columns:minmax(0,1fr) 140px 100px 80px 110px;gap:12px;align-items:center;padding:10px 14px;border-radius:14px}
#menuView .gbm-cs-row:not(.gbm-cs-head):hover{background:rgba(var(--gb-ink),.04)}
#menuView .gbm-cs-head{font:800 11px system-ui;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
#menuView .gbm-cs-name{font-weight:800;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#menuView .gbm-cs-lock{margin-right:6px}
/* P13 official rooms: gold seal badge + description (refs: Stripe Apps overview list pills, Base verified seal) */
#menuView .gbm-cs-official{position:relative;background:linear-gradient(90deg,rgba(250,204,21,.09),rgba(250,204,21,0) 60%);box-shadow:inset 3px 0 0 #facc15}
#menuView .gbm-cs-official:hover{background:linear-gradient(90deg,rgba(250,204,21,.14),rgba(var(--gb-ink),.03) 70%)}
#menuView .gbm-cs-off-name{display:grid;gap:2px;white-space:normal;min-width:0}
#menuView .gbm-cs-off-top{display:flex;align-items:center;gap:8px;min-width:0}
#menuView .gbm-cs-off-title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#menuView .gbm-off-badge{flex:none;display:inline-flex;align-items:center;gap:4px;padding:2px 8px 2px 4px;border-radius:999px;font:800 10px/1.4 system-ui,sans-serif;letter-spacing:.08em;text-transform:uppercase;color:#1a1300;background:linear-gradient(135deg,#fde68a,#facc15 45%,#f59e0b);box-shadow:0 0 0 1px rgba(253,230,138,.55),0 4px 14px -4px rgba(250,204,21,.65)}
#menuView .gbm-off-badge svg{width:14px;height:14px;flex:none}
#menuView .gbm-off-badge svg path{fill:#1a1300}
#menuView .gbm-off-badge svg path.ck{fill:none;stroke:#facc15;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
#menuView .gbm-cs-desc{font-weight:500;font-size:12px;color:var(--gb-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#menuView .gbm-cs-join{padding:9px 14px;font-size:14px}
#menuView .gbm-cs-pw{grid-column:1/-1;display:flex;gap:8px}
#menuView .gbm-cs-pw .gbm-input{max-width:280px}
#menuView .gbm-cs-empty{padding:26px;text-align:center}
#menuView .gbm-cs-note{margin-top:14px;font-size:13px}
#menuView .gbm-cs-form{display:grid;grid-template-columns:1fr 1fr;gap:16px;padding:24px;max-width:720px;width:100%;margin-inline:auto;box-sizing:border-box}
#menuView .gbm-cs-form label{display:grid;gap:6px;font:800 11px system-ui;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
#menuView .gbm-cs-form label:first-child{grid-column:1/-1}
#menuView .gbm-cs-form p,#menuView .gbm-cs-form .gbm-xl{grid-column:1/-1}
@media (max-width:720px){#menuView .gbm-cs-row{grid-template-columns:minmax(0,1fr) 70px 90px}#menuView .gbm-cs-row>:nth-child(2),#menuView .gbm-cs-row>:nth-child(4){display:none}#menuView .gbm-cs-form{grid-template-columns:1fr}}
body.community-mode #chatContainer,body.community-mode #chatResizeHandle,body.community-mode #btnToggleOnline,body.community-mode .nick-box{display:none!important}
body.community-mode .bottom-bar{height:auto!important;min-height:0!important;max-height:none!important;padding-top:4px}
.btn-cs-invite{border-radius:12px;border:1px solid rgba(34,197,94,.5);background:linear-gradient(135deg,rgba(74,222,128,.22),rgba(22,163,74,.12));color:var(--gb-ok);font-weight:800}
#menuView .gbm-cs-invite{border-color:rgba(34,197,94,.45)}
#menuView .gbm-user[hidden]{display:none!important}
/* Wrong room password: inline error + shake (no list re-render) */
.gbm-cs-pw-err{flex-basis:100%;margin:6px 0 0;font:600 12px system-ui;color:var(--gb-bad)}
.gbm-cs-pw{flex-wrap:wrap}
.gbm-shake{animation:gbm-shake .38s cubic-bezier(.36,.07,.19,.97)}
@keyframes gbm-shake{10%,90%{transform:translateX(-1px)}20%,80%{transform:translateX(3px)}30%,50%,70%{transform:translateX(-5px)}40%,60%{transform:translateX(5px)}}
@media (prefers-reduced-motion:reduce){.gbm-shake{animation:none}}

/* ESC "Uniformes" card (team kit picker) + scoreboard club names */
body.ranked-mode #escKits{display:none!important}
.esc-kits{grid-column:1/-1}
.kit-body{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.kit-body.is-off .kit-side{opacity:.55}
.kit-side{display:grid;gap:6px;min-width:0}
.kit-side-head{display:flex;align-items:center;gap:6px;font:700 12px system-ui;min-width:0}
.kit-current{margin-left:auto;display:flex;align-items:center;gap:6px;color:var(--gb-text-2);font-weight:600;min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.kit-swatch{width:20px;height:20px;flex:none}
.kit-list{max-height:180px;overflow-y:auto;display:grid;align-content:start;gap:1px;background:rgba(var(--gb-well),.45);border:1px solid rgba(var(--gb-edge),.18);border-radius:10px;padding:4px;scrollbar-width:thin}
.kit-group{font:800 10px system-ui;letter-spacing:.12em;text-transform:uppercase;color:var(--gb-muted);padding:6px 6px 2px}
.kit-row{display:flex;align-items:center;gap:8px;width:100%;text-align:left;background:none;border:0;border-radius:7px;padding:4px 6px;color:var(--gb-text);font:600 12px system-ui;cursor:pointer}
.kit-row:hover,.kit-row:focus-visible{background:rgba(var(--gb-edge),.14);outline:none}
.kit-row.is-sel{background:rgba(59,130,246,.28)}
.kit-side-red .kit-row.is-sel{background:rgba(244,63,94,.26)}
.kit-name{min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.kit-none{color:var(--gb-muted);padding-left:34px}
.kit-away{padding-bottom:0}
.kit-clash{grid-column:1/-1;display:flex;align-items:center;gap:10px;flex-wrap:wrap;font:600 12px system-ui;color:var(--gb-gold);background:rgba(234,179,8,.12);border:1px solid rgba(234,179,8,.35);border-radius:10px;padding:6px 10px}
.kit-clash[hidden]{display:none}
.kit-clash-fix{font:700 12px system-ui;color:#0b1020;background:#fde68a;border:0;border-radius:8px;padding:4px 10px;cursor:pointer}
.kit-clash-fix[hidden]{display:none}
/* GOBALL teams in the picker: their own kits (Uniforme do time) */
.kit-team-note{display:block;margin:-2px 0 8px;color:var(--gb-muted);font-size:11.5px}
.kit-team-note[hidden]{display:none}
.kit-group-teams{display:flex;align-items:center;gap:6px;color:#86efac}
.kit-group-teams::before{content:"";width:7px;height:7px;border-radius:50%;background:linear-gradient(135deg,#22c55e,#0ea5e9);box-shadow:0 0 8px rgba(34,197,94,.7)}
.kit-row-team .kit-name{flex:1}
.kit-tag{flex:none;padding:1px 6px;border-radius:6px;background:rgba(var(--gb-edge),.16);color:var(--gb-text-2);font:800 10px system-ui;letter-spacing:.06em}
.kit-auto{flex:none;padding:1px 6px;border-radius:999px;background:linear-gradient(135deg,rgba(34,197,94,.3),rgba(14,165,233,.3));color:var(--gb-hi);font:800 9.5px system-ui;letter-spacing:.08em;text-transform:uppercase}
#gameView .hud-team{max-width:150px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
@media (max-width:640px){.kit-body{grid-template-columns:1fr}}

/* Auto / Reset (Espectadores column) and AUTO ADMIN (match row) */
.esc-col-head .esc-auto, .esc-col-head .esc-reset { margin-left: 4px; }
body.ranked-mode #btnEscAuto, body.ranked-mode #btnEscReset, body.ranked-mode .esc-aa { display: none; }
.esc-aa { position: relative; display: inline-flex; gap: 4px; align-items: center; }
.esc-aa[hidden] { display: none; }
.esc-aa-toggle.on { background: #2e7d32; border-color: #66bb6a; color:var(--gb-hi); box-shadow: 0 0 0 1px #66bb6a inset; }
.esc-aa-pop { position: fixed; z-index: 1000; width: 330px; max-height: 60vh; overflow: auto;
  background: var(--gb-panel); border: 1px solid rgba(var(--gb-ink),0.16); border-radius: 10px; padding: 10px 12px; box-shadow: 0 10px 30px rgba(0,0,0,0.5); text-align: left; }
.esc-aa-pop[hidden] { display: none; }
.esc-aa-pop h4 { margin: 0 0 6px; font-size: 13px; letter-spacing: .04em; }
.esc-aa-pop .esc-check, .esc-aa-pop .esc-field { display: flex; align-items: center; gap: 6px; margin: 5px 0; font-size: 12px; }
.esc-aa-pop .esc-field select { flex: 1; }
.esc-aa-num { width: 46px; padding: 2px 4px; }
.esc-rule-note { font-size: 12px; opacity: .8; align-self: center; }
/* the ESC body scrolls: its sections keep their natural height (long "Mais opções" must not squash the columns) */
#roomModal .esc-body { grid-template-rows: auto minmax(210px, 1fr) auto auto; }
.match-limits-row label[hidden], .match-limits-row .esc-rule-note[hidden] { display: none; }

/* Guest entry (no account): nick + "Jogar como convidado", or Entrar / Criar conta */
#menuView .gbm-guest{flex-direction:column;align-items:stretch;gap:8px;border-color:rgba(34,197,94,.35);background:linear-gradient(90deg,rgba(34,197,94,.14),rgba(var(--gb-glass),.55) 60%)}
#menuView .gbm-guest[data-guest-box]:not(:has(.gbm-guest-form)){flex-direction:row;align-items:center}
#menuView .gbm-guest-form{display:flex;flex-wrap:wrap;align-items:center;gap:10px}
#menuView .gbm-guest-label{display:flex;align-items:center;gap:8px;font-weight:600}
#menuView .gbm-guest-label .gbm-input{width:220px}
#menuView .gbm-guest-actions{display:flex;gap:8px;flex-wrap:wrap}
#menuView .gbm-guest-privacy{margin:0;font-size:12px}
#menuView .gbm-guest-err{margin:0;color:var(--gb-bad);font-weight:600}
#menuView .gbm-locked-note{border-color:rgba(148,163,184,.35)}
#menuView .gbm-locked{opacity:.75}
#menuView button.gbm-sc.gbm-off{cursor:pointer;font:inherit;color:inherit;text-align:left}

/* AUTO ADMIN options: a popover attached to <body> (escapes the ESC panel's clipping/transform) */
.esc-aa-pop{position:fixed;z-index:10050;width:min(360px,calc(100vw - 16px));max-height:min(70vh,calc(100vh - 16px));overflow:auto;box-sizing:border-box;
  color:#e5e7eb;font:13px/1.35 system-ui,-apple-system,"Segoe UI",sans-serif;overscroll-behavior:contain}
.esc-aa-pop .esc-check,.esc-aa-pop .esc-field{flex-wrap:wrap;white-space:normal}
.esc-aa-pop .esc-check span,.esc-aa-pop .esc-field span{white-space:normal;overflow:visible;text-overflow:clip}
.esc-aa-pop .esc-field{justify-content:space-between}
.esc-aa-pop .esc-field select{min-width:150px}
.esc-aa-pop input[type=checkbox]{flex:none}
.esc-aa-pop .esc-aa-close{position:sticky;top:0;float:right;background:none;border:0;color:inherit;font-size:16px;cursor:pointer;padding:0 2px}

/* "Nova versão disponível" toast */
.gb-update-toast{position:fixed;left:50%;bottom:18px;transform:translateX(-50%);z-index:10060;display:flex;gap:10px;align-items:center;
  padding:8px 10px 8px 16px;border-radius:999px;background:rgba(15,23,42,.95);color:#fff;border:1px solid rgba(34,197,94,.5);
  font:600 13px system-ui,sans-serif;box-shadow:0 8px 24px rgba(0,0,0,.4)}
.gb-update-toast[hidden]{display:none}
.gb-update-toast button{border:0;border-radius:999px;padding:6px 12px;font:inherit;cursor:pointer;background:#22c55e;color:#04210f}
.gb-update-toast .gb-x{background:transparent;color:#cbd5e1;padding:4px 8px}
.gb-update-toast button[hidden]{display:none}
/* during a match: out of the touch controls, and of the way */
.gb-update-toast.gb-in-match{top:calc(8px + env(safe-area-inset-top,0px));bottom:auto;padding:5px 12px;font-size:12px;max-width:calc(100vw - 24px);white-space:nowrap}
.gb-update-toast.gb-in-match button{padding:3px 10px}
/* a co-admin's refused command: over the ESC panel, where it was clicked */
.gb-room-notice{top:calc(14px + env(safe-area-inset-top,0px));bottom:auto;border-radius:14px;padding:9px 16px;max-width:min(560px,calc(100vw - 24px));border-color:rgba(251,191,36,.6);z-index:20000}

/* Treino uses the overlay chat panel: the old bottom-bar chat stays hidden */
#chatContainer,#chatResizeHandle{display:none !important}
.gb-chat .gb-tab[hidden]{display:none !important}
.dock-label{font:600 11px system-ui,sans-serif;opacity:.75;margin-right:4px;white-space:nowrap}
#menuView .gbm-mcard.gbm-click{cursor:pointer}
#menuView .gbm-mcard.gbm-click:hover{border-color:rgba(var(--gb-ink),.28)}
#menuView .gbm-mcard.gbm-click:hover [data-card-main]{filter:brightness(1.15)}
#menuView .gbm-mcard.gbm-click:focus-visible{outline:3px solid #22c55e;outline-offset:3px;transform:translateY(-6px)}
#menuView a.gbm-locked{text-decoration:none}

/* =============================================================
   v8: ranks (emblems per tier), ranked ESC panel, "Você" rank card, end-of-match screen
   Mobbin refs: X (sports) game header + per-team stats; WHOOP levels + leaderboard rows;
   Cal AI / Discord badge unlocked; Tripadvisor milestone bar; Sweatcoin countdown
   ============================================================= */
.rk-badge{position:relative;display:inline-flex;align-items:center;gap:6px;flex:none;line-height:0}
.rk-badge .rk-emblem{filter:drop-shadow(0 2px 6px color-mix(in srgb,var(--rk,#94a3b8) 55%,transparent))}
.rk-badge-name{font:800 12px/1 system-ui;color:var(--rk-glow,#e2e8f0);letter-spacing:.02em}
.rk-ghost .rk-emblem{filter:grayscale(1) opacity(.55)}

/* --- Ranked ESC panel --- */
.rk-panel{display:none}
body.ranked-mode .rk-panel{display:grid;gap:12px;min-height:0}
body.ranked-mode #roomModal .esc-body{grid-template-rows:auto minmax(0,1fr)}
body.ranked-mode .esc-sub{display:none}
body.ranked-mode #escTools>:not(#btnBackToMenu):not(#btnToggleControls):not(#btnCameraToggle):not(#soundToggle):not(#btnFullscreen):not(#btnInvite):not(#btnEscTheme){display:none!important}
.rk-head{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:12px;padding:14px 18px;border-radius:18px;
  background:linear-gradient(110deg,rgba(244,63,94,.22),rgba(var(--gb-well),.55) 38%,rgba(var(--gb-well),.55) 62%,rgba(59,130,246,.24));border:1px solid var(--glass-b,rgba(var(--gb-edge),.16))}
.rk-head-mode{display:flex;flex-wrap:wrap;align-items:center;gap:6px 8px;min-width:0}
.rk-tag{font:800 10px system-ui;letter-spacing:.14em;padding:3px 8px;border-radius:999px;background:linear-gradient(135deg,#fbbf24,#f59e0b);color:#1c1300}
.rk-mode{font:italic 900 18px/1.1 "Segoe UI Black","Arial Black",system-ui}
.rk-size{font:700 12px system-ui;color:var(--gb-text-2);padding:2px 8px;border-radius:999px;background:rgba(var(--gb-ink),.08)}
.rk-score{display:flex;align-items:center;gap:10px;font-variant-numeric:tabular-nums}
.rk-sc{font:900 34px/1 "Segoe UI Black","Arial Black",system-ui;min-width:28px;text-align:center}
.rk-sc-red{color:var(--gb-bad);text-shadow:0 0 18px rgba(244,63,94,.45)}.rk-sc-blue{color:var(--gb-info);text-shadow:0 0 18px rgba(59,130,246,.45)}
.rk-sc-dash{opacity:.45;font:900 22px system-ui}
.rk-clock{margin-left:6px;font:800 13px system-ui;padding:4px 9px;border-radius:9px;background:rgba(var(--gb-well),.6);color:var(--gb-text)}
.rk-head-state{display:flex;flex-direction:column;align-items:flex-end;gap:4px}
.rk-state{font:800 11px system-ui;letter-spacing:.08em;text-transform:uppercase;color:var(--gb-ok)}
.rk-state::before{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;background:currentColor;margin-right:6px;vertical-align:1px;box-shadow:0 0 8px currentColor}
.rk-code{font:600 11px system-ui;color:var(--gb-muted)}
.rk-teams{display:grid;grid-template-columns:1fr 1fr;gap:12px;min-height:0}
.rk-col{border-radius:18px;padding:10px 10px 8px;background:rgba(var(--gb-well),.42);border:1px solid rgba(var(--gb-edge),.14);min-width:0}
.rk-col-red{box-shadow:inset 0 3px 0 rgba(244,63,94,.75)}.rk-col-blue{box-shadow:inset 0 3px 0 rgba(59,130,246,.85)}
.rk-col-arena{grid-column:1/-1;box-shadow:inset 0 3px 0 rgba(251,191,36,.8)}
.rk-col-head{display:flex;align-items:baseline;justify-content:space-between;padding:2px 6px 8px;font:800 12px system-ui;letter-spacing:.12em;text-transform:uppercase}
.rk-col-red .rk-col-name{color:var(--gb-bad)}.rk-col-blue .rk-col-name{color:var(--gb-info)}.rk-col-arena .rk-col-name{color:var(--gb-gold)}
.rk-col-avg{font:600 11px system-ui;letter-spacing:0;text-transform:none;color:var(--gb-muted)}
.rk-list{list-style:none;margin:0;padding:0;display:grid;gap:6px;max-height:min(38vh,340px);overflow:auto}
.rk-row{display:flex;align-items:center;gap:10px;padding:7px 10px;border-radius:13px;background:linear-gradient(90deg,color-mix(in srgb,var(--rk) 14%,transparent),rgba(var(--gb-ink),.02) 55%);border:1px solid rgba(var(--gb-edge),.1);min-width:0}
.rk-row.is-you{border-color:rgba(34,197,94,.55);box-shadow:0 0 0 1px rgba(34,197,94,.25) inset}
.rk-who{display:grid;gap:2px;min-width:0;flex:1}
.rk-name{font:700 13.5px system-ui;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rk-you-tag{margin-left:6px;font:800 9.5px system-ui;letter-spacing:.08em;text-transform:uppercase;padding:1px 6px;border-radius:999px;background:rgba(34,197,94,.2);color:var(--gb-ok);vertical-align:1px}
.rk-sub{display:flex;gap:6px;font:600 11.5px system-ui;color:var(--gb-muted)}
.rk-tier{color:var(--rk);font-weight:800}
.rk-rating{font-variant-numeric:tabular-nums}
.rk-chips{display:flex;gap:4px;flex:none}
.rk-spec{grid-column:1/-1;margin:0;font:12px system-ui;color:var(--gb-muted)}
.rk-me{border-radius:18px;padding:12px 14px;background:linear-gradient(135deg,rgba(34,197,94,.1),rgba(var(--gb-well),.45) 45%);border:1px solid rgba(var(--gb-edge),.16);display:grid;gap:10px}
.rk-me-body{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:16px;align-items:center}
.rk-me-disc{display:grid;gap:6px}
.rk-prog{display:flex;align-items:center;gap:14px;min-width:0}
.rk-prog-info{display:grid;gap:6px;flex:1;min-width:0}
.rk-prog-line{display:flex;align-items:baseline;gap:10px}
.rk-prog-tier{font:italic 900 22px/1 "Segoe UI Black","Arial Black",system-ui;color:var(--rk-glow);text-shadow:0 0 22px color-mix(in srgb,var(--rk) 60%,transparent)}
.rk-prog-rating{font:800 15px system-ui;color:var(--gb-text);font-variant-numeric:tabular-nums}
.rk-prog-rating::after{content:" pts";font-weight:600;color:var(--gb-muted);font-size:12px}
.rk-bar{position:relative;height:10px;border-radius:999px;background:rgba(var(--gb-ink),.08);overflow:hidden}
.rk-bar-fill{position:absolute;inset:0 auto 0 0;border-radius:inherit;background:linear-gradient(90deg,var(--rk),var(--rk-glow));box-shadow:0 0 14px color-mix(in srgb,var(--rk) 70%,transparent);transition:width 1.1s cubic-bezier(.2,.8,.2,1)}
.rk-prog-next{font:600 11.5px system-ui;color:var(--gb-muted)}
.rk-prog-big .rk-emblem{width:64px;height:64px}
@media (max-width:700px){.rk-teams,.rk-me-body{grid-template-columns:1fr}.rk-head{grid-template-columns:1fr;justify-items:start}.rk-head-state{align-items:flex-start}}

/* --- "Você" card: emblems per mode / call to action --- */
.rk-you{display:grid;gap:8px;margin-top:4px;padding-top:10px;border-top:1px solid rgba(var(--gb-edge),.12)}
.rk-you:empty{display:none}
.rk-you-h{margin:0;font:800 10.5px system-ui;letter-spacing:.14em;text-transform:uppercase;color:var(--gb-muted)}
.rk-you-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px}
.rk-you-item{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:14px;background:linear-gradient(135deg,color-mix(in srgb,var(--rk) 20%,transparent),rgba(var(--gb-well),.5) 70%);border:1px solid color-mix(in srgb,var(--rk) 40%,transparent)}
.rk-you-txt{display:grid;gap:1px;min-width:0}
.rk-you-txt b{font:800 12.5px system-ui;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rk-you-txt span{font:600 11px system-ui;color:var(--rk)}
.rk-cta{display:flex;align-items:center;gap:10px;width:100%;box-sizing:border-box;padding:10px 12px;border-radius:14px;cursor:pointer;text-align:left;text-decoration:none;
  font:700 13px system-ui;color:var(--gb-gold);background:linear-gradient(110deg,rgba(251,191,36,.18),rgba(var(--gb-well),.5) 70%);border:1px dashed rgba(251,191,36,.55);transition:transform .15s,border-color .15s}
.rk-cta:hover{transform:translateY(-1px);border-style:solid}
.rk-cta:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(251,191,36,.5)}
div.rk-cta{cursor:default}
.rk-cta-arrow{margin-left:auto;font-size:16px;transition:transform .15s}
.rk-cta:hover .rk-cta-arrow{transform:translateX(3px)}
.rk-cta-guest{color:#dbeafe;background:linear-gradient(110deg,rgba(59,130,246,.18),rgba(var(--gb-well),.5) 70%);border-color:rgba(96,165,250,.55)}

/* --- End-of-match screen --- */
#endBoard{overflow:hidden}
#endBoard{z-index:40}
.es-card{width:min(600px,94%);max-height:96%;overflow:auto;position:relative;z-index:1;scrollbar-width:thin}
.es-card.es-in{animation:es-pop .6s cubic-bezier(.34,1.56,.64,1)}
@keyframes es-pop{from{opacity:0;transform:scale(.86) translateY(16px)}}
.es-hero{position:relative;padding:16px 22px 12px;text-align:center;overflow:hidden}
.es-win .es-hero{background:radial-gradient(120% 90% at 50% 0%,rgba(34,197,94,.45),transparent 70%),linear-gradient(115deg,rgba(244,63,94,.25) 0 50%,rgba(59,130,246,.28) 50% 100%)}
.es-loss .es-hero{background:radial-gradient(120% 90% at 50% 0%,rgba(100,116,139,.45),transparent 70%),linear-gradient(115deg,rgba(244,63,94,.16) 0 50%,rgba(59,130,246,.18) 50% 100%)}
.es-draw .es-hero{background:radial-gradient(120% 90% at 50% 0%,rgba(251,191,36,.35),transparent 70%),linear-gradient(115deg,rgba(244,63,94,.2) 0 50%,rgba(59,130,246,.22) 50% 100%)}
.es-win .es-hero::before{content:"";position:absolute;left:50%;top:-60%;width:160%;aspect-ratio:1;transform:translateX(-50%);background:conic-gradient(from 0deg,transparent 0 8%,rgba(255,255,255,.08) 8% 12%,transparent 12% 24%,rgba(255,255,255,.08) 24% 28%,transparent 28% 40%,rgba(255,255,255,.08) 40% 44%,transparent 44% 56%,rgba(255,255,255,.08) 56% 60%,transparent 60% 72%,rgba(255,255,255,.08) 72% 76%,transparent 76% 88%,rgba(255,255,255,.08) 88% 92%,transparent 92%);animation:es-rays 14s linear infinite;pointer-events:none}
@keyframes es-rays{to{transform:translateX(-50%) rotate(360deg)}}
.es-hero>*{position:relative}
.es-res{font-size:50px;margin:8px 0 2px}
.es-win .es-res{background-image:linear-gradient(180deg,#fff,#bbf7d0 45%,#4ade80);filter:drop-shadow(0 0 22px rgba(74,222,128,.55));animation:es-glow 1.8s ease-in-out infinite alternate}
.es-draw .es-res{background-image:linear-gradient(180deg,#fff,#fde68a)}
.es-loss .es-res{background-image:linear-gradient(180deg,#f1f5f9,#94a3b8)}
@keyframes es-glow{to{filter:drop-shadow(0 0 34px rgba(74,222,128,.85))}}
.es-sub{margin:0 0 8px;font:600 13.5px system-ui;color:#dbe4f3}
.es-sc{font-size:40px}
.es-num{min-width:34px;text-align:center}
.es-team-red{color:#fecdd3}.es-team-blue{color:#bfdbfe}
/* MVP block (v10): the match MVP card + MVP Vermelho / MVP Azul. Mobbin refs: Apple Games friend profile
   (big tinted hero card), X game header (team-tinted sides), Discord badge popover (gold glow). */
.es-mvp{display:grid;gap:8px;margin:12px 22px 0;animation:mo-enter .5s .15s both cubic-bezier(.2,.8,.2,1)}
.es-mvp[hidden]{display:none}
.es-mvp-main{position:relative;display:flex;align-items:center;gap:12px;padding:10px 14px;border-radius:18px;overflow:hidden;
  background:radial-gradient(120% 140% at 0% 0%,rgba(251,191,36,.34),transparent 55%),linear-gradient(110deg,rgba(251,191,36,.16),rgba(7,11,20,.55) 70%);
  border:1px solid rgba(251,191,36,.55);box-shadow:0 0 30px -10px rgba(251,191,36,.65),inset 0 1px 0 rgba(255,255,255,.12)}
.es-mvp-main::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.16) 50%,transparent 65%);transform:translateX(-120%);animation:es-shine 2.8s 1s ease-in-out infinite;pointer-events:none}
@keyframes es-shine{60%,100%{transform:translateX(120%)}}
.es-mvp-main.es-mvp-red{box-shadow:0 0 30px -10px rgba(251,191,36,.65),-18px 0 40px -24px rgba(244,63,94,.9)}
.es-mvp-main.es-mvp-blue{box-shadow:0 0 30px -10px rgba(251,191,36,.65),18px 0 40px -24px rgba(59,130,246,.9)}
.es-mvp-star{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;font-size:22px;color:#1c1300;background:radial-gradient(circle at 35% 30%,#fff7d6,#fbbf24 60%,#d97706);box-shadow:0 0 22px rgba(251,191,36,.75);flex:none}
.es-mvp-txt{display:grid;flex:1;min-width:0}
.es-mvp-tag{font:800 10px system-ui;letter-spacing:.14em;text-transform:uppercase;color:#fde68a}
.es-mvp-name{font:900 18px system-ui;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.es-mvp-chips{flex:none}
.es-mvp-score{display:grid;justify-items:center;flex:none;padding:4px 10px;border-radius:12px;background:rgba(7,11,20,.5);border:1px solid rgba(251,191,36,.35)}
.es-mvp-score b{font:900 20px/1 var(--display,system-ui);color:#fde68a;font-variant-numeric:tabular-nums}
.es-mvp-score small{font:700 9px system-ui;letter-spacing:.12em;text-transform:uppercase;color:#cbd5e1}
.es-mvp-sides{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.es-mvp-side{position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:2px 8px;padding:8px 10px;border-radius:14px;background:rgba(7,11,20,.5);border:1px solid rgba(148,173,220,.16)}
.es-mvp-side .es-mvp-tag{grid-column:1/-1}
.es-mvp-side .es-mvp-name{font-size:14px}
.es-mvp-side .es-mvp-chips{grid-column:1/-1}
.es-side-score{grid-row:2;grid-column:2;font:900 14px system-ui;font-variant-numeric:tabular-nums;color:#e2e8f0;padding:1px 8px;border-radius:999px;background:rgba(255,255,255,.08)}
.es-side-red{background:linear-gradient(120deg,rgba(244,63,94,.22),rgba(7,11,20,.55) 70%);border-color:rgba(244,63,94,.45);box-shadow:0 8px 24px -16px rgba(244,63,94,.9)}
.es-side-red .es-mvp-tag{color:#fecdd3}
.es-side-blue{background:linear-gradient(240deg,rgba(59,130,246,.24),rgba(7,11,20,.55) 70%);border-color:rgba(59,130,246,.45);box-shadow:0 8px 24px -16px rgba(59,130,246,.9)}
.es-side-blue .es-mvp-tag{color:#bfdbfe}
.es-mvp-side.is-empty{opacity:.6}
.es-mvp-none{font:600 12px system-ui;color:#94a3b8}
@media (max-width:560px){.es-mvp-sides{grid-template-columns:1fr}.es-mvp-main .es-mvp-chips{display:none}}
@media (prefers-reduced-motion:reduce){.es-mvp-main::after{animation:none}}
.es-rank{margin:10px 22px 0;padding:10px 12px;border-radius:16px;background:rgba(7,11,20,.45);border:1px solid rgba(148,173,220,.14);display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:8px 12px;animation:mo-enter .5s .25s both cubic-bezier(.2,.8,.2,1)}
.es-rank[hidden]{display:none}
.es-rank .mo-delta{margin:0;padding:8px 14px;gap:12px}
.es-rank .mo-delta b{font-size:28px}
.es-rank .es-tierup{grid-column:1/-1}
.es-tierup{display:flex;align-items:center;gap:10px;justify-content:center;padding:6px 12px;border-radius:12px;font:900 16px system-ui;color:#fff;background:linear-gradient(110deg,color-mix(in srgb,var(--rk,#fbbf24) 45%,transparent),transparent);animation:es-pop .6s cubic-bezier(.34,1.56,.64,1)}
.es-tierup[hidden]{display:none}
.es-promoted .es-rank{box-shadow:0 0 0 1px color-mix(in srgb,var(--rk,#fbbf24) 60%,transparent),0 0 40px -6px color-mix(in srgb,var(--rk,#fbbf24) 70%,transparent)}
.es-table{grid-template-columns:repeat(auto-fit,minmax(200px,1fr));padding:12px 22px 2px}
.es-col{display:grid;gap:2px;align-content:start}
.es-col-head,.es-prow{display:grid;grid-template-columns:minmax(0,1fr) repeat(var(--es-n,3),24px);gap:3px;align-items:center}
.es-table.es-full{grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}
.es-col-note{white-space:nowrap;font:800 8px system-ui;letter-spacing:0;color:#cbd5e1}
.es-n.es-bad{color:#fca5a5}
.es-has-note>.es-col-head,.es-has-note>.es-prow{grid-template-columns:minmax(0,1fr) repeat(var(--es-n,3),24px) 32px}
.es-col-head b{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0}
.es-note{white-space:nowrap;justify-self:stretch;min-width:26px;text-align:center;padding:1px 0;border-radius:7px;font:900 11.5px system-ui;font-variant-numeric:tabular-nums;color:#0b1220;background:var(--tc);box-shadow:0 0 10px -3px var(--tc)}
.es-t-top{--tc:#fbbf24}.es-t-good{--tc:#4ade80}.es-t-ok{--tc:#cbd5e1}.es-t-low{--tc:#fb7185}
.es-mine{display:flex;align-items:center;gap:12px;margin:10px 22px 0;padding:10px 14px;border-radius:16px;background:linear-gradient(110deg,rgba(74,222,128,.12),rgba(7,11,20,.5) 60%);border:1px solid rgba(148,173,220,.16);animation:mo-enter .5s .2s both cubic-bezier(.2,.8,.2,1)}
.es-mine[hidden]{display:none}
.es-mine-ring{--deg:calc(var(--p,60) * 3.6deg);flex:none;width:52px;height:52px;border-radius:50%;display:grid;place-items:center;background:conic-gradient(var(--tc) var(--deg),rgba(255,255,255,.08) 0);box-shadow:0 0 18px -4px var(--tc);animation:es-pop .7s .35s both cubic-bezier(.34,1.56,.64,1)}
.es-mine-ring b{display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:#0b1220;font:900 16px/1 var(--display,system-ui);color:var(--tc);font-variant-numeric:tabular-nums}
.es-mine-txt{display:grid;gap:2px;min-width:0}
.es-mine-line{font:700 13px system-ui;color:#e2e8f0}
.es-col-head{padding:0 6px 4px;font:800 11px system-ui;letter-spacing:.1em;text-transform:uppercase}
.es-col-ico{text-align:center;font-size:12px;letter-spacing:0}
.es-prow{padding:3px 6px!important;border-radius:9px;border:0!important}
.es-prow:nth-child(odd){background:rgba(255,255,255,.03)}
.es-prow.mo-me{background:rgba(34,197,94,.14)}
.es-prow.es-is-mvp .es-pname::after{content:" ★";color:#fbbf24}
.es-pname{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.es-n{text-align:center;font:800 13px system-ui;font-variant-numeric:tabular-nums}
.es-n.is-zero{opacity:.35;font-weight:600}
.es-next{display:grid;gap:6px;margin:10px 22px 2px;font:600 13px system-ui;color:#cbd5e1;text-align:center}
.es-next b{font:900 18px system-ui;color:#fbbf24;font-variant-numeric:tabular-nums}
.es-next-bar{height:4px;border-radius:999px;background:rgba(255,255,255,.08);overflow:hidden}
.es-next-bar[hidden]{display:none}
.es-next-bar i{display:block;height:100%;width:100%;background:linear-gradient(90deg,#fbbf24,#f59e0b);transition:width .2s linear}
.es-card .mo-acts{padding-top:10px}
.es-card .mo-acts [hidden]{display:none!important}
.es-confetti{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:2}
.es-abandon{width:min(400px,92%)}
.es-abandon-txt{margin:0 0 6px;font:600 14px system-ui;color:#fde68a}
.es-danger{border-color:rgba(244,63,94,.55)!important;color:#fecdd3}
.es-danger:hover{background:rgba(244,63,94,.18)}
@media (prefers-reduced-motion:reduce){.es-win .es-hero::before,.es-win .es-res,.es-card.es-in,.es-mvp,.es-rank,.es-tierup{animation:none!important}.rk-bar-fill,.es-next-bar i,.rk-cta,.rk-cta-arrow{transition:none!important}}
body:has(#endBoard:not([hidden])) #canvasContainer,body:has(#abandonModal:not([hidden])) #canvasContainer{position:relative;z-index:25}

/* P13 official rooms: the local physics panel ("Admin") is the Treino/host one; the server runs these rooms */
body.official-room #btnToggleAdmin{display:none!important}

/* v14 room list (Servidores da Comunidade): tight card rows, mode tile, players fill bar, ping chip,
   small Entrar, whole row clickable, hover glow. Mobbin refs: Telegram "Popular Apps" list (icon +
   verified seal + count line) https://mobbin.com/screens/1f18f461-3aba-4f74-815e-94589c557c94 ·
   Higgsfield games (small Play pill) https://mobbin.com/screens/9c19f257-4de4-4428-8801-0ca07b191506 */
#menuView .gbm-cs-bar{margin:14px 0 10px}
#menuView .gbm-cs-list{display:grid;gap:6px;padding:6px;overflow:visible}
#menuView .gbm-cs-row.gbm-cs-card{position:relative;display:grid;grid-template-columns:40px minmax(0,1fr) 150px 66px auto;gap:12px;align-items:center;padding:8px 10px 8px 8px;border-radius:14px;background:rgba(var(--gb-ink),.025);border:1px solid rgba(var(--gb-edge),.1);transition:background .15s,border-color .15s,box-shadow .2s,transform .15s}
#menuView .gbm-cs-card[data-card]{cursor:pointer}
#menuView .gbm-cs-card[data-card]:hover,#menuView .gbm-cs-card[data-card]:focus-visible{background:rgba(var(--gb-ink),.055);border-color:rgba(34,197,94,.45);box-shadow:0 0 0 1px rgba(34,197,94,.18),0 10px 28px -14px rgba(34,197,94,.65);transform:translateY(-1px);outline:none}
#menuView .gbm-cs-card.is-full{opacity:.7}
#menuView .gbm-cs-ic{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;font-size:20px;line-height:1;background:linear-gradient(135deg,rgba(244,63,94,.18),rgba(59,130,246,.18));box-shadow:inset 0 0 0 1px rgba(var(--gb-edge),.18)}
#menuView .gbm-cs-card .gbm-cs-name{display:grid;gap:2px;min-width:0;white-space:normal;font-weight:800}
#menuView .gbm-cs-off-top{display:flex;align-items:center;gap:7px;min-width:0;font-size:14.5px}
#menuView .gbm-cs-off-title{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#menuView .gbm-cs-lock{margin:0;font-size:12px}
#menuView .gbm-cs-sub{display:flex;align-items:center;gap:6px;min-width:0;font:600 12px system-ui;color:var(--gb-muted)}
#menuView .gbm-cs-mode{flex:none;padding:1px 7px;border-radius:999px;background:rgba(var(--gb-ink),.06);box-shadow:inset 0 0 0 1px rgba(var(--gb-edge),.14);font:700 11px/1.5 system-ui;color:var(--gb-text-2)}
#menuView .gbm-cs-sub .gbm-cs-desc{min-width:0;font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#menuView .gbm-off-badge{padding:1px 7px 1px 3px;font-size:9.5px}
#menuView .gbm-off-badge svg{width:12px;height:12px}
/* official: gold edge glow instead of the wide yellow wash */
#menuView .gbm-cs-card.gbm-cs-official{background:linear-gradient(90deg,rgba(250,204,21,.07),rgba(var(--gb-ink),.02) 45%);border-color:rgba(250,204,21,.28);box-shadow:inset 2px 0 0 rgba(250,204,21,.85)}
#menuView .gbm-cs-card.gbm-cs-official .gbm-cs-ic{background:linear-gradient(135deg,rgba(250,204,21,.28),rgba(245,158,11,.1));box-shadow:inset 0 0 0 1px rgba(250,204,21,.4),0 0 14px -4px rgba(250,204,21,.6)}
#menuView .gbm-cs-card.gbm-cs-official[data-card]:hover{border-color:rgba(250,204,21,.6);box-shadow:inset 2px 0 0 #facc15,0 10px 28px -14px rgba(250,204,21,.6)}
/* players: count + state + fill bar */
#menuView .gbm-cs-players{display:grid;gap:5px;min-width:0}
#menuView .gbm-cs-count{display:flex;align-items:baseline;gap:6px;font:800 13px system-ui;font-variant-numeric:tabular-nums;white-space:nowrap}
#menuView .gbm-cs-count i{font:700 10px system-ui;font-style:normal;letter-spacing:.06em;text-transform:uppercase;color:var(--gb-muted)}
#menuView .gbm-cs-bar-track{display:block;height:5px;border-radius:999px;background:rgba(var(--gb-ink),.08);overflow:hidden}
#menuView .gbm-cs-bar-track>span{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#22c55e,#4ade80);box-shadow:0 0 8px rgba(74,222,128,.6);min-width:3px}
#menuView .gbm-cs-players.is-empty .gbm-cs-bar-track>span{min-width:0}
#menuView .gbm-cs-players.is-high .gbm-cs-bar-track>span{background:linear-gradient(90deg,#f59e0b,#facc15);box-shadow:0 0 8px rgba(250,204,21,.6)}
#menuView .gbm-cs-players.is-high i{color:var(--gb-gold)}
#menuView .gbm-cs-players.is-full .gbm-cs-bar-track>span{background:linear-gradient(90deg,#f43f5e,#fb7185);box-shadow:0 0 8px rgba(244,63,94,.6)}
#menuView .gbm-cs-players.is-full i{color:var(--gb-bad)}
/* ping chip */
#menuView .gbm-cs-ping{justify-self:start;display:inline-flex;align-items:center;gap:4px;padding:3px 7px;border-radius:999px;background:rgba(var(--gb-ink),.05);font:700 11px/1 system-ui;font-variant-numeric:tabular-nums;color:var(--gb-muted);white-space:nowrap}
#menuView .gbm-cs-ping.ping-good,#menuView .gbm-cs-ping.ping-mid,#menuView .gbm-cs-ping.ping-bad{color:var(--pc)}
#menuView .gbm-cs-ping.ping-good{--pc:#4ade80}#menuView .gbm-cs-ping.ping-mid{--pc:#facc15}#menuView .gbm-cs-ping.ping-bad{--pc:#f87171}
#menuView .gbm-cs-ping[class*=ping-]::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor;box-shadow:0 0 6px currentColor}
/* small Entrar */
#menuView .gbm-cs-card .gbm-cs-join{padding:7px 14px;font-size:13px;border-radius:10px;min-width:74px}
#menuView .gbm-cs-card .gbm-cs-pw{grid-column:2/-1}
@media (max-width:720px){
  #menuView .gbm-cs-row.gbm-cs-card{grid-template-columns:36px minmax(0,1fr) 72px auto;gap:10px}
  #menuView .gbm-cs-card>:nth-child(2),#menuView .gbm-cs-card>:nth-child(4){display:grid}
  #menuView .gbm-cs-card .gbm-cs-ping{display:none}
  #menuView .gbm-cs-ic{width:36px;height:36px;font-size:18px}
  #menuView .gbm-cs-card .gbm-cs-pw{grid-column:1/-1}
  #menuView .gbm-cs-sub .gbm-cs-desc{display:none}
  #menuView .gbm-cs-count i{display:none}
  #menuView .gbm-cs-bar{flex-wrap:wrap}
  #menuView .gbm-cs-bar .gbm-input{max-width:none;flex:1 1 100%}
  #menuView .gbm-cs-card .gbm-cs-join{min-width:0;padding:7px 12px}
}
@media (prefers-reduced-motion:reduce){#menuView .gbm-cs-row.gbm-cs-card{transition:none}}

/* =============================================================
   AUTO ADMIN options v2: glass popover with a sticky header (icon, state pill, close), grouped
   sections (Partida / Jogadores / AFK / Extras), switches, segmented choices and −/+ steppers; pops in,
   sections cascade. Mobbin refs: Revolut privacy settings
   https://mobbin.com/screens/92934ea5-3e8a-43d4-a194-dc9669a9fe49 · Replit settings
   https://mobbin.com/screens/e2c001c6-04fa-4162-aa16-a3f89d7c7d8d · Mercury insights settings
   https://mobbin.com/screens/e88f1daf-83bf-4645-a1de-c932788f2ac5
   ============================================================= */
#autoAdminPop.esc-aa-pop{width:min(600px,calc(100vw - 16px));padding:0;border-radius:18px;text-align:left;color:#e5e9f5;
  background:linear-gradient(180deg,rgba(16,23,38,.97),rgba(var(--gb-well),.97));border:1px solid rgba(var(--gb-edge),.2);
  box-shadow:0 24px 60px -12px rgba(0,0,0,.85),0 0 44px -20px rgba(34,197,94,.6),inset 0 1px 0 rgba(var(--gb-ink),.05);
  -webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);scrollbar-width:thin;scrollbar-color:rgba(var(--gb-edge),.3) transparent}
#autoAdminPop.esc-aa-pop:not([hidden]){animation:aaPopIn .26s cubic-bezier(.2,.9,.25,1.12) both}
@keyframes aaPopIn{from{opacity:0;transform:translateY(6px) scale(.965)}to{opacity:1;transform:none}}
@keyframes aaSecIn{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}
#autoAdminPop .aa-head{position:sticky;top:0;z-index:2;display:flex;align-items:center;gap:10px;margin:0;padding:12px 10px 11px 12px;
  background:linear-gradient(180deg,rgba(16,23,38,.99),rgba(16,23,38,.93));border-bottom:1px solid rgba(var(--gb-edge),.12)}
#autoAdminPop .aa-head::before{content:"";position:absolute;left:14px;right:14px;top:0;height:2px;border-radius:0 0 2px 2px;background:linear-gradient(90deg,transparent,#22c55e,#818cf8,transparent);opacity:.85}
#autoAdminPop .aa-head-ic{flex:none;width:34px;height:34px;border-radius:11px;display:grid;place-items:center;font-size:18px;line-height:1;
  background:linear-gradient(135deg,rgba(34,197,94,.4),rgba(16,185,129,.12));box-shadow:inset 0 0 0 1px rgba(74,222,128,.4),0 0 16px -4px rgba(34,197,94,.75)}
#autoAdminPop .aa-head-t{flex:1;min-width:0;display:grid;gap:2px}
#autoAdminPop .aa-head h4{margin:0;font:900 13px/1.1 system-ui,sans-serif;letter-spacing:.1em;color:var(--gb-hi)}
#autoAdminPop .aa-head small{font:600 11px/1.2 system-ui,sans-serif;color:var(--gb-muted)}
#autoAdminPop .aa-state{flex:none;display:inline-flex;align-items:center;gap:5px;padding:4px 9px;border-radius:999px;font:800 9.5px/1 system-ui,sans-serif;letter-spacing:.1em;text-transform:uppercase;
  color:var(--gb-muted);background:rgba(148,163,184,.12);box-shadow:inset 0 0 0 1px rgba(148,163,184,.2);transition:color .2s,background .2s,box-shadow .2s}
#autoAdminPop .aa-state::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
#autoAdminPop .aa-state.on{color:var(--gb-ok);background:rgba(34,197,94,.14);box-shadow:inset 0 0 0 1px rgba(74,222,128,.4),0 0 12px -4px rgba(34,197,94,.8)}
#autoAdminPop .aa-state.on::before{box-shadow:0 0 6px currentColor;animation:aaPulse 1.6s ease-in-out infinite}
@keyframes aaPulse{50%{opacity:.35}}
#autoAdminPop .esc-aa-close{position:static;float:none;flex:none;width:28px;height:28px;display:grid;place-items:center;padding:0;border:0;border-radius:9px;
  background:rgba(var(--gb-ink),.05);color:var(--gb-muted);font:700 13px/1 system-ui,sans-serif;cursor:pointer;transition:background .15s,color .15s}
#autoAdminPop .esc-aa-close:hover{background:rgba(244,63,94,.2);color:var(--gb-hi)}
/* two balanced columns of section cards (one column when narrow) */
#autoAdminPop .aa-body{columns:2 250px;column-gap:9px;padding:10px 10px 2px}
#autoAdminPop .aa-sec{display:block;break-inside:avoid;margin:0 0 9px;padding:2px 11px;border-radius:14px;background:linear-gradient(180deg,rgba(var(--gb-ink),.04),rgba(var(--gb-ink),.015));border:1px solid rgba(var(--gb-edge),.11);
  animation:aaSecIn .32s ease-out both;animation-delay:calc(var(--i,0) * 45ms + 70ms)}
#autoAdminPop .aa-sec h5{display:flex;align-items:center;gap:7px;margin:8px 0 2px;font:800 10px/1 system-ui,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:var(--gb-info)}
#autoAdminPop .aa-sec-ic{width:20px;height:20px;border-radius:7px;display:grid;place-items:center;font-size:11px;letter-spacing:0;background:rgba(129,140,248,.16);box-shadow:inset 0 0 0 1px rgba(129,140,248,.28)}
#autoAdminPop .aa-row{display:grid;gap:7px;padding:9px 0;border-top:1px solid rgba(var(--gb-edge),.08)}
#autoAdminPop .aa-sec h5+.aa-row{border-top:0}
#autoAdminPop .aa-row[hidden]{display:none}
#autoAdminPop .aa-main{display:flex;align-items:center;gap:12px;margin:0;cursor:pointer}
#autoAdminPop .aa-txt{flex:1;min-width:0;display:grid;gap:2px}
#autoAdminPop .aa-txt b{font:700 12.5px/1.25 system-ui,sans-serif;color:var(--gb-text)}
#autoAdminPop .aa-txt small{font:500 11px/1.3 system-ui,sans-serif;color:var(--gb-muted)}
#autoAdminPop .aa-main:hover .aa-txt b{color:var(--gb-hi)}
/* switch */
#autoAdminPop .aa-sw{-webkit-appearance:none;appearance:none;flex:none;position:relative;width:36px;height:21px;margin:0;padding:0;border:0;border-radius:999px;cursor:pointer;
  background:rgba(148,163,184,.22);box-shadow:inset 0 0 0 1px rgba(var(--gb-edge),.28);transition:background .2s,box-shadow .2s}
#autoAdminPop .aa-sw::before{content:"";position:absolute;top:3px;left:3px;width:15px;height:15px;border-radius:50%;background:#cbd5e1;box-shadow:0 1px 3px rgba(0,0,0,.5);
  transition:transform .24s cubic-bezier(.3,1.4,.5,1),background .2s}
#autoAdminPop .aa-sw:checked{background:linear-gradient(90deg,#16a34a,#22c55e);box-shadow:inset 0 0 0 1px rgba(74,222,128,.6),0 0 12px -2px rgba(34,197,94,.7)}
#autoAdminPop .aa-sw:checked::before{transform:translateX(15px);background:#fff}
#autoAdminPop .aa-main:hover .aa-sw:not(:checked){background:rgba(148,163,184,.34)}
#autoAdminPop .aa-sw:focus-visible,#autoAdminPop .aa-seg button:focus-visible,#autoAdminPop .aa-step-btn:focus-visible,#autoAdminPop .esc-aa-close:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(129,140,248,.5)}
/* −/+ stepper (dims while its switch is off; still editable) */
#autoAdminPop .aa-step{display:inline-flex;align-items:center;justify-self:start;border-radius:10px;background:rgba(var(--gb-well),.6);border:1px solid rgba(var(--gb-edge),.18);overflow:hidden;transition:opacity .2s,border-color .2s}
#autoAdminPop .aa-step:focus-within{border-color:rgba(129,140,248,.6)}
#autoAdminPop .aa-row:has(.aa-sw:not(:checked)) .aa-step{opacity:.45}
#autoAdminPop .aa-step-btn{width:28px;height:28px;margin:0;padding:0;border:0;border-radius:0;background:transparent;color:var(--gb-text-2);font:800 15px/1 system-ui,sans-serif;cursor:pointer;transition:background .15s,color .15s}
#autoAdminPop .aa-step-btn:hover{background:rgba(34,197,94,.18);color:var(--gb-hi)}
#autoAdminPop .aa-step-btn:active{background:rgba(34,197,94,.3)}
#autoAdminPop .aa-num{width:38px;height:28px;margin:0;padding:0;border:0;border-inline:1px solid rgba(var(--gb-edge),.14);border-radius:0;background:transparent;color:var(--gb-hi);text-align:center;
  font:800 13px system-ui,sans-serif;font-variant-numeric:tabular-nums;-moz-appearance:textfield;appearance:textfield}
#autoAdminPop .aa-num::-webkit-inner-spin-button,#autoAdminPop .aa-num::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
#autoAdminPop .aa-num:focus{outline:none;background:rgba(129,140,248,.12)}
#autoAdminPop .aa-unit{padding:0 10px 0 8px;font:600 11px system-ui,sans-serif;color:var(--gb-muted);white-space:nowrap}
/* segmented choice */
#autoAdminPop .aa-row-seg{gap:7px}
#autoAdminPop .aa-seg{display:flex;gap:3px;padding:3px;border-radius:11px;background:rgba(var(--gb-well),.6);border:1px solid rgba(var(--gb-edge),.14)}
#autoAdminPop .aa-seg button{flex:1 1 auto;min-width:0;height:28px;margin:0;padding:0 5px;border:0;border-radius:8px;background:transparent;color:var(--gb-muted);font:700 11.5px/1 system-ui,sans-serif;cursor:pointer;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:background .18s,color .18s,box-shadow .18s}
#autoAdminPop .aa-seg button:hover{color:var(--gb-hi);background:rgba(var(--gb-ink),.06)}
#autoAdminPop .aa-seg button[aria-checked=true]{color:#03140a;background:linear-gradient(135deg,#4ade80,#22c55e);box-shadow:0 4px 14px -6px rgba(34,197,94,.9),inset 0 1px 0 rgba(var(--gb-ink),.35)}
#autoAdminPop .aa-foot{padding:8px 14px 12px;font:600 10.5px system-ui,sans-serif;color:var(--gb-muted);text-align:center}
/* per-mode scope: "Padrão" + mode tabs (chips that wrap: all of them in sight at any width), inherit / own markers per row */
#autoAdminPop .aa-scope{padding:10px 10px 0}
#autoAdminPop .aa-tabs{display:flex;flex-wrap:wrap;gap:5px;padding:2px 2px 6px}
#autoAdminPop .aa-tabs [data-scope]{position:relative;flex:none;height:27px;margin:0;padding:0 11px;border:0;border-radius:999px;cursor:pointer;
  background:rgba(var(--gb-ink),.05);box-shadow:inset 0 0 0 1px rgba(var(--gb-edge),.14);color:var(--gb-muted);font:700 11px/1 system-ui,sans-serif;white-space:nowrap;
  transition:background .18s,color .18s,box-shadow .18s,transform .18s}
#autoAdminPop .aa-tabs [data-scope]:hover{color:var(--gb-hi);background:rgba(var(--gb-ink),.09);transform:translateY(-1px)}
#autoAdminPop .aa-tabs [data-scope][aria-selected=true]{color:var(--gb-hi);background:linear-gradient(135deg,rgba(129,140,248,.5),rgba(99,102,241,.28));box-shadow:inset 0 0 0 1px rgba(165,180,252,.6),0 4px 14px -6px rgba(129,140,248,.9)}
#autoAdminPop .aa-tabs [data-scope]:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(129,140,248,.5)}
/* the room's current mode: a live green dot; a mode with its own settings: an indigo dot */
#autoAdminPop .aa-tabs [data-scope].now{padding-left:21px;color:#d1fae5}
#autoAdminPop .aa-tabs [data-scope].now::before{content:"";position:absolute;left:9px;top:50%;width:6px;height:6px;margin-top:-3px;border-radius:50%;background:#4ade80;box-shadow:0 0 6px #4ade80;animation:aaPulse 1.6s ease-in-out infinite}
#autoAdminPop .aa-tabs [data-scope].has::after{content:"";position:absolute;top:3px;right:4px;width:5px;height:5px;border-radius:50%;background:#a5b4fc;box-shadow:0 0 5px rgba(165,180,252,.9)}
#autoAdminPop .aa-scope-info{display:flex;align-items:center;gap:8px;min-height:26px;padding:2px 4px 0}
#autoAdminPop .aa-scope-txt{flex:1;min-width:0;font:600 10.5px/1.3 system-ui,sans-serif;color:var(--gb-muted)}
#autoAdminPop .aa-scope-reset{flex:none;height:24px;margin:0;padding:0 9px;border:0;border-radius:8px;cursor:pointer;background:rgba(var(--gb-ink),.05);box-shadow:inset 0 0 0 1px rgba(var(--gb-edge),.16);
  color:var(--gb-info);font:700 10.5px/1 system-ui,sans-serif;transition:background .15s,color .15s,opacity .15s}
#autoAdminPop .aa-scope-reset:hover:not(:disabled){background:rgba(129,140,248,.22);color:var(--gb-hi)}
#autoAdminPop .aa-scope-reset:disabled{opacity:.4;cursor:default}
#autoAdminPop .aa-body.aa-swap .aa-sec{animation:aaSecIn .26s ease-out both;animation-delay:calc(var(--i,0) * 35ms)}
#autoAdminPop .aa-row{position:relative;transition:opacity .2s}
#autoAdminPop .aa-rst{position:absolute;top:7px;right:-6px;width:22px;height:22px;margin:0;padding:0;border:0;border-radius:7px;display:none;place-items:center;cursor:pointer;
  background:rgba(129,140,248,.18);color:var(--gb-info);font:800 12px/1 system-ui,sans-serif;transition:background .15s,transform .2s}
#autoAdminPop .aa-rst:hover{background:rgba(129,140,248,.4);color:var(--gb-hi);transform:rotate(-40deg)}
/* own value of this mode: indigo bar on the left + "↺" (the switch moves left of it) */
#autoAdminPop .aa-row.aa-ovr::before{content:"";position:absolute;left:-11px;top:9px;bottom:9px;width:3px;border-radius:0 3px 3px 0;background:linear-gradient(180deg,#a5b4fc,#6366f1);box-shadow:0 0 8px rgba(129,140,248,.7);animation:aaSecIn .2s ease-out both}
#autoAdminPop .aa-row.aa-ovr .aa-rst{display:grid}
#autoAdminPop .aa-row.aa-ovr .aa-main,#autoAdminPop .aa-row-seg.aa-ovr .aa-txt{padding-right:22px}
/* inherited from Padrão: a quiet "Padrão" tag, values slightly dimmed */
#autoAdminPop .aa-row.aa-inh .aa-txt b::after{content:"Padrão";margin-left:6px;padding:1px 5px;border-radius:5px;vertical-align:1px;font:700 8.5px/1.4 system-ui,sans-serif;letter-spacing:.06em;text-transform:uppercase;color:var(--gb-muted);background:rgba(148,163,184,.12)}
#autoAdminPop .aa-row.aa-inh.aa-pre .aa-txt b::after{content:"Do modo";color:var(--gb-info);background:rgba(129,140,248,.14)}
#autoAdminPop .aa-row.aa-inh .aa-sw:not(:checked),#autoAdminPop .aa-row.aa-inh .aa-seg{opacity:.8}
#autoAdminPop .aa-row.aa-lock{opacity:.45}
#autoAdminPop .aa-row.aa-lock .aa-txt b::after{content:none}
#autoAdminPop .aa-lock-why{font:700 10px/1.3 system-ui,sans-serif;font-style:normal;color:var(--gb-gold)}
#autoAdminPop .aa-row:not(.aa-lock) .aa-lock-why{display:none}
#autoAdminPop .aa-seg button:disabled{opacity:.35;cursor:not-allowed;text-decoration:line-through}
#autoAdminPop .aa-sw:disabled,#autoAdminPop .aa-num:disabled{cursor:not-allowed}
@media (prefers-reduced-motion:reduce){#autoAdminPop.esc-aa-pop:not([hidden]),#autoAdminPop .aa-sec,#autoAdminPop .aa-state.on::before{animation:none}#autoAdminPop .aa-sw,#autoAdminPop .aa-sw::before{transition:none}
  #autoAdminPop .aa-tabs [data-scope],#autoAdminPop .aa-tabs [data-scope].now::before,#autoAdminPop .aa-body.aa-swap .aa-sec,#autoAdminPop .aa-row.aa-ovr::before{animation:none;transition:none}}

/* =============================================================
   ESC team columns: dense one-line player rows (name · stats · ping · BOT · ×) and taller columns, so
   5+ players fit per column at 1280x720-1366x768. Stat chips: only non-zero ones; they stack inside
   their slot (row grows) instead of being cut. Mobbin refs: Subframe team members (single-line rows)
   https://mobbin.com/screens/f1784f66-d932-4f8e-a5ce-efbb2ed7ec6b · incident.io team members
   https://mobbin.com/screens/790a7e42-46d7-4614-86a7-c5e5184804f1
   ============================================================= */
@media (min-width:821px){
  #escRosters .esc-col.roster-card{height:auto;min-height:200px;max-height:clamp(236px,40vh,380px)}
}
#escRosters .esc-col .roster-list{gap:3px}
#escRosters .esc-col .roster-player-item{flex-wrap:nowrap;align-items:center;gap:5px;min-height:28px;padding:3px 5px 3px 8px;border-radius:9px;font-size:12px;line-height:1.2}
#escRosters .esc-col .roster-player-item:hover{background:linear-gradient(90deg,rgba(var(--gb-ink),.09),rgba(var(--gb-ink),.03))}
#escRosters .esc-col.card-red .roster-player-item:hover{box-shadow:inset 3px 0 0 #fb7185,0 0 14px -6px rgba(244,63,94,.7)}
#escRosters .esc-col.card-blue .roster-player-item:hover{box-shadow:inset 3px 0 0 #60a5fa,0 0 14px -6px rgba(59,130,246,.7)}
#escRosters .esc-col.card-spec .roster-player-item:hover{box-shadow:inset 3px 0 0 #cbd5e1,0 0 14px -6px rgba(148,163,184,.6)}
#escRosters .roster-player-item .player-info-wrap{order:0;flex:1 1 auto;min-width:64px;gap:4px}
#escRosters .roster-player-item .player-drag-handle{font-size:11px;opacity:.5}
#escRosters .roster-player-item:hover .player-drag-handle{opacity:.9}
#escRosters .roster-player-item .player-name-text{font-weight:650;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#escRosters .roster-player-item .badge-you{padding:0 5px;font-size:9.5px}
#escRosters .roster-player-item .pstat-chips{order:1;flex:0 1 auto!important;display:inline-flex;flex-wrap:wrap;justify-content:flex-end;gap:2px;min-width:0;margin:0!important;padding:0!important;overflow:visible!important}
#escRosters .roster-player-item .pstat-chips:not(:has(.pstat-chip:not(.is-zero))){display:none}
#escRosters .roster-player-item .pstat-chip{font-size:9.5px;padding:2px 4px;line-height:1}
#escRosters .roster-player-item .pstat-chip.is-zero{display:none}
#escRosters .roster-player-item .esc-ping{order:2;padding:2px 5px;font-size:9.5px}
#escRosters .roster-player-item .badge-bot{order:3;flex:none;padding:1px 5px;font-size:9px;line-height:1.3}
#escRosters .roster-player-item .esc-muted{order:4;flex:none;font-size:11px}
#escRosters .roster-player-item .esc-rm{order:5;flex:none;width:18px;height:18px;font-size:13px;line-height:1}
#escRosters .esc-col .roster-list:empty{min-height:84px}

/* --- Grupo (party): lobby, friend picker and calls. Prefix gbp-. Refs in src/ui/party-ui.js --- */
#menuView .gbp-home-acts{display:flex;gap:10px;flex-wrap:wrap}
#menuView .gbm-mbtn.gbp-open{background:rgba(59,130,246,.14);border-color:rgba(96,165,250,.4)}
#menuView .gbm-mbtn.gbp-open.is-on{background:rgba(34,197,94,.14);border-color:rgba(74,222,128,.5);animation:gbp-breathe 2.4s ease-in-out infinite}
#menuView .gbm-go.gbp-open{margin-top:10px}
@keyframes gbp-breathe{50%{box-shadow:0 0 0 4px rgba(34,197,94,.14)}}
#menuView .gbp-stage{position:relative;padding:22px;overflow:hidden;min-height:340px;display:flex;flex-direction:column;gap:18px}
#menuView .gbp-stage::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.5;background:radial-gradient(420px 220px at 50% 118%,rgba(34,197,94,.28),transparent 70%),repeating-linear-gradient(90deg,rgba(var(--gb-ink),.022) 0 56px,transparent 56px 112px)}
#menuView .gbp-head{position:relative;display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
#menuView .gbp-head>div{display:flex;flex-direction:column}
#menuView .gbp-head b{font:900 20px/1.2 var(--display);letter-spacing:-.01em}
#menuView .gbm-mbtn.gbp-add{padding:9px 14px;font-size:13px}
#menuView .gbp-slots{position:relative;display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px;flex:1}
#menuView .gbp-slot{position:relative;display:flex;flex-direction:column;align-items:center;gap:7px;padding:22px 10px 14px;min-height:204px;border-radius:18px;color:var(--text);font:inherit;text-align:center;background:linear-gradient(170deg,rgba(var(--gb-ink),.06),rgba(var(--gb-ink),.012));border:1px solid var(--glass-b);transition:border-color .3s,box-shadow .3s,transform .3s var(--ease),background .3s;animation:gbp-pop .42s var(--ease) both}
@keyframes gbp-pop{from{opacity:0;transform:translateY(12px) scale(.9)}}
#menuView .gbp-slot.is-me{background:linear-gradient(170deg,rgba(59,130,246,.13),rgba(var(--gb-ink),.012))}
#menuView .gbp-slot.is-ready{border-color:rgba(74,222,128,.6);box-shadow:0 0 0 1px rgba(34,197,94,.3),0 14px 34px -16px rgba(34,197,94,.65);transform:translateY(-3px)}
#menuView .gbp-slot.is-away{opacity:.55;filter:saturate(.4)}
#menuView .gbp-slot.is-match{border-color:rgba(251,191,36,.45)}
#menuView .gbp-empty{border-style:dashed;cursor:pointer;background:transparent;justify-content:center;color:var(--muted)}
#menuView .gbp-empty:hover{border-color:rgba(74,222,128,.6);color:var(--text);transform:translateY(-3px)}
#menuView .gbp-empty:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(59,130,246,.6)}
#menuView .gbp-plus{width:60px;height:60px;border-radius:50%;display:grid;place-items:center;font:300 32px/1 system-ui;border:1px dashed currentColor;animation:gbp-call 2.6s ease-in-out infinite}
@keyframes gbp-call{50%{transform:scale(1.07);box-shadow:0 0 0 8px rgba(148,173,220,.07)}}
#menuView .gbp-slot.is-called{border-style:dashed;border-color:rgba(96,165,250,.55)}
#menuView .gbp-slot.is-called .gbp-ring{animation:gbp-ping 1.5s ease-out infinite}
@keyframes gbp-ping{0%{box-shadow:0 0 0 0 rgba(96,165,250,.5)}100%{box-shadow:0 0 0 16px rgba(96,165,250,0)}}
#menuView .gbp-ring{position:relative;display:block;width:68px;height:68px;padding:3px;border-radius:50%;background:rgba(var(--gb-edge),.22);transition:background .3s}
#menuView .gbp-slot.is-ready .gbp-ring{background:conic-gradient(from 210deg,#4ade80,#16a34a,#86efac,#4ade80)}
.gbp-disc{display:grid;place-items:center;width:100%;height:100%;overflow:hidden;border-radius:50%;color:var(--gb-text);background:radial-gradient(circle at 34% 28%,#3b4c6e,#121b2e 72%);font:800 22px/1 system-ui}
.gbp-disc img{width:100%;height:100%;object-fit:cover;display:block}
#menuView .gbp-tick{position:absolute;right:-3px;bottom:-1px;width:24px;height:24px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 3px #0e1626;opacity:0;transform:scale(.3);transition:transform .32s var(--ease),opacity .2s}
#menuView .gbp-tick svg{display:block;width:100%;height:100%;fill:none;stroke:#04120a;stroke-width:3.4;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:24;stroke-dashoffset:24;transition:stroke-dashoffset .3s .1s}
#menuView .gbp-slot.is-ready .gbp-tick{opacity:1;transform:none}
#menuView .gbp-slot.is-ready .gbp-tick svg{stroke-dashoffset:0}
#menuView .gbp-crown{position:absolute;top:8px;left:10px;width:20px;height:20px;fill:var(--gold);filter:drop-shadow(0 0 6px rgba(251,191,36,.6))}
#menuView .gbp-kick{position:absolute;top:6px;right:6px;width:26px;height:26px;border-radius:50%;border:0;cursor:pointer;color:var(--muted);background:rgba(var(--gb-ink),.05);opacity:.55;transition:opacity .15s,background .15s,color .15s}
#menuView .gbp-slot:hover .gbp-kick,#menuView .gbp-kick:focus-visible{opacity:1}
#menuView .gbp-kick:hover{color:#fff;background:var(--red)}
#menuView .gbp-name{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font:800 15px/1.2 system-ui}
#menuView .gbp-name small{font:600 11px system-ui;color:var(--gb-info)}
#menuView .gbp-rank{display:inline-flex;align-items:center;gap:5px;font:600 12px system-ui;color:var(--muted)}
#menuView .gbp-rank svg{flex:none}
#menuView .gbp-rank em{font-style:normal;font-weight:800;color:var(--text)}
#menuView .gbp-chip{margin-top:auto;padding:3px 11px;border-radius:999px;font:800 11px system-ui;letter-spacing:.03em;color:var(--muted);background:rgba(var(--gb-edge),.12);transition:color .25s,background .25s}
#menuView .gbp-slot.is-ready .gbp-chip{color:#04120a;background:#4ade80}
#menuView .gbp-slot.is-match .gbp-chip{color:#201500;background:var(--gold)}
#menuView .gbp-warn{position:relative;padding:10px 12px;border-radius:12px;font-size:13px;color:var(--gb-gold);background:rgba(251,191,36,.1);box-shadow:inset 0 0 0 1px rgba(251,191,36,.35)}
#menuView .gbp-modes{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:14px}
#menuView .gbp-pill{padding:6px 11px;border-radius:999px;cursor:pointer;color:var(--muted);font:700 12px system-ui;background:rgba(var(--gb-ink),.04);border:1px solid var(--glass-b);transition:color .15s,background .15s,border-color .15s,transform .2s var(--ease)}
#menuView .gbp-pill:hover{color:var(--text);transform:translateY(-1px)}
#menuView .gbp-pill:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(59,130,246,.6)}
#menuView .gbp-pill.gbm-sel{color:#04120a;background:#4ade80;border-color:#4ade80}
#menuView .gbp-queue{display:flex;justify-content:space-between;align-items:baseline;padding:12px 14px;margin-bottom:8px;border-radius:12px;background:rgba(var(--gb-ink),.04)}
#menuView .gbp-small{margin:8px 0 0;font-size:12px}
#menuView .gbp-sub{text-align:center}
#menuView .gbm-mbtn.gbp-start.is-armed{animation:gbp-armed 1.5s ease-in-out infinite}
@keyframes gbp-armed{50%{box-shadow:0 10px 38px -4px rgba(34,197,94,.95),0 0 0 5px rgba(34,197,94,.16)}}
#menuView .gbm-mbtn.gbp-ready.is-on{color:var(--gb-ok);border-color:rgba(74,222,128,.6);background:rgba(34,197,94,.12)}
#menuView .gbm-mbtn.gbp-leave{display:block;width:100%;margin-top:12px;padding:9px;font-size:13px;color:var(--muted);background:transparent}
#menuView .gbm-mbtn.gbp-leave:hover:not(:disabled){color:var(--gb-bad);border-color:rgba(244,63,94,.5);background:rgba(244,63,94,.08)}
#menuView .gbp-live{display:flex;align-items:center;gap:9px;padding:11px 13px;margin:6px 0 10px;border-radius:12px;font-weight:700;background:rgba(251,191,36,.1)}
#menuView .gbp-live i{width:9px;height:9px;border-radius:50%;background:var(--gold);animation:gbp-ping-gold 1.4s ease-out infinite}
@keyframes gbp-ping-gold{0%{box-shadow:0 0 0 0 rgba(251,191,36,.6)}100%{box-shadow:0 0 0 10px rgba(251,191,36,0)}}
/* queue countdown: over the slots, so nobody misses it */
#menuView .gbp-count{position:absolute;inset:0;z-index:2;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;text-align:center;background:rgba(var(--gb-well),.72);backdrop-filter:blur(5px);animation:gbp-fade .25s both}
@keyframes gbp-fade{from{opacity:0}}
#menuView .gbp-count .gbm-mbtn{margin-top:10px}
#menuView .gbp-count-ring{position:relative;width:112px;height:112px;display:grid;place-items:center}
#menuView .gbp-count-ring i{position:absolute;inset:0;border-radius:50%;border:2px solid var(--accent);animation:gbp-wave 1.4s ease-out infinite}
#menuView .gbp-count-ring i:nth-child(2){animation-delay:.7s}
@keyframes gbp-wave{from{transform:scale(.55);opacity:.9}to{transform:scale(1.3);opacity:0}}
#menuView .gbp-count-ring b{font:900 54px/1 var(--display);color:var(--gb-ok);text-shadow:0 0 22px rgba(34,197,94,.7)}
/* friend picker */
#menuView .gbp-sheet-ov{position:fixed;inset:0;z-index:30;display:grid;place-items:center;padding:16px;background:rgba(2,5,12,.6);backdrop-filter:blur(6px);animation:gbp-fade .18s both}
#menuView .gbp-sheet{display:flex;flex-direction:column;gap:10px;width:min(460px,100%);max-height:min(640px,92vh);padding:20px;background:linear-gradient(160deg,rgba(var(--gb-ink),.07),rgba(var(--gb-ink),.01) 40%),var(--gb-panel);animation:gbp-rise .3s var(--ease) both}
@keyframes gbp-rise{from{opacity:0;transform:translateY(18px) scale(.97)}}
#menuView .gbp-sheet-h{display:flex;justify-content:space-between;align-items:center}
#menuView .gbp-sheet-h h3{margin:0;font:900 19px var(--display)}
#menuView .gbp-x{width:30px;height:30px;border:0;border-radius:50%;cursor:pointer;color:var(--muted);background:rgba(var(--gb-ink),.06)}
#menuView .gbp-x:hover{color:var(--text)}
#menuView .gbp-friends{flex:1;min-height:150px;overflow-y:auto;display:flex;flex-direction:column;gap:4px}
#menuView .gbp-friend{display:flex;align-items:center;gap:10px;padding:7px 8px;border-radius:12px;transition:background .15s}
#menuView .gbp-friend:hover{background:rgba(var(--gb-ink),.04)}
#menuView .gbp-friend .gbp-disc{flex:none;width:38px;height:38px;font-size:15px}
#menuView .gbp-fname{flex:1;min-width:0;display:flex;flex-direction:column}
#menuView .gbp-fname b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#menuView .gbp-fname small{color:var(--muted)}
#menuView .gbp-fname small.is-on{color:var(--gb-ok)}
#menuView .gbp-fname small.is-match{color:var(--gold)}
#menuView .gbp-fname small.is-web{color:var(--gb-info)}
#menuView .gbm-mbtn.gbp-call{flex:none;padding:7px 13px;font-size:13px}
#menuView .gbm-mbtn.gbp-call.is-sent{color:var(--gb-ok);opacity:1}
#menuView .gbp-empty-note{margin:auto;padding:14px;text-align:center}
#menuView .gbp-link-h{margin:6px 0 0;font:800 12px system-ui;color:var(--muted)}
#menuView .gbp-link{display:flex;gap:8px}
#menuView .gbp-link .gbm-input{flex:1;min-width:0;font-size:12px}
#menuView .gbp-link .gbm-mbtn{padding:9px 15px;font-size:13px}
@media (max-width:560px){#menuView .gbp-slots{grid-template-columns:repeat(2,1fr)}#menuView .gbp-slot{min-height:176px}}
/* calls and notes: over the menu, the portal header and the match; never in the way of the field centre */
.gbp-toasts{position:fixed;top:72px;right:16px;z-index:19000;display:flex;flex-direction:column;align-items:flex-end;gap:10px;width:min(340px,calc(100vw - 32px));pointer-events:none;font:14px/1.4 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color:#eef2fb}
.gbp-toast{pointer-events:auto;border-radius:18px;background:linear-gradient(160deg,rgba(255,255,255,.09),rgba(255,255,255,.015) 45%),rgba(14,22,38,.94);border:1px solid rgba(148,173,220,.22);box-shadow:0 24px 60px -18px rgba(0,0,0,.85);backdrop-filter:blur(14px);animation:gbp-in .42s cubic-bezier(.34,1.56,.64,1) both}
@keyframes gbp-in{from{opacity:0;transform:translateX(44px) scale(.95)}}
.gbp-toast.is-out{animation:gbp-out .2s ease-in both}
@keyframes gbp-out{to{opacity:0;transform:translateX(30px) scale(.97)}}
.gbp-call-card{width:100%;padding:14px 14px 12px;border-color:rgba(74,222,128,.42)}
.gbp-toast-top{display:flex;align-items:center;gap:12px}
.gbp-toast .gbp-disc{flex:none;width:46px;height:46px;font-size:18px}
.gbp-disc-pulse{animation:gbp-ring 1.5s ease-out infinite}
@keyframes gbp-ring{0%{box-shadow:0 0 0 0 rgba(74,222,128,.6)}100%{box-shadow:0 0 0 15px rgba(74,222,128,0)}}
.gbp-toast-txt{min-width:0}
.gbp-toast-txt p{margin:0}
.gbp-toast-txt small{color:#93a1bd}
.gbp-toast-bar{display:block;height:3px;margin:11px 0;overflow:hidden;border-radius:3px;background:rgba(148,173,220,.16)}
.gbp-toast-bar i{display:block;height:100%;background:#4ade80;transform-origin:left;animation:gbp-time linear both}
@keyframes gbp-time{to{transform:scaleX(0)}}
.gbp-toast-acts{display:flex;gap:8px}
.gbp-btn{flex:1;padding:9px;border-radius:12px;cursor:pointer;color:#eef2fb;font:800 13px system-ui;background:rgba(255,255,255,.07);border:1px solid rgba(148,173,220,.22);transition:transform .15s,background .15s}
.gbp-btn:hover{transform:translateY(-1px);background:rgba(255,255,255,.12)}
.gbp-btn-yes{border:0;color:#04120a;background:linear-gradient(135deg,#4ade80,#22c55e 55%,#16a34a)}
.gbp-btn-yes:hover{background:linear-gradient(135deg,#86efac,#22c55e 55%,#16a34a)}
.gbp-note{padding:10px 14px;font-size:13px;font-weight:600}
.gbp-note.is-err{border-color:rgba(244,63,94,.5);color:#fecdd3}
.gbp-note.is-warn{border-color:rgba(251,191,36,.45);color:#fde68a}
.es-party-note{margin:0;padding:0 26px 8px;text-align:center;color:#86efac}
@media (max-width:760px){.gbp-toasts{top:auto;bottom:92px;right:16px}}
@media (prefers-reduced-motion:reduce){.gbp-toast,.gbp-toast.is-out,.gbp-disc-pulse{animation-duration:.001ms!important;animation-iteration-count:1!important}}

/* Player card (src/ui/player-card.js): Discord-style banner + overlapping disc, anchored to the row */
.pc-card{position:fixed;z-index:19500;width:248px;border-radius:16px;overflow:hidden;background:var(--gb-panel);border:1px solid rgba(var(--gb-edge),.22);box-shadow:0 22px 48px -14px rgba(0,0,0,.85),0 0 0 1px rgba(var(--gb-ink),.03) inset;color:var(--gb-text);font:14px/1.35 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;animation:pc-in .2s cubic-bezier(.2,.9,.3,1.25);transform-origin:left top}
@keyframes pc-in{from{opacity:0;transform:translateY(6px) scale(.94)}}
.pc-banner{height:58px;background:linear-gradient(120deg,#334155,#64748b 60%,#94a3b8);background-size:180% 100%;animation:pc-sheen 5s ease-in-out infinite alternate}
.pc-team-1 .pc-banner{background-image:linear-gradient(120deg,#7f1d1d,#ef4444 60%,#fb923c)}
.pc-team-2 .pc-banner{background-image:linear-gradient(120deg,#1e3a8a,#3b82f6 60%,#22d3ee)}
@keyframes pc-sheen{to{background-position:100% 0}}
.pc-disc{position:absolute;left:14px;top:26px;width:56px;height:56px;border-radius:50%;display:grid;place-items:center;font:800 19px system-ui;letter-spacing:.02em;background:var(--gb-raised);border:4px solid #0d1424;box-shadow:0 6px 16px -6px rgba(0,0,0,.7)}
.pc-team-1 .pc-disc{background:#b91c1c}.pc-team-2 .pc-disc{background:#1d4ed8}
.pc-disc.has-photo{overflow:hidden;background:#0d1424}.pc-disc img{display:block;width:100%;height:100%;object-fit:cover;border-radius:50%;animation:pc-photo .35s ease both}
.pc-team-1 .pc-disc.has-photo{box-shadow:0 0 0 2px #ef4444,0 6px 16px -6px rgba(0,0,0,.7)}.pc-team-2 .pc-disc.has-photo{box-shadow:0 0 0 2px #3b82f6,0 6px 16px -6px rgba(0,0,0,.7)}
@keyframes pc-photo{from{opacity:0;transform:scale(.85)}to{opacity:1;transform:none}}
.pc-body{padding:32px 14px 14px}
.pc-name{display:flex;align-items:center;gap:6px;font-weight:800;font-size:16px;min-width:0}
.pc-name-t{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pc-sub{color:var(--gb-muted);font-size:12px;margin:2px 0 12px}
.pc-slot{display:grid;gap:8px;min-height:38px}
.pc-tag{flex:none;padding:1px 6px;border-radius:6px;font:800 11px/1.4 system-ui;letter-spacing:.04em;color:var(--gb-text);background:rgba(var(--gb-edge),.18);border:1px solid rgba(var(--gb-edge),.28);animation:pc-pop .24s cubic-bezier(.2,.9,.3,1.4)}
.pc-medals{display:flex;gap:6px;margin:-4px 0 12px}
.pc-medals[hidden]{display:none}
.pc-medal{display:inline-flex;align-items:center;gap:5px;padding:2px 8px 2px 4px;border-radius:999px;background:rgba(var(--gb-ink),.06);font-size:12px;animation:pc-pop .24s cubic-bezier(.2,.9,.3,1.4)}
.pc-medal i{width:14px;height:14px;border-radius:50%;box-shadow:inset 0 -1px 2px rgba(0,0,0,.35)}
.pc-medal.m-gold i{background:radial-gradient(circle at 35% 30%,#fef3c7,#f59e0b)}
.pc-medal.m-silver i{background:radial-gradient(circle at 35% 30%,#f8fafc,#94a3b8)}
.pc-medal.m-bronze i{background:radial-gradient(circle at 35% 30%,#fed7aa,#b45309)}
@keyframes pc-pop{from{opacity:0;transform:scale(.7)}to{opacity:1;transform:none}}
.pc-btn{display:flex;align-items:center;justify-content:center;gap:6px;box-sizing:border-box;width:100%;min-height:38px;padding:8px 12px;border:0;border-radius:11px;font:700 13px system-ui;color:var(--gb-hi);text-decoration:none;cursor:pointer;transition:transform .15s,filter .15s,background .2s}
.pc-btn:focus-visible{outline:2px solid #93c5fd;outline-offset:2px}
.pc-add,.pc-login{background:linear-gradient(135deg,#16a34a,#22c55e)}
.pc-add:hover,.pc-login:hover{filter:brightness(1.1);transform:translateY(-1px)}
.pc-add:active{transform:scale(.97)}
.pc-wait{background:rgba(var(--gb-ink),.07);color:var(--gb-muted);cursor:default;position:relative;overflow:hidden}
.pc-wait::after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,transparent 30%,rgba(255,255,255,.09),transparent 70%);animation:pc-load 1s linear infinite}
@keyframes pc-load{from{transform:translateX(-100%)}to{transform:translateX(100%)}}
.pc-done{background:rgba(var(--gb-ink),.07);color:var(--gb-text-2);cursor:default;animation:pc-done .28s cubic-bezier(.2,.9,.3,1.4)}
.pc-done::before{content:"✓";color:var(--gb-ok);font-weight:900}
.pc-friend{background:rgba(34,197,94,.14);color:var(--gb-ok)}
@keyframes pc-done{from{transform:scale(.94);opacity:.5}}
.pc-note{margin:0;color:var(--gb-text-2);font-size:12.5px}
.esc-col .roster-player-item.has-card,.rk-row[data-player-id],.es-prow[data-player-id],.gb-name[data-chan="room"]{cursor:pointer}
.es-prow[data-player-id]:hover,.rk-row[data-player-id]:hover{background:rgba(var(--gb-ink),.05)}
.gb-name[data-chan="room"]:hover{text-decoration:underline}

/* "Travar times" strip above the ESC columns (src/ui/team-lock-ui.js) */
.esc-lockbar{display:flex;align-items:center;gap:8px;margin:0 0 8px;padding:6px 10px;border-radius:11px;background:rgba(var(--gb-ink),.04);border:1px solid rgba(var(--gb-edge),.16);font:600 12.5px system-ui;color:var(--gb-text-2);transition:background .25s,border-color .25s,color .25s}
.esc-lockbar[hidden]{display:none}
.esc-lockbar.is-on{background:rgba(245,158,11,.1);border-color:rgba(245,158,11,.38);color:var(--gb-gold)}
.esc-lock-t{flex:1;min-width:0}
.esc-lock-ic{transition:transform .25s cubic-bezier(.2,.9,.3,1.4)}
.esc-lockbar.is-on .esc-lock-ic{transform:scale(1.12)}
.esc-lock-sw{position:relative;flex:none;width:38px;height:22px;padding:0;border:0;border-radius:99px;background:rgba(148,163,184,.3);cursor:pointer;transition:background .2s}
.esc-lock-sw[hidden]{display:none}
.esc-lock-sw i{position:absolute;left:3px;top:3px;width:16px;height:16px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.5);transition:transform .2s cubic-bezier(.2,.9,.3,1.4)}
.esc-lock-sw[aria-checked="true"]{background:#f59e0b}
.esc-lock-sw[aria-checked="true"] i{transform:translateX(16px)}
.esc-lock-sw:focus-visible{outline:2px solid #93c5fd;outline-offset:2px}
.esc-lockbar.nudge{animation:esc-lock-nudge .4s}
@keyframes esc-lock-nudge{20%{transform:translateX(-4px)}40%{transform:translateX(4px)}60%{transform:translateX(-3px)}80%{transform:translateX(2px)}}
.esc-rosters.is-team-locked .esc-col{cursor:default}
@media (prefers-reduced-motion:reduce){.pc-card,.pc-banner,.pc-wait::after,.pc-done,.pc-tag,.pc-medal,.esc-lockbar.nudge,.pc-disc img{animation:none}}
.esc-rosters.is-team-locked .roster-list:empty::before,.esc-rosters.is-team-locked .roster-list:empty::after{content:none}
/* gb-short-screens: phones lying down (about 760x360). The board takes the whole screen in two columns: result, MVP
   and rating on the left, the player tables on the right, and the actions on a line that never scrolls away. */
@media (max-height:500px) and (orientation:landscape){
  body:has(#endBoard:not([hidden])) #gameView header{visibility:hidden}
  #endBoard{position:fixed;box-sizing:border-box;padding:max(4px,env(safe-area-inset-top,0px)) max(6px,env(safe-area-inset-right,0px)) max(4px,env(safe-area-inset-bottom,0px)) max(6px,env(safe-area-inset-left,0px))}
  #endBoard .es-card{box-sizing:border-box;width:min(100%,980px);max-height:100%;border-radius:16px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.12fr);
    grid-template-rows:auto auto auto minmax(0,1fr) auto auto;grid-template-areas:"hero teams" "mvp teams" "mine teams" "rank teams" "note note" "next acts";align-items:start;overflow:auto}
  #endBoard .es-hero{grid-area:hero;padding:6px 10px 5px;border-radius:0 0 12px 0}
  #endBoard .es-tag{display:none}
  #endBoard .es-res{font-size:clamp(20px,6.4vh,27px);margin:0}
  #endBoard .es-sub{margin:0 0 1px;font-size:11px}
  #endBoard .es-sc{font-size:23px;gap:8px}
  #endBoard .es-sc small{font-size:10px}
  #endBoard .es-mvp{grid-area:mvp;margin:5px 8px 0;gap:4px}
  #endBoard .es-mvp-main{padding:3px 8px;gap:7px;border-radius:12px}
  #endBoard .es-mvp-star{width:26px;height:26px;font-size:14px}
  #endBoard .es-mvp-name{font-size:13px}
  #endBoard .es-mvp-tag{font-size:8.5px}
  #endBoard .es-mvp-main .es-mvp-chips{display:none}
  #endBoard .es-mvp-score{padding:1px 7px;border-radius:9px}
  #endBoard .es-mvp-score b{font-size:14px}
  #endBoard .es-mvp-score small{font-size:7.5px}
  #endBoard .es-mvp-sides{gap:4px}
  #endBoard .es-mvp-side{padding:3px 7px;border-radius:10px;gap:0 6px}
  #endBoard .es-mvp-side .es-mvp-name{font-size:12px}
  #endBoard .es-mvp-side .es-mvp-chips{display:none}
  #endBoard .es-side-score{font-size:11.5px;padding:0 6px}
  #endBoard .es-rank{grid-area:rank;margin:5px 8px 0;padding:4px 8px;border-radius:12px;gap:4px 8px}
  #endBoard .es-rank .mo-delta{padding:3px 8px;gap:8px}
  #endBoard .es-rank .mo-delta b{font-size:18px}
  #endBoard .es-tierup{padding:2px 8px;font-size:12px}
  #endBoard .es-table{grid-area:teams;grid-template-columns:repeat(auto-fit,minmax(138px,1fr));gap:8px;padding:6px 8px 2px 0;font-size:12px;min-height:0;align-self:stretch}
  #endBoard .es-col-head{padding:0 4px 2px;font-size:10px}
  #endBoard .es-col-head,#endBoard .es-prow{grid-template-columns:minmax(0,1fr) repeat(var(--es-n,3),20px);gap:2px}
  #endBoard .es-has-note>.es-col-head,#endBoard .es-has-note>.es-prow{grid-template-columns:minmax(0,1fr) repeat(var(--es-n,3),20px) 26px}
  #endBoard .es-mine{grid-area:mine;margin:4px 8px 0;padding:3px 8px;gap:8px;border-radius:12px}
  #endBoard .es-mine-line{font-size:11px}
  #endBoard .es-table.es-full{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:4px}
  #endBoard .es-full .es-has-note>.es-col-head,#endBoard .es-full .es-has-note>.es-prow{grid-template-columns:minmax(26px,1fr) repeat(var(--es-n,3),15px) 19px;gap:1px}
  #endBoard .es-full .es-n{font-size:10px}
  #endBoard .es-full .es-note{font-size:8.5px;min-width:0;border-radius:5px}
  #endBoard .es-full .es-col-ico{font-size:9px}
  #endBoard .es-full .es-col-note{font-size:6.5px}
  #endBoard .es-mine-ring{width:30px;height:30px}
  #endBoard .es-mine-ring b{width:24px;height:24px;font-size:10.5px}
  #endBoard .es-prow{padding:1px 4px!important;border-radius:6px}
  #endBoard .es-n{font-size:12px}
  #endBoard .es-party-note{grid-area:note;padding:3px 10px 0;font-size:11px}
  #endBoard .es-next{grid-area:next;align-self:center;margin:0 8px 6px;gap:3px;font-size:11.5px;position:sticky;bottom:6px}
  #endBoard .es-next b{font-size:14px}
  #endBoard .mo-acts{grid-area:acts;padding:4px 8px 6px 0;gap:6px;position:sticky;bottom:0;z-index:3}
  #endBoard .mo-acts .mo-btn{padding:0 8px;min-height:38px;font-size:12.5px;border-radius:11px;white-space:nowrap}
  #endBoard .es-card.es-ffa{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
  #endBoard .es-sc[hidden]{display:none}
  /* party lobby: seats on the left, mode and the main button on the right, on the same screen */
  #menuView [data-screen=party] .gbm-top{margin-bottom:8px}
  #menuView [data-screen=party] h1.gbm-title{font-size:22px}
  #menuView .gbp-wrap{grid-template-columns:minmax(0,1.5fr) minmax(210px,1fr);gap:8px}
  #menuView .gbp-stage{min-height:0;padding:10px;gap:8px}
  #menuView .gbp-head b{font-size:15px}
  #menuView .gbm-mbtn.gbp-add{padding:6px 10px;font-size:12px}
  #menuView .gbp-slots{grid-template-columns:repeat(auto-fit,minmax(104px,1fr));gap:8px}
  #menuView .gbp-slot{min-height:112px;padding:10px 6px 8px;gap:3px;border-radius:14px}
  #menuView .gbp-ring,#menuView .gbp-plus{width:44px;height:44px}
  #menuView .gbp-plus{font-size:22px}
  #menuView .gbp-tick{width:18px;height:18px}
  #menuView .gbp-name{font-size:13px}
  #menuView .gbm-side{padding:10px;position:static}
  #menuView .gbp-wrap .gbm-go{min-height:40px;padding:8px 10px;margin-top:6px;font-size:14px}
  #menuView .gbp-modes{margin-bottom:5px;gap:4px}
  #menuView .gbp-wrap .gbp-pill{padding:3px 9px;font-size:11.5px;min-height:28px}
  #menuView .gbp-wrap .gbm-label{margin:0 0 3px}
  #menuView [data-screen=party] .gbm-top .gbm-mbtn{padding:6px 12px;font-size:13px}
  #menuView .gbm-mbtn.gbp-leave{margin-top:6px;padding:6px}
  #menuView .gbm-top{margin-bottom:10px}
  /* the other cards of the match: same screen, less air */
  .mo-overlay .mo-modal:not(.es-card){max-height:calc(100% - 8px);overflow:auto;padding:14px 18px}
}
/* gb-app-download: the menu keeps clear of the cutout and of a navigation bar on the side */
#menuView{padding-left:env(safe-area-inset-left,0px);padding-right:env(safe-area-inset-right,0px)}
/* "Baixar app Android" on the home top line (src/ui/app-download.js). Mobbin refs: Wix "Symphony" download card, Voicenotes download list */
#menuView .gbm-apk{--apk:#4ade80;position:relative;display:inline-flex;align-items:center;gap:9px;min-height:44px;margin-left:auto;padding:5px 7px 5px 6px;border-radius:999px;overflow:hidden;isolation:isolate;
  background:linear-gradient(120deg,rgba(34,197,94,.2),rgba(59,130,246,.14)),rgba(var(--gb-well),.55);box-shadow:inset 0 0 0 1px rgba(74,222,128,.42),0 10px 26px -14px rgba(34,197,94,.75);transition:transform .16s var(--ease),box-shadow .2s;animation:gbm-apk-in .5s cubic-bezier(.2,.8,.2,1)}
#menuView .gbm-apk::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(105deg,transparent 40%,rgba(255,255,255,.2) 50%,transparent 60%);transform:translateX(-110%);animation:gbm-apk-shine 4.2s 1.2s ease-in-out infinite}
#menuView .gbm-apk:hover{transform:translateY(-1px);box-shadow:inset 0 0 0 1px rgba(74,222,128,.75),0 14px 30px -12px rgba(34,197,94,.9)}
#menuView .gbm-apk:active{transform:scale(.97)}
#menuView .gbm-apk:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(59,130,246,.6)}
#menuView .gbm-apk-ic{flex:none;display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#86efac,#16a34a)}
#menuView .gbm-apk-ic svg{width:20px;height:20px;fill:#04120a}
#menuView .gbm-apk-t{display:grid;line-height:1.15;min-width:0}
#menuView .gbm-apk-t b{font:800 13px system-ui;white-space:nowrap}
#menuView .gbm-apk-t small{font:600 11px system-ui;color:#a7f3d0;font-variant-numeric:tabular-nums;white-space:nowrap}
#menuView .gbm-apk-dl{flex:none;display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:rgba(var(--gb-ink),.09)}
#menuView .gbm-apk-dl svg{width:17px;height:17px;fill:none;stroke:#eef2fb;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;animation:gbm-apk-bob 2.2s ease-in-out infinite}
@keyframes gbm-apk-in{from{opacity:0;transform:translateY(-6px) scale(.96)}}
@keyframes gbm-apk-shine{0%,60%{transform:translateX(-110%)}100%{transform:translateX(110%)}}
@keyframes gbm-apk-bob{50%{transform:translateY(2px)}}
@media (max-width:520px){#menuView .gbm-top{flex-wrap:wrap}#menuView .gbm-apk{order:3;width:100%;margin-left:0}#menuView .gbm-apk-dl{margin-left:auto}}
@media (prefers-reduced-motion:reduce){#menuView .gbm-apk,#menuView .gbm-apk::after,#menuView .gbm-apk-dl svg{animation:none;transition:none}}

/* Skins: name background on the menu and the shop overlay (src/ui/skin-shop.js).
   Mobbin: Tolan, BitePal, Duolingo "Pick your look", Flo, Discord Shop. */
#menuView .gbm-nameplate{position:relative;overflow:hidden;display:inline-flex;align-items:center;gap:10px;min-width:170px;max-width:300px;margin-left:auto;padding:8px 14px;border:1px solid rgba(var(--gb-ink),.16);border-radius:12px;background:linear-gradient(120deg,#16233b,#0d1526);background-size:cover;color:var(--gb-hi);font:700 14px system-ui,sans-serif;cursor:pointer;transition:transform .16s,border-color .16s,box-shadow .16s}
#menuView .gbm-nameplate.has-art{background-image:linear-gradient(90deg,rgba(0,0,0,.34),rgba(0,0,0,.04)),var(--plate);border-color:rgba(255,255,255,.3);box-shadow:0 0 0 1px rgba(0,0,0,.3),0 4px 14px rgba(0,0,0,.3)}
#menuView .gbm-nameplate::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 40%,rgba(255,255,255,.22) 50%,transparent 60%);transform:translateX(-120%);pointer-events:none}
#menuView .gbm-nameplate:hover{transform:translateY(-1px);border-color:rgba(134,239,172,.6);box-shadow:0 6px 18px rgba(0,0,0,.35)}
#menuView .gbm-nameplate:hover::after{animation:gbs-sheen .8s ease}
#menuView .gbm-np-name{flex:1;min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;text-align:left;text-shadow:0 1px 3px rgba(0,0,0,.8)}
#menuView .gbm-np-cta{flex:none;padding:2px 8px;border-radius:999px;background:rgba(0,0,0,.45);font-size:11px;font-weight:700;color:var(--gb-ok)}
.gbs-back{position:fixed;inset:0;z-index:9000;display:flex;align-items:center;justify-content:center;padding:16px;background:rgba(4,8,16,.72);backdrop-filter:blur(6px);animation:gbs-fade .18s both}
.gbs-sheet{display:flex;flex-direction:column;width:min(860px,100%);max-height:100%;border:1px solid rgba(var(--gb-ink),.1);border-radius:20px;background:var(--gb-panel);color:var(--gb-text);box-shadow:0 30px 80px rgba(0,0,0,.6);font-family:system-ui,sans-serif;animation:gbs-rise .26s cubic-bezier(.2,.9,.3,1.2) both;overflow:hidden}
.gbs-head{display:flex;align-items:center;justify-content:space-between;padding:14px 18px;border-bottom:1px solid rgba(var(--gb-ink),.07)}
.gbs-head h2{margin:0;font-size:20px;font-weight:800;color:var(--gb-hi)}
.gbs-x{width:34px;height:34px;border:0;border-radius:10px;background:rgba(var(--gb-ink),.08);color:var(--gb-hi);font-size:14px;cursor:pointer}
.gbs-x:hover{background:rgba(var(--gb-ink),.16)}
.gbs-body{padding:14px 18px 18px;overflow-y:auto}
.gbs-stage{--glow:rgba(148,163,184,.3);display:grid;grid-template-columns:220px 1fr;gap:18px;align-items:center;padding:12px;border-radius:16px;background:linear-gradient(135deg,#10203a,#0b1526)}
.gbs-stage.r-raro{--glow:rgba(56,189,248,.45)}.gbs-stage.r-epico{--glow:rgba(192,132,252,.5)}.gbs-stage.r-lendario{--glow:rgba(250,204,21,.55)}
.gbs-pitch{position:relative;display:grid;place-items:center;height:210px;border-radius:12px;background:repeating-linear-gradient(90deg,#2f7d3a 0 28px,#2a7235 28px 56px);box-shadow:inset 0 0 0 2px rgba(var(--gb-ink),.3)}
.gbs-pitch canvas{width:170px;height:170px;filter:drop-shadow(0 0 16px var(--glow)) drop-shadow(0 8px 8px rgba(0,0,0,.4));animation:gbs-float 3.2s ease-in-out infinite}
.gbs-stage.is-pop .gbs-pitch canvas{animation:gbs-pop .4s cubic-bezier(.2,.9,.3,1.4)}
.gbs-info h3{margin:10px 0 2px;font-size:19px;color:var(--gb-hi)}.gbs-info p{margin:0;color:var(--gb-muted);font-size:13px}
.gbs-plate{display:inline-block;min-width:170px;padding:7px 14px;border-radius:10px;background:#16233b;background-size:cover;font-weight:700;color:var(--gb-hi);text-shadow:0 1px 3px rgba(0,0,0,.8)}
.gbs-plate.has-art{background-image:linear-gradient(90deg,rgba(0,0,0,.34),rgba(0,0,0,.04)),var(--plate)}
/* Fundo do nome animado (src/ui/plate-motion.js): os quadros prontos numa imagem alta, que o CSS troca em degraus (nada roda por quadro).
   O quadro cobre a altura e guarda a ponta direita, onde fica o emblema. Só no Máximo: nos outros níveis a classe nem existe. */
@property --gb-plate-y{syntax:"<percentage>";inherits:false;initial-value:0%}
@keyframes gb-plate-run{0%{--gb-plate-y:0%}4.1667%{--gb-plate-y:4.3478%}8.3333%{--gb-plate-y:8.6957%}12.5%{--gb-plate-y:13.0435%}16.6667%{--gb-plate-y:17.3913%}20.8333%{--gb-plate-y:21.7391%}25%{--gb-plate-y:26.087%}29.1667%{--gb-plate-y:30.4348%}33.3333%{--gb-plate-y:34.7826%}37.5%{--gb-plate-y:39.1304%}41.6667%{--gb-plate-y:43.4783%}45.8333%{--gb-plate-y:47.8261%}50%{--gb-plate-y:52.1739%}54.1667%{--gb-plate-y:56.5217%}58.3333%{--gb-plate-y:60.8696%}62.5%{--gb-plate-y:65.2174%}66.6667%{--gb-plate-y:69.5652%}70.8333%{--gb-plate-y:73.913%}75%{--gb-plate-y:78.2609%}79.1667%{--gb-plate-y:82.6087%}83.3333%{--gb-plate-y:86.9565%}87.5%{--gb-plate-y:91.3043%}91.6667%{--gb-plate-y:95.6522%}95.8333%{--gb-plate-y:100%}}
.gb-plate-anim{animation:gb-plate-run 2.16s step-end infinite}
#menuView .gbm-nameplate.has-art.gb-plate-anim,.gbs-plate.has-art.gb-plate-anim{background-size:cover,auto 2400%;background-position:0 0,100% var(--gb-plate-y);background-repeat:no-repeat}
.gbs-teams{display:inline-flex;gap:4px;margin:10px 0 0;padding:3px;border-radius:10px;background:rgba(var(--gb-ink),.06)}
.gbs-teams button{border:0;border-radius:7px;padding:5px 12px;background:transparent;color:var(--gb-text-2);font:600 12px system-ui,sans-serif;cursor:pointer}
.gbs-teams button.is-on{background:var(--c);color:var(--gb-hi)}
.gbs-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.gbs-cta{flex:1 1 auto;padding:11px 16px;border:0;border-radius:12px;background:linear-gradient(135deg,#22c55e,#16a34a);color:#04210f;font:800 14px system-ui,sans-serif;cursor:pointer;transition:transform .14s,filter .14s}
.gbs-cta:hover:not(:disabled){transform:translateY(-1px);filter:brightness(1.08)}.gbs-cta:disabled{cursor:default;opacity:.65}
.gbs-cta.is-on{background:rgba(34,197,94,.14);color:var(--gb-ok);opacity:1}.gbs-cta s{opacity:.6;font-weight:600}
.gbs-note{min-height:18px;margin-top:8px!important;color:var(--gb-ok)!important}
.gbs-hint{color:var(--gb-muted);font-size:13px}
.gbs-tabs{display:flex;gap:4px;margin:14px 0 12px;border-bottom:1px solid rgba(var(--gb-ink),.08)}
.gbs-tabs button{padding:9px 14px;border:0;border-bottom:2px solid transparent;background:transparent;color:var(--gb-muted);font:700 13.5px system-ui,sans-serif;cursor:pointer}
.gbs-tabs button.is-on{border-color:#22c55e;color:var(--gb-hi)}
.gbs-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(132px,1fr));gap:10px}
.gbs-card{position:relative;display:flex;flex-direction:column;align-items:center;gap:3px;padding:12px 8px 10px;border:2px solid rgba(var(--gb-ink),.07);border-radius:14px;background:rgba(var(--gb-ink),.03);color:var(--gb-text);cursor:pointer;overflow:hidden;transition:transform .14s,border-color .14s,background .14s}
.gbs-enter .gbs-card{animation:gbs-in .3s both;animation-delay:calc(var(--i,0)*18ms)}
.gbs-card:hover{transform:translateY(-2px);background:rgba(var(--gb-ink),.06)}
.gbs-card canvas{width:76px;height:76px}.gbs-card canvas.gbs-wide{width:100%;height:42px;border-radius:8px}
.gbs-card b{font-size:13px}.gbs-card small{color:var(--gb-muted);font-size:11px}
.gbs-card.r-raro small{color:var(--gb-info)}.gbs-card.r-epico small{color:#d8b4fe}.gbs-card.r-lendario small{color:#fde047}
.gbs-card.r-lendario::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 42%,rgba(253,224,71,.18) 50%,transparent 58%);transform:translateX(-120%);animation:gbs-sheen 3.6s ease-in-out infinite;pointer-events:none}
.gbs-card.is-sel{border-color:#22c55e;background:rgba(34,197,94,.08)}
.gbs-noneic{display:grid;place-items:center;width:76px;height:76px;color:var(--gb-muted);font-size:50px;line-height:1}
.gbs-corner{position:absolute;top:6px;right:6px;padding:2px 7px;border-radius:8px;background:#0a101d;color:var(--gb-hi);font-size:10.5px;font-weight:800}
.gbs-corner.is-on{background:#22c55e;color:#04210f}.gbs-corner.is-free{background:rgba(34,197,94,.2);color:var(--gb-ok)}
.gbs-drop{display:flex;flex-direction:column;align-items:center;gap:3px;padding:20px;border:2px dashed rgba(148,163,184,.35);border-radius:14px;text-align:center;cursor:pointer;transition:border-color .14s,background .14s}
.gbs-drop:hover{border-color:#22c55e;background:rgba(34,197,94,.06)}.gbs-drop input{position:absolute;opacity:0;width:1px;height:1px}
.gbs-drop span{color:var(--gb-muted);font-size:12.5px}
.gbs-rules{margin:10px 0;color:var(--gb-muted);font-size:12.5px;line-height:1.5}
.gbs-row{display:grid;grid-template-columns:44px 1fr auto;gap:12px;align-items:center;padding:8px 10px;margin-bottom:6px;border-radius:12px;background:rgba(var(--gb-ink),.04);animation:gbs-in .28s both;animation-delay:calc(var(--i,0)*30ms)}
.gbs-row img,.gbs-gone{width:44px;height:44px;border-radius:50%;object-fit:cover}.gbs-gone{display:grid;place-items:center;background:rgba(var(--gb-ink),.06);color:var(--gb-muted);font-size:24px}
.gbs-row p{margin:3px 0 0;color:var(--gb-bad);font-size:12.5px}
.gbs-rowacts{display:flex;gap:6px}
.gbs-pill{padding:2px 8px;border-radius:999px;font-size:11px;font-weight:800}
.gbs-pill.s-pending{background:rgba(245,158,11,.16);color:var(--gb-gold)}.gbs-pill.s-approved{background:rgba(34,197,94,.16);color:var(--gb-ok)}.gbs-pill.s-rejected,.gbs-pill.s-revoked{background:rgba(244,63,94,.16);color:var(--gb-bad)}
.gbs-mini{padding:6px 11px;border:1px solid rgba(var(--gb-ink),.14);border-radius:9px;background:transparent;color:var(--gb-text);font:600 12px system-ui,sans-serif;cursor:pointer}
.gbs-mini.is-on{border-color:transparent;color:var(--gb-ok)}
.gbs-empty{display:grid;place-items:center;gap:8px;min-height:240px;text-align:center}
.gbs-spin{width:34px;height:34px;border:3px solid rgba(var(--gb-ink),.14);border-top-color:#22c55e;border-radius:50%;animation:gbs-turn .8s linear infinite}
/* Coleções da loja (Estúdio de skins). Mobbin: Discord Shop GGEZ e DISXCORE (faixa com a arte da coleção sobre os itens, preço
   embaixo de cada um), Discord Server Tag Badge Packs (um cartão por pacote). A arte é a do próprio item, animada só no Máximo. */
.gbs-tabs .gbs-tab-coll{display:inline-flex;align-items:center;gap:6px}
.gbs-tabs .gbs-tab-coll::before{content:"";width:7px;height:7px;border-radius:50%;background:radial-gradient(circle,#fde68a,#f59e0b);box-shadow:0 0 8px rgba(250,204,21,.8)}
.gbs-cname{color:#fbbf24!important;font-weight:700}
.gbs-colls{display:grid;gap:14px}
.gbs-coll{position:relative;overflow:hidden;border:1px solid rgba(var(--gb-ink),.1);border-radius:18px;background:rgba(var(--gb-ink),.03)}
.gbs-coll.r-epico{border-color:rgba(192,132,252,.4);box-shadow:0 12px 30px -18px rgba(168,85,247,.6)}
.gbs-coll.r-lendario{border-color:rgba(250,204,21,.45);box-shadow:0 0 0 1px rgba(250,204,21,.08),0 14px 34px -18px rgba(250,204,21,.55)}
.gbs-enter .gbs-coll{animation:gbs-in .34s both;animation-delay:calc(var(--i,0)*45ms)}
.gbs-chead{position:relative;display:flex;align-items:flex-end;height:96px;padding:12px 16px;isolation:isolate}
.gbs-chead canvas{position:absolute;inset:0;z-index:-2;width:100%;height:100%}
.gbs-chead::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(4,8,16,.82),rgba(4,8,16,.3) 58%,rgba(4,8,16,0)),linear-gradient(0deg,rgba(4,8,16,.55),transparent 60%)}
.gbs-chead::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 40%,rgba(255,255,255,.16) 50%,transparent 60%);transform:translateX(-120%);animation:gbs-sheen 5s ease-in-out infinite;pointer-events:none}
.gbs-ctitle{display:flex;flex-direction:column;gap:1px;color:#fff;text-shadow:0 2px 8px rgba(0,0,0,.65)}
.gbs-ctitle small{font:800 10.5px system-ui,sans-serif;letter-spacing:.14em;text-transform:uppercase;color:#fde68a}
.gbs-coll.r-epico .gbs-ctitle small{color:#e9d5ff}
.gbs-ctitle b{font:900 23px/1.1 system-ui,sans-serif;letter-spacing:-.01em}
.gbs-ctitle em{font:600 12px system-ui,sans-serif;font-style:normal;opacity:.88}
.gbs-pieces{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.6fr);gap:10px;padding:12px}
.gbs-piece{display:flex;flex-direction:column;gap:6px;min-width:0}
.gbs-ppick{display:grid;grid-template-columns:64px minmax(0,1fr) auto;align-items:center;gap:6px 10px;width:100%;min-height:100%;padding:10px;border:2px solid rgba(var(--gb-ink),.08);border-radius:14px;background:rgba(var(--gb-ink),.04);color:var(--gb-text);text-align:left;cursor:pointer;transition:transform .14s,border-color .14s,background .14s}
.gbs-ppick:hover{transform:translateY(-2px);background:rgba(var(--gb-ink),.07)}
.gbs-ppick:focus-visible,.gbs-cbuy:focus-visible{outline:2px solid #60a5fa;outline-offset:2px}
.gbs-piece.is-sel .gbs-ppick{border-color:#22c55e;background:rgba(34,197,94,.08)}
.gbs-piece.is-plate .gbs-ppick{grid-template-columns:minmax(0,1fr) auto}
.gbs-cdisc{width:64px;height:64px;filter:drop-shadow(0 4px 8px rgba(0,0,0,.35))}
.gbs-cplate{position:relative;display:block;grid-column:1/-1;height:48px;border-radius:10px;overflow:hidden;box-shadow:inset 0 0 0 1px rgba(255,255,255,.14)}
.gbs-cplate canvas{display:block;width:100%;height:100%}
.gbs-cplate::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.34),rgba(0,0,0,.04))}
.gbs-cplate b{position:absolute;left:12px;top:50%;transform:translateY(-50%);color:#fff;font:800 14px system-ui,sans-serif;text-shadow:0 1px 3px rgba(0,0,0,.85)}
.gbs-ptext{min-width:0}.gbs-ptext b{display:block;overflow:hidden;color:var(--gb-hi);font-size:13.5px;text-overflow:ellipsis;white-space:nowrap}.gbs-ptext small{color:var(--gb-muted);font-size:11.5px}
.gbs-cprice{justify-self:end;color:var(--gb-hi);font:900 15px system-ui,sans-serif;white-space:nowrap}.gbs-cprice s{margin-right:6px;font-size:12px;font-weight:600;opacity:.6}
.gbs-ctag{justify-self:end;padding:3px 9px;border-radius:999px;background:rgba(var(--gb-ink),.1);color:var(--gb-hi);font:800 11px system-ui,sans-serif}
.gbs-ctag.is-on{background:#22c55e;color:#04210f}.gbs-ctag.is-free{background:rgba(34,197,94,.2);color:var(--gb-ok)}
.gbs-cbuy{padding:9px 12px;border:0;border-radius:11px;background:linear-gradient(135deg,#fde047,#f59e0b);color:#2a1700;font:800 13px system-ui,sans-serif;cursor:pointer;transition:transform .14s,filter .14s,box-shadow .14s}
.gbs-cbuy:hover{transform:translateY(-1px);filter:brightness(1.05);box-shadow:0 6px 16px -6px rgba(245,158,11,.8)}
.gbs-stage.is-buy .gbs-actions{border-radius:14px;animation:gbs-buyglow 1s ease 2}
@keyframes gbs-buyglow{50%{box-shadow:0 0 0 4px rgba(250,204,21,.45)}}
html[data-gb-theme=light] .gbs-coll,html[data-gb-theme=light] .gbs-ppick{border-color:rgba(15,23,42,.22)}
html[data-gb-theme=light] .gbs-cname{color:#92400e!important}
@media (max-width:620px){.gbs-pieces{grid-template-columns:1fr}.gbs-chead{height:84px}.gbs-ctitle b{font-size:20px}}
@media (prefers-reduced-motion:reduce){.gbs-enter .gbs-coll,.gbs-chead::after,.gbs-stage.is-buy .gbs-actions{animation:none}.gbs-ppick,.gbs-cbuy{transition:none}}
@keyframes gbs-fade{from{opacity:0}}
@keyframes gbs-rise{from{opacity:0;transform:translateY(14px) scale(.98)}}
@keyframes gbs-in{from{opacity:0;transform:translateY(8px)}}
@keyframes gbs-float{50%{transform:translateY(-6px)}}
@keyframes gbs-pop{40%{transform:scale(1.12)}}
@keyframes gbs-sheen{60%,100%{transform:translateX(120%)}}
@keyframes gbs-turn{to{transform:rotate(360deg)}}
@media (max-width:620px){.gbs-back{padding:0}.gbs-sheet{height:100%;border-radius:0}.gbs-stage{grid-template-columns:1fr}.gbs-pitch{height:170px}.gbs-pitch canvas{width:130px;height:130px}.gbs-row{grid-template-columns:44px 1fr}.gbs-rowacts{grid-column:1/-1}#menuView .gbm-nameplate{min-width:0;max-width:60%}}
@media (prefers-reduced-motion:reduce){.gbs-back,.gbs-sheet,.gbs-enter .gbs-card,.gbs-row,.gbs-pitch canvas,.gbs-card.r-lendario::after,.gb-plate-anim{animation:none}#menuView .gbm-nameplate:hover::after{animation:none}}

/* Community maps: the "Mapas" window (src/ui/map-library.js) and the editor (src/ui/map-editor.js).
   Mobbin: Browserbase Templates, v0 Community Templates, Base44 App Templates, MagicPath Community;
   Luma, Recraft, Subframe, Wix, Base44 canvas, Shopify image editor, Klaviyo editor. */
.gml-back{position:fixed;inset:0;z-index:9400;display:flex;align-items:center;justify-content:center;padding:18px;background:rgba(4,8,16,.74);-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px);animation:gbs-fade .18s both;font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif}
.gml-sheet{display:flex;flex-direction:column;width:min(1080px,100%);height:min(720px,100%);border:1px solid rgba(var(--gb-edge),.16);border-radius:22px;background:radial-gradient(700px 300px at 0 0,rgba(34,197,94,.1),transparent 60%),radial-gradient(600px 300px at 100% 100%,rgba(59,130,246,.1),transparent 60%),var(--gb-panel);color:var(--gb-text);box-shadow:0 30px 90px rgba(0,0,0,.65);overflow:hidden;animation:gbs-rise .26s cubic-bezier(.2,.9,.3,1.2) both}
.gml-head{display:flex;align-items:center;gap:18px;padding:14px 18px;border-bottom:1px solid rgba(var(--gb-ink),.07)}
.gml-head h2{margin:0;font:900 22px "Segoe UI Black","Arial Black",system-ui,sans-serif;color:var(--gb-hi);letter-spacing:.2px}
.gml-tabs{display:flex;gap:4px;padding:4px;border-radius:12px;background:rgba(var(--gb-ink),.05)}
.gml-tab{padding:7px 14px;border:0;border-radius:9px;background:transparent;color:var(--gb-muted);font:700 13.5px system-ui,sans-serif;cursor:pointer;transition:background .16s,color .16s}
.gml-tab:hover{color:var(--gb-hi)}.gml-tab.is-on{background:linear-gradient(135deg,#22c55e,#16a34a);color:#04120a;box-shadow:0 4px 16px rgba(34,197,94,.35)}
.gml-x{margin-left:auto;width:34px;height:34px;border:0;border-radius:10px;background:rgba(var(--gb-ink),.08);color:var(--gb-hi);font-size:14px;cursor:pointer}.gml-x:hover{background:rgba(var(--gb-ink),.16)}
.gml-tools{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:10px 18px}
.gml-input{min-width:0;padding:8px 11px;border:1px solid rgba(var(--gb-edge),.2);border-radius:10px;background:rgba(var(--gb-well),.6);color:var(--gb-text);font:600 13.5px system-ui,sans-serif;outline:none;transition:border-color .16s,box-shadow .16s}
.gml-input:focus{border-color:#22c55e;box-shadow:0 0 0 3px rgba(34,197,94,.22)}
input.gml-input{flex:1 1 220px}.gml-sort{flex:none}.gml-sort option{background:var(--gb-panel)}
.gml-btn{padding:8px 13px;border:1px solid rgba(var(--gb-edge),.2);border-radius:10px;background:rgba(var(--gb-ink),.05);color:var(--gb-text);font:700 13px system-ui,sans-serif;cursor:pointer;transition:transform .14s,background .14s,border-color .14s,box-shadow .14s}
.gml-btn:hover:not(:disabled){background:rgba(var(--gb-ink),.1);border-color:rgba(var(--gb-edge),.4);transform:translateY(-1px)}.gml-btn:disabled{opacity:.45;cursor:default}
.gml-pri{border-color:transparent;background:linear-gradient(135deg,#22c55e,#16a34a);color:#04120a;box-shadow:0 6px 18px rgba(34,197,94,.3)}.gml-pri:hover:not(:disabled){background:linear-gradient(135deg,#34d399,#22c55e);box-shadow:0 8px 24px rgba(34,197,94,.45)}
.gml-danger{color:var(--gb-bad);border-color:rgba(244,63,94,.35)}.gml-danger:hover:not(:disabled){background:rgba(244,63,94,.14);border-color:rgba(244,63,94,.6)}
.gml-count{margin-left:auto;color:var(--gb-muted);font-size:12px}
.gml-main{flex:1;min-height:0;display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:0;border-top:1px solid rgba(var(--gb-ink),.05)}
.gml-grid{align-content:start;display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px;padding:14px 18px 18px;overflow-y:auto;scrollbar-width:thin}
.gml-card{position:relative;display:flex;flex-direction:column;padding:0;border:1px solid rgba(var(--gb-edge),.14);border-radius:14px;background:rgba(var(--gb-ink),.03);color:inherit;text-align:left;cursor:pointer;overflow:hidden;animation:gbs-in .3s both;animation-delay:calc(var(--i,0)*22ms);transition:transform .16s,border-color .16s,box-shadow .16s}
.gml-card::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 40%,rgba(255,255,255,.14) 50%,transparent 60%);transform:translateX(-120%);pointer-events:none}
.gml-card:hover{transform:translateY(-3px);border-color:rgba(134,239,172,.5);box-shadow:0 12px 28px rgba(0,0,0,.4)}.gml-card:hover::after{animation:gbs-sheen .8s ease}
.gml-card.is-on{border-color:#22c55e;box-shadow:0 0 0 1px rgba(34,197,94,.55),0 0 24px rgba(34,197,94,.3)}
.gml-thumb{display:block;width:100%;aspect-ratio:16/9;height:auto}
.gml-meta{display:flex;flex-direction:column;gap:2px;padding:9px 11px 10px}
.gml-name{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:14px;color:var(--gb-hi)}
.gml-sub{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;color:var(--gb-muted);font-size:12px}
.gml-tag{position:absolute;top:8px;right:8px;padding:2px 8px;border-radius:999px;background:rgba(var(--gb-well),.78);color:var(--gb-ok);font:700 11px system-ui,sans-serif}.gml-tag.is-bad{color:var(--gb-gold)}
.gml-side{display:flex;flex-direction:column;gap:8px;padding:14px 16px;border-left:1px solid rgba(var(--gb-ink),.06);background:rgba(var(--gb-well),.35);overflow-y:auto;scrollbar-width:thin}
.gml-big{width:100%;height:auto;aspect-ratio:16/9;border-radius:12px;box-shadow:0 10px 26px rgba(0,0,0,.45);animation:gbs-in .22s both}
.gml-title{margin:4px 0 0;font-size:17px;color:var(--gb-hi);overflow-wrap:anywhere}.gml-by{margin:0;color:var(--gb-muted);font-size:12.5px}
.gml-desc{margin:0;font-size:13.5px;color:#cbd5e6;overflow-wrap:anywhere}.gml-warn{margin:0;padding:8px 10px;border-radius:10px;background:rgba(251,191,36,.12);color:var(--gb-gold);font-size:12.5px}
.gml-hint{margin:auto 0;text-align:center;color:var(--gb-muted);font-size:13px}
.gml-acts{display:flex;flex-direction:column;gap:7px;margin-top:6px}
.gml-empty{grid-column:1/-1;margin:40px auto;text-align:center;color:var(--gb-muted);font-size:14px}.gml-empty p{margin:0 0 10px}
.gml-pages{grid-column:1/-1;display:flex;align-items:center;gap:10px}.gml-pages .gml-count{margin:0 auto}
.gml-side-x{display:none}
@media (max-width:800px){.gml-back{padding:0}.gml-sheet{height:100%;border-radius:0;border:0}.gml-main{grid-template-columns:1fr}.gml-side{display:none;position:fixed;left:0;right:0;bottom:0;z-index:2;max-height:78%;border:0;border-top:1px solid rgba(var(--gb-edge),.2);border-radius:18px 18px 0 0;background:var(--gb-panel);box-shadow:0 -18px 50px rgba(0,0,0,.6)}.gml-side.is-open{display:flex;animation:gbs-rise .22s both}.gml-side-x{display:block}.gml-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));padding:12px}.gml-head{gap:10px;padding:12px}.gml-head h2{display:none}}
.gme-chip{position:fixed;top:calc(12px + env(safe-area-inset-top,0px));left:14px;z-index:9000;padding:9px 16px;border:0;border-radius:999px;background:linear-gradient(135deg,#22c55e,#16a34a);color:#04120a;font:800 13.5px system-ui,sans-serif;box-shadow:0 10px 28px rgba(34,197,94,.45);cursor:pointer}.gme-chip[hidden]{display:none}
.gme{position:fixed;inset:0;z-index:9500;display:grid;grid-template:56px minmax(0,1fr)/minmax(0,1fr) auto;background:radial-gradient(900px 500px at 15% -10%,rgba(34,197,94,.12),transparent 60%),radial-gradient(800px 500px at 110% 110%,rgba(59,130,246,.14),transparent 60%),var(--gb-panel);color:var(--gb-text);font:14px/1.4 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;animation:gbs-fade .2s both;touch-action:none}
.gme *{box-sizing:border-box}
.gme-top{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:8px 12px;background:rgba(var(--gb-glass),.72);border-bottom:1px solid rgba(var(--gb-edge),.14);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.gme-top-l,.gme-top-r{display:flex;align-items:center;gap:7px;min-width:0}.gme-top-l{flex:1;overflow:hidden}.gme-top-r{flex:none}
.gme-name{flex:0 1 240px;min-width:90px;padding:7px 10px;border:1px solid transparent;border-radius:9px;background:transparent;color:var(--gb-hi);font:800 15px system-ui,sans-serif;outline:none;transition:border-color .16s,background .16s}
.gme-name:hover{background:rgba(var(--gb-ink),.05)}.gme-name:focus{border-color:#22c55e;background:rgba(var(--gb-well),.6)}
.gme-status{flex:0 1 auto;min-width:0;overflow:hidden;text-overflow:ellipsis;padding:4px 10px;border:1px solid rgba(34,197,94,.35);border-radius:999px;background:rgba(34,197,94,.12);color:var(--gb-ok);font:700 12px system-ui,sans-serif;white-space:nowrap;cursor:default}.gme-status.is-bad{border-color:rgba(251,191,36,.45);background:rgba(251,191,36,.12);color:var(--gb-gold);cursor:pointer}
.gme-btn{padding:7px 12px;border:1px solid rgba(var(--gb-edge),.2);border-radius:10px;background:rgba(var(--gb-ink),.05);color:var(--gb-text);font:700 13px system-ui,sans-serif;white-space:nowrap;cursor:pointer;transition:transform .14s,background .14s,box-shadow .14s}
.gme-btn:hover{background:rgba(var(--gb-ink),.1);transform:translateY(-1px)}.gme-btn.is-danger{color:var(--gb-bad);border-color:rgba(244,63,94,.35)}
.gme-pri{border-color:transparent;background:linear-gradient(135deg,#22c55e,#16a34a);color:#04120a;box-shadow:0 6px 18px rgba(34,197,94,.3)}.gme-pri:hover{background:linear-gradient(135deg,#34d399,#22c55e)}
.gme-ic{width:34px;height:34px;border:0;border-radius:10px;background:rgba(var(--gb-ink),.06);color:var(--gb-text);font-size:17px;cursor:pointer}.gme-ic:hover:not(:disabled){background:rgba(var(--gb-ink),.14)}.gme-ic:disabled{opacity:.35;cursor:default}
.gme-stage{position:relative;min-width:0;min-height:0;overflow:hidden}
.gme-canvas{position:absolute;inset:0;width:100%;height:100%;display:block;touch-action:none;cursor:default}
.gme-canvas[data-tool=pan]{cursor:grab}.gme-canvas[data-tool=wall],.gme-canvas[data-tool=disc],.gme-canvas[data-tool=goal],.gme-canvas[data-tool=spawn]{cursor:crosshair}
.gme-rail{position:absolute;left:12px;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:4px;padding:6px;border:1px solid rgba(var(--gb-edge),.16);border-radius:16px;background:rgba(var(--gb-glass),.78);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 14px 34px rgba(0,0,0,.45)}
.gme-tool{width:42px;height:42px;display:grid;place-items:center;border:0;border-radius:11px;background:transparent;color:var(--gb-text-2);cursor:pointer;transition:background .14s,color .14s,box-shadow .14s,transform .14s}
.gme-tool svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.gme-tool:hover{background:rgba(var(--gb-ink),.08);color:var(--gb-hi);transform:scale(1.05)}.gme-tool.is-on{background:linear-gradient(135deg,#22c55e,#16a34a);color:#04120a;box-shadow:0 0 0 1px rgba(34,197,94,.55),0 0 18px rgba(34,197,94,.45)}
.gme-pill{position:absolute;left:50%;bottom:12px;transform:translateX(-50%);display:flex;align-items:center;gap:4px;max-width:calc(100% - 24px);padding:5px 8px;border:1px solid rgba(var(--gb-edge),.16);border-radius:999px;background:rgba(var(--gb-glass),.82);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:0 12px 30px rgba(0,0,0,.45);white-space:nowrap}
.gme-pill-b{width:30px;height:30px;border:0;border-radius:50%;background:transparent;color:var(--gb-text);font-size:16px;cursor:pointer}.gme-pill-b:hover{background:rgba(var(--gb-ink),.1)}
.gme-zoom{min-width:46px;text-align:center;font:700 12.5px system-ui,sans-serif;color:var(--gb-text-2)}
.gme-snap{margin:0 4px;padding:4px 6px;border:0;border-radius:8px;background:rgba(var(--gb-ink),.07);color:var(--gb-text);font:600 12.5px system-ui,sans-serif}.gme-snap option{background:var(--gb-panel)}
.gme-counts{padding:0 6px;color:var(--gb-muted);font-size:12px}
.gme-toast{position:absolute;left:50%;top:14px;transform:translate(-50%,-8px);padding:8px 14px;border-radius:999px;background:rgba(var(--gb-well),.92);border:1px solid rgba(var(--gb-edge),.2);color:var(--gb-text);font-size:13px;opacity:0;pointer-events:none}.gme-toast.is-on{animation:gme-toast 2.4s ease both}
@keyframes gme-toast{0%{opacity:0;transform:translate(-50%,-8px)}8%,85%{opacity:1;transform:translate(-50%,0)}100%{opacity:0}}
.gme-side{position:relative;width:0;background:rgba(var(--gb-glass),.78);border-left:1px solid rgba(var(--gb-edge),.14);display:flex;flex-direction:column;min-height:0;transition:width .2s ease;touch-action:pan-y}
.gme-side.is-open{width:300px}.gme-side>.gme-tabs,.gme-side>.gme-panel{display:none}.gme-side.is-open>.gme-tabs{display:flex}.gme-side.is-open>.gme-panel{display:flex}
.gme-fold{position:absolute;left:-34px;top:12px;width:30px;height:36px;border:1px solid rgba(var(--gb-edge),.16);border-radius:10px;background:rgba(var(--gb-glass),.82);color:var(--gb-text);cursor:pointer;z-index:2;transition:transform .2s}.gme-side:not(.is-open) .gme-fold{transform:scaleX(-1)}
.gme-tabs{gap:3px;margin:10px 12px 0;padding:3px;border-radius:11px;background:rgba(var(--gb-ink),.05)}
.gme-tab{flex:1;padding:6px 8px;border:0;border-radius:8px;background:transparent;color:var(--gb-muted);font:700 12.5px system-ui,sans-serif;cursor:pointer}.gme-tab.is-on{background:rgba(34,197,94,.2);color:var(--gb-ok)}
.gme-panel{flex:1;min-height:0;flex-direction:column;gap:10px;padding:12px;overflow-y:auto;scrollbar-width:thin}
.gme-field{display:flex;flex-direction:column;gap:4px;min-width:0;color:var(--gb-muted);font-size:12px;font-weight:600}
.gme-input{width:100%;padding:7px 9px;border:1px solid rgba(var(--gb-edge),.2);border-radius:9px;background:rgba(var(--gb-well),.6);color:var(--gb-text);font:600 13px system-ui,sans-serif;outline:none;resize:vertical}.gme-input:focus{border-color:#22c55e;box-shadow:0 0 0 3px rgba(34,197,94,.2)}.gme-input option{background:var(--gb-panel)}
.gme-color{width:100%;height:34px;padding:2px;border:1px solid rgba(var(--gb-edge),.2);border-radius:9px;background:rgba(var(--gb-well),.6);cursor:pointer}
.gme-two{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.gme-note{margin:0;color:var(--gb-muted);font-size:12px}.gme-h{margin:0;font-size:14px;color:var(--gb-hi)}
.gme-range{display:flex;flex-direction:column;gap:3px}.gme-range-h{display:flex;justify-content:space-between;color:var(--gb-muted);font-size:12px;font-weight:600}.gme-range-h output{color:var(--gb-ok);font-variant-numeric:tabular-nums}.gme-range input{width:100%;accent-color:#22c55e}
.gme-obj-acts{display:flex;flex-wrap:wrap;gap:6px;margin-top:4px}
@media (max-width:1180px){.gme-hide-s{display:none}}
@media (max-width:1000px){.gme{grid-template-columns:minmax(0,1fr)}.gme-side{position:absolute;top:56px;right:0;bottom:0;z-index:3}.gme-side.is-open{box-shadow:-18px 0 40px rgba(0,0,0,.5)}.gme-tool{width:46px;height:46px}.gme-counts{display:none}.gme-status{max-width:150px;overflow:hidden;text-overflow:ellipsis}}
@media (max-width:700px){.gme-name{flex-basis:120px}.gme-top-r .gme-btn{padding:7px 9px}}
@media (prefers-reduced-motion:reduce){.gml-card,.gml-big,.gml-sheet,.gme{animation:none}.gml-card:hover::after{animation:none}}
#btnMapLibrary.esc-maps-btn{flex:none;align-self:stretch;padding:0 16px;border:1px solid rgba(134,239,172,.4);border-radius:12px;background:linear-gradient(135deg,rgba(34,197,94,.24),rgba(59,130,246,.22));color:var(--gb-ok);font-weight:800;white-space:nowrap;transition:transform .14s,box-shadow .14s}
#btnMapLibrary.esc-maps-btn:hover{transform:translateY(-1px);box-shadow:0 6px 18px rgba(34,197,94,.3)}

/* Convites. Panel route of .gbx-* (src/ui/invites-panel.js), medals and title (src/ui/invite-art.js), card row and hall strip. */
.iv-page{display:flex;flex-direction:column;gap:14px;min-width:0}
.iv-cols{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:14px;align-items:start}
.iv-col{display:flex;flex-direction:column;gap:14px;min-width:0}
@media (max-width:820px){.iv-cols{grid-template-columns:minmax(0,1fr)}}
.iv-card{position:relative;padding:14px 16px;border:1px solid var(--c-line);border-radius:16px;background:var(--c-card);min-width:0}
.iv-h{font:800 14px/1.2 system-ui,sans-serif;letter-spacing:.02em;color:var(--gb-hi)}
.iv-card>.iv-h{margin-bottom:10px}
.iv-head{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:10px}
.iv-muted{color:var(--c-muted);font-size:12.5px}
.iv-rule{margin-top:10px!important;color:var(--c-muted);font-size:12.5px;line-height:1.45}
.iv-medal{display:inline-flex;flex:none;width:var(--iv-size);height:var(--iv-size);filter:drop-shadow(0 3px 7px rgba(0,0,0,.45))}
.iv-medal svg{display:block;width:100%;height:100%}
.iv-medal.is-locked{filter:none;opacity:.55}
.iv-title{display:inline-flex;align-items:center;gap:4px;color:#f5c542;line-height:1}
.iv-title svg{width:11px;height:15px;flex:none}
.iv-title b{font:900 11.5px/1 var(--display,"Arial Black",system-ui,sans-serif);font-style:italic;letter-spacing:.09em;text-transform:uppercase;background:linear-gradient(100deg,#b7791f 0%,#fde68a 32%,#fffbeb 50%,#fde68a 68%,#b7791f 100%);background-size:220% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:iv-sheen 5.5s linear infinite}
@keyframes iv-sheen{from{background-position:120% 0}to{background-position:-100% 0}}
.iv-hero{position:relative;display:flex;align-items:center;gap:18px;padding:18px 20px;border:1px solid rgba(251,191,36,.28);border-radius:18px;overflow:hidden;background:radial-gradient(420px 220px at 8% 0,rgba(251,191,36,.2),transparent 70%),radial-gradient(520px 260px at 100% 120%,rgba(59,130,246,.22),transparent 70%),rgba(var(--gb-ink),.04)}
.iv-hero-crest{position:relative;flex:none;display:grid;place-items:center;width:112px;height:112px}
.iv-hero-crest::before{content:"";position:absolute;inset:6px;border-radius:50%;background:radial-gradient(circle,rgba(253,230,138,.34),transparent 68%)}
.iv-hero-crest .iv-medal{position:relative;animation:gbx-pop-in .45s cubic-bezier(.2,.9,.3,1.3) both}
.iv-hero-t{flex:1;min-width:0}
.iv-count{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.iv-count b{font:900 44px/1 var(--display,"Arial Black",system-ui,sans-serif);font-style:italic;font-variant-numeric:tabular-nums;color:var(--gb-hi)}
.iv-count span{color:var(--c-muted);font-weight:700;font-size:13.5px}
.iv-rank{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:6px}
.iv-rank-l{font-weight:800;font-size:13px;color:var(--c-gold)}
.iv-bar{height:10px;margin-top:10px;border-radius:999px;overflow:hidden;background:rgba(var(--gb-ink),.1)}
.iv-bar i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#f59e0b,#fde68a);box-shadow:0 0 12px rgba(251,191,36,.6);transition:width .7s cubic-bezier(.2,.8,.2,1)}
.iv-next{margin-top:8px!important;font-size:13px;line-height:1.4;color:var(--c-text)}
.iv-open{margin-top:2px!important;font-size:12.5px;color:var(--c-muted)}
.iv-link{display:flex;align-items:center;gap:8px;padding:5px 5px 5px 13px;border:1px solid var(--c-line);border-radius:999px;background:rgba(var(--gb-ink),.04)}
.iv-link .gbx-btn{border-radius:999px;flex:none}
.iv-url{flex:1;min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:13px;color:var(--c-text);user-select:all}
.iv-code{display:flex;align-items:center;gap:10px;margin:10px 0}
.iv-code span{color:var(--c-muted);font-size:12.5px}
.iv-code b{flex:1;font:900 20px/1 ui-monospace,Consolas,monospace;letter-spacing:.14em;color:var(--gb-hi);user-select:all}
.iv-go{width:100%}
.iv-welcome{display:flex;align-items:center;gap:14px;border-color:rgba(34,197,94,.35);background:linear-gradient(120deg,rgba(34,197,94,.1),transparent 70%),var(--c-card)}
.iv-welcome-t{display:flex;flex-direction:column;gap:4px;min-width:0;font-size:13px}
.iv-welcome-t span:not(.iv-dots){color:var(--c-muted);line-height:1.4}
.iv-disc{display:block;flex:none;border-radius:50%;box-shadow:0 0 0 2px rgba(var(--gb-ink),.28),0 4px 12px rgba(0,0,0,.4)}
.iv-plate{position:relative;display:inline-flex;align-items:center;border-radius:8px;overflow:hidden;box-shadow:0 2px 8px rgba(0,0,0,.4)}
.iv-plate-art{display:block}
.iv-plate b{position:absolute;left:9px;right:30px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;color:#fff;font-size:12px;text-shadow:0 1px 2px rgba(0,0,0,.7)}
.iv-redeem{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.iv-redeem-l{font-weight:700;font-size:13px}
.iv-input{flex:1 1 150px;min-width:0;min-height:34px;padding:6px 10px;border:1px solid var(--c-line);border-radius:10px;background:rgba(var(--gb-ink),.05);color:var(--c-text);font:600 13px system-ui,sans-serif;text-transform:uppercase}
.iv-input::placeholder{text-transform:none;color:var(--c-muted)}
.iv-ladder{position:relative;display:flex;flex-direction:column}
.iv-ladder::before{content:"";position:absolute;left:22px;top:18px;bottom:18px;width:2px;background:rgba(var(--gb-ink),.12)}
.iv-step{position:relative;display:flex;align-items:center;gap:12px;padding:9px 8px 9px 0;border-radius:12px}
.iv-step .iv-medal{position:relative;z-index:1}
.iv-step.is-next{background:linear-gradient(90deg,rgba(251,191,36,.12),transparent 80%)}
.iv-step-t{flex:1;min-width:0}
.iv-step-h{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}
.iv-step-h b{font-size:14px;color:var(--gb-hi)}
.iv-goal{color:var(--c-muted);font-size:12px}
.iv-lines{font-size:12.5px;line-height:1.4;color:var(--c-muted)}
.iv-step.is-done .iv-lines{color:var(--c-text)}
.iv-step-t .iv-title{margin-top:3px}
.iv-step-art{flex:none;display:flex;gap:6px;align-items:center}
.iv-people{display:flex;flex-direction:column;gap:6px}
.iv-person{display:flex;align-items:center;gap:10px;padding:7px 8px;border-radius:12px;background:rgba(var(--gb-ink),.03);min-width:0}
.iv-ava{flex:none;display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:linear-gradient(135deg,#334155,#1e293b);color:#e2e8f0;font:800 11.5px system-ui,sans-serif}
.iv-person-t{flex:1;min-width:0;display:flex;flex-direction:column;gap:4px}
.iv-person-t b{overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:13.5px;color:var(--c-text)}
.iv-dots{display:inline-flex;gap:4px}
.iv-dots i{width:14px;height:5px;border-radius:999px;background:rgba(var(--gb-ink),.14)}
.iv-dots i.is-on{background:#22c55e}
.iv-pill{flex:none;max-width:56%;padding:3px 9px;border-radius:999px;font-size:11.5px;font-weight:700;line-height:1.3;text-align:right}
.iv-pill.t-ok{background:rgba(34,197,94,.16);color:var(--gb-good,#16a34a)}
.iv-pill.t-go{background:rgba(59,130,246,.16);color:#60a5fa}
.iv-pill.t-idle{background:rgba(var(--gb-ink),.08);color:var(--c-muted)}
.iv-pill.t-wait{background:rgba(251,191,36,.16);color:#d99a0b}
.iv-pill.t-off{background:rgba(244,63,94,.14);color:var(--gb-bad)}
.iv-seg{display:inline-flex;padding:3px;border-radius:999px;background:rgba(var(--gb-ink),.07)}
.iv-seg .gbx-btn{min-height:30px;padding:3px 11px;border:0;border-radius:999px;background:transparent;font-size:12px;color:var(--c-muted)}
.iv-seg .gbx-btn[aria-selected=true]{background:rgba(var(--gb-ink),.16);color:var(--gb-hi)}
.iv-podium{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;align-items:end}
.iv-pod{display:flex;flex-direction:column;align-items:center;gap:4px;padding:10px 6px;border-radius:14px;background:rgba(var(--gb-ink),.05);text-align:center;min-width:0}
.iv-pod b{max-width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:12.5px;color:var(--c-text)}
.iv-pod.p-1{padding-top:18px;background:linear-gradient(180deg,rgba(251,191,36,.24),rgba(251,191,36,.05));box-shadow:inset 0 0 0 1px rgba(251,191,36,.4)}
.iv-pod.p-1 .iv-ava{width:42px;height:42px;background:linear-gradient(135deg,#fde68a,#b45309);color:#3b2500}
.iv-pod.is-me b{color:var(--c-gold)}
.iv-pod-n{font:900 15px/1 var(--display,"Arial Black",system-ui,sans-serif);font-style:italic;color:var(--c-muted)}
.iv-pod.p-1 .iv-pod-n{color:var(--c-gold)}
.iv-pod-c{color:var(--c-muted);font-size:11.5px}
.iv-rlist{display:flex;flex-direction:column;gap:4px;margin-top:8px}
.iv-rlist.is-pin{padding-top:8px;border-top:1px dashed var(--c-line)}
.iv-rrow{display:flex;align-items:center;gap:8px;padding:6px 10px;border-radius:10px;background:rgba(var(--gb-ink),.03);font-size:13px}
.iv-rrow.is-me{background:rgba(251,191,36,.13)}
.iv-rpos{width:22px;color:var(--c-muted);font-weight:800;font-variant-numeric:tabular-nums}
.iv-rname{flex:1;min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;color:var(--c-text)}
.iv-rn{font-variant-numeric:tabular-nums;color:var(--gb-hi)}
.iv-prizes{display:flex;flex-direction:column;gap:3px;margin-top:10px!important;font-size:12.5px}
.iv-prizes li{display:flex;gap:8px;color:var(--c-muted)}
.iv-prizes b{color:var(--c-gold)}
.iv-hall{margin-bottom:14px;padding:12px 14px;border:1px solid rgba(251,191,36,.3);border-radius:16px;background:linear-gradient(120deg,rgba(251,191,36,.12),transparent 70%)}
.iv-hall-row{display:flex;gap:10px;margin-top:8px;overflow-x:auto;padding-bottom:4px}
.iv-hall-i{flex:none;display:flex;flex-direction:column;align-items:center;gap:4px;min-width:112px;padding:8px;text-align:center;font-size:13px}
.iv-hall-i small{color:var(--c-muted)}
.pc-invite{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin:-2px 0 8px}
.pc-invite-l{font-size:12px;font-weight:700;color:#d99a0b}
html[data-gb-theme=light] .iv-title b{background-image:linear-gradient(100deg,#7c4a03 0%,#b7791f 40%,#d99a0b 50%,#b7791f 60%,#7c4a03 100%)}
html[data-gb-theme=light] .iv-title{color:#92560b}
@media (max-width:560px){.iv-hero{padding:14px;gap:12px}.iv-hero-crest{width:78px;height:78px}.iv-hero-crest .iv-medal{--iv-size:66px!important}.iv-count b{font-size:34px}.iv-step-art .iv-plate{display:none}}
@media (prefers-reduced-motion:reduce){.iv-title b,.iv-hero-crest .iv-medal{animation:none}.iv-bar i{transition:none}}
/* Times, Torneios e Avisos. Menu: third hero card, bell, team tag. Panel: .gbx-* (lives on <body>, outside #menuView). */
@media (min-width:1101px){#menuView .gbm-hero{grid-template-columns:1.25fr 1fr 1fr}}
@media (min-width:901px) and (max-width:1100px){#menuView .gbm-hero{grid-template-columns:1fr 1fr}#menuView .gbm-hero .gbm-rank{grid-column:1/-1}}
#menuView .gbm-t-cup{background:rgba(251,191,36,.14);color:var(--gb-gold);box-shadow:inset 0 0 0 1px rgba(251,191,36,.42)}
#menuView .gbm-mcard.gbm-cups:hover{box-shadow:0 0 0 1px rgba(251,191,36,.5),0 30px 70px -20px rgba(251,191,36,.35)}
#menuView .gbm-np-tag{flex:none;padding:1px 6px;border-radius:6px;background:rgba(0,0,0,.5);font-size:11px;font-weight:800;letter-spacing:.06em;color:var(--gb-gold)}
#menuView .gbm-bell{position:relative;flex:none;display:grid;place-items:center;width:42px;height:42px;padding:0;border:1px solid rgba(var(--gb-ink),.16);border-radius:12px;background:linear-gradient(135deg,rgba(var(--gb-ink),.1),rgba(var(--gb-ink),.03));color:var(--text);cursor:pointer;transition:transform .2s var(--ease),border-color .2s}
#menuView .gbm-themebtn{flex:none;display:grid;place-items:center;width:42px;height:42px;padding:0;border:1px solid rgba(var(--gb-ink),.16);border-radius:12px;background:rgba(var(--gb-ink),.05);color:var(--gb-text);cursor:pointer;transition:transform .15s,border-color .15s}
#menuView .gbm-themebtn:hover{transform:translateY(-1px) rotate(-8deg);border-color:rgba(251,191,36,.6)}
#menuView .gbm-themebtn:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(59,130,246,.6)}
#menuView .gbm-bell:hover{transform:translateY(-1px);border-color:rgba(251,191,36,.6)}
#menuView .gbm-bell:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(59,130,246,.6)}
#menuView .gbm-bell-n{position:absolute;top:-6px;right:-6px;min-width:19px;height:19px;padding:0 5px;border-radius:999px;background:#e11d48;color:#fff;font:800 11px/19px system-ui;text-align:center;box-shadow:0 0 0 2px #0c1322;animation:gbx-pop-in .3s var(--ease) both}

.gbx-back{--c-text:var(--gb-text);--c-muted:var(--gb-muted);--c-line:rgba(var(--gb-edge),.16);--c-card:rgba(var(--gb-ink),.035);--c-green:#22c55e;--c-gold:#fbbf24;--c-blue:#3b82f6;--c-red:#f43f5e;--display:"Segoe UI Black","Arial Black","Helvetica Neue",system-ui,sans-serif;
position:fixed;inset:0;z-index:9950;display:flex;align-items:center;justify-content:center;padding:16px;background:rgba(4,8,16,.74);-webkit-backdrop-filter:blur(7px);backdrop-filter:blur(7px);animation:gbs-fade .18s both;font:14px/1.45 system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color:var(--c-text);text-align:left}
.gbx-back *,.gbx-back *::before,.gbx-back *::after{box-sizing:border-box}
.gbx-back h2,.gbx-back h3,.gbx-back p,.gbx-back ul,.gbx-back ol{margin:0;padding:0}
.gbx-back ul,.gbx-back ol{list-style:none}
.gbx-sheet{position:relative;display:flex;flex-direction:column;width:min(1120px,100%);height:min(780px,100%);min-width:0;border:1px solid var(--c-line);border-radius:22px;outline:none;overflow:hidden;background:radial-gradient(900px 420px at 0 -10%,rgba(251,191,36,.08),transparent 60%),radial-gradient(800px 460px at 110% 0,rgba(59,130,246,.12),transparent 60%),#0a101d;box-shadow:0 30px 90px rgba(0,0,0,.65);animation:gbs-rise .26s cubic-bezier(.2,.9,.3,1.2) both}
.gbx-head{flex:none;display:flex;align-items:center;gap:10px;padding:12px 14px;border-bottom:1px solid var(--c-line)}
.gbx-title{flex:1;min-width:0;font:900 22px/1.15 var(--display);font-style:italic;letter-spacing:-.01em;color:var(--gb-hi);overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.gbx-body{flex:1;min-height:0;min-width:0;padding:16px 18px 22px;overflow-x:hidden;overflow-y:auto;-webkit-overflow-scrolling:touch}
.gbx-stack{display:flex;flex-direction:column;gap:14px;min-width:0}
.gbx-tabslot{min-width:0}
.gbx-muted{color:var(--c-muted);font-size:13px}
.gbx-center{text-align:center}
.gbx-self-end{align-self:flex-end}.gbx-self-center{align-self:center}
.gbx-pre{white-space:pre-wrap;overflow-wrap:anywhere}

.gbx-btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:40px;padding:8px 15px;border:1px solid var(--c-line);border-radius:12px;background:rgba(var(--gb-ink),.05);color:var(--c-text);font:700 13.5px system-ui,sans-serif;text-decoration:none;white-space:nowrap;cursor:pointer;transition:transform .16s,filter .16s,background .16s,border-color .16s}
.gbx-btn:hover:not(:disabled){transform:translateY(-1px);background:rgba(var(--gb-ink),.1);border-color:rgba(var(--gb-ink),.26)}
.gbx-btn:disabled{cursor:default;opacity:.55}
.gbx-btn:focus-visible,.gbx-tab:focus-visible,.gbx-card:focus-visible,.gbx-chip:focus-visible,.gbx-bk-card:focus-visible,.gbx-notice:focus-visible,.gbx-member-who:focus-visible,.gbx-linkbtn:focus-visible,.gbx-podium-i:focus-visible,.gbx-pick-i:focus-visible{outline:2px solid #60a5fa;outline-offset:2px}
.gbx-btn.is-pri{border-color:transparent;background:linear-gradient(135deg,#22c55e,#16a34a);color:#04210f}
.gbx-btn.is-pri:hover:not(:disabled){background:linear-gradient(135deg,#22c55e,#16a34a);filter:brightness(1.1)}
.gbx-btn.is-gold{border-color:transparent;background:linear-gradient(135deg,#fde68a,#f59e0b);color:#3b2500}
.gbx-btn.is-gold:hover:not(:disabled){background:linear-gradient(135deg,#fde68a,#f59e0b);filter:brightness(1.08)}
.gbx-btn.is-danger{border-color:rgba(244,63,94,.45);background:rgba(244,63,94,.1);color:var(--gb-bad)}
.gbx-btn.is-danger:hover:not(:disabled){background:rgba(244,63,94,.2);border-color:rgba(244,63,94,.7)}
.gbx-btn.is-sm{min-height:34px;padding:5px 11px;border-radius:10px;font-size:12.5px}
.gbx-btn.is-xl{min-height:46px;padding:11px 22px;font-size:15px}
.gbx-btn.gbx-icon{width:38px;min-height:38px;padding:0;flex:none}
.gbx-btn[hidden]{display:none}
.gbx-pulse{animation:gbx-glow 1.6s ease-in-out infinite}
@keyframes gbx-glow{50%{box-shadow:0 0 0 5px rgba(34,197,94,.22)}}
@keyframes gbx-pop-in{from{transform:scale(.4);opacity:0}}
@keyframes gbx-rise{from{opacity:0;transform:translateY(8px)}}
@keyframes gbx-dot{50%{opacity:.35}}
@keyframes gbx-sheen{from{transform:translateX(-130%)}to{transform:translateX(130%)}}

.gbx-tag{flex:none;padding:1px 6px;border-radius:6px;background:rgba(var(--gb-edge),.16);color:var(--gb-text-2);font:800 10.5px/1.5 system-ui,sans-serif;letter-spacing:.06em}
.gbx-pill{flex:none;display:inline-flex;align-items:center;gap:5px;padding:2px 9px;border-radius:999px;background:rgba(var(--gb-edge),.13);color:var(--gb-text-2);font:700 11.5px/1.5 system-ui,sans-serif;white-space:nowrap}
.gbx-pill.t-open{background:rgba(34,197,94,.16);color:var(--gb-ok)}
.gbx-pill.t-live{background:rgba(244,63,94,.17);color:var(--gb-bad)}
.gbx-pill.t-live::before{content:"";width:7px;height:7px;border-radius:50%;background:#f43f5e;animation:gbx-dot 1.2s infinite}
.gbx-pill.t-soon,.gbx-pill.t-blue{background:rgba(59,130,246,.18);color:var(--gb-info)}
.gbx-pill.t-gold{background:rgba(251,191,36,.17);color:var(--gb-gold)}
.gbx-pill.t-silver{background:rgba(203,213,225,.16);color:var(--gb-text)}
.gbx-pill.t-bad{background:rgba(244,63,94,.14);color:var(--gb-bad)}

.gbx-tabs{flex:none;display:flex;gap:2px;max-width:100%;overflow-x:auto;scrollbar-width:none;border-bottom:1px solid var(--c-line)}
.gbx-tabs::-webkit-scrollbar{display:none}
.gbx-tab{position:relative;flex:none;min-height:40px;padding:8px 14px;border:0;background:transparent;color:var(--c-muted);font:700 13.5px system-ui,sans-serif;cursor:pointer;transition:color .15s}
.gbx-tab:hover{color:var(--gb-hi)}
.gbx-tab.is-on{color:var(--gb-hi)}
.gbx-tab.is-on::after{content:"";position:absolute;left:10px;right:10px;bottom:-1px;height:3px;border-radius:3px 3px 0 0;background:linear-gradient(90deg,#22c55e,#fbbf24);box-shadow:0 0 12px rgba(34,197,94,.6)}

.gbx-state{display:flex;flex-direction:column;align-items:center;gap:8px;max-width:520px;margin:0 auto;padding:34px 18px;text-align:center}
.gbx-state b{font-size:16px;color:var(--gb-hi)}
.gbx-state p{color:var(--c-muted);font-size:13.5px}
.gbx-state-ic{display:grid;place-items:center;width:58px;height:58px;border-radius:18px;background:linear-gradient(135deg,rgba(251,191,36,.16),rgba(59,130,246,.1));box-shadow:inset 0 0 0 1px var(--c-line);font-size:26px}
.gbx-state.t-bad .gbx-state-ic{background:rgba(244,63,94,.13)}
.gbx-state .gbx-row-acts{justify-content:center;margin-top:6px}
.gbx-grid>.gbx-state{grid-column:1/-1}
.gbx-spin{width:30px;height:30px;border-radius:50%;border:3px solid rgba(var(--gb-edge),.2);border-top-color:var(--c-green);animation:gbx-turn .8s linear infinite}
@keyframes gbx-turn{to{transform:rotate(360deg)}}
.gbx-banner{padding:10px 13px;border-radius:12px;background:rgba(var(--gb-edge),.1);font-size:13.5px;overflow-wrap:anywhere}
.gbx-banner.t-bad{background:rgba(244,63,94,.12);color:var(--gb-bad)}

.gbx-sec{display:flex;flex-direction:column;gap:10px;min-width:0;padding:14px;border:1px solid var(--c-line);border-radius:16px;background:var(--c-card)}
.gbx-sec.is-danger{border-color:rgba(244,63,94,.3)}
.gbx-sec-h{display:flex;align-items:center;justify-content:space-between;gap:10px}
.gbx-sec-h h3{font-size:14.5px;font-weight:800;color:var(--gb-hi)}
.gbx-sec>.gbx-btn{align-self:flex-start}
.gbx-row-acts{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.gbx-intro{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px}
.gbx-ranknote{display:inline-flex;align-items:center;gap:7px;color:var(--gb-gold);font-size:12.5px;font-weight:600}
.gbx-ranknote::before{content:"";flex:none;width:8px;height:8px;border-radius:2px;background:var(--c-gold);transform:rotate(45deg)}
.gbx-list{display:flex;flex-direction:column;gap:6px;min-width:0}
.gbx-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:10px;min-width:0}
.gbx-inline{display:flex;gap:8px;min-width:0}
.gbx-inline .gbx-input{flex:1;min-width:0}
.gbx-field-l{font-size:12px;font-weight:700;color:var(--c-muted)}

.gbx-input{width:100%;min-width:0;min-height:40px;padding:8px 11px;border:1px solid var(--c-line);border-radius:11px;background:rgba(var(--gb-well),.6);color:var(--gb-hi);font:14px system-ui,sans-serif;outline:none;transition:border-color .15s,box-shadow .15s}
.gbx-input:focus{border-color:rgba(34,197,94,.7);box-shadow:0 0 0 3px rgba(34,197,94,.18)}
textarea.gbx-input{resize:vertical}
.gbx-form-err{color:var(--gb-bad);font-size:13px}.gbx-form-err:empty{display:none}
.gbx-ok{color:var(--gb-ok);font-weight:700}

.gbx-card{position:relative;display:flex;align-items:center;gap:11px;width:100%;min-width:0;padding:11px 12px;border:1px solid var(--c-line);border-radius:14px;background:var(--c-card);color:var(--c-text);font:inherit;text-align:left;cursor:pointer;overflow:hidden;animation:gbx-rise .3s both;animation-delay:calc(var(--i,0)*28ms);transition:transform .16s,border-color .16s,background .16s}
.gbx-card:hover{transform:translateY(-2px);border-color:rgba(var(--gb-ink),.26);background:rgba(var(--gb-ink),.06)}
.gbx-card::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 40%,rgba(255,255,255,.1) 50%,transparent 60%);transform:translateX(-130%);pointer-events:none}
.gbx-card:hover::after{animation:gbx-sheen .7s ease}
.gbx-card-t{flex:1;display:flex;flex-direction:column;gap:1px;min-width:0}
.gbx-card-t b{min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;color:var(--gb-hi)}
.gbx-card-t small{color:var(--c-muted);font-size:12px;overflow-wrap:anywhere}
.gbx-card-top{display:flex;align-items:center;gap:6px;min-width:0}
.gbx-teamcard{border-left:3px solid var(--c1)}
.gbx-emblem{flex:none;display:block;border-radius:50%;box-shadow:0 2px 8px rgba(0,0,0,.4)}
.gbx-avatar{flex:none;display:grid;place-items:center;border-radius:50%;overflow:hidden;background:linear-gradient(135deg,#334155,#1e293b);color:var(--gb-text);font:800 12px system-ui,sans-serif}
.gbx-avatar img{width:100%;height:100%;object-fit:cover;display:block}
.gbx-teamline{display:flex;align-items:center;gap:7px;min-width:0}
.gbx-teamline.is-empty{color:var(--c-muted)}
.gbx-teamname{min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-weight:600}
.gbx-linkbtn{display:block;width:100%;min-width:0;padding:0;border:0;background:none;color:inherit;font:inherit;text-align:left;cursor:pointer}
.gbx-linkbtn:hover .gbx-teamname{text-decoration:underline}

.gbx-hero{position:relative;display:flex;align-items:center;gap:16px;min-width:0;padding:18px;border-radius:18px;overflow:hidden;isolation:isolate;background:linear-gradient(120deg,var(--c1),var(--c2));box-shadow:inset 0 0 0 1px rgba(var(--gb-ink),.12)}
.gbx-hero::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(6,10,20,.62),rgba(6,10,20,.28))}
.gbx-hero::after{content:"";position:absolute;top:-50%;right:-6%;width:220px;height:220%;z-index:-1;background:rgba(var(--gb-ink),.07);transform:rotate(18deg)}
.gbx-hero .gbx-emblem{box-shadow:0 8px 24px rgba(0,0,0,.5)}
.gbx-hero-t{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px}
.gbx-hero-name{display:flex;align-items:center;gap:8px;min-width:0}
.gbx-hero-name h3{min-width:0;font:900 26px/1.1 var(--display);font-style:italic;color:var(--gb-hi);overflow:hidden;white-space:nowrap;text-overflow:ellipsis;text-shadow:0 2px 8px rgba(0,0,0,.5)}
.gbx-hero .gbx-tag{background:rgba(0,0,0,.45);color:var(--gb-hi)}
.gbx-hero-about{font-size:13px;color:var(--gb-text);overflow-wrap:anywhere;text-shadow:0 1px 4px rgba(0,0,0,.6)}
.gbx-stats{display:flex;flex-wrap:wrap;gap:18px}
.gbx-stat{display:flex;align-items:baseline;gap:5px}
.gbx-stat b{font:900 18px var(--display);color:var(--gb-hi)}
.gbx-stat small{color:var(--gb-text-2);font-size:12px}

.gbx-member{display:flex;align-items:center;gap:8px;min-width:0;padding:7px 9px;border-radius:12px;background:rgba(var(--gb-ink),.03);animation:gbx-rise .28s both;animation-delay:calc(var(--i,0)*28ms)}
.gbx-member-who{flex:1;display:flex;align-items:center;gap:10px;min-width:0;padding:0;border:0;background:none;color:inherit;font:inherit;text-align:left}
button.gbx-member-who{cursor:pointer}
button.gbx-member-who:hover b{text-decoration:underline}
.gbx-member-who>b{min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.gbx-invite{border:1px solid rgba(34,197,94,.3);background:rgba(34,197,94,.06)}
.gbx-friends{display:flex;flex-direction:column;gap:6px;max-height:260px;overflow-y:auto}
.gbx-friends:empty{display:none}

.gbx-upsell{position:relative;display:flex;align-items:center;gap:14px;padding:18px;border:1px solid rgba(251,191,36,.35);border-radius:18px;overflow:hidden;background:linear-gradient(120deg,rgba(251,191,36,.14),rgba(124,58,237,.12))}
.gbx-upsell::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 42%,rgba(255,255,255,.12) 50%,transparent 58%);animation:gbx-sheen 4.5s ease-in-out infinite;pointer-events:none}
.gbx-upsell>div{flex:1;min-width:0}
.gbx-upsell b{font-size:16px;color:var(--gb-hi)}
.gbx-upsell p{color:var(--gb-text-2);font-size:13.5px}
.gbx-upsell-ic{flex:none;display:grid;place-items:center;width:52px;height:52px;border-radius:16px;background:rgba(251,191,36,.18);font-size:25px}

.gbx-trophies{display:grid;grid-template-columns:repeat(auto-fill,minmax(180px,1fr));gap:10px}
.gbx-trophy{position:relative;display:flex;flex-direction:column;align-items:center;gap:2px;padding:14px 10px;border-radius:14px;overflow:hidden;text-align:center;background:linear-gradient(170deg,rgba(203,213,225,.12),rgba(var(--gb-ink),.02));box-shadow:inset 0 0 0 1px rgba(203,213,225,.25);animation:gbx-rise .3s both;animation-delay:calc(var(--i,0)*40ms)}
.gbx-trophy.p-gold{background:linear-gradient(170deg,rgba(251,191,36,.2),rgba(var(--gb-ink),.02));box-shadow:inset 0 0 0 1px rgba(251,191,36,.45)}
.gbx-trophy.p-gold::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 42%,rgba(255,255,255,.16) 50%,transparent 58%);animation:gbx-sheen 5s ease-in-out infinite;pointer-events:none}
.gbx-trophy-ic{font-size:30px;filter:drop-shadow(0 3px 6px rgba(0,0,0,.4))}
.gbx-trophy:not(.p-gold) .gbx-trophy-ic{filter:grayscale(1) brightness(1.3)}
.gbx-trophy b{max-width:100%;color:var(--gb-hi);overflow-wrap:anywhere}
.gbx-trophy small{color:var(--c-muted);font-size:11.5px}

.gbx-medals{display:flex;gap:8px}
.gbx-medal{flex:1;display:flex;flex-direction:column;align-items:center;gap:1px;min-width:0;padding:9px 6px;border-radius:12px;background:rgba(var(--gb-ink),.04)}
.gbx-medal i,.gbx-dot{display:block;flex:none;width:20px;height:20px;border-radius:50%;box-shadow:inset 0 -2px 3px rgba(0,0,0,.3),0 0 10px var(--m,transparent)}
.gbx-dot{width:12px;height:12px}
.m-gold{--m:rgba(251,191,36,.5)}.m-silver{--m:rgba(203,213,225,.4)}.m-bronze{--m:rgba(217,119,6,.45)}
.gbx-medal.m-gold i,.gbx-dot.m-gold{background:radial-gradient(circle at 35% 30%,#fef3c7,#f59e0b)}
.gbx-medal.m-silver i,.gbx-dot.m-silver{background:radial-gradient(circle at 35% 30%,#f8fafc,#94a3b8)}
.gbx-medal.m-bronze i,.gbx-dot.m-bronze{background:radial-gradient(circle at 35% 30%,#fed7aa,#b45309)}
.gbx-medal.is-zero{opacity:.45}
.gbx-medal b{font:900 17px var(--display);color:var(--gb-hi)}
.gbx-medal small{color:var(--c-muted);font-size:11px}
.gbx-medal-list{display:flex;flex-direction:column;gap:5px}
.gbx-medal-list li{display:flex;flex-wrap:wrap;align-items:center;gap:7px;font-size:13px}
.gbx-medal-list b{min-width:0;overflow-wrap:anywhere}

.gbx-pop{position:absolute;left:50%;top:50%;z-index:5;width:min(360px,calc(100% - 24px));max-height:calc(100% - 24px);padding:14px;border:1px solid var(--c-line);border-radius:18px;overflow-y:auto;transform:translate(-50%,-50%);background:var(--gb-panel);box-shadow:0 24px 70px rgba(0,0,0,.7);animation:gbs-fade .16s both}
.gbx-pop .gbx-match{grid-template-columns:minmax(0,1fr);text-align:left}
.gbx-pop-x{position:absolute;top:8px;right:8px;z-index:2;width:30px!important;min-height:30px!important}
.gbx-pop-t{color:var(--gb-hi);font-size:15px;padding-right:34px}
.gbx-pcard{display:flex;flex-direction:column;align-items:center;gap:7px;margin:-14px -14px 0;padding:0 14px 2px;text-align:center}
.gbx-pcard-banner{align-self:stretch;height:62px;margin:0 -14px;background:linear-gradient(120deg,var(--c1),var(--c2))}
.gbx-pcard .gbx-avatar{margin-top:-36px;box-shadow:0 0 0 3px #0e1626;font-size:17px}
.gbx-pcard-name{display:flex;align-items:center;justify-content:center;gap:7px;max-width:100%}
.gbx-pcard-name b{min-width:0;color:var(--gb-hi);font-size:16px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.gbx-pcard-slot{display:flex;flex-direction:column;gap:8px;align-self:stretch;min-height:66px;color:var(--c-muted);font-size:13px;text-align:left}

.gbx-editor{display:grid;grid-template-columns:320px minmax(0,1fr);gap:18px;min-width:0}
.gbx-editor-l,.gbx-editor-r{display:flex;flex-direction:column;gap:12px;min-width:0}
.gbx-editor-foot{grid-column:1/-1;display:flex;align-items:center;justify-content:flex-end;gap:12px}
.gbx-prev{position:relative;display:flex;flex-direction:column;align-items:center;gap:10px;padding:22px 12px;border-radius:18px;overflow:hidden;isolation:isolate;background:linear-gradient(135deg,var(--c1),var(--c2));box-shadow:inset 0 0 0 1px rgba(var(--gb-ink),.14);transition:background .2s}
.gbx-prev::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(circle at 50% 35%,rgba(var(--gb-ink),.14),rgba(6,10,20,.5))}
.gbx-prev .gbx-emblem{box-shadow:0 10px 26px rgba(0,0,0,.55)}
.gbx-prev-t{display:flex;align-items:center;gap:7px;max-width:100%}
.gbx-prev-name{min-width:0;font:900 19px var(--display);font-style:italic;color:var(--gb-hi);overflow:hidden;white-space:nowrap;text-overflow:ellipsis;text-shadow:0 2px 6px rgba(0,0,0,.6)}
.gbx-prev .gbx-tag{background:rgba(0,0,0,.45);color:var(--gb-hi)}
.gbx-colors{display:flex;flex-wrap:wrap;gap:8px}
.gbx-color{flex:1 1 90px;display:flex;align-items:center;gap:7px;min-width:0;padding:5px 8px;border:1px solid var(--c-line);border-radius:10px;font-size:12px;color:var(--c-muted);cursor:pointer}
.gbx-color input{flex:none;width:28px;height:28px;padding:0;border:0;border-radius:7px;background:none;cursor:pointer}
.gbx-field{display:flex;flex-direction:column;gap:4px;min-width:0}
.gbx-field-h{color:var(--c-muted);font-size:11.5px}
.gbx-field-e{color:var(--gb-bad);font-size:12px}.gbx-field-e:empty{display:none}
.gbx-pair{display:grid;grid-template-columns:minmax(0,1fr) 150px;gap:10px}
.gbx-pick{display:flex;flex-direction:column;gap:6px;min-width:0}
.gbx-pick-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(50px,1fr));gap:6px}
.gbx-pick-i{aspect-ratio:1;padding:0;border:2px solid transparent;border-radius:12px;overflow:hidden;background:none;cursor:pointer;transition:transform .14s,border-color .14s}
.gbx-pick-i canvas{display:block;width:100%;height:100%}
.gbx-pick-i:hover{transform:scale(1.06)}
.gbx-pick-i.is-on{border-color:var(--c-green);box-shadow:0 0 12px rgba(34,197,94,.5)}

/* Uniforme do time (src/ui/team-kit-editor.js): a pitch stage with both kits and the plain sides, the controls beside it */
.gbx-kit{grid-column:1/-1;position:relative;display:flex;flex-direction:column;gap:12px;min-width:0;padding:16px;border:1px solid var(--c-line);border-radius:18px;background:radial-gradient(700px 240px at 0 0,rgba(34,197,94,.09),transparent 70%),radial-gradient(600px 240px at 100% 100%,rgba(14,165,233,.08),transparent 70%),var(--c-card)}
.gbx-kit-h{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;min-width:0}
.gbx-kit-ht{display:flex;flex-direction:column;gap:3px;min-width:0}
.gbx-kit-ht h3{font:900 17px/1.2 var(--display);font-style:italic;letter-spacing:-.01em;color:var(--gb-hi)}
.gbx-kit-switch{flex:none;min-height:36px;gap:10px;font:700 12.5px system-ui;color:var(--c-muted)}
.gbx-kit-off{display:none;margin:0;padding:12px 14px;border:1px dashed var(--c-line);border-radius:14px;color:var(--c-muted);font-size:13px}
.gbx-kit.is-off .gbx-kit-off{display:block}
.gbx-kit.is-off .gbx-kit-body{display:none}
.gbx-kit-body{display:grid;grid-template-columns:minmax(0,380px) minmax(0,1fr);gap:16px;min-width:0;animation:gbx-rise .25s both}
.gbx-kit-stage{position:relative;display:flex;flex-direction:column;gap:14px;min-width:0;padding:16px 14px 14px;border-radius:16px;overflow:hidden;isolation:isolate;color:#fff;
background:linear-gradient(180deg,rgba(255,255,255,.06),transparent 30%),repeating-linear-gradient(90deg,rgba(255,255,255,.05) 0 32px,rgba(0,0,0,.035) 32px 64px),radial-gradient(130% 100% at 50% 0,#86a56c 0,#718C5A 48%,#4b6639 100%);
box-shadow:inset 0 0 0 1px rgba(255,255,255,.14),inset 0 -50px 70px -30px rgba(0,0,0,.35),0 14px 30px -18px rgba(0,0,0,.55)}
.gbx-kit-stage::before{content:"";position:absolute;left:50%;top:-40px;width:150px;height:150px;margin-left:-75px;border:2px solid rgba(255,255,255,.2);border-radius:50%;z-index:-1}
.gbx-kit-stage::after{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.28) 50%,transparent 65%);transform:translateX(-120%)}
.gbx-kit-stage.is-fresh::after{animation:gbx-kit-shine .7s ease-out}
@keyframes gbx-kit-shine{to{transform:translateX(120%)}}
.gbx-kit-hero{display:flex;align-items:flex-end;justify-content:center;gap:18px;padding-top:6px}
.gbx-kit-fig{display:flex;flex-direction:column;align-items:center;gap:7px;padding:0;border:0;background:none;color:inherit;font:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}
.gbx-kit-fig canvas{display:block;filter:drop-shadow(0 12px 12px rgba(0,0,0,.45));transition:transform .2s cubic-bezier(.2,.9,.3,1.3)}
.gbx-kit-fig.is-home canvas{animation:gbx-kit-float 4.4s ease-in-out infinite}
.gbx-kit-fig:hover canvas{transform:translateY(-3px) scale(1.04)}
.gbx-kit-fig.is-on canvas{transform:scale(1.03)}
@keyframes gbx-kit-float{50%{translate:0 -4px}}
.gbx-kit-cap{padding:3px 10px;border-radius:999px;background:rgba(5,12,6,.42);font:800 10.5px system-ui;letter-spacing:.12em;text-transform:uppercase;transition:background .2s,color .2s}
.gbx-kit-fig.is-on .gbx-kit-cap{background:#fff;color:#0b1020;box-shadow:0 4px 14px rgba(0,0,0,.35)}
.gbx-kit-fig:focus-visible{outline:none}.gbx-kit-fig:focus-visible .gbx-kit-cap{outline:2px solid #bfdbfe;outline-offset:2px}
.gbx-kit-vs{display:flex;flex-direction:column;gap:7px;min-width:0}
.gbx-kit-vs-h{font:800 10.5px system-ui;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.85);text-shadow:0 1px 2px rgba(0,0,0,.5)}
.gbx-kit-match{display:flex;align-items:center;gap:6px;min-width:0;padding:6px 10px 6px 6px;border-radius:13px;background:rgba(4,10,5,.42);box-shadow:inset 0 0 0 1px rgba(255,255,255,.08);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}
.gbx-kit-match canvas{flex:none;display:block}
.gbx-kit-x{flex:none;font:900 13px var(--display);color:rgba(255,255,255,.7)}
.gbx-kit-res{flex:1;display:flex;flex-direction:column;align-items:flex-end;gap:1px;min-width:0;text-align:right}
.gbx-kit-res b{display:flex;align-items:center;gap:5px;font:800 12.5px system-ui}
.gbx-kit-res b::before{content:"";width:8px;height:8px;border-radius:50%;background:currentColor;box-shadow:0 0 8px currentColor}
.gbx-kit-res small{max-width:100%;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:11px;color:rgba(255,255,255,.82)}
.gbx-kit-res.t-ok b{color:#86efac}.gbx-kit-res.t-warn b{color:#fde68a}.gbx-kit-res.t-bad b{color:#fda4af}
.gbx-kit-ctrl{display:flex;flex-direction:column;gap:12px;min-width:0}
.gbx-seg{position:relative;display:grid;grid-template-columns:1fr 1fr;padding:3px;border:1px solid var(--c-line);border-radius:13px;background:rgba(var(--gb-ink),.06)}
.gbx-seg button{position:relative;z-index:1;min-height:36px;padding:0 10px;border:0;border-radius:10px;background:none;color:var(--c-muted);font:800 13px system-ui;cursor:pointer;transition:color .2s}
.gbx-seg button[aria-selected=true]{color:var(--gb-hi)}
.gbx-seg-thumb{position:absolute;top:3px;bottom:3px;left:3px;width:calc(50% - 3px);border-radius:10px;background:linear-gradient(135deg,rgba(34,197,94,.32),rgba(14,165,233,.26));box-shadow:inset 0 0 0 1px rgba(134,239,172,.5),0 4px 12px -4px rgba(0,0,0,.4);transition:transform .28s cubic-bezier(.2,.9,.3,1.2)}
.gbx-seg[data-at=away] .gbx-seg-thumb{transform:translateX(100%)}
.gbx-kit-noaway{display:flex;flex-direction:column;align-items:flex-start;gap:8px;padding:14px;border:1px dashed var(--c-line);border-radius:14px}
.gbx-kit-noaway[hidden],.gbx-kit-edit[hidden],.gbx-kit-err[hidden],.gbx-kit-drop[hidden]{display:none}
.gbx-kit-noaway b{color:var(--gb-hi);font-size:14px}
.gbx-kit-edit{display:flex;flex-direction:column;gap:12px;min-width:0}
.gbx-kit-field{display:flex;flex-direction:column;gap:7px;min-width:0}
.gbx-kit-pats{display:grid;grid-template-columns:repeat(auto-fill,minmax(46px,1fr));gap:6px}
.gbx-kit-pat{background:rgba(var(--gb-ink),.05)}
.gbx-kit-slots{display:flex;flex-wrap:wrap;gap:6px}
.gbx-kit-slot{display:inline-flex;align-items:center;gap:7px;min-height:36px;padding:4px 12px 4px 5px;border:1px solid var(--c-line);border-radius:999px;background:rgba(var(--gb-ink),.04);color:var(--c-text);font:700 12.5px system-ui;cursor:pointer;transition:transform .15s,border-color .15s,background .15s,box-shadow .15s}
.gbx-kit-slot:hover{transform:translateY(-1px);border-color:rgba(var(--gb-ink),.3)}
.gbx-kit-slot i{flex:none;width:24px;height:24px;border-radius:50%;background:var(--sw);box-shadow:inset 0 0 0 1px rgba(0,0,0,.28),0 1px 3px rgba(0,0,0,.3)}
.gbx-kit-slot i.is-none{background:linear-gradient(135deg,transparent 45%,#f43f5e 45% 55%,transparent 55%),rgba(var(--gb-ink),.08)}
.gbx-kit-slot i.is-auto{background:radial-gradient(circle at 50% 50%,var(--sw) 0 40%,transparent 41%),conic-gradient(#fff 0 50%,#111 0)}
.gbx-kit-slot-v{color:var(--c-muted);font-weight:600;font-size:11px}.gbx-kit-slot-v:empty{display:none}
.gbx-kit-slot.is-on{border-color:#22c55e;background:rgba(34,197,94,.13);box-shadow:0 0 0 3px rgba(34,197,94,.18)}
.gbx-kit-pal{display:flex;flex-wrap:wrap;gap:8px;padding:10px;border:1px solid var(--c-line);border-radius:14px;background:rgba(var(--gb-well),.35)}
.gbx-kit-dot{position:relative;flex:none;width:32px;height:32px;padding:0;border:0;border-radius:50%;background:var(--sw);box-shadow:inset 0 0 0 1px rgba(0,0,0,.28),0 2px 5px rgba(0,0,0,.28);cursor:pointer;transition:transform .14s cubic-bezier(.2,.9,.3,1.4),box-shadow .14s}
.gbx-kit-dot:hover{transform:scale(1.12)}
.gbx-kit-dot.is-dark,.gbx-kit-slot i.is-dark{box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.38),0 2px 5px rgba(0,0,0,.28)}
.gbx-kit-dot[aria-checked=true],.gbx-kit-dot.is-custom.is-on{box-shadow:0 0 0 2px var(--gb-panel),0 0 0 4px #22c55e,0 4px 12px rgba(34,197,94,.45);transform:scale(1.06)}
.gbx-kit-dot[aria-checked=true]::after{content:"✓";position:absolute;inset:0;display:grid;place-items:center;font:900 15px/1 system-ui;color:var(--ck,#fff)}
.gbx-kit-dot.is-special{display:grid;place-items:center;font:900 13px system-ui;color:#0b1020}
.gbx-kit-dot.is-special[hidden]{display:none}
.gbx-kit-dot.is-special.is-none{background:linear-gradient(135deg,transparent 46%,#f43f5e 46% 54%,transparent 54%),rgba(var(--gb-ink),.1)}
.gbx-kit-dot.is-special.is-auto{background:radial-gradient(circle,var(--sw) 0 46%,transparent 48%),conic-gradient(#fff 0 50%,#111 0);color:transparent}
.gbx-kit-dot.is-special[aria-checked=true]::after{color:#22c55e;text-shadow:0 0 3px #000}
.gbx-kit-dot.is-custom{background:conic-gradient(from 90deg,#ef4444,#f59e0b,#eab308,#22c55e,#06b6d4,#3b82f6,#a855f7,#ef4444)}
.gbx-kit-dot.is-custom.is-on{background:radial-gradient(circle,var(--sw) 0 52%,transparent 54%),conic-gradient(from 90deg,#ef4444,#f59e0b,#eab308,#22c55e,#06b6d4,#3b82f6,#a855f7,#ef4444)}
.gbx-kit-dot.is-custom input{position:absolute;inset:0;width:100%;height:100%;margin:0;padding:0;border:0;opacity:0;cursor:pointer}
.gbx-kit-err{display:flex;align-items:center;flex-wrap:wrap;gap:8px 12px;padding:9px 12px;border:1px solid rgba(244,63,94,.45);border-radius:12px;background:rgba(244,63,94,.1);color:var(--gb-bad);font-size:12.5px;font-weight:600}
.gbx-kit-err-t{flex:1 1 220px}
.gbx-kit-drop{align-self:flex-start;color:var(--gb-bad)}
.gbx-kit-slot:focus-visible,.gbx-kit-dot:focus-visible,.gbx-seg button:focus-visible,.gbx-kit-dot.is-custom:focus-within{outline:2px solid #60a5fa;outline-offset:2px}
@media (max-width:980px){.gbx-kit-body{grid-template-columns:minmax(0,1fr)}}
@media (max-width:980px) and (min-width:600px){.gbx-kit-stage{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:18px}}
@media (max-width:600px){.gbx-kit{padding:12px}.gbx-kit-h{flex-wrap:wrap}.gbx-kit-dot{width:30px;height:30px}}
@media (prefers-reduced-motion:reduce){.gbx-kit-fig canvas,.gbx-kit-body{animation:none}.gbx-kit-stage.is-fresh::after{animation:none}.gbx-seg-thumb,.gbx-kit-dot,.gbx-kit-slot,.gbx-kit-fig canvas{transition:none}}
html[data-gb-theme=light] .gbx-kit{border-color:rgba(15,23,42,.3);background:radial-gradient(700px 240px at 0 0,rgba(34,197,94,.08),transparent 70%),#fff;box-shadow:0 1px 2px rgba(15,23,42,.14),0 8px 20px -14px rgba(15,23,42,.4)}
html[data-gb-theme=light] .gbx-seg{background:rgba(15,23,42,.08)}
html[data-gb-theme=light] .gbx-seg-thumb{background:linear-gradient(135deg,#dcfce7,#e0f2fe);box-shadow:inset 0 0 0 1px rgba(21,128,61,.45),0 2px 8px -3px rgba(15,23,42,.4)}
html[data-gb-theme=light] .gbx-kit-slot.is-on{background:#dcfce7;border-color:#15803d}
html[data-gb-theme=light] .gbx-kit-pal{background:#f3f6fa}
html[data-gb-theme=light] .gbx-kit-dot[aria-checked=true],html[data-gb-theme=light] .gbx-kit-dot.is-custom.is-on{box-shadow:0 0 0 2px #fff,0 0 0 4px #15803d,0 4px 12px rgba(21,128,61,.35)}

.gbx-chat{display:flex;flex-direction:column;gap:8px;height:min(420px,58vh);min-height:260px;min-width:0}
.gbx-chat-tools{display:flex;justify-content:space-between;gap:8px}
.gbx-chat-tools .gbx-btn:last-child{margin-left:auto}
.gbx-chat-log{flex:1;min-height:0;display:flex;flex-direction:column;gap:6px;padding:10px;border:1px solid var(--c-line);border-radius:14px;overflow-y:auto;background:rgba(var(--gb-well),.45);outline:none}
.gbx-msg{max-width:min(82%,520px);align-self:flex-start;padding:6px 10px;border-radius:4px 12px 12px 12px;background:rgba(var(--gb-edge),.1);animation:gbx-rise .2s both}
.gbx-msg.is-me{align-self:flex-end;border-radius:12px 4px 12px 12px;background:rgba(34,197,94,.16)}
.gbx-msg-h{display:flex;align-items:baseline;gap:7px;font-size:12px}
.gbx-msg-h b{min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;color:var(--gb-info)}
.gbx-msg.is-me .gbx-msg-h b{color:var(--gb-ok)}
.gbx-msg-h time{flex:none;color:var(--c-muted);font-size:10.5px}
.gbx-msg p{font-size:13.5px;overflow-wrap:anywhere;white-space:pre-wrap}
.gbx-msg.is-gone p{color:var(--c-muted);font-style:italic}
.gbx-chat-form{display:flex;align-items:center;gap:8px;min-width:0}
.gbx-chat-form .gbx-input{flex:1}
.gbx-chat-n{flex:none;color:var(--c-muted);font-size:11px;font-variant-numeric:tabular-nums}

.gbx-podium{display:flex;align-items:flex-end;justify-content:center;gap:10px;min-width:0;padding-top:8px}
.gbx-podium-i{position:relative;flex:1 1 0;max-width:230px;min-width:0;display:flex;flex-direction:column;align-items:center;gap:4px;padding:14px 8px;border:1px solid var(--c-line);border-radius:16px;overflow:hidden;background:linear-gradient(180deg,rgba(var(--gb-ink),.07),rgba(var(--gb-ink),.01));color:var(--c-text);font:inherit;cursor:pointer;transition:transform .16s}
.gbx-podium-i:hover{transform:translateY(-3px)}
.gbx-podium-i b{max-width:100%;color:var(--gb-hi);overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.gbx-podium-i small{color:var(--c-muted);font-size:12px}
.gbx-podium-i.p-1{order:2;padding-top:24px;border-color:rgba(251,191,36,.5);background:linear-gradient(180deg,rgba(251,191,36,.2),rgba(var(--gb-ink),.01));box-shadow:0 0 30px rgba(251,191,36,.18)}
.gbx-podium-i.p-1::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 42%,rgba(255,255,255,.16) 50%,transparent 58%);animation:gbx-sheen 4s ease-in-out infinite;pointer-events:none}
.gbx-podium-i.p-2{order:1}.gbx-podium-i.p-3{order:3}
.gbx-podium-n{font:900 13px var(--display);color:var(--c-gold)}

.gbx-cupgrid{grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}
.gbx-cupcard{flex-direction:column;align-items:stretch;gap:6px;padding:13px 14px;background:linear-gradient(150deg,rgba(59,130,246,.13),rgba(var(--gb-ink),.02) 60%)}
.gbx-cupcard.f-taca{background:linear-gradient(150deg,rgba(251,191,36,.13),rgba(var(--gb-ink),.02) 60%)}
.gbx-cupcard-top{display:flex;flex-wrap:wrap;gap:6px}
.gbx-cupcard-name{font:900 18px/1.2 var(--display);font-style:italic;color:var(--gb-hi);overflow-wrap:anywhere}
.gbx-cupcard small{color:var(--c-muted);font-size:12.5px}
.gbx-cupcard-foot{display:flex;align-items:baseline;justify-content:space-between;gap:8px;margin-top:2px;padding-top:7px;border-top:1px solid var(--c-line)}
.gbx-clock{color:var(--gb-hi);font:800 15px system-ui,sans-serif;font-variant-numeric:tabular-nums}
.gbx-cuphero{position:relative;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:14px;min-width:0;padding:18px;border-radius:18px;overflow:hidden;isolation:isolate;background:linear-gradient(120deg,#1e3a8a,var(--gb-panel) 70%);box-shadow:inset 0 0 0 1px rgba(var(--gb-ink),.1)}
.gbx-cuphero.f-taca{background:linear-gradient(120deg,#92400e,#3b0764 55%,var(--gb-panel))}
.gbx-cuphero::after{content:"";position:absolute;top:-60%;right:18%;z-index:-1;width:170px;height:240%;background:rgba(var(--gb-ink),.05);transform:rotate(18deg)}
.gbx-cuphero-t{flex:1 1 280px;display:flex;flex-direction:column;gap:6px;min-width:0}
.gbx-cuphero h3{font:900 28px/1.1 var(--display);font-style:italic;color:var(--gb-hi);overflow-wrap:anywhere;text-shadow:0 2px 10px rgba(0,0,0,.5)}
.gbx-cuphero p{color:var(--gb-text-2);font-size:13.5px}
.gbx-cuphero-c{flex:none;display:flex;flex-direction:column;gap:1px;padding:9px 16px;border-radius:14px;background:rgba(0,0,0,.34);box-shadow:inset 0 0 0 1px rgba(var(--gb-ink),.12)}
.gbx-cuphero-c small{color:var(--gb-text-2);font-size:11.5px}
.gbx-cuphero-c .gbx-clock{font-size:25px;color:var(--gb-gold)}
.gbx-over{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:14px;align-items:start;min-width:0}
.gbx-rules{display:flex;flex-direction:column;gap:6px}
.gbx-rules li{position:relative;padding-left:16px;color:var(--gb-text-2);font-size:13.5px}
.gbx-rules li::before{content:"";position:absolute;left:2px;top:7px;width:6px;height:6px;border-radius:50%;background:var(--c-green)}
.gbx-rules li.is-rank{color:var(--gb-gold);font-weight:600}.gbx-rules li.is-rank::before{background:var(--c-gold)}
.gbx-timeline{display:flex;flex-direction:column}
.gbx-timeline li{position:relative;display:flex;flex-direction:column;padding:0 0 12px 20px}
.gbx-timeline li:last-child{padding-bottom:0}
.gbx-timeline li::before{content:"";position:absolute;left:2px;top:5px;width:10px;height:10px;border-radius:50%;box-shadow:inset 0 0 0 2px var(--c-muted)}
.gbx-timeline li::after{content:"";position:absolute;left:6px;top:17px;bottom:-3px;width:2px;background:var(--c-line)}
.gbx-timeline li:last-child::after{display:none}
.gbx-timeline li.is-done::before{background:var(--c-green);box-shadow:0 0 8px rgba(34,197,94,.7)}
.gbx-timeline b{font-size:13px;color:var(--gb-hi)}.gbx-timeline small{color:var(--c-muted);font-size:12px}
.gbx-signup{border-color:rgba(34,197,94,.34);background:linear-gradient(170deg,rgba(34,197,94,.09),rgba(var(--gb-ink),.02))}
.gbx-roster{display:flex;flex-direction:column;gap:6px}
.gbx-roster-n{color:var(--gb-text-2);font-size:12.5px;font-weight:600}
.gbx-roster-i{cursor:pointer}
.gbx-roster-i input{flex:none;width:18px;height:18px;margin:0;accent-color:#22c55e}
.gbx-signup .gbx-btn.is-xl{width:100%}

.gbx-match{display:grid;grid-template-columns:128px minmax(0,1fr) auto minmax(0,1fr) auto;align-items:center;gap:10px;min-width:0;padding:9px 11px;border:1px solid transparent;border-radius:12px;background:rgba(var(--gb-ink),.03)}
.gbx-match.s-live{border-color:rgba(244,63,94,.4);background:rgba(244,63,94,.07)}
.gbx-match.is-mine{box-shadow:inset 3px 0 0 var(--c-green)}
.gbx-match-i{display:flex;flex-direction:column;align-items:flex-start;gap:2px;min-width:0}
.gbx-match-i small{color:var(--c-muted);font-size:11.5px;overflow-wrap:anywhere}
.gbx-match .is-a{justify-content:flex-end;flex-direction:row-reverse}
.gbx-match .is-won .gbx-teamname{color:var(--gb-hi);font-weight:800}
.gbx-match-s{justify-self:center;min-width:44px;padding:3px 9px;border-radius:9px;background:rgba(var(--gb-well),.6);color:var(--gb-hi);font-size:13px;font-variant-numeric:tabular-nums;text-align:center}
.gbx-match>.gbx-btn{justify-self:end}
.gbx-mine{display:flex;flex-direction:column;gap:3px}
.gbx-mine-t{align-self:flex-end;color:var(--c-muted);font-size:12px}
.gbx-mine-t .gbx-clock{font-size:12.5px;color:var(--gb-gold)}

.gbx-legend{display:flex;align-items:center;gap:7px;color:var(--c-muted);font-size:12.5px}
.gbx-legend i{flex:none;width:12px;height:12px;border-radius:3px;background:var(--c-green)}
.gbx-groups{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,470px),1fr));gap:12px;min-width:0}
.gbx-tablewrap{min-width:0;overflow-x:auto;outline:none;-webkit-overflow-scrolling:touch}
.gbx-table{width:100%;min-width:430px;border-collapse:collapse;font-size:13px;font-variant-numeric:tabular-nums}
.gbx-table th{padding:5px 6px;border-bottom:1px solid var(--c-line);color:var(--c-muted);font-size:11.5px;font-weight:700;text-align:center;cursor:help}
.gbx-table td{padding:6px;border-bottom:1px solid rgba(var(--gb-edge),.07);text-align:center}
.gbx-table th:nth-child(2),.gbx-table td.c-team{text-align:left;width:100%;max-width:150px}
.gbx-table td.c-pts{color:var(--gb-hi);font-weight:800}
.gbx-table tr.is-q .c-rank{box-shadow:inset 3px 0 0 var(--c-green);color:var(--gb-ok);font-weight:800}
.gbx-table tr.is-q+tr:not(.is-q) td{border-top:1px dashed rgba(var(--gb-edge),.4)}
.gbx-table tr.is-mine td{background:rgba(34,197,94,.08)}
.gbx-table th:nth-child(-n+2),.gbx-table td:nth-child(-n+2){position:sticky;background:var(--gb-panel)}
.gbx-table th:first-child,.gbx-table td:first-child{left:0;z-index:1;min-width:30px}
.gbx-table th:nth-child(2),.gbx-table td:nth-child(2){left:30px;z-index:1}
.gbx-table tr.is-mine td:nth-child(-n+2){background:#102a24}

.gbx-bk{display:flex;flex-direction:column;gap:8px;min-width:0}
.gbx-bk-chips{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none}
.gbx-bk-chips[hidden]{display:none}
.gbx-bk-chips::-webkit-scrollbar{display:none}
.gbx-chip{flex:none;min-height:32px;padding:4px 12px;border:1px solid var(--c-line);border-radius:999px;background:rgba(var(--gb-ink),.04);color:var(--gb-text-2);font:700 12px system-ui,sans-serif;cursor:pointer}
.gbx-chip:hover{border-color:rgba(var(--gb-ink),.3)}
.gbx-bk-scroll{min-width:0;padding:4px 2px 12px;overflow:auto;outline:none;-webkit-overflow-scrolling:touch;overscroll-behavior-x:contain}
.gbx-bk-stage{position:relative;margin:0 auto}
.gbx-bk-stage svg{position:absolute;inset:0;pointer-events:none}
.gbx-bk-line{fill:none;stroke:rgba(var(--gb-edge),.28);stroke-width:2}
.gbx-bk-line.is-won{stroke:rgba(34,197,94,.75);filter:drop-shadow(0 0 3px rgba(34,197,94,.5))}
.gbx-bk-line.is-live{stroke:#f43f5e;stroke-dasharray:6 5;animation:gbx-flow 1s linear infinite}
@keyframes gbx-flow{to{stroke-dashoffset:-11}}
.gbx-bk-head{position:absolute;top:0;color:var(--c-muted);font-size:12px;font-weight:700;text-align:center;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.gbx-bk-card{position:absolute;display:flex;flex-direction:column;justify-content:center;gap:3px;padding:5px 8px;border:1px solid var(--c-line);border-radius:12px;background:var(--gb-card);color:var(--c-text);font:inherit;text-align:left;cursor:pointer;transition:transform .14s,border-color .14s,box-shadow .14s}
.gbx-bk-card:hover{transform:translateY(-2px);border-color:rgba(var(--gb-ink),.3);z-index:2}
.gbx-bk-card.is-quiet{opacity:.62}
.gbx-bk-card.is-mine{border-color:rgba(34,197,94,.7);box-shadow:0 0 12px rgba(34,197,94,.3)}
.gbx-bk-card.is-final{border-color:rgba(251,191,36,.65);background:linear-gradient(150deg,#2a1f0a,var(--gb-card));box-shadow:0 0 18px rgba(251,191,36,.22)}
.gbx-bk-card.s-live{border-color:rgba(244,63,94,.7);box-shadow:0 0 14px rgba(244,63,94,.3)}
.gbx-bk-side{display:flex;align-items:center;gap:6px;min-width:0;color:var(--gb-text-2);font-size:12.5px}
.gbx-bk-side.is-won{color:var(--gb-hi);font-weight:800}
.gbx-bk-side.is-lost{color:var(--c-muted)}
.gbx-bk-name{flex:1;min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.gbx-bk-score{flex:none;font-size:12.5px;font-variant-numeric:tabular-nums}
.gbx-bk-live{position:absolute;top:-8px;right:8px;padding:0 6px;border-radius:999px;background:#f43f5e;color:#fff;font:800 9.5px/1.5 system-ui,sans-serif}
.gbx-bk-champ{position:absolute;display:flex;align-items:center;justify-content:center;gap:5px;min-width:0;color:var(--gb-gold);font-size:12.5px}
.gbx-bk-champ b{min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.gbx-bk-champ i{font-style:normal}

.gbx-entry{display:flex;flex-direction:column;gap:6px;min-width:0;padding:11px 12px;border:1px solid var(--c-line);border-radius:14px;background:var(--c-card)}
.gbx-entry small{color:var(--c-muted);font-size:12px;overflow-wrap:anywhere}
.gbx-entry.is-out{opacity:.7}
.gbx-entry .gbx-pill{align-self:flex-start}

.gbx-notice{display:flex;align-items:center;gap:10px;width:100%;min-width:0;padding:10px 11px;border:1px solid transparent;border-radius:13px;background:rgba(var(--gb-ink),.03);color:var(--c-text);font:inherit;text-align:left;cursor:pointer;animation:gbx-rise .26s both;animation-delay:calc(var(--i,0)*22ms);transition:background .15s}
.gbx-notice:hover{background:rgba(var(--gb-ink),.07)}
.gbx-notice.is-new{border-color:rgba(34,197,94,.3);background:rgba(34,197,94,.07)}
.gbx-notice-ic{flex:none;display:grid;place-items:center;width:36px;height:36px;border-radius:11px;background:rgba(var(--gb-edge),.1)}
.gbx-notice .gbx-card-t b{white-space:normal}
.gbx-notice time{flex:none;color:var(--c-muted);font-size:11.5px}

.gbx-toast{position:absolute;left:50%;bottom:14px;z-index:6;max-width:calc(100% - 28px);padding:9px 14px;border-radius:12px;background:var(--gb-card);box-shadow:0 12px 34px rgba(0,0,0,.55);color:var(--gb-hi);font-size:13.5px;opacity:0;pointer-events:none;transform:translate(-50%,8px);transition:opacity .18s,transform .18s}
.gbx-toast.is-on{opacity:1;transform:translate(-50%,0)}
.gbx-toast.t-good{background:#14532d}.gbx-toast.t-bad{background:#7f1d33}

@media (max-width:980px){.gbx-over{grid-template-columns:minmax(0,1fr)}.gbx-over>:last-child{order:-1}.gbx-editor{grid-template-columns:minmax(0,1fr)}.gbx-prev{flex-direction:row;justify-content:center;padding:14px}}
@media (max-width:760px){.gbx-back{padding:0}.gbx-sheet{width:100%;height:100%;border:0;border-radius:0}.gbx-head{padding:calc(8px + env(safe-area-inset-top)) 10px 8px}.gbx-title{font-size:19px}.gbx-body{padding:12px 12px calc(20px + env(safe-area-inset-bottom))}
.gbx-match{grid-template-columns:minmax(0,1fr) auto;row-gap:6px}.gbx-match-i{grid-column:1/-1;flex-direction:row;flex-wrap:wrap;align-items:center;gap:7px}.gbx-match>.gbx-btn{grid-column:1/-1;justify-self:stretch}.gbx-match .is-a{grid-column:1;grid-row:2;flex-direction:row;justify-content:flex-start}.gbx-match .is-b{grid-column:1;grid-row:3}.gbx-match-s{grid-column:2;grid-row:2/4;align-self:center}
.gbx-pop{top:auto;bottom:0;left:0;width:100%;max-height:82%;border-radius:18px 18px 0 0;transform:none;animation:gbs-rise .2s both}
.gbx-upsell{flex-direction:column;text-align:center}}
@media (max-width:520px){.gbx-hero{flex-direction:column;align-items:flex-start}.gbx-hero-name h3{font-size:22px;white-space:normal;overflow-wrap:anywhere}.gbx-member{flex-wrap:wrap}.gbx-member .gbx-row-acts{width:100%;justify-content:flex-end}.gbx-pair{grid-template-columns:minmax(0,1fr)}.gbx-cuphero h3{font-size:23px}.gbx-grid,.gbx-cupgrid{grid-template-columns:minmax(0,1fr)}.gbx-podium{gap:6px}.gbx-chat{height:min(460px,62vh)}.gbx-msg{max-width:92%}.gbx-table .gbx-tag{display:none}#menuView .gbm-top{gap:8px}#menuView .gbm-nameplate{flex:0 1 auto;min-width:0}#menuView .gbm-bell{width:38px;height:38px}}
@media (max-width:420px){#menuView .gbm-np-cta{display:none}}
@media (max-height:500px) and (orientation:landscape){.gbx-back{padding:0}.gbx-sheet{width:100%;height:100%;border:0;border-radius:0}.gbx-head{padding:5px 12px}.gbx-chat{height:calc(100vh - 90px);min-height:200px}}
@media (prefers-reduced-motion:reduce){.gbx-back,.gbx-sheet,.gbx-card,.gbx-member,.gbx-notice,.gbx-msg,.gbx-trophy,.gbx-pop,.gbx-pulse,#menuView .gbm-bell-n{animation:none}.gbx-card:hover::after,.gbx-upsell::after,.gbx-trophy.p-gold::after,.gbx-podium-i.p-1::after,.gbx-bk-line.is-live,.gbx-pill.t-live::before{animation:none}.gbx-btn,.gbx-card,.gbx-bk-card,.gbx-toast{transition:none}}

/* Torneios and Times as a competition page. Refs in src/ui/cups-panel.js and teams-panel.js. Colours come from the theme
   tokens; art and team colours sit in .gb-dark, so they read the same on both themes. */
.gbx-back{padding:0;background:var(--gb-page);-webkit-backdrop-filter:none;backdrop-filter:none}
.gbx-sheet{width:100%;height:100%;border:0;border-radius:0;box-shadow:none;background:radial-gradient(1100px 520px at 8% -8%,rgba(34,197,94,.1),transparent 62%),radial-gradient(1000px 520px at 104% 2%,rgba(59,130,246,.12),transparent 60%),radial-gradient(900px 500px at 50% 112%,rgba(251,191,36,.07),transparent 62%),var(--gb-page);animation:gbx-fade .2s both}
@keyframes gbx-fade{from{opacity:0}}
.gbx-head{padding:10px clamp(12px,3vw,32px);background:rgba(var(--gb-glass),.72);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}
.gbx-body{padding:16px clamp(12px,3vw,32px) calc(28px + env(safe-area-inset-bottom));scroll-padding-top:12px}
.gbx-body>*{width:100%;max-width:1240px;margin-inline:auto}
.gbx-body>.gbx-state{max-width:520px}
.gbx-page{gap:16px}

/* the seal of the examples: solid, so nobody takes one for the real thing */
.gbx-pill.t-example{background:#fde68a;color:#422006;box-shadow:inset 0 0 0 1px #b45309;font-weight:800}
.gbx-banner.t-example{background:rgba(251,191,36,.14);box-shadow:inset 0 0 0 1px rgba(180,83,9,.4);color:var(--gb-gold)}
.gbx-examplenote{font-size:12.5px}

/* hero */
.gbx-art{position:absolute;inset:0;width:100%;height:100%;display:block}
.gbx-trophy-art{display:block;flex:none;width:72px;height:auto;filter:drop-shadow(0 6px 14px rgba(251,191,36,.42))}
.gbx-cuphero{position:relative;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:20px;min-height:250px;min-width:0;padding:clamp(16px,3vw,32px);border-radius:24px;overflow:hidden;isolation:isolate;background:#0b1220;box-shadow:0 18px 44px -24px rgba(var(--gb-shadow),.8),inset 0 0 0 1px rgba(255,255,255,.1)}
.gbx-cuphero.f-taca{background:#0b1220}
.gbx-cuphero.is-feature{min-height:330px}
.gbx-cuphero>.gbx-art{z-index:-3;left:34%;width:66%;filter:saturate(1.1) brightness(.86);transform:perspective(1000px) rotateX(24deg) rotateZ(-3deg) scale(1.22);transform-origin:50% 60%;animation:gbx-drift 26s ease-in-out infinite alternate}
@keyframes gbx-drift{to{transform:perspective(1000px) rotateX(24deg) rotateZ(-1deg) scale(1.3) translateX(-2%)}}
.gbx-cuphero-fade{position:absolute;inset:0;z-index:-2;background:linear-gradient(90deg,#060a14 32%,rgba(6,10,20,.82) 48%,rgba(6,10,20,.12)),linear-gradient(0deg,rgba(6,10,20,.72),transparent 58%)}
.gbx-cuphero.f-taca .gbx-cuphero-fade{background:radial-gradient(520px 300px at 92% 12%,rgba(251,191,36,.26),transparent 70%),linear-gradient(90deg,#0e0904 32%,rgba(14,9,4,.82) 48%,rgba(14,9,4,.12)),linear-gradient(0deg,rgba(14,9,4,.72),transparent 58%)}
.gbx-cuphero.f-copa .gbx-cuphero-fade{background:radial-gradient(520px 300px at 92% 12%,rgba(59,130,246,.3),transparent 70%),linear-gradient(90deg,#060a14 32%,rgba(6,10,20,.82) 48%,rgba(6,10,20,.12)),linear-gradient(0deg,rgba(6,10,20,.72),transparent 58%)}
.gbx-cuphero::before{content:"";position:absolute;inset:-40% auto -40% 0;width:34%;z-index:-1;background:linear-gradient(100deg,transparent,rgba(255,255,255,.1),transparent);transform:translateX(-130%) skewX(-16deg);animation:gbx-beam 8s ease-in-out infinite}
@keyframes gbx-beam{55%,100%{transform:translateX(420%) skewX(-16deg)}}
.gbx-cuphero::after{content:"";position:absolute;left:0;right:0;top:0;height:3px;top:auto;bottom:0;width:auto;background:linear-gradient(90deg,#22c55e,#fbbf24,#3b82f6);transform:none}
.gbx-cuphero-t{flex:none;display:flex;flex-direction:column;align-items:flex-start;gap:8px;min-width:0}
.gbx-eyebrow{color:#fde68a;font:800 11.5px system-ui,sans-serif;letter-spacing:.12em;text-transform:uppercase}
.gbx-cuphero h3{max-width:100%;font:900 clamp(26px,4.4vw,52px)/1.04 var(--display);font-style:italic;letter-spacing:-.015em;color:#fff;overflow-wrap:anywhere;text-shadow:0 3px 18px rgba(0,0,0,.6)}
.gbx-cuphero p{color:#dbe4f5;font-size:14px;font-weight:600}
.gbx-cuphero .gbx-pill{background:rgba(6,10,20,.66);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.gbx-cuphero .gbx-pill.t-example{background:#fde68a}
.gbx-cuphero-t .gbx-btn{margin-top:4px}
.gbx-cuphero-c{flex:none;display:flex;flex-direction:column;align-items:flex-end;gap:5px;padding:0;border-radius:0;background:none;box-shadow:none}
.gbx-cuphero-c>small{color:#dbe4f5;font-size:12px;font-weight:700}
.gbx-cuphero-c .gbx-trophy-art{width:clamp(84px,10vw,128px);margin-bottom:4px;animation:gbx-float 5s ease-in-out infinite}
@keyframes gbx-float{50%{transform:translateY(-7px)}}
.gbx-tiles{display:flex;gap:6px}
.gbx-tile{display:flex;flex-direction:column;align-items:center;min-width:54px;padding:7px 6px 5px;border:1px solid rgba(255,255,255,.14);border-radius:12px;background:rgba(6,10,20,.62);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.gbx-tile b{font:900 24px/1.05 var(--display);font-variant-numeric:tabular-nums;color:#fde68a}
.gbx-tile small{color:#dbe4f5;font-size:10.5px;font-weight:700}
.gbx-prizes{display:flex;flex-wrap:wrap;gap:6px 14px;margin-top:2px}
.gbx-prizes li{display:flex;align-items:center;gap:7px}
.gbx-prizes span{display:flex;flex-direction:column;line-height:1.15}
.gbx-prizes small{color:#dbe4f5;font-size:10.5px;font-weight:700}
.gbx-prizes b{color:#fff;font-size:12.5px}
.gbx-prizes .gbx-dot{width:16px;height:16px}

.gbx-ranknote{color:var(--gb-gold)}

/* live strip */
.gbx-livestrip{display:flex;align-items:center;gap:10px;min-width:0;padding:8px 10px;border:1px solid rgba(244,63,94,.4);border-radius:16px;background:linear-gradient(90deg,rgba(244,63,94,.13),rgba(var(--gb-ink),.03) 40%)}
.gbx-livestrip-t{flex:none;display:inline-flex;align-items:center;gap:7px;color:var(--gb-bad);font:900 13px var(--display);font-style:italic;letter-spacing:.02em;text-transform:uppercase}
.gbx-livestrip-t::before{content:"";width:9px;height:9px;border-radius:50%;background:#f43f5e;box-shadow:0 0 0 0 rgba(244,63,94,.6);animation:gbx-ping 1.6s ease-out infinite}
@keyframes gbx-ping{to{box-shadow:0 0 0 9px rgba(244,63,94,0)}}
.gbx-livestrip-r{flex:1;display:flex;gap:8px;min-width:0;overflow-x:auto;scrollbar-width:none;outline:none}
.gbx-livestrip-r::-webkit-scrollbar{display:none}
.gbx-livecard{flex:none;display:grid;grid-template-columns:auto auto;align-items:center;gap:1px 10px;padding:6px 9px;border-radius:12px;background:var(--gb-raised);box-shadow:inset 0 0 0 1px rgba(var(--gb-edge),.16)}
.gbx-livecard>small{grid-column:1/-1;max-width:260px;color:var(--gb-muted);font-size:11px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.gbx-livecard-l{display:flex;align-items:center;gap:8px}
.gbx-livecard-l b{font-size:13px;font-variant-numeric:tabular-nums;color:var(--gb-hi)}
.gbx-livecard-s{display:inline-flex;align-items:center;gap:5px;font:800 12px system-ui,sans-serif;color:var(--gb-text)}

/* list */
.gbx-cupcols{display:grid;grid-template-columns:minmax(0,1fr) 290px;gap:18px;align-items:start;min-width:0}
.gbx-guide{display:flex;flex-direction:column;gap:12px;min-width:0}
.gbx-steps{display:flex;flex-direction:column;gap:10px;counter-reset:gbx-step}
.gbx-steps li{position:relative;display:flex;flex-direction:column;padding-left:34px;counter-increment:gbx-step}
.gbx-steps li::before{content:counter(gbx-step);position:absolute;left:0;top:1px;display:grid;place-items:center;width:24px;height:24px;border-radius:8px;background:linear-gradient(135deg,#22c55e,#16a34a);color:#04210f;font:900 12px system-ui,sans-serif}
.gbx-steps b{font-size:13px;color:var(--gb-hi)}.gbx-steps small{color:var(--gb-muted);font-size:12px}
.gbx-promo{padding:12px 13px;background:linear-gradient(120deg,rgba(251,191,36,.18),rgba(var(--gb-ink),.03));border-color:rgba(180,83,9,.34)}
.gbx-promo .gbx-trophy-art{width:44px}
.gbx-cupgrid{grid-template-columns:repeat(auto-fill,minmax(min(100%,270px),1fr));gap:14px}
.gbx-cupcard{display:flex;flex-direction:column;align-items:stretch;gap:0;padding:0;border-radius:18px;overflow:hidden;background:var(--gb-raised);box-shadow:0 10px 26px -20px rgba(var(--gb-shadow),.9);transition:transform .18s,box-shadow .18s,border-color .18s;animation:gbx-rise .3s both;animation-delay:calc(var(--i,0)*36ms)}
.gbx-cupcard.f-taca,.gbx-cupcard{background:var(--gb-raised)}
.gbx-cupcard:hover{background:var(--gb-raised);transform:translateY(-3px);box-shadow:0 18px 34px -20px rgba(var(--gb-shadow),1);border-color:rgba(34,197,94,.6)}
.gbx-cupcard.f-taca:hover{border-color:rgba(251,191,36,.7)}
.gbx-cupcard-art{position:relative;display:block;height:122px;overflow:hidden;background:#0b1220}
.gbx-cupcard-art .gbx-art{transition:transform .5s cubic-bezier(.2,.8,.2,1)}
.gbx-cupcard:hover .gbx-art{transform:scale(1.07)}
.gbx-cupcard-art::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(6,10,20,.36),transparent 42%,rgba(6,10,20,.64))}
.gbx-cupcard-top{position:absolute;left:9px;top:9px;right:9px;z-index:1;display:flex;flex-wrap:wrap;gap:5px}
.gbx-cupcard-top .gbx-pill{background:rgba(6,10,20,.74)}
.gbx-cupcard-top .gbx-pill.t-example{background:#fde68a}
.gbx-cupcard-art .gbx-trophy-art{position:absolute;right:9px;bottom:6px;z-index:1;width:44px}
.gbx-cupcard-b{display:flex;flex-direction:column;gap:9px;padding:11px 13px 12px}
.gbx-cupcard-name{font:900 18px/1.15 var(--display);font-style:italic;color:var(--gb-hi);overflow-wrap:anywhere}
.gbx-facts{display:grid;grid-template-columns:repeat(3,minmax(0,auto));justify-content:space-between;gap:8px}
.gbx-fact{display:flex;flex-direction:column;min-width:0}
.gbx-fact small{color:var(--gb-muted);font-size:10.5px;font-weight:700;letter-spacing:.02em}
.gbx-fact b{min-width:0;color:var(--gb-text);font-size:13px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.gbx-fill{display:block;height:4px;border-radius:9px;overflow:hidden;background:rgba(var(--gb-ink),.1)}
.gbx-fill::after{content:"";display:block;width:var(--p,0%);height:100%;border-radius:9px;background:linear-gradient(90deg,#22c55e,#fbbf24)}
.gbx-cupcard-foot{margin:0;padding-top:0;border-top:0}
.gbx-cupcard-foot small{color:var(--gb-muted);font-size:12px}
.gbx-cupcard-go{color:var(--gb-ok);font-size:12.5px;font-weight:800}
.gbx-cupcard-go::after{content:" →"}
.gbx-clock{color:var(--gb-hi)}
.gbx-cuphero .gbx-clock{color:#fde68a}
.gbx-mine-t .gbx-clock{color:var(--gb-gold)}

/* cup page */
.gbx-phases{display:flex;flex-wrap:wrap;gap:4px 0;min-width:0}
.gbx-phases li{position:relative;display:inline-flex;align-items:center;padding:4px 14px 4px 8px;color:var(--gb-muted);font-size:12.5px;font-weight:700}
.gbx-phases li::before{content:"";flex:none;width:10px;height:10px;margin-right:6px;border-radius:50%;box-shadow:inset 0 0 0 2px rgba(var(--gb-edge),.5)}
.gbx-phases li.is-done{color:var(--gb-text)}
.gbx-phases li.is-done::before{background:#22c55e;box-shadow:none}
.gbx-phases li.is-now{border-radius:999px;background:rgba(34,197,94,.14);color:var(--gb-ok)}
.gbx-phases li.is-now::before{background:#22c55e;box-shadow:0 0 0 3px rgba(34,197,94,.28)}
.gbx-sec{background:var(--gb-raised);box-shadow:0 8px 22px -20px rgba(var(--gb-shadow),.9)}
.gbx-sec-h h3{font:900 15.5px var(--display);font-style:italic;letter-spacing:-.005em;color:var(--gb-hi)}
.gbx-champsec{position:relative;overflow:hidden;background:radial-gradient(420px 220px at 50% -10%,rgba(251,191,36,.2),transparent 70%),var(--gb-raised)}
.gbx-confetti{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.gbx-confetti i{position:absolute;top:-12px;left:var(--x);width:7px;height:12px;border-radius:2px;background:#fbbf24;animation:gbx-fall 3.8s linear infinite;animation-delay:var(--d)}
.gbx-confetti i:nth-child(3n){background:#22c55e}.gbx-confetti i:nth-child(3n+1){background:#3b82f6}
@keyframes gbx-fall{to{transform:translateY(420px) rotate(420deg)}}
.gbx-podium-i .gbx-trophy-art{width:56px}
.gbx-podium-i{border:1px solid rgba(var(--gb-edge),.2);background:var(--gb-raised);padding:12px 8px}
.gbx-podium-i b{color:var(--gb-hi)}
.gbx-podium-i.p-1{background:linear-gradient(180deg,rgba(251,191,36,.26),var(--gb-raised));padding-top:14px}
.gbx-podium-n{color:var(--gb-gold)}
.gbx-podium-hall{align-items:flex-end;gap:12px;padding:6px 0 0}
.gbx-podium-hall .gbx-podium-i{justify-content:flex-start;padding:14px 10px 18px;border-radius:18px 18px 8px 8px;animation:gbx-rise .4s both}
.gbx-podium-hall .gbx-podium-i.p-1{min-height:292px;max-width:270px;animation-delay:.16s}
.gbx-podium-hall .gbx-podium-i.p-2{min-height:232px;background:linear-gradient(180deg,rgba(203,213,225,.26),var(--gb-raised));animation-delay:.08s}
.gbx-podium-hall .gbx-podium-i.p-3{min-height:204px;background:linear-gradient(180deg,rgba(217,119,6,.2),var(--gb-raised))}
.gbx-podium-hall .gbx-podium-n{font-size:22px}

/* match rows: a score plate between the two teams */
.gbx-match{grid-template-columns:128px minmax(0,1fr) auto minmax(0,1fr) auto;padding:10px 12px;border:1px solid rgba(var(--gb-edge),.14);border-radius:14px;background:var(--gb-raised)}
.gbx-match-s{min-width:64px;padding:5px 10px;border-radius:10px;background:#0b1220;color:#fff;font:900 15px/1.1 var(--display);font-variant-numeric:tabular-nums;text-align:center;box-shadow:inset 0 0 0 1px rgba(255,255,255,.1)}
.gbx-match-s.is-long{font:800 11.5px/1.25 system-ui,sans-serif}
.gbx-match.s-live .gbx-match-s{background:#be123c}
.gbx-match .is-won .gbx-teamname{color:var(--gb-hi)}
.gbx-match .is-a{justify-content:flex-start}
.gbx-avatar{color:#eef2fb}

/* group tables */
.gbx-groups{grid-template-columns:repeat(auto-fill,minmax(min(100%,520px),1fr));gap:14px}
.gbx-table{min-width:500px}
.gbx-table th{color:var(--gb-muted)}
.gbx-table td{border-bottom:1px solid rgba(var(--gb-edge),.1)}
.gbx-table tbody tr:last-child td{border-bottom:0}
.gbx-table tbody tr{transition:background .14s}
.gbx-table tbody tr:hover td{background:rgba(var(--gb-ink),.04)}
.gbx-table th:nth-child(-n+2),.gbx-table td:nth-child(-n+2){background:var(--gb-raised)}
.gbx-table tr.is-mine td{background:rgba(34,197,94,.1)}
.gbx-table tr.is-mine td:nth-child(-n+2){background:var(--gb-raised);box-shadow:inset 0 0 0 99px rgba(34,197,94,.1)}
.gbx-table tr.is-q .c-rank{color:var(--gb-ok)}
.gbx-table td.c-pts{color:var(--gb-hi);font-size:14px}
.gbx-table td.c-form{white-space:nowrap}
.gbx-form{display:inline-grid;place-items:center;width:18px;height:18px;margin-left:2px;border-radius:5px;color:#fff;font:800 10px system-ui,sans-serif;font-style:normal}
.gbx-form.f-V{background:#15803d}.gbx-form.f-E{background:#64748b}.gbx-form.f-D{background:#be123c}

/* bracket */
.gbx-bk-scroll{padding:6px 4px 14px}
.gbx-bk-head{display:inline-block;color:var(--gb-muted);font:800 11.5px system-ui,sans-serif;letter-spacing:.06em;text-transform:uppercase}
.gbx-bk-card{border:1px solid rgba(var(--gb-edge),.2);border-radius:12px;background:var(--gb-raised);box-shadow:0 6px 16px -12px rgba(var(--gb-shadow),.9)}
.gbx-bk-card:hover{border-color:rgba(34,197,94,.6)}
.gbx-bk-card.is-final{background:linear-gradient(150deg,rgba(251,191,36,.22),var(--gb-raised) 62%)}
.gbx-bk-side.is-won{color:var(--gb-hi)}
.gbx-bk-side.is-won .gbx-bk-score{color:var(--gb-ok)}
.gbx-bk-line{stroke:rgba(var(--gb-edge),.36)}
.gbx-bk-champ{color:var(--gb-gold);font-weight:800}
.gbx-bk-champ .gbx-trophy-art{width:22px}

/* teams */
.gbx-hero{gap:20px;min-height:170px;padding:clamp(16px,3vw,28px);border-radius:24px;background:linear-gradient(120deg,var(--c1),var(--c2));box-shadow:0 18px 44px -24px rgba(var(--gb-shadow),.8)}
.gbx-hero-mark{position:absolute;right:-34px;top:-52px;z-index:-1;opacity:.2;transform:rotate(-9deg);pointer-events:none}
.gbx-hero-mark .gbx-emblem{box-shadow:none}
.gbx-hero-name h3{font-size:clamp(24px,3.4vw,38px)}
.gbx-stats{gap:8px;margin-top:4px}
.gbx-stat{flex-direction:column;align-items:flex-start;gap:0;min-width:84px;padding:6px 11px;border-radius:12px;background:rgba(0,0,0,.34);box-shadow:inset 0 0 0 1px rgba(255,255,255,.12)}
.gbx-stat b{font-size:20px}
.gbx-teamcard{position:relative;align-items:center;gap:12px;padding:30px 13px 12px;border-left:1px solid var(--c-line);border-radius:16px;overflow:hidden;background:var(--gb-raised)}
.gbx-teamcard:hover{background:var(--gb-raised);border-color:var(--c1)}
.gbx-teamcard-band{position:absolute;left:0;right:0;top:0;height:40px;background:linear-gradient(115deg,var(--c1),var(--c2));opacity:.92}
.gbx-teamcard .gbx-emblem{position:relative;box-shadow:0 0 0 3px var(--gb-raised),0 6px 14px rgba(0,0,0,.3)}
.gbx-teamcard .gbx-card-t{padding-top:10px}
.gbx-roster-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,330px),1fr));gap:8px}
.gbx-member{background:rgba(var(--gb-ink),.035)}
.gbx-trophy{background:linear-gradient(170deg,rgba(203,213,225,.16),var(--gb-raised));padding-top:16px}
.gbx-trophy.p-gold{background:linear-gradient(170deg,rgba(251,191,36,.24),var(--gb-raised))}
.gbx-trophy .gbx-trophy-art{width:58px}
.gbx-trophy:not(.p-gold) .gbx-trophy-art{filter:grayscale(1) brightness(1.15) drop-shadow(0 4px 8px rgba(0,0,0,.25))}
.gbx-trophy small{color:var(--gb-muted)}
.gbx-pop{background:var(--gb-raised);color:var(--gb-text);box-shadow:0 24px 60px -18px rgba(var(--gb-shadow),1)}
.gbx-pcard .gbx-avatar{box-shadow:0 0 0 3px var(--gb-raised)}
.gbx-toast{background:#1b2740;color:#fff}

@media (max-width:980px){.gbx-over>:last-child:not(:has(.gbx-signup)){order:0}}
@media (max-width:1080px){.gbx-cupcols{grid-template-columns:minmax(0,1fr)}.gbx-guide{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.gbx-promo{align-self:start}}
@media (max-width:760px){
.gbx-cuphero,.gbx-cuphero.is-feature{grid-template-columns:minmax(0,1fr);align-items:stretch;min-height:0;padding-top:64px;border-radius:20px}
.gbx-cuphero>.gbx-art{left:0;width:100%}
.gbx-cuphero-fade,.gbx-cuphero.f-copa .gbx-cuphero-fade,.gbx-cuphero.f-taca .gbx-cuphero-fade{background:linear-gradient(0deg,rgba(6,10,20,.95) 38%,rgba(6,10,20,.3))}
.gbx-cuphero-c{align-items:stretch}
.gbx-cuphero-c .gbx-trophy-art{position:absolute;top:12px;right:14px;width:62px;margin:0}
.gbx-tile{flex:1;min-width:0}
.gbx-guide{grid-template-columns:minmax(0,1fr)}
.gbx-match{grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);row-gap:7px}
.gbx-match-i{grid-column:1/-1;flex-direction:row;flex-wrap:wrap;align-items:center;gap:4px 8px}
.gbx-match>.gbx-btn{grid-column:1/-1;justify-self:stretch}
.gbx-match .is-a,.gbx-match .is-b,.gbx-match .gbx-match-s{grid-column:auto;grid-row:auto}
.gbx-match .is-a{justify-self:stretch;justify-content:flex-end;flex-direction:row;flex-wrap:nowrap}
.gbx-match .is-a .gbx-emblem{order:3}
.gbx-match .is-a .gbx-teamname{order:2;text-align:right}
.gbx-match .gbx-tag{display:none}
.gbx-match-s{min-width:52px}
.gbx-livestrip{flex-direction:column;align-items:stretch;gap:6px}
.gbx-hero{min-height:0}
}
@media (max-width:420px){#menuView .gbm-brand{font-size:21px}#menuView .gbm-top{gap:6px}}
@media (max-width:520px){#menuView .gbm-themebtn{width:38px;height:38px}#menuView .gbm-nameplate{flex:1 1 0}.gbx-podium-hall{gap:6px}.gbx-podium-hall .gbx-podium-i.p-1{min-height:250px}.gbx-podium-hall .gbx-podium-i.p-2{min-height:210px}.gbx-podium-hall .gbx-podium-i.p-3{min-height:186px}.gbx-teamcard .gbx-card-top{flex-wrap:wrap}}
@media (max-height:500px) and (orientation:landscape){
.gbx-head{padding:4px 12px}
.gbx-body{padding-top:10px}
.gbx-cuphero,.gbx-cuphero.is-feature{grid-template-columns:minmax(0,1fr) auto;align-items:center;min-height:0;padding:12px 16px}
.gbx-cuphero>.gbx-art{left:34%;width:66%}
.gbx-cuphero-fade,.gbx-cuphero.f-copa .gbx-cuphero-fade,.gbx-cuphero.f-taca .gbx-cuphero-fade{background:linear-gradient(90deg,rgba(6,10,20,.94),rgba(6,10,20,.55))}
.gbx-cuphero h3{font-size:24px}
.gbx-cuphero-c{align-items:flex-end}
.gbx-cuphero-c .gbx-trophy-art,.gbx-prizes{display:none}
.gbx-tile{min-width:44px;padding:4px}
.gbx-tile b{font-size:18px}
.gbx-hero{min-height:0;padding:12px 16px}
.gbx-cupcols{grid-template-columns:minmax(0,1fr)}
}
@media (prefers-reduced-motion:reduce){.gbx-upsell::after,.gbx-trophy.p-gold::after,.gbx-podium-i.p-1::after{display:none}.gbx-sheet,.gbx-cupcard,.gbx-podium-hall .gbx-podium-i,.gbx-cuphero>.gbx-art,.gbx-cuphero::before,.gbx-cuphero-c .gbx-trophy-art,.gbx-livestrip-t::before,.gbx-confetti i{animation:none}.gbx-confetti{display:none}.gbx-cupcard,.gbx-cupcard .gbx-art{transition:none}.gbx-cupcard:hover .gbx-art{transform:none}.gbx-cuphero::before{display:none}}

/* the portal header on the GoBall page follows the theme (its colours are on :root; only the bar's own glass is fixed) */
html[data-gb-theme=light] body.game .sitenav{background:rgba(255,255,255,.88);border-bottom-color:rgba(51,65,85,.16)}
html[data-gb-theme=light] body.game .sitenav .nav-links a:hover{background:rgba(15,23,42,.06)}
html[data-gb-theme=light] body.game .sitenav .me-drop .premium-item{color:#854d0e}
html[data-gb-theme=light] body.game .sitenav .brand span{color:#15803d}
html[data-gb-theme=light] #menuView .gbm-brand b{background:linear-gradient(90deg,#15803d,#16a34a);-webkit-background-clip:text;background-clip:text}

/* ==========================================================================
   Design wave (v1.7): team above the name, home shortcuts, rooms in two columns, Times, Hall da fama, Mapas, Controles
   and Avisos. Mobbin references are listed on top of each screen's JS. Everything reads the --gb-* tokens: light and dark.
   ========================================================================== */

/* Team above the name: name plate of the menu and rows of the ESC lists */
#menuView .gbm-nameplate{min-width:190px;min-height:50px;padding:6px 12px}
@media (max-width:520px){#menuView .gbm-nameplate{min-width:0;flex:1 1 0}}
#menuView .gbm-np-who{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}
#menuView .gbm-np-team{display:flex;align-items:center;gap:5px;min-width:0;font-size:11px;line-height:1.25;color:#e2e8f0;text-shadow:0 1px 3px rgba(0,0,0,.8)}
#menuView .gbm-np-team img{flex:none;width:16px;height:16px;border-radius:50%;box-shadow:0 0 0 1px rgba(255,255,255,.3)}
#menuView .gbm-np-tname{min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-weight:700}
#menuView .gbm-np-tag{padding:0 5px;font-size:9.5px;line-height:1.5}
.player-name-stack{display:inline-flex;flex-direction:column;min-width:0;max-width:100%;line-height:1.15}
.gb-teamline{display:inline-flex;align-items:center;gap:4px;min-width:0;max-width:100%;font-size:10px;font-weight:700;letter-spacing:.01em;color:var(--gb-muted)}
.gb-teamline img{flex:none;width:13px;height:13px;border-radius:50%}
.gb-teamline span{min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.roster-player-item.has-plate .gb-teamline{color:#e2e8f0;text-shadow:0 1px 3px rgba(0,0,0,.85)}

/* Home shortcuts: tinted glass, a light that follows the pointer, the icon lifts and the arrow arrives */
#menuView .gbm-sc-training{--sc:34,197,94}#menuView .gbm-sc-teams{--sc:59,130,246}#menuView .gbm-sc-maps{--sc:20,184,166}#menuView .gbm-sc-controls{--sc:168,85,247}
#menuView .gbm-sc-stats{--sc:6,182,212}#menuView .gbm-sc-ranking{--sc:245,158,11}#menuView .gbm-sc-hall{--sc:234,179,8}#menuView .gbm-sc-support{--sc:244,63,94}
#menuView .gbm-shorts{gap:12px;margin-top:16px}
#menuView .gbm-sc{position:relative;isolation:isolate;overflow:hidden;gap:13px;min-height:84px;padding:14px 38px 14px 14px;border-radius:18px;background:linear-gradient(150deg,rgba(var(--sc),.13),rgba(var(--sc),.02) 58%),var(--glass);transition:transform .22s var(--ease),border-color .22s,box-shadow .22s}
#menuView .gbm-sc::before{content:"";position:absolute;inset:0;z-index:-1;opacity:0;background:radial-gradient(150px circle at var(--mx,50%) var(--my,50%),rgba(var(--sc),.34),transparent 70%);transition:opacity .25s}
#menuView .gbm-sc::after{content:"";position:absolute;left:14px;right:14px;bottom:0;height:2px;border-radius:2px;background:linear-gradient(90deg,transparent,rgb(var(--sc)),transparent);opacity:.35;transform:scaleX(.55);transition:transform .3s var(--ease),opacity .3s}
#menuView .gbm-sc:hover{transform:translateY(-3px);border-color:rgba(var(--sc),.6);box-shadow:0 14px 30px -18px rgba(var(--sc),.9)}
#menuView .gbm-sc:hover::before{opacity:1}#menuView .gbm-sc:hover::after{opacity:1;transform:scaleX(1)}
#menuView .gbm-sc:active{transform:translateY(-1px) scale(.985)}
#menuView .gbm-sc .gbm-ic{width:46px;height:46px;border-radius:14px;color:rgb(var(--sc));background:linear-gradient(145deg,rgba(var(--sc),.28),rgba(var(--sc),.08));box-shadow:inset 0 0 0 1px rgba(var(--sc),.42),0 8px 18px -12px rgba(var(--sc),.9);transition:transform .28s var(--ease)}
html[data-gb-theme=light] #menuView .gbm-sc .gbm-ic{filter:saturate(1.2) brightness(.82)}
#menuView .gbm-sc:hover .gbm-ic{transform:translateY(-2px) rotate(-5deg) scale(1.07)}
#menuView .gbm-sc div{min-width:0}
#menuView .gbm-sc b{font-size:14.5px;line-height:1.2}
#menuView .gbm-sc span.gbm-muted{display:block;margin-top:2px;font-size:12px;line-height:1.3}
#menuView .gbm-sc-go{position:absolute;right:13px;top:50%;margin-top:-8px;color:rgb(var(--sc));opacity:.35;transform:translateX(-5px);transition:transform .22s var(--ease),opacity .22s}
#menuView .gbm-sc:hover .gbm-sc-go{opacity:1;transform:none}
#menuView .gbm-sc.gbm-off{opacity:.62;pointer-events:auto}
#menuView .gbm-sc.gbm-off:hover{transform:none;box-shadow:none}
@media (max-width:1100px) and (min-width:901px){#menuView .gbm-shorts{grid-template-columns:repeat(4,1fr)}#menuView .gbm-sc{padding-right:12px}#menuView .gbm-sc-go{display:none}}
@media (max-width:900px){#menuView .gbm-shorts{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}#menuView .gbm-sc{min-height:72px;padding:11px;gap:10px}#menuView .gbm-sc .gbm-ic{width:40px;height:40px;border-radius:12px}#menuView .gbm-sc-go{display:none}}
@media (max-height:500px) and (orientation:landscape){#menuView .gbm-shorts{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}#menuView .gbm-sc{min-height:60px;padding:8px 9px}#menuView .gbm-sc span.gbm-muted{display:none}}
@media (max-width:380px){#menuView .gbm-sc span.gbm-muted{display:none}#menuView .gbm-sc b{font-size:13.5px}}

/* Rooms: Oficiais | Comunidade. Each column scrolls by itself, so the page stays one screen tall */
#menuView .gbm-cs-title{display:flex;gap:14px;align-items:center;min-width:0;flex-wrap:wrap}
#menuView .gbm-cs-topacts{display:flex;gap:8px;flex-wrap:wrap;margin-left:auto}
#menuView .gbm-cs-tabs{display:none}
#menuView .gbm-cs-cols{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:14px;align-items:start;margin-top:14px}
#menuView .gbm-cs-cols.is-solo{grid-template-columns:minmax(0,1fr)}
#menuView .gbm-cs-col{display:flex;flex-direction:column;gap:10px;min-width:0;max-height:calc(100dvh - 190px);padding:14px;border:1px solid var(--glass-b);border-radius:22px;background:linear-gradient(170deg,rgba(var(--gb-ink),.05),rgba(var(--gb-ink),.01) 45%),var(--glass);overflow:hidden}
#menuView .gbm-cs-col-off{border-color:rgba(250,204,21,.3);background:radial-gradient(420px 180px at 12% -20%,rgba(250,204,21,.16),transparent 70%),linear-gradient(170deg,rgba(var(--gb-ink),.05),rgba(var(--gb-ink),.01) 45%),var(--glass)}
#menuView .gbm-cs-colh{flex:none;display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
#menuView .gbm-cs-colh h2{margin:0;font:900 19px/1.15 "Segoe UI Black","Arial Black",system-ui,sans-serif;font-style:italic;color:var(--gb-hi)}
#menuView .gbm-cs-colh p{margin:2px 0 0;font-size:12px}
#menuView .gbm-cs-n{flex:none;padding:3px 10px;border-radius:999px;background:rgba(var(--gb-ink),.08);font:800 12px system-ui;font-variant-numeric:tabular-nums;color:var(--gb-text-2)}
#menuView .gbm-cs-offlist,#menuView .gbm-cs-list{flex:1;min-height:0;display:grid;align-content:start;gap:8px;padding:2px;overflow-y:auto;overflow-x:hidden;scrollbar-width:thin;background:none;border:0;box-shadow:none}
#menuView .gbm-cs-list{margin:0}
/* official: the mode's colours as the card itself */
#menuView .gbm-cs-offlist .gbm-cs-row.gbm-cs-card{grid-template-columns:50px minmax(0,1fr) auto;grid-template-areas:"ic name join" "ic meta ping";gap:7px 12px;padding:11px 12px;border-radius:16px;border:1px solid rgba(250,204,21,.22);box-shadow:none;background:var(--gb-raised);overflow:hidden;position:relative;isolation:isolate}
#menuView .gbm-cs-offlist .gbm-cs-row.gbm-cs-card::before{content:"";position:absolute;inset:0 auto 0 0;width:92px;z-index:-1;background:var(--rg);opacity:.5;-webkit-mask-image:linear-gradient(90deg,#000,transparent);mask-image:linear-gradient(90deg,#000,transparent)}
#menuView .gbm-cs-offlist .gbm-cs-ic{grid-area:ic;align-self:center;width:50px;height:50px;border-radius:15px;font-size:24px;background:var(--rg);box-shadow:0 8px 18px -10px rgba(var(--gb-shadow),.9),inset 0 0 0 1px rgba(255,255,255,.22)}
#menuView .gbm-cs-offlist .gbm-cs-name{grid-area:name}
#menuView .gbm-cs-offlist .gbm-cs-players{grid-area:meta;align-self:center;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:9px}
#menuView .gbm-cs-offlist .gbm-cs-ping{grid-area:ping;justify-self:end;align-self:center}
#menuView .gbm-cs-offlist .gbm-cs-join{grid-area:join;align-self:start}
#menuView .gbm-cs-offlist .gbm-cs-card[data-card]:hover{border-color:rgba(250,204,21,.65);box-shadow:0 12px 26px -16px rgba(250,204,21,.75);transform:translateY(-2px)}
#menuView .gbm-cs-offlist .gbm-cs-sub .gbm-cs-desc{white-space:normal;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical}
/* community: compact rows */
#menuView .gbm-cs-list .gbm-cs-row.gbm-cs-card{grid-template-columns:38px minmax(0,1fr) 112px 58px auto;padding:7px 9px;border-radius:14px;background:var(--gb-raised);border-color:rgba(var(--gb-edge),.14)}
#menuView .gbm-cs-list .gbm-cs-ic{width:38px;height:38px;font-size:18px;background:var(--rg);box-shadow:inset 0 0 0 1px rgba(255,255,255,.18)}
#menuView .gbm-cs-pw{grid-column:1/-1;grid-area:auto;grid-row:auto}
#menuView .gbm-cs-offlist .gbm-cs-pw{grid-column:1/-1}
#menuView .gbm-cs-tools{flex:none;display:flex;gap:8px;align-items:center;min-width:0}
#menuView .gbm-cs-search{position:relative;flex:1;min-width:0;display:block;margin:0}
#menuView .gbm-cs-search svg{position:absolute;left:11px;top:50%;margin-top:-8px;color:var(--gb-muted);pointer-events:none}
#menuView .gbm-cs-search .gbm-input{width:100%;max-width:none;padding-left:33px}
#menuView .gbm-cs-pick{flex:1 1 0;width:auto;min-width:0;max-width:none;padding:6px 9px;min-height:34px;font-size:12.5px;border-radius:999px}
#menuView .gbm-cs-pick.is-on{border-color:rgba(34,197,94,.65);background:rgba(34,197,94,.14);color:var(--gb-ok)}
#menuView .gbm-cs-sort{flex:none;width:auto;max-width:170px;min-height:40px;border-radius:12px}
#menuView .gbm-cs-ftoggle{display:none;flex:none}
#menuView .gbm-cs-ftoggle b{display:inline-grid;place-items:center;min-width:18px;height:18px;margin-left:3px;border-radius:999px;background:#22c55e;color:#04120a;font-size:11px}
#menuView .gbm-cs-filters{flex:none;display:flex;flex-wrap:wrap;gap:6px;align-items:center}
#menuView .gbm-cs-clear{border:0;background:none;color:var(--gb-info);font:700 12.5px system-ui;cursor:pointer;padding:4px 6px}
#menuView .gbm-cs-clear:hover{text-decoration:underline}
#menuView .gbm-cs-more{justify-self:center;margin:2px 0 4px}
#menuView .gbm-cs-empty{display:grid;justify-items:center;gap:10px;padding:30px 14px;text-align:center}
#menuView .gbm-cs-note{margin:10px 0 0;font-size:12px;text-align:center}
@media (max-width:1180px){#menuView .gbm-cs-list .gbm-cs-row.gbm-cs-card{grid-template-columns:38px minmax(0,1fr) 92px auto}#menuView .gbm-cs-list .gbm-cs-ping{display:none}}
@media (max-width:980px),(max-height:520px){
  #menuView .gbm-cs-tabs{display:grid;grid-template-columns:1fr 1fr;gap:4px;margin-top:10px;padding:4px;border-radius:14px;background:rgba(var(--gb-ink),.06)}
  #menuView .gbm-cs-tab{display:flex;align-items:center;justify-content:center;gap:7px;min-height:40px;border:0;border-radius:11px;background:none;color:var(--gb-muted);font:800 13.5px system-ui;cursor:pointer}
  #menuView .gbm-cs-tab b{padding:0 7px;border-radius:999px;background:rgba(var(--gb-ink),.1);font-size:11.5px;line-height:1.5}
  #menuView .gbm-cs-tab.is-on{background:var(--gb-raised);color:var(--gb-hi);box-shadow:0 3px 10px -6px rgba(var(--gb-shadow),.9)}
  #menuView .gbm-cs-cols{grid-template-columns:minmax(0,1fr);margin-top:10px}
  #menuView .gbm-cs-cols[data-tab=off] .gbm-cs-col-com,#menuView .gbm-cs-cols[data-tab=com] .gbm-cs-col-off{display:none}
  #menuView .gbm-cs-col{max-height:none;padding:10px;overflow:visible;border-radius:18px}
  #menuView .gbm-cs-colh p{display:none}
  #menuView .gbm-cs-offlist,#menuView .gbm-cs-list{overflow:visible}
  #menuView .gbm-cs-ftoggle{display:inline-flex}
  #menuView .gbm-cs-filters{display:none}#menuView .gbm-cs-filters.is-open{display:flex}
  #menuView .gbm-cs-pick{flex:1 1 40%;max-width:none}#menuView .gbm-cs-sort{flex:none;max-width:130px}
}
@media (max-width:560px){
  #menuView .gbm-cs-offlist .gbm-cs-row.gbm-cs-card{grid-template-columns:44px minmax(0,1fr) auto;gap:5px 10px;padding:10px}
  #menuView .gbm-cs-offlist .gbm-cs-ic{width:44px;height:44px}
  #menuView .gbm-cs-list .gbm-cs-row.gbm-cs-card{grid-template-columns:34px minmax(0,1fr) auto;gap:8px}
  #menuView .gbm-cs-list .gbm-cs-row.gbm-cs-card>.gbm-cs-players{grid-column:2;grid-row:2}
  #menuView .gbm-cs-list .gbm-cs-row.gbm-cs-card>.gbm-cs-join{grid-column:3;grid-row:1/3}
  #menuView .gbm-cs-list .gbm-cs-ic{grid-row:1/3;width:34px;height:34px;align-self:center}
  #menuView .gbm-cs-topacts .gbm-mbtn{padding:7px 10px;font-size:12.5px}
}

/* Times: Explorar */
.gbx-find{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:center;padding:12px;border:1px solid var(--c-line);border-radius:18px;background:var(--gb-raised);box-shadow:0 10px 26px -24px rgba(var(--gb-shadow),.9)}
.gbx-find-sort{width:auto;min-width:150px}
.gbx-chips-row{display:flex;flex-wrap:wrap;gap:6px;min-width:0}
.gbx-fchip{min-height:34px;padding:5px 13px;border:1px solid var(--c-line);border-radius:999px;background:transparent;color:var(--gb-text-2);font:700 12.5px system-ui,sans-serif;cursor:pointer;transition:background .15s,color .15s,border-color .15s,transform .15s}
.gbx-fchip:hover{border-color:rgba(var(--gb-ink),.3);transform:translateY(-1px)}
.gbx-fchip.is-on{border-color:transparent;background:linear-gradient(135deg,#22c55e,#16a34a);color:#04210f;box-shadow:0 6px 16px -8px rgba(34,197,94,.9)}
.gbx-fchip:focus-visible{outline:2px solid #60a5fa;outline-offset:2px}
.gbx-find-n{justify-self:end;color:var(--c-muted);font:700 12.5px system-ui,sans-serif;font-variant-numeric:tabular-nums;white-space:nowrap}
.gbx-teamgrid{grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:12px}
.gbx-teamcard{padding:34px 13px 13px}
.gbx-teamcard-band{height:46px}
.gbx-teamcard:hover{transform:translateY(-3px);box-shadow:0 16px 32px -22px var(--c1)}
.gbx-teamcard .gbx-card-t{gap:3px}
.gbx-teamcard-bar{display:block;width:100%;max-width:150px;height:4px;margin-top:3px;border-radius:999px;background:rgba(var(--gb-ink),.1);overflow:hidden}
.gbx-teamcard-bar i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--c1),#fbbf24)}
.gbx-teamcard-cups{position:absolute;right:10px;top:8px;padding:2px 8px;border-radius:999px;background:rgba(0,0,0,.5);color:#fde68a;font:800 11.5px system-ui,sans-serif}
@media (max-width:620px){.gbx-find{grid-template-columns:minmax(0,1fr)}.gbx-find-sort{width:100%}.gbx-find-n{justify-self:start}}

/* Time: roster with the shelf beside it */
.gbx-team-cols{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:14px;align-items:start;min-width:0}
.gbx-team-side{display:flex;flex-direction:column;gap:14px;min-width:0}
.gbx-mini{display:flex;align-items:center;gap:10px;min-width:0;padding:8px 9px;border-radius:12px;background:rgba(var(--gb-ink),.04)}
.gbx-mini .gbx-trophy-art{flex:none;width:30px;height:auto}
.gbx-mini.p-gold{box-shadow:inset 3px 0 0 #fbbf24}.gbx-mini.p-silver{box-shadow:inset 3px 0 0 #cbd5e1}
.gbx-hero-facts{font-size:12.5px;font-weight:600;color:var(--gb-text-2);text-shadow:0 1px 4px rgba(0,0,0,.6)}
@media (max-width:980px){.gbx-team-cols{grid-template-columns:minmax(0,1fr)}.gbx-team-side{flex-direction:row;flex-wrap:wrap}.gbx-team-side>*{flex:1 1 260px}}

/* Hall da fama */
.gbx-hall-hero{position:relative;isolation:isolate;overflow:hidden;display:flex;align-items:center;gap:clamp(14px,3vw,34px);min-height:178px;padding:clamp(16px,3vw,30px) clamp(16px,4vw,44px);border-radius:26px;background:radial-gradient(520px 300px at 16% 118%,rgba(251,191,36,.6),transparent 68%),radial-gradient(640px 320px at 92% -20%,rgba(168,85,247,.55),transparent 66%),linear-gradient(120deg,#2a1702,#1b1037 58%,#0a1022);box-shadow:0 22px 50px -30px rgba(120,53,15,.95),inset 0 0 0 1px rgba(253,230,138,.26)}
.gbx-hall-ray{position:absolute;left:12%;top:-60%;z-index:-1;width:70px;height:240%;background:linear-gradient(180deg,rgba(253,230,138,.22),transparent 74%);transform-origin:50% 0;animation:gbx-ray 7s ease-in-out infinite alternate}
.gbx-hall-ray:nth-child(1){transform:rotate(-22deg)}.gbx-hall-ray:nth-child(2){transform:rotate(4deg);animation-delay:-2.5s}.gbx-hall-ray:nth-child(3){transform:rotate(28deg);animation-delay:-5s}
@keyframes gbx-ray{from{opacity:.35}to{opacity:1}}
.gbx-hall-hero .gbx-trophy-art{flex:none;width:clamp(76px,11vw,122px);height:auto;filter:drop-shadow(0 10px 22px rgba(251,191,36,.55))}
.gbx-hall-t{min-width:0;display:flex;flex-direction:column;gap:3px}
.gbx-hall-eyebrow{font:800 11.5px system-ui,sans-serif;letter-spacing:.24em;color:#fde68a}
.gbx-hall-t h3{font:900 clamp(28px,5vw,48px)/1.02 var(--display);font-style:italic;letter-spacing:-.01em;color:#fff;background:linear-gradient(100deg,#fff 18%,#fde68a 52%,#fff 78%);background-size:220% 100%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;animation:gbx-gold 6s linear infinite}
@keyframes gbx-gold{from{background-position:120% 0}to{background-position:-100% 0}}
.gbx-hall-t p{font-size:13.5px;color:#e2e8f0}
.gbx-hall-t .gbx-stats{margin-top:8px}
.gbx-podium-hall{margin-top:4px}
.gbx-podium-hall .gbx-podium-i{box-shadow:0 18px 34px -26px rgba(var(--gb-shadow),.9)}
.gbx-podium-hall .gbx-podium-i::before{content:"";position:absolute;left:0;right:0;bottom:0;height:7px;background:linear-gradient(90deg,#94a3b8,#e2e8f0,#94a3b8)}
.gbx-podium-hall .gbx-podium-i.p-1{box-shadow:0 22px 46px -24px rgba(251,191,36,.7),inset 0 0 0 1px rgba(251,191,36,.4)}
.gbx-podium-hall .gbx-podium-i.p-1::before{background:linear-gradient(90deg,#b45309,#fde68a,#b45309)}
.gbx-podium-hall .gbx-podium-i.p-3::before{background:linear-gradient(90deg,#78350f,#d97706,#78350f)}
.gbx-hall-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:8px}
.gbx-hall-row{position:relative;display:flex;align-items:center;gap:11px;min-width:0;padding:9px 12px 9px 15px;border:1px solid var(--c-line);border-radius:14px;overflow:hidden;background:rgba(var(--gb-ink),.03);color:var(--c-text);font:inherit;text-align:left;cursor:pointer;animation:gbx-rise .3s both;animation-delay:calc(var(--i,0)*22ms);transition:transform .16s,border-color .16s}
.gbx-hall-row::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--c1)}
.gbx-hall-row:hover{transform:translateX(3px);border-color:var(--c1)}
.gbx-hall-row:focus-visible{outline:2px solid #60a5fa;outline-offset:2px}
.gbx-hall-rank{flex:none;width:30px;font:900 15px var(--display);font-style:italic;color:var(--c-muted);text-align:center}
.gbx-hall-n{flex:none;display:flex;flex-direction:column;align-items:flex-end;line-height:1}
.gbx-hall-n b{font:900 21px var(--display);color:var(--gb-gold)}
.gbx-hall-n small{font-size:10.5px;color:var(--c-muted)}
@media (max-width:520px){.gbx-hall-hero{min-height:0;padding:14px}.gbx-hall-list{grid-template-columns:minmax(0,1fr)}}

/* Avisos */
.gbx-nt{display:flex;flex-direction:column;gap:14px;min-width:0}
.gbx-nt-head{display:flex;align-items:center;gap:13px;min-width:0;padding:14px 16px;border:1px solid var(--c-line);border-radius:20px;background:radial-gradient(340px 150px at 0 0,rgba(34,197,94,.17),transparent 72%),var(--gb-raised)}
.gbx-nt-bell{flex:none;display:grid;place-items:center;width:48px;height:48px;border-radius:15px;font-size:23px;background:rgba(var(--gb-edge),.12)}
.gbx-nt-bell.is-on{background:linear-gradient(135deg,rgba(34,197,94,.3),rgba(59,130,246,.2));animation:gbx-bell 3.6s ease-in-out infinite;transform-origin:50% 12%}
@keyframes gbx-bell{0%,86%,100%{transform:rotate(0)}89%{transform:rotate(9deg)}93%{transform:rotate(-8deg)}97%{transform:rotate(4deg)}}
.gbx-nt-head-t{flex:1;min-width:0;display:flex;flex-direction:column}
.gbx-nt-head-t b{font:900 19px/1.2 var(--display);font-style:italic;color:var(--gb-hi)}
.gbx-nt-head-t small{font-size:12.5px;color:var(--c-muted)}
.gbx-nt-cols{display:grid;grid-template-columns:250px minmax(0,1fr);gap:16px;align-items:start;min-width:0}
.gbx-nt-rail{position:sticky;top:0;display:flex;flex-direction:column;gap:10px;min-width:0}
.gbx-nt-seg{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:3px;padding:3px;border-radius:13px;background:rgba(var(--gb-ink),.06)}
.gbx-nt-state{display:flex;flex-direction:column;align-items:center;gap:0;min-height:44px;padding:4px 2px;border:0;border-radius:10px;background:none;color:var(--c-muted);font:700 11.5px system-ui,sans-serif;cursor:pointer;transition:background .15s,color .15s}
.gbx-nt-state b{color:inherit;font:900 14px var(--display)}
.gbx-nt-state.is-on{background:var(--gb-raised);color:var(--gb-hi);box-shadow:0 3px 10px -6px rgba(var(--gb-shadow),.9)}
.gbx-nt-groups{display:flex;flex-direction:column;gap:3px}
.gbx-nt-group{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:40px;padding:6px 11px;border:0;border-radius:11px;background:none;color:var(--gb-text-2);font:700 13.5px system-ui,sans-serif;text-align:left;cursor:pointer;transition:background .15s,color .15s}
.gbx-nt-group:hover{background:rgba(var(--gb-ink),.06)}
.gbx-nt-group b{min-width:22px;padding:0 6px;border-radius:999px;background:rgba(var(--gb-ink),.08);font-size:11.5px;line-height:1.6;text-align:center;font-variant-numeric:tabular-nums}
.gbx-nt-group.is-on{background:rgba(34,197,94,.16);color:var(--gb-ok)}
.gbx-nt-state:focus-visible,.gbx-nt-group:focus-visible{outline:2px solid #60a5fa;outline-offset:1px}
.gbx-nt-main{display:flex;flex-direction:column;gap:12px;min-width:0}
.gbx-nt-list{display:flex;flex-direction:column;gap:14px;min-width:0}
.gbx-nt-day{display:flex;flex-direction:column;gap:6px;min-width:0}
.gbx-nt-day h3{font:800 11.5px system-ui,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:var(--c-muted)}
.gbx-notice{--nc:148,163,184;position:relative;align-items:flex-start;gap:11px;padding:11px 12px;border-radius:15px;background:var(--gb-raised);border-color:rgba(var(--gb-edge),.12);transition:transform .16s,border-color .16s,box-shadow .16s}
.gbx-notice.g-invite{--nc:168,85,247}.gbx-notice.g-team{--nc:59,130,246}.gbx-notice.g-cup{--nc:245,158,11}.gbx-notice.g-match{--nc:34,197,94}
.gbx-notice.g-friends{--nc:236,72,153}.gbx-notice.g-shop{--nc:234,179,8}.gbx-notice.g-maps{--nc:20,184,166}.gbx-notice.g-support{--nc:14,165,233}.gbx-notice.g-account{--nc:129,140,248}
.gbx-notice:hover{background:var(--gb-raised);transform:translateY(-1px);border-color:rgba(var(--nc),.55);box-shadow:0 10px 22px -18px rgba(var(--nc),.9)}
.gbx-notice-ic{width:40px;height:40px;border-radius:13px;background:rgba(var(--nc),.16);box-shadow:inset 0 0 0 1px rgba(var(--nc),.3)}
.gbx-notice-kind{font:800 10.5px system-ui,sans-serif;letter-spacing:.07em;text-transform:uppercase;color:var(--c-muted)}
.gbx-notice.is-new{background:var(--gb-raised);border-color:rgba(var(--nc),.45);box-shadow:inset 3px 0 0 rgb(var(--nc))}
.gbx-notice.is-new::after{content:"";position:absolute;right:11px;bottom:11px;width:8px;height:8px;border-radius:50%;background:rgb(var(--nc));box-shadow:0 0 0 3px rgba(var(--nc),.25)}
.gbx-notice:not(.is-new) .gbx-card-t b{font-weight:600;color:var(--gb-text-2)}
@media (max-width:820px),(max-height:500px){
  .gbx-nt-cols{grid-template-columns:minmax(0,1fr);gap:10px}
  .gbx-nt-rail{position:static}
  .gbx-nt-groups{flex-direction:row;flex-wrap:wrap}
  .gbx-nt-group{flex:none;gap:6px;min-height:36px;border:1px solid var(--c-line);border-radius:999px}
  .gbx-nt-head{padding:10px 12px}
  .gbx-nt-head .gbx-btn{padding:5px 9px;white-space:normal;max-width:120px}
}

/* Mapas */
.gml-sheet{width:min(1320px,100%);height:min(860px,100%)}
.gml-tools{padding:10px 18px 6px}
.gml-search{flex:1 1 200px}
.gml-ftoggle{display:none}
.gml-ftoggle.is-on{border-color:rgba(34,197,94,.65);color:var(--gb-ok)}
.gml-filters{display:flex;flex-wrap:wrap;align-items:center;gap:6px;padding:0 18px 10px}
.gml-pick,.gml-who{flex:none;width:auto;max-width:170px;min-height:34px;padding:5px 10px;border-radius:999px;font-size:12.5px}
input.gml-who{flex:0 1 150px}
.gml-pick.is-on{border-color:rgba(34,197,94,.65);background:rgba(34,197,94,.14);color:var(--gb-ok)}
.gml-clear{border:0;background:none;color:var(--gb-info);font:700 12.5px system-ui,sans-serif;cursor:pointer;padding:4px 6px}
.gml-clear:hover{text-decoration:underline}
.gml-main{grid-template-columns:minmax(0,1fr);transition:grid-template-columns .22s ease}
.gml-main.has-side{grid-template-columns:minmax(0,1fr) 340px}
.gml-side{display:none}.gml-side.is-open{display:flex;position:relative;animation:gbs-in .2s both}
.gml-grid{grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:14px}
.gml-card{border-radius:16px;background:var(--gb-raised)}
.gml-art{position:relative;display:block;overflow:hidden;border-radius:15px 15px 0 0}
.gml-art .gml-thumb{transition:transform .3s ease}
.gml-card:hover .gml-thumb{transform:scale(1.05)}
.gml-mode{position:absolute;left:7px;bottom:7px;padding:2px 8px;border-radius:999px;background:rgba(7,11,20,.76);color:#fff;font:700 11px system-ui,sans-serif;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}
.gml-mode.m-livre{background:rgba(88,28,135,.82)}
.gml-chips{display:flex;flex-wrap:wrap;gap:4px;min-width:0}
.gml-meta .gml-chips{margin-top:4px}
.gml-chip{padding:1px 7px;border-radius:999px;background:rgba(var(--gb-ink),.07);color:var(--gb-text-2);font:700 10.5px/1.6 system-ui,sans-serif;white-space:nowrap}
.gml-relates{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:12px;background:rgba(34,197,94,.1);box-shadow:inset 0 0 0 1px rgba(34,197,94,.26)}
.gml-relates-ic{font-size:20px}
.gml-relates-t{display:flex;flex-direction:column;min-width:0}
.gml-relates-t b{color:var(--gb-hi);font-size:13.5px}
.gml-relates-t small{color:var(--gb-muted);font-size:12px}
.gml-author{padding:0;border:0;background:none;color:var(--gb-info);font:inherit;font-weight:700;cursor:pointer}
.gml-author:hover{text-decoration:underline}
.gml-side-close{position:absolute;right:22px;top:20px;z-index:1;width:30px;height:30px;border:0;border-radius:9px;background:rgba(7,11,20,.66);color:#fff;cursor:pointer}
.gml-desc{color:var(--gb-text-2)}
.gml-empty{display:flex;flex-direction:column;align-items:center;gap:8px;margin:auto;padding:46px 18px;max-width:420px}
.gml-empty b{font-size:16px;color:var(--gb-hi)}
.gml-empty p{margin:0;font-size:13.5px}
.gml-empty-ic{display:grid;place-items:center;width:68px;height:68px;border-radius:20px;font-size:32px;background:linear-gradient(135deg,rgba(34,197,94,.2),rgba(59,130,246,.14));box-shadow:inset 0 0 0 1px rgba(var(--gb-edge),.2)}
.gml-empty-acts{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-top:6px}
.gml-grid:has(.gml-empty){min-height:100%;align-content:center}
.gme-mode{flex:none;padding:4px 10px;border-radius:999px;background:rgba(59,130,246,.14);box-shadow:inset 0 0 0 1px rgba(59,130,246,.36);color:var(--gb-info);font:700 12px system-ui,sans-serif;white-space:nowrap}
.gme-top{box-shadow:0 8px 20px -18px rgba(var(--gb-shadow),.9)}
.gme-rail{box-shadow:0 18px 38px -22px rgba(var(--gb-shadow),.9)}
.gme-side.is-open{width:320px}
.gme-panel .gme-field,.gme-range{padding:8px 9px;border-radius:11px;background:rgba(var(--gb-ink),.035)}
.gme-two .gme-field{padding:6px 7px}
.gme-two{gap:6px}
@media (max-width:820px),(max-height:500px){
  .gml-ftoggle{display:inline-flex}.gml-filters{display:none;padding-bottom:8px}.gml-filters.is-open{display:flex}
  .gml-main.has-side{grid-template-columns:minmax(0,1fr)}
  .gml-side.is-open{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:2;max-height:82%;border-radius:18px 18px 0 0;border-left:0;box-shadow:0 -18px 40px rgba(var(--gb-shadow),.6);background:var(--gb-panel)}
  .gml-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;padding:8px 12px 14px}
  .gml-head{padding:8px 12px;gap:10px}.gml-tools{padding:6px 12px}.gml-filters{padding-left:12px;padding-right:12px}
  .gml-pick{flex:1 1 40%;max-width:none}
}
@media (max-height:500px) and (orientation:landscape){.gml-back{padding:0}.gml-sheet{height:100%;border-radius:0;border:0}.gml-side.is-open{top:0;left:auto;width:min(380px,50%);max-height:none;border-radius:0}.gml-big{max-height:120px}}

/* Controles do Jogador */
#controlsModal .gbh-modal{display:flex;flex-direction:column;width:min(860px,calc(100vw - 24px));max-width:none;max-height:calc(100dvh - 24px);padding:0;overflow:hidden;background:radial-gradient(560px 240px at 0 -10%,rgba(168,85,247,.18),transparent 70%),radial-gradient(560px 260px at 100% 0,rgba(34,197,94,.13),transparent 66%),var(--gb-panel)!important}
.gbh-head{flex:none;display:flex;align-items:center;gap:12px;padding:14px 16px 10px}
.gbh-head-ic{flex:none;display:grid;place-items:center;width:44px;height:44px;border-radius:14px;font-size:22px;background:linear-gradient(145deg,rgba(168,85,247,.32),rgba(59,130,246,.14));box-shadow:inset 0 0 0 1px rgba(168,85,247,.42)}
.gbh-head-t{flex:1;min-width:0}
.gbh-eyebrow{display:block;font:800 10.5px system-ui,sans-serif;letter-spacing:.18em;text-transform:uppercase;color:var(--gb-muted)}
.gbh-head h2{margin:0;font:900 22px/1.15 "Segoe UI Black","Arial Black",system-ui,sans-serif;font-style:italic;color:var(--gb-hi)}
.gbh-body{flex:1;min-height:0;display:flex;flex-direction:column;gap:12px;padding:2px 16px 12px;overflow-y:auto;scrollbar-width:thin}
.gbh-tabs{flex:none;display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;padding:2px}
.gbh-tabs::-webkit-scrollbar{display:none}
.gbh-tab{flex:none;display:inline-flex;align-items:center;gap:6px;min-height:38px;padding:6px 12px;border:1px solid rgba(var(--gb-edge),.2);border-radius:999px;background:rgba(var(--gb-ink),.04);color:var(--gb-text-2);font:700 13px system-ui,sans-serif;cursor:pointer;transition:background .15s,transform .15s,border-color .15s}
.gbh-tab:hover{transform:translateY(-1px);border-color:rgba(var(--gb-edge),.45)}
.gbh-tab.is-on{border-color:transparent;background:linear-gradient(135deg,#a855f7,#6366f1);color:#fff;box-shadow:0 8px 18px -10px rgba(168,85,247,.9)}
.gbh-tab:focus-visible{outline:2px solid #60a5fa;outline-offset:2px}
.gbh-panel{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:12px;animation:gbh-in .2s both}
@keyframes gbh-in{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}
.gbh-move,.gbh-acts,.gbh-keys{padding:12px;border:1px solid rgba(var(--gb-edge),.15);border-radius:16px;background:rgba(var(--gb-ink),.035)}
.gbh-body h3{margin:0 0 9px;font:800 11.5px system-ui,sans-serif;letter-spacing:.1em;text-transform:uppercase;color:var(--gb-muted)}
.gbh-pads{display:flex;align-items:center;justify-content:center;gap:12px}
.gbh-pad{display:grid;grid-template:repeat(2,38px)/repeat(3,38px);gap:4px}
.gbh-up{grid-area:1/2}.gbh-left{grid-area:2/1}.gbh-down{grid-area:2/2}.gbh-right{grid-area:2/3}
.gbh-cap{display:inline-grid;place-items:center;min-width:34px;height:34px;padding:0 8px;border-radius:9px;background:linear-gradient(180deg,rgba(var(--gb-ink),.13),rgba(var(--gb-ink),.05));box-shadow:inset 0 1px 0 rgba(var(--gb-ink),.16),inset 0 -2px 0 rgba(var(--gb-shadow),.4),0 0 0 1px rgba(var(--gb-edge),.3);color:var(--gb-hi);font:800 12.5px system-ui,sans-serif;transition:transform .08s,background .08s,box-shadow .08s}
.gbh-pad .gbh-cap{width:38px;height:38px;min-width:0;padding:0}
.gbh-cap.is-down{transform:translateY(2px);background:linear-gradient(135deg,#22c55e,#16a34a);color:#04120a;box-shadow:0 0 16px rgba(34,197,94,.7)}
.gbh-or{color:var(--gb-muted);font:600 11.5px system-ui,sans-serif}
.gbh-plus{color:var(--gb-muted);font-weight:800}
.gbh-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:7px 0;border-top:1px solid rgba(var(--gb-edge),.1)}
.gbh-row:first-of-type{border-top:0;padding-top:0}
.gbh-row-t{min-width:0;display:flex;flex-direction:column}
.gbh-row-t b{color:var(--gb-hi);font-size:14px}
.gbh-row-t small{color:var(--gb-muted);font-size:12px;line-height:1.3}
.gbh-caps{flex:none;display:flex;flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:4px;max-width:58%}
.gbh-modes{margin:8px 0 0;color:var(--gb-muted);font-size:12px}
.gbh-intro{margin-top:10px;min-height:36px;padding:7px 14px;border:0;border-radius:10px;background:linear-gradient(135deg,#22c55e,#16a34a);color:#04210f;font:800 12.5px system-ui;cursor:pointer;transition:filter .15s}.gbh-intro:hover{filter:brightness(1.08)}.gbh-intro:focus-visible{outline:none;box-shadow:0 0 0 3px rgba(59,130,246,.6)}
.gbh-keys-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px 18px}
.gbh-key{display:flex;align-items:center;justify-content:space-between;gap:8px;min-width:0;color:var(--gb-text-2);font-size:13px}
#controlsModal .help-version{flex:none;padding:0 16px 10px}
@media (max-width:640px),(max-height:500px){
  .gbh-panel{grid-template-columns:minmax(0,1fr)}.gbh-keys-list{grid-template-columns:minmax(0,1fr)}
  .gbh-pad{grid-template:repeat(2,32px)/repeat(3,32px)}.gbh-pad .gbh-cap{width:32px;height:32px}
  .gbh-head{padding:10px 12px 6px}.gbh-body{padding:2px 12px 10px}.gbh-head h2{font-size:18px}
}
@media (max-height:500px) and (orientation:landscape){.gbh-panel{grid-template-columns:minmax(0,5fr) minmax(0,7fr)}.gbh-keys-list{grid-template-columns:repeat(2,minmax(0,1fr))}}

@media (prefers-reduced-motion:reduce){
  #menuView .gbm-sc,#menuView .gbm-sc .gbm-ic,#menuView .gbm-sc-go,.gbx-teamcard,.gbx-hall-row,.gbx-notice,.gbh-tab,.gbh-cap,.gml-art .gml-thumb{transition:none}
  #menuView .gbm-sc:hover,#menuView .gbm-sc:hover .gbm-ic,.gbx-teamcard:hover,.gbx-hall-row:hover,.gbx-notice:hover,.gml-card:hover .gml-thumb{transform:none}
  #menuView .gbm-sc::before{display:none}
  .gbx-hall-ray,.gbx-hall-t h3,.gbx-nt-bell.is-on,.gbh-panel,.gbx-hall-row,.gml-side.is-open{animation:none}
}

/* ESC header: the room's name, its code to copy, and the theme */
.esc-title-row{display:flex;align-items:center;gap:9px;min-width:0;flex-wrap:wrap}
.esc-title-row .esc-title{min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.esc-code{flex:none;min-height:26px;padding:2px 9px;border:1px dashed rgba(var(--gb-edge),.45);border-radius:8px;background:rgba(var(--gb-ink),.06);color:var(--gb-text-2);font:800 12px ui-monospace,Consolas,monospace;letter-spacing:.06em;cursor:copy;transition:background .15s,border-color .15s}
.esc-code:hover{background:rgba(var(--gb-ink),.12);border-color:rgba(var(--gb-edge),.7)}
.esc-code:focus-visible{outline:2px solid #60a5fa;outline-offset:2px}
.esc-code.is-copied{border-style:solid;border-color:rgba(34,197,94,.7);background:rgba(34,197,94,.16);color:var(--gb-ok)}
.esc-head .esc-tools #btnEscTheme{order:3;width:30px;padding:0;font-size:15px}

/* Rooms: join by code */
#menuView .gbm-cs-codebox{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:12px;padding:8px 10px;border:1px solid var(--glass-b);border-radius:14px;background:var(--glass)}
#menuView .gbm-cs-codebox label{flex:1 1 240px;display:flex;align-items:center;gap:10px;min-width:0;margin:0;font:800 13px system-ui;color:var(--gb-text-2)}
#menuView .gbm-cs-codebox label span{flex:none}
#menuView .gbm-cs-codebox .gbm-input{flex:1;min-width:0;max-width:210px;text-transform:uppercase;font:800 14px ui-monospace,Consolas,monospace;letter-spacing:.1em}
#menuView .gbm-cs-codebox .gbm-input::placeholder{text-transform:none;letter-spacing:.06em}
#menuView .gbm-cs-code{flex:none;padding:0 6px;border-radius:6px;background:rgba(var(--gb-ink),.07);font:700 10.5px/1.6 ui-monospace,Consolas,monospace;letter-spacing:.04em;color:var(--gb-text-2)}
@media (max-width:560px){#menuView .gbm-cs-codebox label{flex-wrap:wrap;gap:4px}#menuView .gbm-cs-codebox .gbm-input{max-width:none;flex-basis:100%}}
@media (max-height:520px){#menuView .gbm-cs-codebox{margin-top:8px;padding:5px 8px}}

/* Light: cards stand off the page; the washes of the dark look are too thin here */
html[data-gb-theme=light] #menuView .gbm-glass,html[data-gb-theme=light] .gbx-sec,html[data-gb-theme=light] .gbx-card,html[data-gb-theme=light] .gbx-find,html[data-gb-theme=light] .gbx-notice,html[data-gb-theme=light] .gbx-nt-head,html[data-gb-theme=light] .gml-card,html[data-gb-theme=light] .gbs-card,html[data-gb-theme=light] #menuView .gbm-cs-col,html[data-gb-theme=light] #menuView .gbm-cs-card{border-color:rgba(15,23,42,.3);box-shadow:0 1px 2px rgba(15,23,42,.14),0 8px 20px -14px rgba(15,23,42,.4)}
html[data-gb-theme=light] #menuView .gbm-sc{background:linear-gradient(150deg,rgba(var(--sc),.1),rgba(var(--sc),.02) 58%),#fff}
html[data-gb-theme=light] .gbx-nt-seg,html[data-gb-theme=light] #menuView .gbm-cs-tabs,html[data-gb-theme=light] .gml-tabs{background:rgba(15,23,42,.1)}

/* Light: surfaces under the text are solid, so what is on screen behind a panel never changes its contrast */
html[data-gb-theme=light] .modal-overlay .modal-content,html[data-gb-theme=light] .esc-panel{background:var(--gb-panel)!important;-webkit-backdrop-filter:none;backdrop-filter:none}
html[data-gb-theme=light] .esc-more,html[data-gb-theme=light] .roster-card,html[data-gb-theme=light] .esc-card,html[data-gb-theme=light] .esc-col{background:#fff!important;border-color:rgba(15,23,42,.3)!important}
html[data-gb-theme=light] .esc-rule-note{opacity:1}
html[data-gb-theme=light] .amb-opt{color:var(--gb-text-2)}
html[data-gb-theme=light] .kit-row.is-sel{background:rgba(59,130,246,.16)}
html[data-gb-theme=light] .kit-side-red .kit-row.is-sel{background:rgba(244,63,94,.14)}
html[data-gb-theme=light] #menuView .gbm-cs-ping{--pc:#14532d}
html[data-gb-theme=light] #menuView .gbm-cs-ping.ping-mid{--pc:#6b3d07}
html[data-gb-theme=light] #menuView .gbm-cs-ping.ping-bad{--pc:#9f1239}
html[data-gb-theme=light] #menuView .gbm-cs-ping.ping-good{--pc:#14532d}
html[data-gb-theme=light] #menuView .gbm-cs-card.is-full{opacity:1}
html[data-gb-theme=light] #menuView .gbm-cs-tab{color:var(--gb-text-2)}
/* the art cards of the home keep their colours: --muted comes from #menuView, so it is set again here */
html[data-gb-theme=light] #menuView .gbm-mcard{--muted:#e8eef8}
html[data-gb-theme=light] #menuView .gbm-mcard .gbm-tag{background:rgba(5,9,18,.72);color:#fff;box-shadow:inset 0 0 0 1px rgba(255,255,255,.3)}
html[data-gb-theme=light] #menuView .gbm-mcard p.gbm-muted{text-shadow:none;padding:2px 7px;margin-left:-7px;border-radius:7px;background:rgba(5,9,18,.5);width:fit-content}
html[data-gb-theme=light] .gbh-tab.is-on{background:linear-gradient(135deg,#7e22ce,#4f46e5)}
html[data-gb-theme=light] body.game .sitenav .avatar:not(img){background:linear-gradient(135deg,#0f766e,#1e40af)}
html[data-gb-theme=light] .gbs-stage button.is-on{color:#160606}

/* Sun and moon in the site header */
body.game .sitenav .gb-themebtn{border-color:rgba(var(--gb-edge),.3)}
html[data-gb-theme=light] .kit-body.is-off .kit-side{opacity:1}
html[data-gb-theme=light] .gfx-pick{background:rgba(15,23,42,.1);border-color:rgba(15,23,42,.25)}
html[data-gb-theme=light] .gfx-opt{color:var(--gb-text-2)}
html[data-gb-theme=light] .gfx-opt:hover{background:rgba(15,23,42,.08);color:var(--gb-hi)}
html[data-gb-theme=light] .gfx-opt[aria-checked="true"]{color:#fff;background:linear-gradient(160deg,#4338ca,#0369a1)}
html[data-gb-theme=light] .kit-group{color:var(--gb-hi)}
html[data-gb-theme=light] .kit-group-teams{color:#14532d}

/* Rooms on a phone lying down: the header gives its height to the list */
@media (max-height:520px){
  #menuView [data-screen=community] .gbm-top{margin-bottom:4px;flex-wrap:nowrap}
  #menuView .gbm-cs-title h1{font-size:19px;white-space:nowrap}
  #menuView .gbm-cs-title .gbm-tag{display:none}
  #menuView .gbm-cs-topacts{flex-wrap:nowrap}
  #menuView .gbm-cs-topacts .gbm-mbtn{padding:6px 10px;font-size:12.5px;white-space:nowrap}
  #menuView .gbm-cs-tabs{margin-top:6px}
  #menuView .gbm-cs-tab{min-height:32px}
  #menuView .gbm-cs-codebox .gbm-mbtn{padding:5px 12px}
}

/* Pedidos para entrar: a faixa na página do time, a lista do capitão e o interruptor */
.gbx-join{position:relative;display:flex;align-items:center;justify-content:space-between;gap:14px;padding:12px 14px;border-radius:15px;background:var(--gb-raised);box-shadow:inset 0 0 0 1px rgba(var(--gb-edge),.14);overflow:hidden;animation:gbx-rise .26s both}
.gbx-join.is-open{box-shadow:inset 0 0 0 1px rgba(34,197,94,.38),0 12px 26px -22px rgba(34,197,94,.9)}
.gbx-join.is-open::before{content:"";position:absolute;inset:0;background:linear-gradient(100deg,rgba(34,197,94,.12),transparent 58%);pointer-events:none}
.gbx-join-t{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:5px;min-width:0}
.gbx-join-t p{color:var(--gb-text-2);font-size:13.5px;overflow-wrap:anywhere}
.gbx-join .gbx-btn{position:relative;flex:none}
.gbx-requests[hidden]{display:none}
.gbx-requests-n{display:inline-grid;place-items:center;min-width:22px;margin-left:8px;padding:0 6px;border-radius:999px;background:rgba(34,197,94,.18);color:var(--gb-ok);font:800 12px/1.6 system-ui,sans-serif;vertical-align:middle}
.gbx-request{border:1px solid rgba(34,197,94,.3);background:rgba(34,197,94,.06)}
.gbx-switch{position:relative;display:flex;align-items:center;justify-content:space-between;gap:14px;min-height:44px;cursor:pointer}
.gbx-switch input{position:absolute;right:0;width:46px;height:28px;margin:0;opacity:0;cursor:pointer}
.gbx-switch-ui{position:relative;flex:none;width:46px;height:28px;border-radius:999px;background:rgba(var(--gb-ink),.18);transition:background .18s}
.gbx-switch-ui::after{content:"";position:absolute;top:3px;left:3px;width:22px;height:22px;border-radius:50%;background:#fff;box-shadow:0 2px 6px rgba(0,0,0,.35);transition:transform .18s}
.gbx-switch input:checked+.gbx-switch-ui{background:#16a34a}
.gbx-switch input:checked+.gbx-switch-ui::after{transform:translateX(18px)}
.gbx-switch input:focus-visible+.gbx-switch-ui{outline:2px solid #60a5fa;outline-offset:2px}
.gbx-switch input:disabled+.gbx-switch-ui{opacity:.6}
@media (max-width:560px){.gbx-join{flex-direction:column;align-items:stretch}.gbx-join .gbx-btn{width:100%}}
@media (prefers-reduced-motion:reduce){.gbx-join{animation:none}.gbx-switch-ui,.gbx-switch-ui::after{transition:none}}

/* ==========================================================================
   Photo beside the name (v1.10): the menu's own photo next to the name plate leads to "Sua foto no disco" in the shop.
   Mobbin: Posh (round photo with a small camera badge), Sora (pencil badge and "Upload photo"), Replit (photo + one
   action beside it), Duolingo "Pick your look" (status chip on the card).
   ========================================================================== */
#menuView .gbm-npface{position:relative;z-index:2;flex:none;display:grid;place-items:center;width:46px;height:46px;margin:0 -20px 0 auto;padding:0;border:2px solid rgba(255,255,255,.88);border-radius:50%;background:hsl(var(--face-h,150) 45% 32%);color:#fff;font:800 15px/1 system-ui,-apple-system,"Segoe UI",sans-serif;cursor:pointer;box-shadow:0 8px 18px -8px rgba(0,0,0,.7),0 0 0 0 rgba(34,197,94,0);transition:transform .2s cubic-bezier(.2,.9,.3,1.3),box-shadow .2s}
#menuView .gbm-npface img{display:block;width:100%;height:100%;border-radius:50%;object-fit:cover}
#menuView .gbm-npface:hover,#menuView .gbm-npface:focus-visible{transform:translateY(-1px) scale(1.06);box-shadow:0 10px 20px -8px rgba(0,0,0,.7),0 0 0 4px rgba(34,197,94,.38)}
#menuView .gbm-npface-b{position:absolute;right:-4px;bottom:-4px;display:grid;place-items:center;width:20px;height:20px;border-radius:50%;background:var(--gb-ok,#22c55e);color:#052e16;border:2px solid #0d1526;animation:gbm-npface-ping 1.8s ease-out 1.2s 3}
#menuView .gbm-npface-b svg{width:11px;height:11px}
#menuView .gbm-npface + .gbm-nameplate{margin-left:0;padding-left:28px}
@keyframes gbm-npface-ping{0%{box-shadow:0 0 0 0 rgba(34,197,94,.7)}80%,100%{box-shadow:0 0 0 9px rgba(34,197,94,0)}}
@media (max-width:520px){#menuView .gbm-npface{width:40px;height:40px;margin-right:-18px;font-size:13px}#menuView .gbm-npface + .gbm-nameplate{padding-left:24px}}

/* "Sua foto no disco": the card on top of Disco próprio */
.gbs-photo-card{position:relative;display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:14px;align-items:center;margin:0 0 12px;padding:14px 16px;border:1px solid rgba(34,197,94,.28);border-radius:16px;background:radial-gradient(280px 120px at 0 0,rgba(34,197,94,.16),transparent 70%),rgba(var(--gb-ink),.04)}
.gbs-photo-card.is-enter{animation:gbs-in .3s both}
.gbs-photo-card.is-lit{border-color:rgba(34,197,94,.6);box-shadow:0 0 0 3px rgba(34,197,94,.14),0 14px 30px -18px rgba(34,197,94,.55)}
.gbs-photo-face{position:relative;display:grid;place-items:center;width:58px;height:58px;border-radius:50%;background:#0d1424;color:var(--gb-muted);font:800 20px system-ui,sans-serif;box-shadow:0 0 0 3px #E56E56,0 8px 18px -8px rgba(0,0,0,.7)}
.gbs-photo-face img{display:block;width:100%;height:100%;border-radius:50%;object-fit:cover}
.gbs-photo-face i{position:absolute;inset:-3px;border-radius:50%;background:conic-gradient(from 0deg,transparent 0 70%,rgba(255,255,255,.55) 80%,transparent 90%);-webkit-mask:radial-gradient(circle,transparent 62%,#000 63%);mask:radial-gradient(circle,transparent 62%,#000 63%);animation:gbs-photo-spin 3.2s linear infinite;pointer-events:none}
.gbs-photo-txt b{font-size:15px}
.gbs-photo-txt p{margin:4px 0 0;color:var(--gb-text);font-size:13px;line-height:1.45}
.gbs-photo-txt .gbs-photo-rule{color:var(--gb-muted);font-size:12px}
.gbs-photo-act .gbs-mini{white-space:nowrap;border-color:rgba(34,197,94,.55);background:rgba(34,197,94,.14);color:var(--gb-ok);font-weight:800;text-decoration:none;display:inline-block}
.gbs-photo-act .gbs-mini:hover{background:rgba(34,197,94,.24)}
.gbs-tagline{display:block;margin-top:3px;color:var(--gb-muted);font-size:11.5px;font-weight:700}
@keyframes gbs-photo-spin{to{transform:rotate(360deg)}}
@media (max-width:620px){.gbs-photo-card{grid-template-columns:auto minmax(0,1fr)}.gbs-photo-act{grid-column:1/-1}}
@media (prefers-reduced-motion:reduce){#menuView .gbm-npface,#menuView .gbm-npface-b,.gbs-photo-card,.gbs-photo-face i{animation:none;transition:none}#menuView .gbm-npface:hover{transform:none}}
/* the ranked panel: the same face beside the name (src/ui/photo-face.js), ringed in the team's colour */
.rk-name .rk-face{width:20px;height:20px;margin-right:6px;vertical-align:-5px;font-size:8.5px;display:inline-grid}
.rk-col-red .rk-face{box-shadow:0 0 0 1.5px rgba(239,68,68,.8),0 2px 6px -2px rgba(0,0,0,.6)}
.rk-col-blue .rk-face{box-shadow:0 0 0 1.5px rgba(59,130,246,.85),0 2px 6px -2px rgba(0,0,0,.6)}
.rk-row.is-you .rk-face{box-shadow:0 0 0 2px rgba(34,197,94,.9),0 0 10px -2px rgba(34,197,94,.65)}

/* Portal name styles and avatar frames inside GOBALL (src/ui/name-style.js): the same look as the site's /skins.css, here so it
   works in the app too. The name keeps its size; only the fill changes. Rainbow moves only without reduced motion. */
.gb-nm { font-weight: 800; }
.gb-nm-ouro { background: linear-gradient(180deg, #fff3c4, #f59e0b 60%, #b45309); -webkit-background-clip: text; background-clip: text; color: transparent !important; }
.gb-nm-neon { color: #fdf4ff !important; text-shadow: 0 0 6px #f472b6, 0 0 12px #22d3ee; }
.gb-nm-arco { background: linear-gradient(90deg, #ef4444, #f59e0b, #eab308, #22c55e, #3b82f6, #a855f7, #ef4444); background-size: 300% 100%;
  -webkit-background-clip: text; background-clip: text; color: transparent !important; animation: gbNmArco 4s linear infinite; }
@keyframes gbNmArco { to { background-position: 300% 0; } }
html[data-gb-theme=light] .gb-nm-ouro { background-image: linear-gradient(180deg, #d97706, #b45309 60%, #78350f); }
html[data-gb-theme=light] .gb-nm-neon { color: #a21caf !important; text-shadow: 0 0 6px rgba(244,114,182,.55); }
.gb-fr-fogo { box-shadow: 0 0 0 2px #f97316, 0 0 10px 2px rgba(239,68,68,.75), 0 -3px 12px rgba(250,204,21,.6) !important; border-radius: 50%; }
.gb-fr-gelo { box-shadow: 0 0 0 2px #e0f2fe, 0 0 12px 3px rgba(56,189,248,.7) !important; border-radius: 50%; }
.gb-fr-ouro { box-shadow: 0 0 0 3px #f59e0b, 0 0 0 5px rgba(253,230,138,.5), 0 0 12px 3px rgba(245,158,11,.55) !important; border-radius: 50%; }
@media (prefers-reduced-motion: reduce) { .gb-nm-arco { animation: none; } }
/* "Denunciar foto" on the player card: a quiet link, then reason chips (Discord member popover "Report") */
.pc-report { margin-top: 8px; }
.pc-report:empty { display: none; }
.pc-rep-open { border: 0; background: none; padding: 2px 0; color: rgba(248, 113, 113, .9); font: 600 12px system-ui, sans-serif; cursor: pointer; text-decoration: underline; text-underline-offset: 2px; }
.pc-rep-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; }
.pc-rep-chip { border: 1px solid rgba(248, 113, 113, .45); border-radius: 999px; padding: 4px 10px; background: rgba(248, 113, 113, .1); color: inherit; font: 600 12px system-ui, sans-serif; cursor: pointer; transition: background .15s, transform .15s; }
.pc-rep-chip:hover { background: rgba(248, 113, 113, .22); transform: translateY(-1px); }
.pc-rep-chip:disabled { opacity: .5; cursor: default; }
.pc-rep-done { color: #4ade80; }
html[data-gb-theme=light] .pc-rep-open { color: #b91c1c; }
html[data-gb-theme=light] .pc-rep-done { color: #15803d; }
/* "Usar em" (one disc per side) over Equipar */
.gbs-side{display:flex;align-items:center;flex-wrap:wrap;gap:4px;margin:0 0 8px;padding:3px;border-radius:12px;background:rgba(var(--gb-ink),.06);width:max-content;max-width:100%}
.gbs-side span{padding:0 8px 0 6px;color:var(--gb-text-2);font:700 11px system-ui,sans-serif;text-transform:uppercase;letter-spacing:.06em}
.gbs-side button{border:0;border-radius:9px;padding:6px 12px;background:transparent;color:var(--gb-text-2);font:600 12.5px system-ui,sans-serif;cursor:pointer;transition:background .15s,color .15s,transform .15s}
.gbs-side button:hover{transform:translateY(-1px);color:var(--gb-text)}
.gbs-side button.is-on{color:var(--gb-hi);box-shadow:0 4px 12px -6px rgba(0,0,0,.5)}
.gbs-side button.s-both.is-on{background:linear-gradient(90deg,#E56E56 50%,#5689E5 50%)}
.gbs-side button.s-red.is-on{background:#E56E56}
.gbs-side button.s-blue.is-on{background:#5689E5}
.gbs-side-note{margin:0 0 8px;font-size:12px}
@media (prefers-reduced-motion: reduce){.gbs-side button{transition:none}.gbs-side button:hover{transform:none}}
/* narrow landscape phones (<= 700px): passes and wrong passes leave the table (they stay in "Sua atuação" and the chat) so names stay readable */
@media (max-height:500px) and (orientation:landscape) and (max-width:700px){
  #endBoard .es-full .es-k-passes,#endBoard .es-full .es-k-badPasses{display:none}
  #endBoard .es-full .es-has-note>.es-col-head,#endBoard .es-full .es-has-note>.es-prow{grid-template-columns:minmax(40px,1fr) repeat(4,15px) 19px}
}