.custom-match-hero{padding:78px 0 66px;border-bottom:1px solid #263340;background:radial-gradient(circle at 82% 25%,rgba(199,255,50,.1),transparent 33%),#090e15}.custom-match-hero>.shell{display:flex;align-items:flex-end;justify-content:space-between;gap:35px}.custom-match-hero h1{margin:9px 0 5px;font-size:58px}.custom-match-hero p{max-width:650px;margin:0;color:#91a0b2;font-size:14px}.custom-match-directory{min-height:540px}.custom-match-section-head{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:25px}.custom-match-section-head h2{margin:7px 0 0}.custom-match-section-head>span{padding:8px 11px;border:1px solid #3b4a2c;color:#aab978;font-size:8px;font-weight:900;text-transform:uppercase}.custom-match-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px}.custom-match-card{display:block;border:1px solid #2d3948;background:linear-gradient(145deg,#0e1620,#0a1018);color:#eaf0f5;transition:.2s}.custom-match-card:hover{border-color:#607b2c;transform:translateY(-2px)}.custom-match-card>header,.custom-match-card>footer{display:flex;align-items:center;justify-content:space-between;padding:11px 15px;border-bottom:1px solid #283440}.custom-match-card>header small,.custom-match-card>footer span{color:#6f7d8d;font-size:8px}.custom-match-card>h3{margin:18px 18px 8px;font-size:20px}.custom-match-status{display:inline-flex;align-items:center;gap:6px;color:var(--accent);font-size:8px;font-weight:900;text-transform:uppercase;letter-spacing:.65px}.custom-match-status:before{content:"";width:5px;height:5px;border-radius:50%;background:currentColor;box-shadow:0 0 8px currentColor}.custom-match-versus{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:13px;padding:15px 18px 20px}.custom-match-versus>div{display:grid;grid-template-columns:38px minmax(0,1fr) auto;align-items:center;gap:9px}.custom-match-versus>div>b{display:grid;width:38px;height:38px;place-items:center;border:1px solid #3b4959;background:#151f2b;color:var(--accent);font-size:8px}.custom-match-versus>div>strong{overflow:hidden;font-size:11px;text-overflow:ellipsis;white-space:nowrap}.custom-match-versus>div>small{color:#718090;font-size:8px}.custom-match-versus>span{display:flex;flex-direction:column;color:#768496;font-size:10px;font-weight:900;text-align:center}.custom-match-versus>span small{margin-top:2px;color:var(--accent);font-size:7px}.custom-match-card>footer{border-top:1px solid #283440;border-bottom:0}.custom-match-card>footer b{color:var(--accent);font-size:8px}.custom-match-card.cancelled,.custom-match-card.finished{opacity:.6}.custom-match-empty{display:flex;min-height:260px;align-items:center;justify-content:center;flex-direction:column;border:1px dashed #334151;background:#0b1119}.custom-match-empty>b{display:grid;width:58px;height:58px;place-items:center;border:1px solid #47582f;color:var(--accent)}.custom-match-empty>strong{margin-top:15px}.custom-match-empty>span{margin-top:5px;color:#758293;font-size:9px}
.custom-match-create{min-height:720px;padding:48px 0 75px;background:radial-gradient(circle at 18% 22%,rgba(199,255,50,.07),transparent 30%)}.custom-match-back{color:#7f8c9d;font-size:8px;font-weight:900}.custom-match-create-grid{display:grid;grid-template-columns:minmax(300px,.85fr) minmax(420px,1fr);gap:70px;margin-top:45px}.custom-match-create-copy h1{margin:10px 0 15px;font-size:50px;line-height:.92}.custom-match-create-copy>p{max-width:500px;color:#8794a5;font-size:11px;line-height:1.7}.custom-match-create-copy ol{display:grid;gap:10px;margin:35px 0 0;padding:0;list-style:none}.custom-match-create-copy li{display:flex;align-items:center;gap:13px;padding:12px;border:1px solid #293543;background:#0d141d}.custom-match-create-copy li>b{display:grid;width:34px;height:34px;place-items:center;background:#172215;color:var(--accent);font-size:9px}.custom-match-create-copy li span{display:flex;flex-direction:column}.custom-match-create-copy li strong{font-size:10px}.custom-match-create-copy li small{margin-top:2px;color:#6e7b8c;font-size:8px}.custom-match-create-form{padding:28px;border:1px solid #334153;background:#0d141d}.custom-match-create-form>label,.custom-match-form-row label{display:flex;flex-direction:column;margin-bottom:19px}.custom-match-create-form label>span:first-child{margin-bottom:7px;color:#aab5c3;font-size:8px;font-weight:900;text-transform:uppercase;letter-spacing:.65px}.custom-match-create-form label>small{margin-top:5px;color:#637181;font-size:7px}.custom-match-create-form input,.custom-match-create-form select{height:49px}.custom-match-form-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}.custom-match-checkbox{display:grid!important;grid-template-columns:auto 1fr;align-items:start;gap:11px;padding:14px;border:1px solid #2c3947;background:#0a1018}.custom-match-checkbox input{width:16px;height:16px}.custom-match-checkbox>span{display:flex;flex-direction:column}.custom-match-checkbox b{font-size:9px}.custom-match-checkbox small{margin-top:4px}.custom-match-create-form>.btn{width:100%;height:50px}
.custom-lobby-page{min-height:800px}.custom-lobby-hero{padding:32px 0;border-bottom:1px solid #2c3947;background:radial-gradient(circle at 75% 30%,rgba(199,255,50,.08),transparent 36%),#0a1017}.custom-lobby-topline{display:flex;align-items:center;justify-content:space-between}.custom-lobby-topline>a{color:#768496;font-size:8px;font-weight:900}.custom-lobby-title{display:flex;align-items:flex-end;justify-content:space-between;gap:30px;margin-top:28px}.custom-lobby-title h1{margin:7px 0 4px;font-size:42px}.custom-lobby-title p{margin:0;color:#6e7b8c;font-size:8px}.custom-lobby-invite{width:min(430px,45%)}.custom-lobby-invite>small{display:block;margin-bottom:6px;color:#7e8b9a;font-size:7px;text-transform:uppercase}.custom-lobby-invite>div{display:grid;grid-template-columns:minmax(0,1fr) auto}.custom-lobby-invite input{height:40px;border-right:0;color:#94a0ae;font-size:8px}.custom-lobby-invite button{border:1px solid #52682d;background:#152012;color:var(--accent);font-size:8px;font-weight:900}.custom-lobby-content{padding-top:28px;padding-bottom:70px}.custom-lobby-progress{display:grid;grid-template-columns:repeat(4,1fr);margin-bottom:20px;border:1px solid #2c3846}.custom-lobby-progress>div{display:flex;align-items:center;gap:9px;padding:12px;border-right:1px solid #2c3846;color:#5e6b7a}.custom-lobby-progress>div:last-child{border-right:0}.custom-lobby-progress b{font-size:8px}.custom-lobby-progress span{font-size:8px;font-weight:900;text-transform:uppercase}.custom-lobby-progress .active{background:#121b12;color:var(--accent)}.custom-lobby-progress .done{color:#9aad73}.custom-lobby-teams{display:grid;grid-template-columns:1fr 1fr;gap:16px}.custom-lobby-team{border:1px solid #2e3b49;background:#0c131c}.custom-lobby-team.side-1{border-top:2px solid var(--accent)}.custom-lobby-team.side-2{border-top:2px solid #ffad43}.custom-lobby-team>header{display:flex;align-items:center;gap:12px;padding:17px;border-bottom:1px solid #2c3846}.custom-lobby-team>header>span{display:grid;width:44px;height:44px;flex:none;place-items:center;border:1px solid #3d4b5a;background:#17212c;color:var(--accent);font-size:9px;font-weight:900}.custom-lobby-team.side-2>header>span{color:#ffad43}.custom-lobby-team>header>div{min-width:0;flex:1}.custom-lobby-team h2{margin:0;font-size:20px}.custom-lobby-team header small{color:#6e7b8b;font-size:8px}.custom-lobby-team header form{display:grid;grid-template-columns:minmax(0,1fr) 35px}.custom-lobby-team header form input{height:35px;font-size:13px;font-weight:800}.custom-lobby-team header form button{border:1px solid #50642e;background:#172312;color:var(--accent)}.custom-lobby-roster>div{display:grid;grid-template-columns:38px minmax(0,1fr) auto;align-items:center;gap:10px;min-height:59px;padding:9px 14px;border-bottom:1px solid #26323e}.custom-lobby-roster>div.empty{opacity:.48}.custom-player-avatar,.custom-lobby-roster>.empty>span{display:grid;width:36px;height:36px;place-items:center;border:1px solid #3a4858;background:#151f2a;color:#c7ff32;font-size:8px;font-weight:900}.custom-lobby-roster>div>div{display:flex;min-width:0;flex-direction:column}.custom-lobby-roster strong{overflow:hidden;font-size:10px;text-overflow:ellipsis;white-space:nowrap}.custom-lobby-roster small{margin-top:2px;color:#687687;font-size:7px}.custom-lobby-roster>div>b{color:#697687;font-size:7px}.custom-lobby-roster>div>b.ready{color:var(--accent)}.custom-lobby-join{padding:13px}.custom-lobby-join .btn{width:100%}.custom-lobby-your-team{display:block;padding:15px;color:var(--accent);font-size:8px;font-weight:900;text-align:center}.custom-lobby-ready-card{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-top:16px;padding:23px;border:1px solid #40532b;background:linear-gradient(120deg,rgba(199,255,50,.06),#0c1413 55%)}.custom-lobby-ready-card h2{margin:5px 0}.custom-lobby-ready-card p{margin:0;color:#7b897f;font-size:9px}.custom-lobby-ready-card form,.custom-lobby-ready-card .btn{flex:none}.custom-lobby-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:14px}.btn.danger{border-color:#66303b;color:#ff697a}
@media(max-width:900px){.custom-match-grid,.custom-lobby-teams{grid-template-columns:1fr}.custom-match-create-grid{grid-template-columns:1fr;gap:35px}.custom-lobby-title{align-items:stretch;flex-direction:column}.custom-lobby-invite{width:100%}}@media(max-width:680px){.custom-match-hero{padding:50px 0}.custom-match-hero>.shell{align-items:stretch;flex-direction:column}.custom-match-hero h1{font-size:43px}.custom-match-hero .btn{width:100%}.custom-match-versus>div{grid-template-columns:32px minmax(0,1fr)}.custom-match-versus>div>b{width:32px;height:32px}.custom-match-versus>div>small{grid-column:2}.custom-match-create-grid{margin-top:28px}.custom-match-create-copy h1{font-size:39px}.custom-match-create-form{padding:20px}.custom-match-form-row{grid-template-columns:1fr}.custom-lobby-title h1{font-size:32px}.custom-lobby-progress{grid-template-columns:1fr 1fr}.custom-lobby-progress>div:nth-child(2){border-right:0}.custom-lobby-progress>div:nth-child(-n+2){border-bottom:1px solid #2c3846}.custom-lobby-ready-card{align-items:stretch;flex-direction:column}.custom-lobby-ready-card .btn{width:100%}.custom-lobby-actions{align-items:stretch;flex-direction:column}.custom-lobby-actions .btn{width:100%}}
.custom-lobby-ready-actions{display:flex;align-items:center;justify-content:flex-end;gap:9px;flex:none}
.custom-match-tabs{display:flex;gap:1px;margin:-8px 0 22px;border-bottom:1px solid #2c3846}.custom-match-tabs a{padding:11px 15px;border-bottom:2px solid transparent;color:#718091;font-size:8px;font-weight:900;letter-spacing:.5px}.custom-match-tabs a:hover{color:#dce5ec}.custom-match-tabs a.active{border-color:var(--accent);background:linear-gradient(180deg,transparent,rgba(199,255,50,.05));color:var(--accent)}
.custom-lobby-state{display:flex;align-items:center;gap:12px}.custom-lobby-expiry{display:flex;align-items:center;gap:9px;padding:7px 10px;border:1px solid #4a5d32;background:#111b12;color:#9fad88}.custom-lobby-expiry small{font-size:7px;font-weight:900;letter-spacing:.45px}.custom-lobby-expiry b{min-width:37px;color:var(--accent);font-size:11px;text-align:right}.custom-lobby-expiry.urgent{border-color:#8b582a;background:#21170f}.custom-lobby-expiry.urgent b{color:#ffad43}.custom-lobby-expiry.expired{border-color:#763340;background:#211015}.custom-lobby-expiry.expired small,.custom-lobby-expiry.expired b{color:#ff697a}
.custom-match-password-block{margin-bottom:19px;padding:16px;border:1px solid #35432f;background:linear-gradient(120deg,rgba(199,255,50,.045),#0a1018)}.custom-match-password-block>div:first-child{display:flex;justify-content:space-between;gap:15px;margin-bottom:14px}.custom-match-password-block>div:first-child b{color:var(--accent);font-size:8px;letter-spacing:.55px}.custom-match-password-block>div:first-child small{color:#718091;font-size:7px;text-align:right}.custom-match-password-block .custom-match-form-row label{margin-bottom:0}.custom-match-card-meta{display:flex;align-items:center;gap:10px}.custom-match-card-meta>span{color:#ffad43;font-size:7px;font-weight:900}.custom-match-access{display:grid;min-height:calc(100vh - 150px);place-items:center;padding:55px 20px;background:radial-gradient(circle at 50% 30%,rgba(199,255,50,.08),transparent 32%),#080d13}.custom-match-access-card{width:min(470px,100%);padding:30px;border:1px solid #364531;background:linear-gradient(145deg,#10191b,#0b1119);box-shadow:0 24px 70px rgba(0,0,0,.35)}.custom-match-access-icon{display:grid;width:58px;height:58px;margin:28px 0 17px;place-items:center;border:1px solid #637d32;background:#172213;color:var(--accent);font-size:27px}.custom-match-access-card h1{margin:8px 0 10px;font-size:30px}.custom-match-access-card>p{margin:0 0 23px;color:#8491a0;font-size:10px;line-height:1.65}.custom-match-access-card form label{display:flex;flex-direction:column}.custom-match-access-card form label>span:first-child{margin-bottom:7px;color:#9eabb9;font-size:8px;font-weight:900}.custom-match-access-card form input{height:49px}.custom-match-access-card form .btn{width:100%;height:49px;margin-top:13px}.custom-match-access-note{display:block;margin-top:14px;color:#687687;font-size:7px;text-align:center}
.custom-lobby-slot-form{margin:0}.custom-lobby-slot{display:grid;width:100%;grid-template-columns:38px minmax(0,1fr);align-items:center;gap:10px;min-height:59px;padding:9px 14px;border:0;border-bottom:1px solid #26323e;background:transparent;color:#e7edf2;text-align:left;cursor:pointer;opacity:.62;transition:.18s}.custom-lobby-slot>span:first-child{display:grid;width:36px;height:36px;place-items:center;border:1px dashed #536331;background:#151f19;color:var(--accent);font-size:13px;font-weight:900}.custom-lobby-slot-copy{display:flex;min-width:0;flex-direction:column}.custom-lobby-slot-copy strong{font-size:10px}.custom-lobby-slot-copy small{margin-top:2px;color:#748291;font-size:7px}.custom-lobby-slot:hover,.custom-lobby-slot:focus-visible{outline:0;background:rgba(199,255,50,.07);opacity:1}.custom-lobby-slot:hover>span:first-child,.custom-lobby-slot:focus-visible>span:first-child{border-style:solid;border-color:var(--accent)}
@media(max-width:680px){.custom-lobby-ready-actions{align-items:stretch;flex-direction:column}}
@media(max-width:680px){.custom-lobby-state{align-items:flex-end;flex-direction:column;gap:7px}.custom-lobby-expiry small{display:none}.custom-match-password-block>div:first-child{align-items:flex-start;flex-direction:column}.custom-match-password-block>div:first-child small{text-align:left}.custom-match-access-card{padding:23px}.custom-match-card-meta>span{display:none}}

/* Compact Fastcup-inspired lobby slots. The visible label is intentionally
   stable when a player moves between teams. */
.custom-lobby-slot,
.custom-lobby-roster > div.custom-lobby-slot {
  display: grid;
  width: 100%;
  min-height: 59px;
  grid-template-columns: 38px minmax(0, 1fr);
  align-items: center;
  gap: 10px;
  padding: 9px 14px;
  border: 0;
  border-bottom: 1px solid #26323e;
  background: transparent;
  color: #e7edf2;
}

.custom-lobby-slot-number {
  display: grid;
  width: 36px;
  height: 36px;
  place-items: center;
  border: 1px dashed #536331;
  background: #151f19;
  color: var(--accent);
  font-size: 11px;
  font-weight: 900;
}

.custom-lobby-slot-plus {
  color: #536071;
  font-size: 24px;
  font-weight: 300;
  line-height: 1;
  text-align: center;
  transition: color .18s ease, transform .18s ease;
}

button.custom-lobby-slot {
  cursor: pointer;
  opacity: .62;
  transition: background .18s ease, opacity .18s ease;
}

button.custom-lobby-slot:hover,
button.custom-lobby-slot:focus-visible {
  outline: 0;
  background: rgba(199,255,50,.07);
  opacity: 1;
}

button.custom-lobby-slot:hover .custom-lobby-slot-number,
button.custom-lobby-slot:focus-visible .custom-lobby-slot-number {
  border-style: solid;
  border-color: var(--accent);
}

button.custom-lobby-slot:hover .custom-lobby-slot-plus,
button.custom-lobby-slot:focus-visible .custom-lobby-slot-plus {
  color: var(--accent);
  transform: scale(1.12);
}

.custom-lobby-roster > div.custom-lobby-slot-static {
  opacity: .32;
}

.custom-lobby-chat {
  margin-top: 16px;
  overflow: hidden;
  border: 1px solid #2e3b49;
  background:
    radial-gradient(circle at 88% 0, rgba(199,255,50,.055), transparent 30%),
    #0b121a;
}

.custom-lobby-chat > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  padding: 19px 22px;
  border-bottom: 1px solid #293642;
}

.custom-lobby-chat > header h2 {
  margin: 5px 0 0;
  font-size: 22px;
}

.custom-lobby-chat > header > span {
  padding: 7px 9px;
  border: 1px solid #41512e;
  color: #9fb278;
  font-size: 7px;
  font-weight: 900;
  text-transform: uppercase;
}

.custom-lobby-chat-messages {
  height: 280px;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-color: #425266 #101720;
}

.custom-lobby-chat-empty {
  display: flex;
  height: 100%;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  color: #6f7d8e;
  text-align: center;
}

.custom-lobby-chat-empty b {
  color: var(--accent);
  font-size: 18px;
  letter-spacing: 5px;
}

.custom-lobby-chat-empty strong {
  margin-top: 8px;
  color: #c9d1d9;
  font-size: 11px;
}

.custom-lobby-chat-empty span {
  margin-top: 5px;
  font-size: 8px;
}

.custom-lobby-chat-message {
  display: grid;
  grid-template-columns: 36px minmax(0, 1fr);
  gap: 11px;
  padding: 12px 22px;
  border-bottom: 1px solid rgba(43,56,69,.7);
}

.custom-lobby-chat-message:last-child {
  border-bottom: 0;
}

.custom-lobby-chat-message > div {
  min-width: 0;
}

.custom-lobby-chat-message header {
  display: flex;
  align-items: baseline;
  gap: 9px;
}

.custom-lobby-chat-message header strong {
  color: #edf2f5;
  font-size: 10px;
}

.custom-lobby-chat-message time {
  color: #607083;
  font-size: 7px;
}

.custom-lobby-chat-message p {
  margin: 4px 0 0;
  color: #aeb9c4;
  font-size: 10px;
  line-height: 1.5;
  overflow-wrap: anywhere;
  white-space: pre-wrap;
}

.custom-lobby-chat-form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 10px;
  padding: 14px;
  border-top: 1px solid #293642;
  background: #0e161f;
}

.custom-lobby-chat-form input {
  height: 44px;
}

.custom-lobby-chat-form .btn {
  min-width: 150px;
}

.custom-lobby-chat-form.is-submitting {
  opacity: .72;
}

.custom-lobby-chat-closed {
  padding: 16px 22px;
  border-top: 1px solid #293642;
  color: #6e7b8b;
  font-size: 8px;
  text-align: center;
  text-transform: uppercase;
}

@media(max-width:680px) {
  .custom-lobby-chat > header,
  .custom-lobby-chat-message {
    padding-right: 14px;
    padding-left: 14px;
  }

  .custom-lobby-chat-form {
    grid-template-columns: 1fr;
  }

  .custom-lobby-chat-form .btn {
    width: 100%;
  }
}

[data-custom-match-view-panel][hidden] {
  display: none !important;
}

.custom-match-view-tabs {
  position: sticky;
  z-index: 12;
  top: 69px;
  display: grid;
  grid-template-columns: 1fr 1fr;
  margin-top: 18px;
  padding: 0;
  border: 1px solid #2c3946;
  background: rgba(8,13,19,.96);
  backdrop-filter: blur(12px);
}

.custom-match-view-tabs a {
  position: relative;
  display: grid;
  grid-template-columns: 28px auto minmax(0,1fr);
  align-items: center;
  gap: 10px;
  min-height: 58px;
  padding: 10px 18px;
  border-right: 1px solid #2c3946;
  color: #718094;
}

.custom-match-view-tabs a:last-child {
  border-right: 0;
}

.custom-match-view-tabs a::after {
  position: absolute;
  right: 0;
  bottom: -1px;
  left: 0;
  height: 2px;
  background: transparent;
  content: "";
}

.custom-match-view-tabs a > span {
  color: #536173;
  font-size: 8px;
  font-weight: 900;
}

.custom-match-view-tabs a > strong {
  color: #aeb8c3;
  font-size: 9px;
}

.custom-match-view-tabs a > small {
  justify-self: end;
  color: #5d6a7a;
  font-size: 7px;
}

.custom-match-view-tabs a.active {
  background: linear-gradient(90deg,rgba(199,255,50,.08),transparent);
}

.custom-match-view-tabs a.active::after {
  background: var(--accent);
}

.custom-match-view-tabs a.active > span,
.custom-match-view-tabs a.active > strong {
  color: var(--accent);
}

.custom-match-lobby-tab {
  padding-top: 28px;
}

.custom-match-lobby-overview {
  overflow: hidden;
  border: 1px solid #2e3b49;
  background:
    radial-gradient(circle at 78% 0,rgba(199,255,50,.06),transparent 34%),
    #0b121a;
}

.custom-match-lobby-overview > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
  padding: 22px;
  border-bottom: 1px solid #2b3743;
}

.custom-match-lobby-overview > header h2 {
  margin: 5px 0 3px;
  font-size: 25px;
}

.custom-match-lobby-overview > header p {
  margin: 0;
  color: #758394;
  font-size: 8px;
}

.custom-match-lobby-score {
  display: grid;
  min-width: 150px;
  grid-template-columns: auto auto;
  align-items: center;
  gap: 2px 12px;
  padding: 11px 14px;
  border: 1px solid #3a4a32;
  background: rgba(15,27,18,.82);
  text-align: right;
}

.custom-match-lobby-score small {
  color: #758394;
  font-size: 8px;
}

.custom-match-lobby-score strong {
  color: #f2f5f6;
  font-size: 24px;
}

.custom-match-lobby-score strong span {
  color: #647386;
}

.custom-match-lobby-score b {
  grid-column: 1 / -1;
  color: var(--accent);
  font-size: 7px;
}

.custom-match-lobby-teams {
  display: grid;
  grid-template-columns: 1fr 1fr;
}

.custom-match-lobby-team:first-child {
  border-right: 1px solid #2b3743;
}

.custom-match-lobby-team > header {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 15px 18px;
  border-bottom: 1px solid #26323e;
}

.custom-match-lobby-team > header > span {
  display: grid;
  width: 40px;
  height: 40px;
  place-items: center;
  border: 1px solid #3c4b59;
  background: #151f2a;
  color: var(--accent);
  font-size: 8px;
  font-weight: 900;
}

.custom-match-lobby-team.side-2 > header > span {
  color: #ffad43;
}

.custom-match-lobby-team h3 {
  margin: 0;
  font-size: 16px;
}

.custom-match-lobby-team header small {
  color: #697789;
  font-size: 7px;
}

.custom-match-lobby-player {
  display: grid;
  grid-template-columns: 36px minmax(0,1fr) auto;
  align-items: center;
  gap: 10px;
  min-height: 58px;
  padding: 10px 18px;
  border-bottom: 1px solid rgba(38,50,62,.8);
}

.custom-match-lobby-player:last-child {
  border-bottom: 0;
}

.custom-match-lobby-player > div {
  display: flex;
  min-width: 0;
  flex-direction: column;
}

.custom-match-lobby-player strong {
  overflow: hidden;
  font-size: 10px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.custom-match-lobby-player small {
  margin-top: 2px;
  color: #687687;
  font-size: 7px;
}

.custom-match-lobby-player > b {
  padding: 4px 6px;
  border: 1px solid #53682e;
  color: var(--accent);
  font-size: 6px;
}

.custom-match-chat-slot .custom-lobby-chat {
  margin-top: 16px;
}

@media(max-width:800px) {
  .custom-match-view-tabs {
    top: 62px;
  }

  .custom-match-view-tabs a {
    grid-template-columns: 22px 1fr;
  }

  .custom-match-view-tabs a > small {
    display: none;
  }

  .custom-match-lobby-overview > header {
    align-items: stretch;
    flex-direction: column;
  }

  .custom-match-lobby-score {
    width: 100%;
  }

  .custom-match-lobby-teams {
    grid-template-columns: 1fr;
  }

  .custom-match-lobby-team:first-child {
    border-right: 0;
    border-bottom: 1px solid #2b3743;
  }
}

/* Informative custom-match directory rows. */
.custom-match-grid {
  grid-template-columns: minmax(0, 1fr);
}

.custom-match-card-body {
  display: grid;
  grid-template-columns: minmax(340px, .95fr) minmax(430px, 1.2fr);
  grid-template-rows: auto 1fr;
  column-gap: 26px;
  padding: 18px;
}

.custom-match-card-body > h3 {
  min-width: 0;
  margin: 0;
  overflow: hidden;
  font-size: 21px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.custom-match-card-body > .custom-match-versus {
  align-self: center;
  padding: 16px 0 0;
}

.custom-match-facts {
  display: grid;
  grid-column: 2;
  grid-row: 1 / span 2;
  grid-template-columns: minmax(145px, 1.25fr) minmax(130px, 1.1fr) repeat(3, minmax(92px, .9fr));
  align-self: stretch;
  border: 1px solid #293744;
  background: rgba(7, 12, 18, .62);
}

.custom-match-facts.without-ping {
  grid-template-columns: minmax(155px, 1.3fr) minmax(140px, 1.1fr) repeat(2, minmax(110px, .9fr));
}

.custom-match-facts > div {
  display: flex;
  min-width: 0;
  flex-direction: column;
  justify-content: center;
  gap: 6px;
  padding: 13px 15px;
  border-left: 1px solid #293744;
}

.custom-match-facts > div:first-child {
  border-left: 0;
}

.custom-match-facts small {
  color: #687789;
  font-size: 7px;
  font-weight: 900;
  letter-spacing: .55px;
}

.custom-match-facts strong {
  overflow: hidden;
  color: #e9eff4;
  font-size: 10px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.custom-match-facts .custom-match-map-fact {
  display: grid;
  grid-template-columns: 58px minmax(0, 1fr);
  align-items: center;
  gap: 11px;
  padding: 8px;
}

.custom-match-map-fact > img,
.custom-match-map-placeholder {
  width: 58px;
  height: 45px;
  object-fit: cover;
  border: 1px solid #354453;
  background: #151f2a;
}

.custom-match-map-placeholder {
  display: grid;
  place-items: center;
  color: #667586;
  font-size: 17px;
  font-weight: 900;
}

.custom-match-map-fact > span:last-child {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 6px;
}

.custom-match-facts .custom-match-creator-fact {
  display: grid;
  grid-template-columns: 32px minmax(0, 1fr);
  align-items: center;
  gap: 9px;
}

.custom-match-creator-fact > span:first-child {
  display: grid;
  width: 32px;
  height: 32px;
  place-items: center;
  border: 1px solid #42512f;
  background: #172115;
  color: var(--accent);
  font-size: 8px;
  font-weight: 900;
}

.custom-match-creator-fact > span:last-child {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 6px;
}

.custom-match-region strong {
  display: flex;
  align-items: center;
  gap: 7px;
}

.custom-match-region-flag {
  width: 20px;
  height: 14px;
  flex: none;
  border: 1px solid rgba(255,255,255,.18);
  object-fit: cover;
  box-shadow: 0 1px 4px rgba(0,0,0,.35);
}

.custom-match-ping strong::before {
  content: "";
  display: inline-block;
  width: 5px;
  height: 5px;
  margin-right: 6px;
  border-radius: 50%;
  background: #657384;
  box-shadow: 0 0 7px currentColor;
  vertical-align: 1px;
}

.custom-match-ping.good strong {
  color: var(--accent);
}

.custom-match-ping.good strong::before {
  background: var(--accent);
}

.custom-match-ping.medium strong {
  color: #ffcf4c;
}

.custom-match-ping.medium strong::before {
  background: #ffcf4c;
}

.custom-match-ping.high strong {
  color: #ff697a;
}

.custom-match-ping.high strong::before {
  background: #ff697a;
}

@media(max-width:1050px) {
  .custom-match-card-body {
    grid-template-columns: 1fr;
  }

  .custom-match-facts {
    grid-column: 1;
    grid-row: auto;
    margin-top: 17px;
  }
}

@media(max-width:680px) {
  .custom-match-card-body {
    display: block;
    padding: 15px;
  }

  .custom-match-facts {
    grid-template-columns: 1fr 1fr;
  }

  .custom-match-facts.without-ping {
    grid-template-columns: 1fr 1fr;
  }

  .custom-match-facts > div {
    min-height: 69px;
    border-top: 1px solid #293744;
  }

  .custom-match-facts > div:nth-child(odd) {
    border-left: 0;
  }

  .custom-match-facts > div:nth-child(-n+2) {
    border-top: 0;
  }

  .custom-match-facts > .custom-match-ping {
    grid-column: 1 / -1;
    border-left: 0;
  }
}

/* Match directory: modular facts instead of a stretched technical table. */
.custom-match-card.cancelled,
.custom-match-card.finished {
  opacity: 1;
}

.custom-match-card.cancelled {
  border-color: #34404c;
}

.custom-match-facts,
.custom-match-facts.without-ping {
  grid-template-columns: minmax(155px,1.35fr) minmax(122px,1fr) minmax(92px,.72fr) minmax(112px,.9fr) minmax(88px,.7fr);
  gap: 8px;
  overflow: visible;
  border: 0;
  background: transparent;
  box-shadow: none;
}

.custom-match-facts.without-ping {
  grid-template-columns: minmax(170px,1.35fr) minmax(135px,1fr) minmax(105px,.72fr) minmax(128px,.92fr);
}

.custom-match-facts > div {
  position: relative;
  min-height: 84px;
  gap: 7px;
  padding: 14px;
  overflow: hidden;
  border: 1px solid #303e4b;
  background:
    linear-gradient(145deg,rgba(255,255,255,.018),transparent 65%),
    #0b121a;
  transition: border-color .2s, background-color .2s, transform .2s;
}

.custom-match-facts > div + div::before {
  display: none;
}

.custom-match-card:hover .custom-match-facts > div {
  border-color: #3c4b56;
}

.custom-match-facts small {
  position: relative;
  z-index: 2;
  color: #7d8b9b;
  font-size: 7px;
  font-weight: 900;
  letter-spacing: .7px;
}

.custom-match-facts strong {
  position: relative;
  z-index: 2;
  overflow: hidden;
  color: #f2f6f8;
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.custom-match-facts .custom-match-map-fact {
  display: flex;
  justify-content: flex-end;
  padding: 13px 14px;
  background: #111923;
}

.custom-match-map-fact::after {
  content: "";
  position: absolute;
  z-index: 1;
  inset: 0;
  background: linear-gradient(90deg,rgba(6,10,15,.1),rgba(6,10,15,.5) 48%,rgba(6,10,15,.96));
}

.custom-match-map-fact > img,
.custom-match-map-placeholder {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
  object-fit: cover;
  background:
    radial-gradient(circle at 28% 50%,rgba(199,255,50,.1),transparent 42%),
    #15202b;
  box-shadow: none;
  transition: transform .28s, filter .28s;
}

.custom-match-map-placeholder {
  display: grid;
  place-items: center start;
  padding-left: 28px;
  color: #758496;
  font-size: 24px;
  font-weight: 900;
}

.custom-match-map-fact > span:last-child {
  position: relative;
  z-index: 2;
  width: 58%;
  align-self: flex-end;
}

.custom-match-map-fact > span:last-child small {
  color: #93a0ae;
}

.custom-match-map-fact > span:last-child strong {
  font-size: 12px;
}

.custom-match-card:hover .custom-match-map-fact > img {
  filter: saturate(1.08);
  transform: scale(1.045);
}

.custom-match-facts .custom-match-creator-fact {
  grid-template-columns: 38px minmax(0,1fr);
  align-items: center;
  gap: 10px;
}

.custom-match-creator-fact > span:first-child {
  width: 38px;
  height: 38px;
  border-color: #4a5d31;
  background:
    linear-gradient(145deg,rgba(199,255,50,.1),transparent),
    #121d15;
  font-size: 9px;
  box-shadow: inset 0 0 18px rgba(199,255,50,.04);
}

.custom-match-creator-fact > span:last-child {
  gap: 7px;
}

.custom-match-mode {
  align-items: flex-start;
}

.custom-match-mode::after {
  content: "VS";
  position: absolute;
  right: 10px;
  bottom: 6px;
  color: rgba(199,255,50,.08);
  font: 30px Impact,sans-serif;
  letter-spacing: 0;
}

.custom-match-mode strong {
  color: #dff0bd;
  font-size: 12px;
}

.custom-match-region {
  background:
    linear-gradient(145deg,rgba(199,255,50,.025),transparent 70%),
    #0b121a !important;
}

.custom-match-region strong {
  gap: 8px;
}

.custom-match-region-flag {
  width: 24px;
  height: 16px;
}

.custom-match-ping::after {
  content: "";
  position: absolute;
  right: 11px;
  bottom: 11px;
  width: 14px;
  height: 8px;
  border-top: 1px solid currentColor;
  border-right: 1px solid currentColor;
  opacity: .22;
}

@media(max-width:680px) {
  .custom-match-facts,
  .custom-match-facts.without-ping {
    grid-template-columns: 1fr 1fr;
    gap: 7px;
  }

  .custom-match-facts > div {
    min-height: 78px;
    border: 1px solid #303e4b;
  }

  .custom-match-facts > div:nth-child(odd) {
    border-left: 1px solid #303e4b;
  }

  .custom-match-facts > div:nth-child(-n+2) {
    border-top: 1px solid #303e4b;
  }

  .custom-match-facts > .custom-match-ping {
    grid-column: 1 / -1;
  }

  .custom-match-map-fact > span:last-child {
    width: 62%;
  }
}
