:root {
  --text: #aab8c4;
  --bg: #070b10;
  --sans: 'Trebuchet MS', 'Segoe UI', 'Fira Sans', sans-serif;
  --heading: Impact, Haettenschweiler, Anton, 'Arial Narrow Bold', sans-serif;
  --mono: ui-monospace, Consolas, 'JetBrains Mono', monospace;
  --cyan: #67d6ff;
  --orange: #ffc247;
  --panel: #10151c;

  font: 18px/145% var(--sans);
  letter-spacing: 0.18px;
  color-scheme: dark;
  color: var(--text);
  background: var(--bg);
  font-synthesis: none;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-size: 16px;
}

* { box-sizing: border-box; }
body { min-width: 320px; margin: 0; }
button, a { font: inherit; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }

body {
  margin: 0;
}

#root {
  width: 1126px;
  max-width: 100%;
  margin: 0 auto;
  text-align: center;
  border-inline: 1px solid var(--border);
  min-height: 100svh;
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
}

h1,
h2 {
  font-family: var(--heading);
  font-weight: 500;
  color: var(--text-h);
}

h1 {
  font-size: 56px;
  letter-spacing: -1.68px;
  margin: 32px 0;
  @media (max-width: 1024px) {
    font-size: 36px;
    margin: 20px 0;
  }
}
h2 {
  font-size: 24px;
  line-height: 118%;
  letter-spacing: -0.24px;
  margin: 0 0 8px;
  @media (max-width: 1024px) {
    font-size: 20px;
  }
}
p {
  margin: 0;
}

code,
.counter {
  font-family: var(--mono);
  display: inline-flex;
  border-radius: 4px;
  color: var(--text-h);
}

code {
  font-size: 15px;
  line-height: 135%;
  padding: 4px 8px;
  background: var(--code-bg);
}
.gaming-page { 
  min-height: 100vh;
   background: radial-gradient(circle at 75% 38%, rgba(245, 91, 52, .13), transparent 27%), linear-gradient(135deg, #0b0c10 0%, #11131a 54%, #161116 100%); color: #f5f1eb; overflow: hidden; }
.navbar { position: relative; z-index: 2; display: flex; align-items: center; min-height: 82px; max-width: 1440px; margin: 0 auto; padding: 0 58px; border-bottom: 1px solid rgba(255,255,255,.09); }
.brand { display: inline-flex; align-items: center; gap: 12px; color: #fff; font-family: var(--heading); font-size: 21px; font-weight: 800; letter-spacing: .08em; text-decoration: none; }
.brand-dot { color: #ff623e; }
.brand-mark { display: flex; align-items: end; gap: 3px; height: 22px; transform: skew(-18deg); }
.brand-mark i { display: block; width: 5px; background: #ff623e; border-radius: 1px; }
.brand-mark i:nth-child(1) { height: 13px; }.brand-mark i:nth-child(2) { height: 19px; }.brand-mark i:nth-child(3) { height: 16px; }
.nav-content { display: flex; align-items: center; justify-content: space-between; width: 100%; margin-left: 76px; }
.nav-links, .nav-actions { display: flex; align-items: center; }
.nav-links { gap: 34px; }.nav-link { position: relative; padding: 31px 0 29px; color: #96949a; font-size: 13px; font-weight: 600; letter-spacing: .04em; text-decoration: none; transition: color .2s ease; }.nav-link:hover, .nav-link.active { color: #fff; }.nav-link.active::after { position: absolute; right: 0; bottom: -1px; left: 0; height: 2px; background: #ff623e; content: ''; box-shadow: 0 0 15px #ff623e; }.live-dot { display: inline-block; margin-left: 6px; padding: 2px 4px; color: #ff856a; font-size: 8px; letter-spacing: .08em; border: 1px solid rgba(255,98,62,.45); border-radius: 2px; vertical-align: 2px; }
.nav-actions { gap: 20px; }.icon-button, .profile-button, .menu-toggle { border: 0; color: inherit; background: transparent; cursor: pointer; }.icon-button { position: relative; width: 24px; height: 26px; padding: 0; }.search-button span { position: absolute; top: 3px; left: 2px; width: 11px; height: 11px; border: 1.5px solid #aaa9ac; border-radius: 50%; }.search-button span::after { position: absolute; right: -6px; bottom: -5px; width: 7px; height: 1.5px; background: #aaa9ac; content: ''; transform: rotate(45deg); }.notification-button span { position: absolute; top: 3px; left: 5px; width: 11px; height: 13px; border: 1.5px solid #aaa9ac; border-radius: 8px 8px 3px 3px; }.notification-button span::after { position: absolute; bottom: -5px; left: 2px; width: 5px; height: 2px; border-radius: 2px; background: #aaa9ac; content: ''; }.notification-button b { position: absolute; top: 0; right: 1px; width: 5px; height: 5px; border: 2px solid #13151b; border-radius: 50%; background: #ff623e; }
.coin-balance { display: flex; align-items: center; gap: 7px; min-height: 34px; padding: 0 10px; border: 1px solid rgba(231,185,94,.28); color: #f3c968; background: rgba(231,185,94,.05); cursor: pointer; }.coin-balance .coin-icon { flex: 0 0 auto; margin: 0 2px 0 0; }.coin-balance strong { color: #f7d889; font-family: var(--mono); font-size: 11px; }.coin-balance small { color: #a88a4e; font-size: 8px; font-weight: 700; letter-spacing: .1em; }
.wallet-backdrop { position: fixed; z-index: 12; inset: 0; display: grid; place-items: center; padding: 24px; background: rgba(4,5,8,.8); backdrop-filter: blur(8px); }
.wallet-modal { position: relative; width: min(100%, 440px); padding: 38px 34px 30px; border: 1px solid rgba(255,118,91,.35); background: linear-gradient(145deg,#1a1b22,#101116); box-shadow: 0 24px 80px rgba(0,0,0,.55); }
.wallet-modal h2 { margin: 13px 0 18px; color: #f5f1eb; font-family: var(--heading); font-size: 36px; line-height: 1; }
.wallet-balance { display: flex; align-items: center; gap: 10px; margin-bottom: 22px; padding: 15px; border: 1px solid rgba(231,185,94,.3); background: rgba(231,185,94,.06); }.wallet-balance .coin-icon { margin: 0 5px 0 2px; }.wallet-balance strong { color: #f7d889; font-family: var(--mono); font-size: 25px; }.wallet-balance small { color: #a88a4e; font-size: 9px; letter-spacing: .1em; }
.wallet-tabs { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; margin-bottom: 16px; }.wallet-tabs button { padding: 10px; border: 1px solid #373841; color: #85828a; background: transparent; font-size: 10px; font-weight: 700; text-transform: uppercase; cursor: pointer; }.wallet-tabs button.selected, .wallet-tabs button:hover { border-color: #ff765b; color: #ffad99; background: rgba(255,118,91,.1); }
.withdraw-balances { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }.withdraw-balances div { display: grid; gap: 5px; padding: 12px; border: 1px solid rgba(255,255,255,.12); background: rgba(255,255,255,.03); }.withdraw-balances span { color: #aaa6aa; font-size: 9px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }.withdraw-balances strong { color: #f7d889; font-family: var(--mono); font-size: 18px; }.withdraw-balances small { color: #77767e; font-size: 9px; }
.coin-packages { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }.coin-packages button { display: grid; gap: 5px; padding: 14px 8px; border: 1px solid rgba(255,255,255,.12); color: #c7c3c0; background: #171920; cursor: pointer; }.coin-packages button:hover { border-color: #ff765b; transform: translateY(-2px); }.coin-packages strong { color: #f3c968; font-family: var(--mono); font-size: 13px; }.coin-packages span { font-size: 10px; }.coin-packages small { color: #ff927d; font-size: 8px; text-transform: uppercase; }
.withdraw-form { display: grid; gap: 14px; }.withdraw-form label, .coin-custom-form label { display: grid; gap: 8px; color: #bab6b9; font-size: 10px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }.withdraw-form input, .coin-custom-form input { width: 100%; padding: 13px 14px; border: 1px solid #373841; outline: 0; color: #f5f1eb; background: #0e0f14; font-family: var(--mono); font-size: 13px; letter-spacing: .02em; transition: border-color .2s, box-shadow .2s; }.withdraw-form input:focus, .coin-custom-form input:focus { border-color: #ff765b; box-shadow: 0 0 0 3px rgba(255,118,91,.12); }.withdraw-form input::placeholder, .coin-custom-form input::placeholder { color: #66646c; }.withdraw-form input::-webkit-inner-spin-button, .withdraw-form input::-webkit-outer-spin-button, .coin-custom-form input::-webkit-inner-spin-button, .coin-custom-form input::-webkit-outer-spin-button { margin: 0; opacity: .45; }.withdraw-form p { margin: -3px 0 0; color: #77767e; font-size: 11px; line-height: 1.5; }.wallet-message { margin: 16px 0 0; color: #8fc99b; font-size: 11px; text-align: center; }
.join-confirm-backdrop { position: fixed; inset: 0; z-index: 20; display: grid; place-items: center; padding: 20px; background: rgba(4, 5, 8, 0.78); backdrop-filter: blur(8px); }
.admin-lookup-row { display: flex; gap: 8px; margin-top: 14px; }.admin-lookup-row input { flex: 1; }.admin-match-lookup { margin-bottom: 14px; }.admin-match-control { margin-bottom: 14px; border: 1px solid rgba(255,118,91,.35); padding: 20px; background: rgba(12,18,26,.92); }.admin-match-columns { display: grid; grid-template-columns: minmax(0, 1fr) 280px; gap: 24px; }.admin-match-columns h3 { margin: 0 0 12px; color: #ffad99; font-size: 11px; letter-spacing: .1em; text-transform: uppercase; }.admin-player-list { display: grid; gap: 7px; }.admin-player-list > div { display: grid; grid-template-columns: 100px minmax(0, 1fr) 70px; gap: 10px; padding: 10px; border: 1px solid rgba(255,255,255,.1); color: #b9bec7; font-size: 10px; }.admin-player-list strong { color: #f7d889; }.admin-player-list span { overflow: hidden; text-overflow: ellipsis; }.admin-player-list small { color: #8d929c; text-align: right; }.admin-match-form { display: grid; gap: 10px; }.admin-match-form label { display: grid; gap: 6px; color: #b9bec7; font-size: 10px; text-transform: uppercase; }.admin-match-form button { border: 1px solid #ff765b; padding: 10px 13px; color: #171216; background: #ff765b; font-size: 9px; font-weight: 800; text-transform: uppercase; cursor: pointer; }.admin-table-card tbody tr[onclick] { cursor: pointer; }.admin-table-card tbody tr[onclick]:hover td { color: #ffad99; }
.admin-create-match { margin-bottom: 14px; }.admin-create-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }.admin-create-form label { display: grid; gap: 6px; color: #b9bec7; font-size: 10px; text-transform: uppercase; }.admin-create-form textarea { grid-column: 1 / -1; }.admin-create-form button { grid-column: 1 / -1; border: 1px solid #ff765b; padding: 12px; color: #171216; background: #ff765b; font-size: 9px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; cursor: pointer; }.admin-create-form select { width: 100%; border: 1px solid #373841; padding: 11px 12px; color: #f5f1eb; background: #0e0f14; font-family: var(--mono); font-size: 12px; }.admin-delete-button { border: 1px solid #e98778; padding: 8px 10px; color: #ffad99; background: transparent; font-size: 9px; font-weight: 800; text-transform: uppercase; cursor: pointer; }.admin-delete-button:hover { color: #171216; background: #e98778; }
@media (max-width: 760px) { .admin-page { padding: 30px 20px 60px; }.admin-header { align-items: flex-start; flex-direction: column; }.admin-summary { grid-template-columns: repeat(2, 1fr); }.admin-toolbar { align-items: stretch; flex-direction: column; }.admin-toolbar input { max-width: none; }.admin-grid, .admin-match-columns, .admin-create-form { grid-template-columns: 1fr; }.admin-create-form textarea, .admin-create-form button { grid-column: auto; }.admin-player-list > div { grid-template-columns: 82px minmax(0, 1fr) 55px; } }
.admin-link { border: 1px solid rgba(255,118,91,.35); padding: 8px 10px; color: #ffad99; background: transparent; font-size: 9px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; cursor: pointer; }.admin-link:hover { border-color: #ff765b; background: rgba(255,118,91,.1); }
.admin-page { min-height: calc(100vh - 82px); max-width: 1440px; margin: 0 auto; padding: 42px 58px 80px; background: linear-gradient(145deg, rgba(14,19,27,.96), rgba(9,12,17,.96)); }.admin-header { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; padding-bottom: 28px; border-bottom: 1px solid rgba(255,255,255,.1); }.admin-header h1, .admin-login h1 { margin: 10px 0 0; color: #f5f1eb; font-family: var(--heading); font-size: clamp(40px, 6vw, 78px); line-height: .9; }.admin-header-actions { display: flex; gap: 8px; }.admin-header-actions button, .admin-card button { border: 1px solid #ff765b; padding: 10px 13px; color: #ffad99; background: transparent; font-size: 9px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; cursor: pointer; }.admin-header-actions button:hover, .admin-card button:hover { color: #171216; background: #ff765b; }.admin-summary { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 10px; margin: 22px 0; }.admin-summary > div { display: grid; gap: 7px; padding: 16px; border: 1px solid rgba(255,255,255,.12); background: rgba(255,255,255,.035); }.admin-summary span, .admin-summary small { color: #8d929c; font-size: 9px; letter-spacing: .1em; text-transform: uppercase; }.admin-summary strong { color: #f7d889; font-family: var(--mono); font-size: 26px; }.admin-toolbar { display: flex; justify-content: space-between; gap: 14px; margin-bottom: 18px; }.admin-toolbar nav { display: flex; flex-wrap: wrap; gap: 6px; }.admin-toolbar button { border: 1px solid rgba(255,255,255,.14); padding: 9px 11px; color: #9fa2a9; background: transparent; font-size: 9px; text-transform: uppercase; cursor: pointer; }.admin-toolbar button.selected, .admin-toolbar button:hover { border-color: #ff765b; color: #ffad99; }.admin-toolbar input, .admin-card input, .admin-login input { width: 100%; border: 1px solid #373841; padding: 11px 12px; outline: 0; color: #f5f1eb; background: #0e0f14; font-family: var(--mono); font-size: 12px; }.admin-toolbar input { max-width: 310px; }.admin-message { color: #8fc99b; font-size: 11px; }.admin-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; }.admin-card, .admin-table-card, .admin-login { border: 1px solid rgba(255,255,255,.12); padding: 20px; background: rgba(12,18,26,.88); }.admin-card h2, .admin-table-card h2 { margin: 0 0 8px; color: #f5f1eb; font-family: var(--heading); font-size: 24px; }.admin-card p, .admin-login > p { color: #9297a1; font-size: 11px; line-height: 1.5; }.admin-card form, .admin-login form { display: grid; gap: 10px; margin-top: 16px; }.admin-table-card { overflow: hidden; }.admin-card-heading { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 14px; }.admin-card-heading span { color: #8d929c; font-size: 10px; }.admin-table-wrap { overflow-x: auto; }.admin-table-card table { width: 100%; min-width: 620px; border-collapse: collapse; }.admin-table-card th, .admin-table-card td { padding: 11px 10px; border-bottom: 1px solid rgba(255,255,255,.08); color: #b9bec7; font-size: 10px; text-align: left; white-space: nowrap; }.admin-table-card th { color: #ffad99; font-size: 9px; letter-spacing: .08em; text-transform: uppercase; }.admin-login { width: min(100%, 460px); margin: 10vh auto; }.admin-login label { display: grid; gap: 7px; color: #b9bec7; font-size: 10px; text-transform: uppercase; }
.join-confirm-modal { position: relative; width: min(100%, 380px); padding: 32px 24px 22px; border: 1px solid rgba(255,118,91,.38); background: linear-gradient(145deg,#1a1b22,#101116); box-shadow: 0 24px 80px rgba(0,0,0,.55); }
.join-confirm-close { position: absolute; top: 12px; right: 12px; width: 30px; height: 30px; border: 1px solid rgba(255,255,255,.14); color: #a09da1; background: transparent; font-size: 20px; line-height: 1; cursor: pointer; }
.join-confirm-kicker { margin: 0 0 10px; color: #ff927d; font-size: 10px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; text-align: center; }
.join-confirm-modal h3 { margin: 0 0 10px; color: #f5f1eb; font-family: var(--heading); font-size: clamp(32px, 4vw, 52px); line-height: 0.95; letter-spacing: -0.03em; text-transform: none; }
.join-confirm-text { margin: 0 0 22px; color: #b9b1b5; line-height: 1.6; }
.join-confirm-text strong { color: #f3c968; font-family: var(--mono); }
.join-confirm-field { display: grid; gap: 8px; margin-bottom: 12px; color: #bab6b9; font-size: 10px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.join-confirm-players { display: grid; gap: 4px; max-height: 280px; margin-bottom: 4px; overflow-y: auto; padding-right: 4px; }
.join-confirm-players .join-confirm-field { margin-bottom: 8px; }
.join-confirm-field input { width: 100%; padding: 13px 14px; border: 1px solid #373841; outline: 0; color: #f5f1eb; background: #0e0f14; font-size: 13px; transition: border-color .2s, box-shadow .2s; }
.join-confirm-field input:focus { border-color: #ff765b; box-shadow: 0 0 0 3px rgba(255,118,91,.12); }
.join-confirm-error { margin: 0 0 16px; color: #ff957f; font-size: 11px; }
.join-confirm-actions { display: flex; justify-content: flex-end; gap: 10px; margin-top: 18px; }
.join-confirm-primary, .join-confirm-secondary { padding: 11px 16px; border: 1px solid #ff765b; font-size: 10px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; cursor: pointer; }
.join-confirm-secondary { color: #f5f1eb; background: transparent; }
.join-confirm-primary { color: #171216; background: #ff765b; border-color: #ff765b; }
.match-detail-banner { margin: 12px 0 18px; overflow: hidden; border: 1px solid rgba(255,118,91,.25); background: #171920; box-shadow: inset 0 0 24px rgba(0,0,0,.2); }
.match-detail-banner img { display: block; width: 100%; height: 180px; object-fit: cover; }
.match-detail-shell { display: grid; gap: 0; }
.match-detail-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
.match-detail-pill { display: inline-flex; align-items: center; justify-content: center; padding: 7px 10px; border: 1px solid rgba(110, 240, 230, 0.4); background: rgba(110, 240, 230, 0.08); color: #87f0eb; font-size: 9px; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; }
.match-detail-banner { position: relative; margin: 0 0 16px; border: 1px solid rgba(110, 240, 230, 0.24); background: #0f141c; box-shadow: 0 22px 40px rgba(0, 0, 0, 0.26); }
.match-detail-banner-glow { position: absolute; inset: 0; background: linear-gradient(135deg, rgba(110, 240, 230, 0.2), transparent 42%, rgba(255, 118, 91, 0.18)); }
.match-detail-banner img { position: relative; z-index: 1; height: 190px; filter: saturate(1.15) contrast(1.04); }
.match-detail-banner-overlay { position: absolute; z-index: 2; right: 16px; bottom: 16px; display: grid; gap: 3px; text-align: right; }
.match-detail-banner-overlay span { color: #9ad9d3; font-size: 8px; font-weight: 700; letter-spacing: 0.16em; text-transform: uppercase; }
.match-detail-banner-overlay strong { color: #f5f1eb; font-family: var(--heading); font-size: 18px; line-height: 1; }
.match-detail-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin: 18px 0; }
.match-detail-grid div { display: grid; gap: 5px; padding: 12px 10px; border: 1px solid rgba(110, 240, 230, 0.16); background: linear-gradient(180deg, rgba(255,255,255,.025), rgba(255,255,255,.015)); min-height: 78px; }
.match-detail-grid span, .room-info-box span { color: #7f7b80; font-size: 8px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; }
.match-detail-grid strong, .room-info-box strong { color: #f5f1eb; font-family: var(--mono); font-size: 11px; }
.brief-content { display: grid; gap: 18px; }
.match-description { margin: 0 0 18px; color: #d8d3d5; font-size: 14px; line-height: 1.7; }
.match-player-list { display: grid; gap: 8px; margin: -4px 0 18px; padding: 12px; border: 1px solid rgba(103,214,255,.22); background: rgba(103,214,255,.05); }
.match-player-list-title { color: #ffc247; font-family: var(--mono); font-size: 9px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; }
.match-team-roster { display: grid; gap: 6px; padding-top: 8px; border-top: 1px solid rgba(103,214,255,.14); }
.match-team-label { color: #8fdfff; font-family: var(--mono); font-size: 8px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.match-team-roster > div { display: flex; flex-wrap: wrap; gap: 7px; }
.match-player-name { padding: 6px 8px; border: 1px solid rgba(103,214,255,.26); color: #dff8ff; background: rgba(5,18,29,.45); font-size: 11px; }
.rules-box { margin: 0; padding: 12px 12px 8px; border: 1px solid rgba(255,118,91,.2); background: linear-gradient(135deg, rgba(255,118,91,.06), rgba(110, 240, 230, .03)); }
.rules-heading { margin: 0 0 10px; color: #f4f0ec; font-size: 12px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.rules-box ol { margin: 0; padding-left: 18px; color: #d7d2d5; font-size: 11px; line-height: 1.7; }
.rules-box li + li { margin-top: 4px; }
.match-detail-lock { margin: 0 0 20px; color: #ffd0bf; font-size: 12px; line-height: 1.6; }
.room-info-box { display: grid; gap: 12px; margin: 0 0 20px; padding: 12px 14px 14px; border: 1px solid rgba(110,240,230,.2); background: linear-gradient(135deg, rgba(110,240,230,.08), rgba(255,118,91,.05)); }
.room-info-row { display: grid; gap: 4px; padding: 10px 10px 9px; border: 1px solid rgba(255,255,255,.08); background: rgba(2,8,12,.18); }
.match-details-modal { width: min(100%, 560px); padding: 18px 18px 16px; border: 1px solid rgba(255,118,91,.3); background: linear-gradient(180deg, rgba(18,20,27,.96), rgba(12,14,19,.98)); box-shadow: 0 28px 80px rgba(0,0,0,.6); }
.match-details-modal .join-confirm-kicker { margin-bottom: 0; }
.match-details-modal h3 { margin: 0; font-size: clamp(26px, 3vw, 40px); letter-spacing: -0.04em; }
.match-details-modal .join-confirm-kicker { margin-bottom: 4px; }
.match-details-modal .join-confirm-primary, .match-details-modal .join-confirm-secondary { padding: 13px 18px; }
.match-details-modal .join-confirm-secondary { background: rgba(255,255,255,.02); }
.coin-custom-form { display: grid; gap: 12px; margin-bottom: 14px; }
.payment-qr-panel { display: grid; justify-items: center; gap: 12px; margin: 0 0 16px; padding: 14px; border: 1px solid rgba(103,214,255,.24); background: rgba(4,12,22,.64); text-align: center; }
.payment-countdown { display: flex; align-items: center; justify-content: space-between; width: 100%; color: #8fdfff; font-family: var(--mono); font-size: 9px; letter-spacing: .1em; }
.payment-countdown strong { color: #ffc247; font-size: 18px; letter-spacing: .04em; }
.payment-countdown strong.is-urgent { color: #ff765b; }
.payment-qr { width: 184px; height: 184px; padding: 8px; background: #fff; image-rendering: pixelated; }
.payment-qr-panel p { margin: 0; max-width: 270px; color: #aebdca; font-size: 10px; line-height: 1.5; }
.payment-qr-panel .payment-receiver { margin: -4px 0 0; color: #8fdfff; font-family: var(--mono); font-size: 9px; }
.payment-receiver strong { color: #f5f1eb; }
.payment-qr-expired { display: grid; width: 184px; height: 184px; place-items: center; border: 1px dashed rgba(255,118,91,.55); color: #ffad99; background: rgba(255,118,91,.07); font-family: var(--mono); font-size: 11px; line-height: 1.6; text-transform: uppercase; }
.payment-upi-button { padding: 10px 14px; border: 1px solid #4d9dff; color: #69c8ff; background: transparent; font-size: 10px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; cursor: pointer; }
.payment-upi-button:hover { color: #07101b; background: #69c8ff; }
.coin-custom-form button:disabled { border-color: #40505c; color: #66737c; background: transparent; cursor: not-allowed; }
.payment-methods { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; }.payment-methods button { padding: 11px 8px; border: 1px solid #373841; color: #85828a; background: transparent; font-size: 9px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; cursor: pointer; }.payment-methods button.selected, .payment-methods button:hover { border-color: #ff765b; color: #ffad99; background: rgba(255,118,91,.1); }
.bank-fields { display: grid; gap: 12px; }
@media (max-width: 480px) { .wallet-modal { padding: 34px 20px 25px; }.coin-packages { grid-template-columns: 1fr; } }
.wallet-backdrop { z-index: 110; overflow-y: auto; }
.wallet-modal { max-height: calc(100dvh - 32px); overflow-y: auto; overscroll-behavior: contain; }
@media (max-width: 760px) { .wallet-backdrop { align-items: start; padding: 78px 12px 16px; }.wallet-modal { width: 100%; max-height: calc(100dvh - 94px); padding: 30px 18px 24px; } }
.profile-button { display: flex; align-items: center; gap: 10px; padding-left: 20px; border-left: 1px solid rgba(255,255,255,.1); text-align: left; }.avatar { display: grid; width: 34px; height: 34px; place-items: center; border: 1px solid #f3a18d; border-radius: 50%; color: #ffad99; font-size: 10px; font-weight: 800; background: #492b2e; }.profile-copy { display: grid; gap: 1px; }.profile-copy strong { color: #f4f2ed; font-size: 11px; letter-spacing: .03em; }.profile-copy small { color: #77767e; font-size: 9px; letter-spacing: .16em; }.chevron { width: 6px; height: 6px; margin-left: 5px; border-right: 1px solid #8d8c93; border-bottom: 1px solid #8d8c93; transform: rotate(45deg) translateY(-2px); }
.nav-showcase { position: relative; max-width: 1440px; min-height: calc(100vh - 82px); margin: 0 auto; padding: 115px 58px; background: linear-gradient(90deg, rgba(11,12,16,.98) 0%, rgba(11,12,16,.77) 39%, rgba(11,12,16,.12) 83%), radial-gradient(ellipse at 75% 55%, rgba(151,45,26,.22), transparent 35%); }.nav-showcase::after { position: absolute; top: 0; right: 0; bottom: 0; width: 52%; background: repeating-linear-gradient(120deg, transparent 0 50px, rgba(255,255,255,.025) 51px 52px); content: ''; pointer-events: none; }.eyebrow { position: relative; z-index: 1; color: #ff8268; font-size: 11px; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; }.eyebrow span, .status-pulse { display: inline-block; width: 7px; height: 7px; margin-right: 8px; border-radius: 50%; background: #ff623e; box-shadow: 0 0 12px #ff623e; }.nav-showcase h1 { position: relative; z-index: 1; max-width: 650px; margin: 22px 0 20px; font-family: var(--heading); font-size: clamp(48px, 6vw, 88px); line-height: .94; letter-spacing: .02em; }.nav-showcase h1 em { color: transparent; -webkit-text-stroke: 1px #ff765b; font-style: normal; }.showcase-copy { position: relative; z-index: 1; max-width: 390px; color: #a3a1a3; font-size: 15px; line-height: 1.7; }.showcase-actions { position: relative; z-index: 1; display: flex; align-items: center; gap: 26px; margin-top: 31px; }.primary-cta { padding: 15px 19px; color: #151316; font-size: 12px; font-weight: 800; letter-spacing: .08em; text-decoration: none; text-transform: uppercase; background: #ff765b; }.primary-cta span { margin-left: 20px; font-size: 16px; }.secondary-cta { color: #e1ddda; font-size: 12px; font-weight: 700; letter-spacing: .09em; text-decoration: none; text-transform: uppercase; }.status-bar { position: absolute; z-index: 1; bottom: 54px; color: #7e7d83; font-size: 10px; letter-spacing: .08em; text-transform: uppercase; }.status-divider { display: inline-block; width: 1px; height: 10px; margin: 0 14px -2px; background: #55545a; }.menu-toggle { display: none; }
@media (max-width: 1050px) { .navbar { padding: 0 26px; }.nav-content { margin-left: 34px; }.nav-links { gap: 18px; } .profile-copy, .chevron { display: none; } }
@media (max-width: 760px) { .navbar { min-height: 70px; padding: 0 20px; }.menu-toggle { display: grid; gap: 4px; width: 28px; margin-left: auto; padding: 5px 0; }.menu-toggle span:not(.sr-only) { width: 22px; height: 2px; background: #f4f1ed; }.nav-content { position: absolute; top: 70px; right: 0; left: 0; display: none; width: auto; margin: 0; padding: 12px 20px 20px; background: #12141a; border-bottom: 1px solid rgba(255,255,255,.1); }.nav-content.is-open { display: block; }.nav-links { display: grid; gap: 0; }.nav-link { padding: 16px 0; }.nav-link.active::after { right: auto; width: 45px; }.nav-actions { justify-content: flex-end; margin-top: 10px; padding-top: 14px; border-top: 1px solid rgba(255,255,255,.08); }.nav-showcase { min-height: calc(100vh - 70px); padding: 86px 20px 120px; }.nav-showcase h1 { font-size: clamp(44px, 14vw, 70px); }.status-bar { bottom: 32px; font-size: 9px; }.status-divider { margin: 0 8px -2px; } }

.auth-backdrop { position: fixed; z-index: 10; inset: 0; display: grid; place-items: center; padding: 24px; background: rgba(4, 5, 8, .78); backdrop-filter: blur(8px); animation: fade-in .18s ease-out; }
.auth-modal { position: relative; width: min(100%, 430px); padding: 42px 40px 32px; border: 1px solid rgba(255, 118, 91, .32); background: linear-gradient(145deg, #1a1b22, #101116); box-shadow: 0 24px 80px rgba(0,0,0,.55), inset 0 1px rgba(255,255,255,.06); animation: modal-in .22s ease-out; }
.auth-modal::before { position: absolute; top: -1px; left: 34px; width: 70px; height: 2px; background: #ff765b; content: ''; box-shadow: 0 0 18px #ff765b; }
.profile-hero { position: relative; display: flex; align-items: center; gap: 15px; margin: 22px 0 12px; padding: 20px 16px; overflow: hidden; border: 1px solid rgba(255,118,91,.28); background: linear-gradient(125deg, rgba(255,118,91,.14), rgba(255,255,255,.025) 55%, transparent); }
.profile-hero::after { position: absolute; right: -35px; bottom: -55px; width: 150px; height: 150px; border: 1px solid rgba(255,118,91,.18); content: ''; transform: rotate(45deg); }
.profile-avatar-large { position: relative; z-index: 1; display: grid; width: 64px; height: 64px; place-items: center; border: 1px solid #ff765b; color: #ffc0ad; background: linear-gradient(145deg, #552b2e, #281a21); font-size: 18px; font-weight: 800; box-shadow: 0 0 0 5px rgba(255,118,91,.07), 0 10px 24px rgba(0,0,0,.25); }
.profile-avatar-large i { position: absolute; right: 2px; bottom: 3px; width: 8px; height: 8px; border: 2px solid #1a1b22; border-radius: 50%; background: #8fc99b; }
.profile-hero h2 { position: relative; z-index: 1; margin: 2px 0 5px; font-size: 26px; }
.profile-hero p { position: relative; z-index: 1; color: #77767e; font-size: 9px; letter-spacing: .12em; }
.profile-handle { color: #ff927d !important; font-size: 9px !important; }
.profile-divider { margin: 0 5px; color: #ff765b; }
.profile-status { position: absolute; z-index: 1; top: 12px; right: 12px; color: #8fc99b; font-size: 8px; font-weight: 700; letter-spacing: .1em; }
.profile-status i { display: inline-block; width: 5px; height: 5px; margin-right: 5px; border-radius: 50%; background: #8fc99b; box-shadow: 0 0 8px #8fc99b; }
.profile-stats { display: grid; grid-template-columns: repeat(3, 1fr); margin-bottom: 22px; border: 1px solid rgba(255,255,255,.09); background: #15171d; }
.profile-stats div { display: grid; gap: 3px; padding: 12px 7px; text-align: center; }.profile-stats div + div { border-left: 1px solid rgba(255,255,255,.09); }
.profile-stats strong { color: #f5f1eb; font-family: var(--heading); font-size: 20px; font-weight: 500; }.profile-stats span, .profile-section-label { color: #77767e; font-size: 8px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.profile-contact { display: grid; gap: 11px; margin-bottom: 23px; padding: 14px; border-left: 2px solid #ff765b; background: rgba(255,255,255,.035); }.profile-contact > span { margin-bottom: 2px; }.profile-contact div { display: flex; justify-content: space-between; gap: 12px; }.profile-contact div span { color: #66646c; font-size: 8px; letter-spacing: .1em; }.profile-contact strong { max-width: 68%; overflow: hidden; color: #c7c3c0; font-size: 10px; font-weight: 600; text-overflow: ellipsis; white-space: nowrap; }
.profile-edit-heading { display: flex; align-items: end; justify-content: space-between; gap: 12px; margin-bottom: 13px; }.profile-edit-heading small { color: #66646c; font-size: 9px; text-align: right; }
.profile-form { display: grid; gap: 17px; }
.profile-form .auth-submit { margin-top: 3px; }
.google-button { display: flex; align-items: center; justify-content: center; gap: 10px; width: 100%; padding: 12px 14px; border: 1px solid rgba(255,255,255,.16); color: #f5f1eb; background: #171920; font-size: 11px; font-weight: 700; cursor: pointer; transition: border-color .2s, background .2s; }
.google-button:hover { border-color: #ff765b; background: #202028; }
.google-button strong { color: #ff927d; font-size: 16px; }
.auth-divider { display: flex; align-items: center; gap: 10px; margin: 20px 0; color: #67656d; font-size: 8px; letter-spacing: .12em; white-space: nowrap; }
.auth-divider::before, .auth-divider::after { flex: 1; height: 1px; background: rgba(255,255,255,.1); content: ''; }
.signup-methods { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; }
.signup-methods button { padding: 10px 8px; border: 1px solid #373841; color: #85828a; background: transparent; font-size: 9px; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; cursor: pointer; }
.signup-methods button.selected, .signup-methods button:hover { border-color: #ff765b; color: #ffad99; background: rgba(255,118,91,.1); }
.auth-close { position: absolute; top: 16px; right: 18px; width: 28px; height: 28px; border: 1px solid rgba(255,255,255,.13); color: #a09da1; background: transparent; font-size: 16px; line-height: 1; cursor: pointer; }.auth-close:hover { color: #fff; border-color: #ff765b; }
.auth-kicker { color: #ff8065; font-size: 10px; font-weight: 700; letter-spacing: .18em; }.auth-kicker span { display: inline-block; width: 6px; height: 6px; margin-right: 6px; border-radius: 50%; background: #ff623e; box-shadow: 0 0 10px #ff623e; }.auth-modal h2 { margin: 13px 0 8px; color: #f5f1eb; font-family: var(--heading); font-size: 37px; line-height: 1; letter-spacing: .02em; }.auth-subtitle { margin-bottom: 27px; color: #929097; font-size: 13px; line-height: 1.5; }.auth-modal form { display: grid; gap: 17px; }.auth-modal label { display: grid; gap: 7px; color: #bab6b9; font-size: 10px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }.auth-modal input { width: 100%; padding: 13px 14px; border: 1px solid #373841; outline: 0; color: #f5f1eb; background: #0e0f14; font-size: 13px; transition: border-color .2s, box-shadow .2s; }.auth-modal input::placeholder { color: #5d5b62; }.auth-modal input:focus { border-color: #ff765b; box-shadow: 0 0 0 3px rgba(255,118,91,.12); }.password-field { position: relative; }.password-field input { padding-right: 58px; }.password-field button { position: absolute; top: 0; right: 0; bottom: 0; padding: 0 13px; border: 0; color: #ff927d; background: transparent; font-size: 10px; font-weight: 700; text-transform: uppercase; cursor: pointer; }.auth-error { margin: -4px 0 -3px; color: #ff957f; font-size: 11px; }.auth-submit { display: flex; align-items: center; justify-content: space-between; margin-top: 4px; padding: 14px 16px; border: 0; color: #171216; background: #ff765b; font-size: 12px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; cursor: pointer; transition: background .2s, transform .2s; }.auth-submit:hover { background: #ff927a; transform: translateY(-1px); }.auth-submit span { font-size: 16px; }.auth-switch { margin-top: 25px; color: #85828a; font-size: 12px; text-align: center; }.auth-switch button, .sign-out { padding: 0; border: 0; color: #ff927d; background: transparent; font-size: inherit; cursor: pointer; }.auth-switch button:hover, .sign-out:hover { text-decoration: underline; }.sign-out { display: block; margin: 18px auto 0; color: #85828a; font-size: 11px; }.profile-button:hover .avatar { border-color: #ff765b; }
@keyframes fade-in { from { opacity: 0; } to { opacity: 1; } } @keyframes modal-in { from { opacity: 0; transform: translateY(8px) scale(.98); } to { opacity: 1; transform: translateY(0) scale(1); } }
@media (max-width: 480px) { .auth-backdrop { padding: 16px; }.auth-modal { padding: 37px 24px 26px; }.auth-modal h2 { font-size: 32px; } }

.library-section { max-width: 1440px; margin: 0 auto; padding: 76px 58px 92px; background: #101217; border-top: 1px solid rgba(255,255,255,.08); }
.library-section:not(.is-visible) { display: none; }
.library-back { margin-bottom: 34px; padding: 0; border: 0; color: #ff927d; background: transparent; font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; cursor: pointer; }.library-back:hover { color: #ffc0ad; }
.section-heading { display: flex; align-items: end; justify-content: space-between; margin-bottom: 28px; }.section-heading .eyebrow { margin-bottom: 12px; }.section-heading h2 { margin: 0; color: #f5f1eb; font-family: var(--heading); font-size: 42px; line-height: 1; }.section-heading > p { color: #77767e; font-size: 11px; letter-spacing: .1em; text-transform: uppercase; }
.library-tools { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 24px; padding-bottom: 16px; border-bottom: 1px solid rgba(255,255,255,.09); }.genre-tabs { display: flex; flex-wrap: wrap; gap: 7px; }.genre-tabs button { padding: 8px 12px; border: 1px solid #34363f; color: #8d8b92; background: transparent; font-size: 10px; letter-spacing: .08em; text-transform: uppercase; cursor: pointer; }.genre-tabs button:hover, .genre-tabs button.selected { border-color: #ff765b; color: #ff927d; background: rgba(255,118,91,.08); }.library-search { position: relative; width: 190px; }.library-search span { position: absolute; top: 11px; left: 3px; width: 10px; height: 10px; border: 1px solid #8d8b92; border-radius: 50%; }.library-search span::after { position: absolute; right: -5px; bottom: -3px; width: 5px; height: 1px; background: #8d8b92; content: ''; transform: rotate(45deg); }.library-search input { width: 100%; padding: 8px 5px 8px 23px; border: 0; border-bottom: 1px solid #34363f; outline: 0; color: #f5f1eb; background: transparent; font-size: 12px; }.library-search input:focus { border-color: #ff765b; }.game-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 15px; }.game-card { overflow: hidden; border: 1px solid rgba(255,255,255,.09); background: #171920; }.game-art { position: relative; display: grid; height: 145px; place-items: center; overflow: hidden; }.game-art::before, .game-art::after { position: absolute; border: 1px solid currentColor; content: ''; transform: rotate(35deg); opacity: .3; }.game-art::before { width: 110px; height: 110px; }.game-art::after { width: 65px; height: 65px; }.game-art span { z-index: 1; color: currentColor; font-family: var(--heading); font-size: 76px; line-height: 1; }.game-art small { position: absolute; right: 12px; bottom: 10px; color: rgba(255,255,255,.65); font-size: 9px; letter-spacing: .1em; text-transform: uppercase; }.game-card.cyan .game-art { color: #54d7d2; background: linear-gradient(135deg, #102a32, #132024); }.game-card.orange .game-art { color: #ff8965; background: linear-gradient(135deg, #39201b, #27191d); }.game-card.violet .game-art { color: #bf9bff; background: linear-gradient(135deg, #282039, #1b1a2b); }.game-card.lime .game-art { color: #c4dc73; background: linear-gradient(135deg, #273321, #1d251c); }.game-card-copy { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 15px; }.game-card h3 { margin: 0 0 4px; color: #f5f1eb; font-size: 14px; }.game-card-copy p { color: #77767e; font-size: 10px; }.game-card-copy button { flex-shrink: 0; padding: 6px 8px; border: 1px solid #ff765b; color: #ff927d; background: transparent; font-size: 9px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; cursor: pointer; }.game-card-copy button.saved { border-color: #45534a; color: #8fb39a; }.empty-library { padding: 32px; color: #8d8b92; text-align: center; }
.contest-banner { display: grid; grid-template-columns: 78px minmax(220px, 1fr) auto auto; align-items: center; gap: 22px; margin-bottom: 26px; padding: 20px 24px; border: 1px solid rgba(255,118,91,.35); background: linear-gradient(105deg, #2c171a, #19171f 58%, #14161b); }.contest-emblem { position: relative; display: grid; width: 64px; height: 64px; place-items: center; overflow: hidden; border: 1px solid #ff765b; color: #ff9b82; background: #451c1f; transform: rotate(-8deg); }.contest-emblem::before, .contest-emblem::after { position: absolute; width: 90px; height: 1px; background: rgba(255,118,91,.45); content: ''; transform: rotate(45deg); }.contest-emblem::after { transform: rotate(-45deg); }.contest-emblem span { z-index: 1; font-family: var(--heading); font-size: 24px; transform: rotate(8deg); }.contest-emblem i { position: absolute; right: 9px; bottom: 8px; width: 6px; height: 6px; border-radius: 50%; background: #ff765b; box-shadow: 0 0 12px #ff765b; }.contest-kicker { margin-bottom: 5px; color: #ff886f; font-size: 9px; font-weight: 700; letter-spacing: .14em; }.contest-kicker span { display: inline-block; width: 6px; height: 6px; margin-right: 6px; border-radius: 50%; background: #ff765b; box-shadow: 0 0 9px #ff765b; }.contest-copy h3 { margin: 0 0 5px; color: #f5f1eb; font-family: var(--heading); font-size: 25px; line-height: 1; }.contest-copy > p:last-child { color: #9f9699; font-size: 11px; }.contest-reward { display: grid; gap: 3px; padding-left: 22px; border-left: 1px solid rgba(255,255,255,.12); }.contest-reward small, .contest-reward span { color: #81777b; font-size: 9px; letter-spacing: .1em; text-transform: uppercase; }.contest-reward strong { color: #ffc16d; font-size: 13px; letter-spacing: .05em; }.contest-button { padding: 12px 14px; border: 0; color: #211316; background: #ff765b; font-size: 10px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; cursor: pointer; }.contest-button span { margin-left: 12px; font-size: 14px; }.contest-button:hover { background: #ff977f; }.contest-button.joined { color: #b4d0b7; background: #31483a; }
.contest-modes { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 12px; }.contest-modes button { padding: 5px 8px; border: 1px solid rgba(255,255,255,.16); color: #9f9699; background: transparent; font-size: 9px; cursor: pointer; }.contest-modes button:hover, .contest-modes button.selected { border-color: #ff765b; color: #ffad99; background: rgba(255,118,91,.1); }
.game-card.fire .game-art { color: #ffb35f; background: linear-gradient(135deg, #48231a, #2c191c); }
@media (max-width: 760px) { .library-section { padding: 58px 20px 72px; }.section-heading { align-items: start; flex-direction: column; gap: 14px; }.section-heading h2 { font-size: 36px; }.library-tools { align-items: stretch; flex-direction: column; }.library-search { width: 100%; }.game-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }.game-art { height: 120px; } }
@media (max-width: 430px) { .game-grid { grid-template-columns: 1fr; }.game-art { height: 150px; } }
@media (max-width: 760px) { .contest-banner { grid-template-columns: 58px 1fr; gap: 14px; padding: 17px; }.contest-emblem { width: 54px; height: 54px; }.contest-copy h3 { font-size: 21px; }.contest-reward { grid-column: 2; padding: 0; border: 0; }.contest-button { grid-column: 1 / -1; width: 100%; } }
.empty-library strong, .empty-library span { display: block; }.empty-library strong { margin-bottom: 7px; color: #f5f1eb; font-size: 15px; }.empty-library span { font-size: 11px; }
.match-history-list { display: grid; gap: 8px; }.match-history-row { display: grid; grid-template-columns: 46px minmax(0, 1fr) auto 70px; align-items: center; gap: 15px; padding: 14px 16px; border: 1px solid rgba(255,255,255,.09); background: #171920; }.match-game-mark { display: block; width: 38px; height: 38px; object-fit: cover; border: 1px solid #ff765b; color: #ffad99; background: #391d20; font-size: 10px; font-weight: 800; }.match-history-row h3 { margin: 0 0 3px; color: #f5f1eb; font-size: 13px; }.match-history-row p { color: #77767e; font-size: 10px; }.match-history-row strong { font-size: 10px; letter-spacing: .08em; text-transform: uppercase; }.match-history-row .victory { color: #8fc99b; }.match-history-row .defeat { color: #e98778; }.match-history-row > span { color: #c6c1bd; font-family: var(--mono); font-size: 12px; text-align: right; }
.tournament-section { max-width: 1440px; min-height: calc(100vh - 82px); margin: 0 auto; padding: 54px 58px 84px; background: #101217; border-top: 1px solid rgba(255,255,255,.08); }.tournament-heading { display: flex; align-items: start; justify-content: space-between; gap: 25px; margin-bottom: 28px; }.tournament-heading h2 { margin: 0 0 9px; color: #f5f1eb; font-family: var(--heading); font-size: 48px; line-height: 1; }.tournament-heading > div:first-child > p:last-child { color: #96939a; font-size: 13px; }.tournament-badge { padding: 9px 12px; border: 1px solid rgba(255,118,91,.35); color: #ff927d; font-size: 9px; font-weight: 700; letter-spacing: .12em; white-space: nowrap; }.tournament-badge span { display: inline-block; width: 6px; height: 6px; margin-right: 7px; border-radius: 50%; background: #ff765b; box-shadow: 0 0 10px #ff765b; }.tournament-modes { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 30px; padding-bottom: 18px; border-bottom: 1px solid rgba(255,255,255,.09); }.tournament-modes button { padding: 10px 14px; border: 1px solid #383941; color: #96939a; background: transparent; font-size: 10px; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; cursor: pointer; }.tournament-modes button:hover, .tournament-modes button.selected { border-color: #ff765b; color: #ffad99; background: rgba(255,118,91,.1); }.tournament-days { display: grid; gap: 30px; }.tournament-day { padding: 20px; border: 1px solid rgba(255,255,255,.08); background: #14161c; }.day-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 14px; }.day-heading h3 { margin: 0; color: #f5f1eb; font-family: var(--heading); font-size: 23px; }.day-heading span { color: #77767e; font-size: 10px; letter-spacing: .1em; text-transform: uppercase; }.match-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }.scheduled-match { display: grid; grid-template-columns: 38px minmax(0, 1fr) auto auto; align-items: center; gap: 11px; padding: 11px; border: 1px solid rgba(255,255,255,.07); background: #1a1c23; }.scheduled-match .match-game-mark { width: 32px; height: 32px; font-size: 9px; }.scheduled-match h4 { margin: 0 0 3px; color: #e9e5e0; font-size: 12px; }.scheduled-match p { color: #77767e; font-size: 9px; }.scheduled-match time { color: #ffc16d; font-family: var(--mono); font-size: 11px; white-space: nowrap; }.scheduled-match button { padding: 6px 9px; border: 1px solid #ff765b; color: #ff927d; background: transparent; font-size: 9px; font-weight: 700; text-transform: uppercase; cursor: pointer; }.scheduled-match button:hover { color: #211316; background: #ff765b; }
@media (max-width: 520px) { .match-history-row { grid-template-columns: 40px minmax(0, 1fr) auto; gap: 10px; padding: 12px; }.match-game-mark { width: 34px; height: 34px; }.match-history-row > span { grid-column: 2; text-align: left; }.match-history-row strong { grid-column: 3; grid-row: 1; } }
@media (max-width: 760px) { .tournament-section { min-height: calc(100vh - 70px); padding: 42px 20px 68px; }.tournament-heading { flex-direction: column; }.tournament-heading h2 { font-size: 38px; }.match-grid { grid-template-columns: 1fr; }.tournament-day { padding: 14px; } }
.scheduled-match { position: relative; }
.tournament-section { background: radial-gradient(circle at 90% 8%, rgba(255,118,91,.08), transparent 28%), #0f1116; }
.tournament-heading { margin-bottom: 38px; }
.tournament-heading h2 { font-size: clamp(42px, 5vw, 64px); letter-spacing: .04em; }
.tournament-heading > div:first-child > p:last-child { max-width: 420px; margin-top: 14px; line-height: 1.6; }
.tournament-badge { align-self: center; padding: 10px 14px; background: rgba(255,118,91,.04); box-shadow: inset 0 0 18px rgba(255,118,91,.03); }
.tournament-coming-soon { min-height: 280px; border: 1px solid rgba(255,255,255,.12); display: grid; place-items: center; align-content: center; gap: 10px; text-align: center; background: linear-gradient(135deg, rgba(255,118,91,.08), rgba(255,255,255,.02)); }
.tournament-coming-soon strong { color: #f5f1eb; font-family: var(--heading); font-size: clamp(32px, 5vw, 56px); line-height: 1; }
.tournament-coming-soon span { color: #96939a; font-size: 12px; }
.tournament-coming-soon button { color: #ffad99; cursor: pointer; background: transparent; border: 1px solid #ff765b; padding: 9px 13px; font-size: 10px; font-weight: 700; text-transform: uppercase; }
.tournament-days { gap: 22px; }
.tournament-day { padding: 0; overflow: hidden; border-color: rgba(255,255,255,.12); background: #15171d; box-shadow: 0 18px 40px rgba(0,0,0,.16); }
.day-heading { margin: 0; padding: 17px 20px 15px; border-bottom: 1px solid rgba(255,255,255,.1); background: linear-gradient(90deg, rgba(255,255,255,.035), transparent 65%); }
.day-heading h3 { font-size: 24px; letter-spacing: .02em; }
.day-heading span { padding: 5px 8px; border: 1px solid rgba(255,118,91,.25); color: #ff927d; font-size: 9px; }
.match-grid { gap: 10px; padding: 12px; }
.scheduled-match { grid-template-columns: 42px minmax(0, 1fr) 92px 60px; min-height: 74px; padding: 12px 12px 12px 11px; border: 1px solid rgba(255,255,255,.1); background: linear-gradient(105deg, #1b1e25, #171920); transition: border-color .2s ease, background .2s ease, transform .2s ease; }
.scheduled-match:hover { border-color: rgba(255,118,91,.55); background: linear-gradient(105deg, #242027, #191b22); transform: translateY(-2px); }
.scheduled-match .match-game-mark { width: 42px; height: 42px; border-color: rgba(255,118,91,.7); box-shadow: 0 5px 14px rgba(0,0,0,.3); }
.scheduled-match h4 { margin: 0 0 5px; color: #f5f1eb; font-size: 12px; letter-spacing: .01em; }
.scheduled-match p { color: #85828a; font-size: 9px; letter-spacing: .06em; text-transform: uppercase; }
.scheduled-match time { min-width: 70px; color: #ffc16d; font-family: var(--mono); font-size: 11px; font-weight: 700; text-align: right; }
.match-meta { display: grid; justify-items: end; gap: 5px; }
.match-entry-fee { color: #d8a952; font-size: 9px; font-weight: 700; letter-spacing: .04em; white-space: nowrap; }
.coin-icon { position: relative; display: inline-block; width: 10px; height: 10px; margin: 0 7px 0 2px; border: 1px solid #f3c968; background: linear-gradient(135deg, #ffe08a, #c88a2e); transform: rotate(45deg); vertical-align: -1px; box-shadow: 0 0 7px rgba(243,201,104,.3); }
.coin-icon::after { position: absolute; top: 2px; left: 2px; width: 4px; height: 4px; border: 1px solid rgba(255,248,194,.75); content: ''; }
.scheduled-match button { width: 60px; padding: 10px 0; border: 1px solid #ff765b; color: #ffad99; background: transparent; font-size: 9px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; cursor: pointer; transition: color .2s ease, background .2s ease; }
.scheduled-match button:hover:not(:disabled) { color: #171216; background: #ff765b; }
.scheduled-match button:disabled { opacity: 0.72; cursor: not-allowed; }
.scheduled-match .joined-button { color: #b4d0b7; background: #31483a; border-color: #31483a; }
@media (max-width: 760px) { .day-heading { padding: 15px 14px 13px; }.match-grid { padding: 9px; }.scheduled-match { grid-template-columns: 42px minmax(0, 1fr) auto 60px; padding: 11px 10px; } }

/* Tactical arena skin */
body { background: #070b10; }
.gaming-page { position: relative; isolation: isolate; background: #070b10; }
.gaming-page::before { position: fixed; z-index: -2; inset: 0; background: linear-gradient(rgba(7,11,16,.9), rgba(7,11,16,.96)), repeating-linear-gradient(0deg, transparent 0 39px, rgba(85,230,224,.045) 40px), repeating-linear-gradient(90deg, transparent 0 39px, rgba(85,230,224,.035) 40px); content: ''; pointer-events: none; }
.gaming-page::after { position: fixed; z-index: -1; top: 0; right: 0; width: 45vw; height: 45vw; max-width: 680px; max-height: 680px; border: 1px solid rgba(85,230,224,.12); border-radius: 50%; content: ''; pointer-events: none; transform: translate(32%, -32%); box-shadow: 0 0 0 24px rgba(85,230,224,.025), 0 0 0 48px rgba(85,230,224,.018); }
.navbar { max-width: none; padding-inline: clamp(20px, 5vw, 72px); border-bottom-color: rgba(85,230,224,.16); background: rgba(7,11,16,.76); backdrop-filter: blur(16px); }
.brand { color: #f4fbff; text-shadow: 0 0 18px rgba(85,230,224,.25); }
.brand-dot, .brand-mark i { color: var(--orange); background: var(--orange); }
.nav-link:hover, .nav-link.active { color: var(--cyan); }
.nav-link.active::after { background: var(--cyan); box-shadow: 0 0 15px var(--cyan); }
.live-dot { color: var(--cyan); border-color: rgba(85,230,224,.48); }
.coin-balance { border-color: rgba(255,194,87,.42); background: rgba(255,194,87,.07); }
.profile-button { border-left-color: rgba(85,230,224,.18); }
.avatar { border-color: var(--cyan); color: var(--cyan); background: rgba(85,230,224,.1); }
.nav-showcase { max-width: none; min-height: calc(100vh - 82px); padding: clamp(90px, 13vh, 150px) clamp(20px, 8vw, 120px); overflow: hidden; background: linear-gradient(90deg, rgba(5,9,13,.97) 0%, rgba(5,9,13,.78) 37%, rgba(5,9,13,.2) 78%, rgba(5,9,13,.55) 100%), linear-gradient(0deg, rgba(5,9,13,.55), transparent 48%), url('/assets/image_10d29343-oYB7uswS.jpg') center / cover; }
.nav-showcase::before { position: absolute; top: 0; right: 0; bottom: 0; width: 54%; background: linear-gradient(115deg, transparent 0 48%, rgba(85,230,224,.14) 48.2%, transparent 48.5% 67%, rgba(255,112,77,.13) 67.2%, transparent 67.5%), repeating-linear-gradient(120deg, transparent 0 54px, rgba(255,255,255,.045) 55px 56px); content: ''; pointer-events: none; }
.nav-showcase::after { width: 100%; background: linear-gradient(90deg, transparent, rgba(85,230,224,.28), transparent) 0 100% / 100% 1px no-repeat; }
.eyebrow { color: var(--cyan); text-shadow: 0 0 14px rgba(85,230,224,.35); }
.eyebrow span, .status-pulse { background: var(--orange); box-shadow: 0 0 12px var(--orange); }
.nav-showcase h1 { color: #f4fbff; text-shadow: 5px 5px 0 rgba(85,230,224,.08), 0 0 32px rgba(0,0,0,.7); }
.nav-showcase h1 em { -webkit-text-stroke-color: var(--cyan); filter: drop-shadow(0 0 8px rgba(85,230,224,.3)); }
.showcase-copy { color: #c0cbd4; }
.primary-cta { color: #061014; background: var(--orange); box-shadow: 0 0 24px rgba(255,112,77,.28); clip-path: polygon(0 0, calc(100% - 12px) 0, 100% 12px, 100% 100%, 12px 100%, 0 calc(100% - 12px)); transition: transform .2s ease, box-shadow .2s ease; }
.primary-cta:hover { transform: translateY(-3px); box-shadow: 0 0 32px rgba(255,112,77,.48); }
.secondary-cta { color: var(--cyan); }
.status-bar { color: #c0cbd4; }
.library-section, .tournament-section { max-width: none; border-top-color: rgba(85,230,224,.14); background: linear-gradient(180deg, rgba(7,11,16,.96), rgba(10,18,25,.98)); }
.section-heading h2, .tournament-heading h2 { color: #f4fbff; text-shadow: 0 0 20px rgba(85,230,224,.12); }
.game-card, .match-history-row, .tournament-day, .scheduled-match { border-color: rgba(85,230,224,.16); background: rgba(13,21,29,.88); box-shadow: inset 0 1px rgba(255,255,255,.05), 0 18px 42px rgba(0,0,0,.22); }
.game-card:hover, .match-history-row:hover, .scheduled-match:hover { border-color: rgba(85,230,224,.58); }
.tournament-badge { border: 1px solid rgba(85,230,224,.42); color: var(--cyan); background: rgba(85,230,224,.06); cursor: pointer; }
.tournament-badge span { background: var(--orange); box-shadow: 0 0 10px var(--orange); }
.tournament-coming-soon { border-color: rgba(85,230,224,.2); background: linear-gradient(135deg, rgba(85,230,224,.08), rgba(255,112,77,.04)); }
.tournament-coming-soon button { border-color: var(--cyan); color: var(--cyan); }
.match-game-mark { border-color: rgba(85,230,224,.5); color: var(--cyan); background: rgba(85,230,224,.08); }
.scheduled-match button, .coin-custom-form .auth-submit, .withdraw-form .auth-submit { border-color: var(--orange); color: var(--orange); background: transparent; }
.match-action { display: grid; justify-items: stretch; gap: 5px; min-width: 74px; }.match-public-id { color: #ffad99; font-family: var(--mono); font-size: 10px; font-weight: 700; letter-spacing: .08em; text-align: center; }
.scheduled-match button:hover, .coin-custom-form .auth-submit:hover, .withdraw-form .auth-submit:hover { color: #071016; background: var(--orange); }
.auth-modal, .wallet-modal { border-color: rgba(85,230,224,.26); background: linear-gradient(145deg, #101c25, #081016); }
@media (max-width: 760px) { .nav-showcase { min-height: calc(100vh - 70px); background-position: 58% center; }.nav-showcase::before { width: 100%; opacity: .7; }.nav-content { background: rgba(7,13,19,.96); border-bottom-color: rgba(85,230,224,.2); } }

/* HUD navigation */
.navbar { min-height: 76px; padding-block: 12px; border-bottom: 0; background: transparent; }
.navbar::before { position: absolute; z-index: -1; inset: 8px clamp(12px, 3vw, 42px); border: 1px solid rgba(85,230,224,.16); background: rgba(5,12,18,.78); box-shadow: 0 14px 38px rgba(0,0,0,.28), inset 0 1px rgba(255,255,255,.06); content: ''; clip-path: polygon(0 0, calc(100% - 18px) 0, 100% 18px, 100% 100%, 18px 100%, 0 calc(100% - 18px)); backdrop-filter: blur(16px); }
.navbar::after { position: absolute; z-index: -1; top: 8px; left: clamp(28px, 5vw, 74px); width: 58px; height: 2px; background: var(--orange); content: ''; box-shadow: 0 0 16px var(--orange); }
.brand { flex: 0 0 auto; gap: 10px; padding-left: 20px; font-size: 20px; }
.brand-mark { height: 20px; }
.brand-mark i { width: 4px; }
.nav-content { gap: 24px; margin-left: 42px; }
.nav-links { gap: 4px; padding: 4px; border: 1px solid rgba(85,230,224,.1); background: rgba(85,230,224,.035); }
.nav-link { padding: 10px 13px 9px; color: #8293a1; font-size: 10px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.nav-link:hover, .nav-link.active { color: #eaffff; background: rgba(85,230,224,.09); }
.nav-link.active::after { right: 10px; bottom: 2px; left: 10px; height: 1px; background: var(--orange); box-shadow: 0 0 9px var(--orange); }
.live-dot { padding: 2px 4px; font-size: 7px; }
.nav-actions { gap: 9px; }
.icon-button, .coin-balance, .profile-button { min-height: 36px; border: 1px solid rgba(85,230,224,.16); background: rgba(85,230,224,.045); }
.icon-button:hover, .coin-balance:hover, .profile-button:hover { border-color: rgba(85,230,224,.52); background: rgba(85,230,224,.1); }
.icon-button { width: 38px; }
.search-button span { left: 12px; }
.coin-balance { gap: 6px; padding-inline: 10px; }
.profile-button { gap: 8px; padding: 4px 10px 4px 5px; border-left: 1px solid rgba(85,230,224,.16); }
.profile-button .avatar { width: 27px; height: 27px; font-size: 9px; }
.profile-copy strong { color: #eaffff; font-size: 10px; text-transform: uppercase; }
.profile-copy small { color: var(--cyan); font-size: 7px; }
.chevron { margin-left: 4px; }
@media (max-width: 1050px) { .navbar { padding-inline: 20px; }.navbar::before { inset-inline: 10px; }.brand { padding-left: 12px; }.nav-content { margin-left: 20px; }.nav-links { gap: 0; }.nav-link { padding-inline: 9px; }.nav-actions { gap: 6px; } }
@media (max-width: 760px) { .navbar { min-height: 70px; padding: 10px 20px; }.navbar::before { inset: 7px 10px; }.navbar::after { left: 28px; }.brand { padding-left: 10px; }.menu-toggle { z-index: 1; width: 38px; height: 36px; margin-left: auto; padding: 9px 8px; border: 1px solid rgba(85,230,224,.2); background: rgba(85,230,224,.06); }.menu-toggle span:not(.sr-only) { width: 20px; background: var(--cyan); }.nav-content { top: 68px; right: 10px; left: 10px; margin: 0; padding: 12px; border: 1px solid rgba(85,230,224,.22); background: rgba(5,12,18,.98); box-shadow: 0 18px 35px rgba(0,0,0,.36); }.nav-links { border: 0; background: transparent; }.nav-link { padding: 14px 12px; }.nav-actions { justify-content: stretch; gap: 8px; }.nav-actions .icon-button { width: 38px; }.coin-balance { flex: 1; justify-content: center; }.profile-button { flex: 1; justify-content: center; }.profile-copy, .chevron { display: grid; } }

/* Underground esports direction */
.gaming-page { background: #080a0d; }
.gaming-page::before { background: radial-gradient(circle at 18% 20%, rgba(214,248,91,.09), transparent 24%), linear-gradient(125deg, rgba(8,10,13,.98), rgba(8,10,13,.82)), repeating-linear-gradient(90deg, transparent 0 79px, rgba(109,231,255,.035) 80px); }
.gaming-page::after { width: 52vw; height: 52vw; border-color: rgba(214,248,91,.12); border-radius: 0; transform: rotate(45deg) translate(35%, -35%); box-shadow: none; }
.navbar { min-height: 90px; padding: 18px clamp(20px, 5vw, 76px); }
.navbar::before { inset: 0; border: 0; border-bottom: 1px solid rgba(109,231,255,.22); background: rgba(8,10,13,.82); clip-path: none; box-shadow: none; }
.navbar::after { top: auto; right: clamp(20px, 5vw, 76px); bottom: -1px; left: auto; width: 170px; height: 3px; background: var(--orange); box-shadow: 0 0 18px rgba(214,248,91,.4); }
.brand { position: relative; padding-left: 0; font-family: var(--mono); font-size: 18px; letter-spacing: .14em; }
.brand::after { position: absolute; top: -14px; left: 0; color: var(--orange); content: 'ARENACORE NETWORK / 08'; font-size: 7px; letter-spacing: .22em; white-space: nowrap; }
.brand-mark { display: none; }
.brand-dot { color: var(--orange); }
.nav-content { margin-left: auto; }
.nav-links { gap: 26px; padding: 0; border: 0; background: transparent; }
.nav-link { padding: 13px 0; color: #697780; font-family: var(--mono); font-size: 10px; letter-spacing: .04em; }
.nav-link::before { display: inline-block; margin-right: 7px; color: #3b464e; content: '0'; font-size: 8px; }
.nav-link:nth-child(2)::before { content: '1'; }.nav-link:nth-child(3)::before { content: '2'; }.nav-link:nth-child(4)::before { content: '3'; }
.nav-link:hover, .nav-link.active { color: var(--orange); background: transparent; }
.nav-link.active::after { right: 0; bottom: 3px; left: 0; height: 3px; background: var(--orange); box-shadow: none; }
.live-dot { color: var(--orange); border-color: rgba(214,248,91,.45); }
.nav-actions { gap: 14px; }
.icon-button, .coin-balance, .profile-button { min-height: 32px; border: 0; background: transparent; }
.icon-button:hover, .coin-balance:hover, .profile-button:hover { border-color: transparent; background: rgba(109,231,255,.08); }
.coin-balance { border-left: 1px solid rgba(109,231,255,.22); border-radius: 0; }
.profile-button { border-left-color: rgba(109,231,255,.22); border-radius: 0; }
.avatar { border-radius: 0; border-color: var(--cyan); color: var(--cyan); background: transparent; transform: rotate(45deg); }
.avatar::first-letter { display: inline-block; transform: rotate(-45deg); }
.profile-copy strong { font-family: var(--mono); }
.profile-copy small { color: var(--orange); }
.nav-showcase { min-height: calc(100vh - 90px); padding: clamp(92px, 16vh, 180px) clamp(20px, 9vw, 140px); background: linear-gradient(90deg, rgba(8,10,13,.98) 0%, rgba(8,10,13,.78) 35%, rgba(8,10,13,.08) 76%, rgba(8,10,13,.6) 100%), linear-gradient(0deg, rgba(8,10,13,.68), transparent 54%), url('/assets/image_10d29343-oYB7uswS.jpg') 56% center / cover; }
.nav-showcase::before { top: 0; right: 0; width: 57%; background: linear-gradient(90deg, transparent, rgba(214,248,91,.75) 1px, transparent 1px) 24% 0 / 26% 100% no-repeat, linear-gradient(135deg, transparent 0 49%, rgba(109,231,255,.28) 49.2%, transparent 49.5%); }
.nav-showcase::after { bottom: 68px; top: auto; right: auto; left: clamp(20px, 9vw, 140px); width: 110px; height: 1px; background: var(--orange); }
.eyebrow { color: var(--orange); font-family: var(--mono); font-size: 10px; }
.eyebrow span, .status-pulse { background: var(--orange); box-shadow: 0 0 12px var(--orange); }
.nav-showcase h1 { max-width: 720px; margin-top: 28px; color: #f3f7ec; font-size: clamp(52px, 8vw, 116px); letter-spacing: -.025em; line-height: .85; }
.nav-showcase h1 em { -webkit-text-stroke: 1px var(--orange); filter: none; }
.showcase-copy { max-width: 330px; color: #a9b8bd; font-family: var(--mono); font-size: 12px; line-height: 1.8; }
.showcase-actions { gap: 30px; margin-top: 38px; }
.primary-cta { padding: 17px 22px; color: #10140c; background: var(--orange); box-shadow: 7px 7px 0 rgba(109,231,255,.72); clip-path: polygon(0 0, 100% 0, 100% calc(100% - 10px), calc(100% - 10px) 100%, 0 100%); }
.primary-cta:hover { box-shadow: 3px 3px 0 rgba(109,231,255,.72); }
.secondary-cta { color: var(--cyan); font-family: var(--mono); font-size: 10px; }
.status-bar { right: clamp(20px, 9vw, 140px); bottom: 68px; color: #71828a; font-family: var(--mono); font-size: 9px; }
.status-divider { background: var(--cyan); }
.library-section, .tournament-section { background: #0b1015; }
.section-heading h2, .tournament-heading h2 { font-size: clamp(42px, 6vw, 70px); letter-spacing: -.02em; }
.game-card, .match-history-row, .tournament-day, .scheduled-match { border-radius: 0; border-color: rgba(109,231,255,.2); background: #10161d; }
.game-card:hover, .match-history-row:hover, .scheduled-match:hover { border-color: var(--orange); }
.tournament-badge { border-radius: 0; border-color: var(--orange); color: var(--orange); background: rgba(214,248,91,.05); }
.scheduled-match button, .coin-custom-form .auth-submit, .withdraw-form .auth-submit { border-color: var(--orange); color: var(--orange); border-radius: 0; }
.auth-modal, .wallet-modal { border-radius: 0; border-color: var(--cyan); }
@media (max-width: 760px) { .navbar { min-height: 76px; padding: 17px 20px; }.navbar::after { right: 20px; width: 90px; }.brand::after { top: -12px; }.nav-content { top: 76px; right: 12px; left: 12px; border: 1px solid rgba(109,231,255,.3); border-radius: 0; }.nav-links { gap: 0; }.nav-link::before { display: inline-block; }.nav-showcase { min-height: calc(100vh - 76px); background-position: 62% center; }.nav-showcase h1 { font-size: clamp(52px, 15vw, 78px); }.status-bar { right: 20px; left: 20px; bottom: 38px; }.primary-cta { box-shadow: 5px 5px 0 rgba(109,231,255,.72); } }

/* Premium broadcast layout */
.gaming-page { background: #0d0f13; }
.gaming-page::before, .gaming-page::after { display: none; }
.navbar { min-height: 72px; padding: 0 clamp(20px, 5vw, 72px); }
.navbar::before { inset: 0; border-bottom: 1px solid rgba(255,255,255,.1); background: rgba(13,15,19,.92); backdrop-filter: blur(18px); }
.navbar::after { right: clamp(20px, 5vw, 72px); bottom: -1px; left: auto; width: 80px; height: 2px; background: var(--orange); box-shadow: none; }
.brand { padding: 0; color: #f6f3ef; font-family: var(--heading); font-size: 22px; letter-spacing: .08em; }
.brand::after { display: none; }
.brand-mark { display: flex; }
.brand-mark i { width: 4px; background: var(--orange); }
.nav-content { gap: 35px; margin-left: auto; }
.nav-links { gap: 26px; }
.nav-link { padding: 26px 0 23px; color: #858b92; font-family: var(--sans); font-size: 11px; letter-spacing: .1em; }
.nav-link::before { display: none; }
.nav-link:hover, .nav-link.active { color: #fff; background: transparent; }
.nav-link.active::after { right: 0; bottom: -1px; left: 0; height: 2px; background: var(--orange); box-shadow: none; }
.live-dot { color: var(--orange); border-color: rgba(255,91,61,.45); }
.nav-actions { gap: 18px; }
.icon-button, .coin-balance, .profile-button { min-height: 34px; border: 0; background: transparent; }
.icon-button:hover, .coin-balance:hover, .profile-button:hover { background: rgba(255,255,255,.05); }
.coin-balance { border-left: 1px solid rgba(255,255,255,.14); border-radius: 0; }
.profile-button { border-left-color: rgba(255,255,255,.14); border-radius: 0; }
.avatar { border-radius: 50%; border-color: var(--orange); color: #fff; background: rgba(255,91,61,.16); transform: none; }
.profile-copy strong { font-family: var(--sans); }
.profile-copy small { color: #777f87; }
.nav-showcase { min-height: calc(100vh - 72px); padding: clamp(80px, 15vh, 160px) clamp(20px, 9vw, 140px); background: linear-gradient(90deg, #0d0f13 0%, rgba(13,15,19,.92) 28%, rgba(13,15,19,.32) 66%, rgba(13,15,19,.8) 100%), linear-gradient(0deg, rgba(13,15,19,.6), transparent 55%), url('/assets/image_10d29343-oYB7uswS.jpg') 62% center / cover; }
.nav-showcase::before { top: auto; right: 0; bottom: 0; width: 42%; height: 1px; background: var(--orange); opacity: .8; }
.nav-showcase::after { display: block; top: 0; right: 10%; bottom: 0; left: auto; width: 1px; height: auto; background: rgba(255,255,255,.1); }
.eyebrow { color: var(--orange); font-family: var(--sans); font-size: 10px; letter-spacing: .22em; }
.nav-showcase h1 { max-width: 650px; margin-top: 25px; color: #f6f3ef; font-size: clamp(54px, 7vw, 104px); letter-spacing: .01em; line-height: .9; text-shadow: none; }
.nav-showcase h1 em { -webkit-text-stroke: 1px #f6f3ef; filter: none; }
.showcase-copy { max-width: 365px; color: #a6abb0; font-family: var(--sans); font-size: 14px; line-height: 1.7; }
.showcase-actions { gap: 24px; margin-top: 34px; }
.primary-cta { padding: 15px 20px; color: #fff; background: var(--orange); box-shadow: none; clip-path: none; }
.primary-cta:hover { box-shadow: 0 8px 24px rgba(255,91,61,.25); transform: translateY(-2px); }
.secondary-cta { color: #e1e4e7; font-family: var(--sans); font-size: 11px; }
.status-bar { right: auto; bottom: 44px; left: clamp(20px, 9vw, 140px); color: #777f87; font-family: var(--sans); font-size: 9px; }
.status-divider { background: #4b5158; }
.library-section, .tournament-section { background: #101318; }
.section-heading h2, .tournament-heading h2 { color: #f6f3ef; font-size: clamp(40px, 5vw, 64px); letter-spacing: .01em; }
.game-card, .match-history-row, .tournament-day, .scheduled-match { border-color: rgba(255,255,255,.1); background: #171b21; box-shadow: none; }
.game-card:hover, .match-history-row:hover, .scheduled-match:hover { border-color: var(--orange); }
.tournament-badge { border-color: rgba(255,91,61,.5); color: var(--orange); background: rgba(255,91,61,.06); }
.scheduled-match button, .coin-custom-form .auth-submit, .withdraw-form .auth-submit { border-color: var(--orange); color: var(--orange); border-radius: 0; }
.auth-modal, .wallet-modal { border-color: rgba(255,255,255,.16); background: #171b21; }
@media (max-width: 760px) { .navbar { min-height: 68px; padding: 0 20px; }.navbar::after { right: 20px; width: 52px; }.menu-toggle { border: 1px solid rgba(255,255,255,.15); background: rgba(255,255,255,.04); }.menu-toggle span:not(.sr-only) { background: #fff; }.nav-content { top: 68px; right: 12px; left: 12px; border: 1px solid rgba(255,255,255,.15); background: rgba(17,19,24,.98); }.nav-link { padding: 14px 12px; }.nav-showcase { min-height: calc(100vh - 68px); padding-top: 92px; background-position: 63% center; }.nav-showcase::after { right: 7%; }.nav-showcase h1 { font-size: clamp(50px, 14vw, 74px); }.status-bar { right: 20px; bottom: 32px; left: 20px; } }

/* Restore the original visual treatment. */
body { background: #0b0c10; }
.gaming-page { position: static; isolation: auto; min-height: 100vh; overflow: hidden; background: radial-gradient(circle at 75% 38%, rgba(245,91,52,.13), transparent 27%), linear-gradient(135deg, #0b0c10 0%, #11131a 54%, #161116 100%); }
.gaming-page::before, .gaming-page::after { display: none; }
.navbar { position: relative; min-height: 82px; max-width: 1440px; padding: 0 58px; border-bottom: 1px solid rgba(255,255,255,.09); background: transparent; }
.navbar::before, .navbar::after { display: none; }
.brand { position: static; flex: initial; gap: 12px; padding: 0; color: #fff; font-family: var(--heading); font-size: 21px; letter-spacing: .08em; }
.brand::after { display: none; }
.brand-mark { display: flex; align-items: end; gap: 3px; height: 22px; }
.brand-mark i { width: 5px; background: #ff623e; }
.brand-dot { color: #ff623e; }
.nav-content { gap: initial; margin-left: 76px; }
.nav-links { gap: 34px; padding: 0; border: 0; background: transparent; }
.nav-link { padding: 31px 0 29px; color: #96949a; font-family: var(--sans); font-size: 13px; font-weight: 600; letter-spacing: .04em; text-transform: none; }
.nav-link::before { display: none; }
.nav-link:hover, .nav-link.active { color: #fff; background: transparent; }
.nav-link.active::after { right: 0; bottom: -1px; left: 0; height: 2px; background: #ff623e; box-shadow: 0 0 15px #ff623e; }
.live-dot { color: #ff856a; border-color: rgba(255,98,62,.45); }
.nav-actions { gap: 20px; }
.icon-button, .coin-balance, .profile-button { min-height: initial; border: 0; background: transparent; }
.icon-button:hover, .coin-balance:hover, .profile-button:hover { border-color: transparent; background: transparent; }
.coin-balance { border-left: 0; border-color: rgba(231,185,94,.28); background: rgba(231,185,94,.05); }
.profile-button { border-left: 1px solid rgba(255,255,255,.1); border-radius: 0; }
.avatar { border-radius: 50%; border-color: #f3a18d; color: #ffad99; background: #492b2e; transform: none; }
.profile-copy strong { font-family: var(--sans); color: #f4f2ed; font-size: 11px; text-transform: none; }
.profile-copy small { color: #77767e; font-size: 9px; }
.nav-showcase { max-width: 1440px; min-height: calc(100vh - 82px); padding: 115px 58px; background: linear-gradient(90deg, rgba(11,12,16,.98) 0%, rgba(11,12,16,.77) 39%, rgba(11,12,16,.12) 83%), radial-gradient(ellipse at 75% 55%, rgba(151,45,26,.22), transparent 35%); }
.nav-showcase::before { display: none; }
.nav-showcase::after { top: 0; right: 0; bottom: 0; width: 52%; height: auto; background: repeating-linear-gradient(120deg, transparent 0 50px, rgba(255,255,255,.025) 51px 52px); }
.eyebrow { color: #ff8268; font-family: var(--sans); font-size: 11px; letter-spacing: .18em; }
.nav-showcase h1 { max-width: 650px; margin: 22px 0 20px; color: inherit; font-size: clamp(48px, 6vw, 88px); line-height: .94; letter-spacing: .02em; text-shadow: none; }
.nav-showcase h1 em { -webkit-text-stroke: 1px #ff765b; filter: none; }
.showcase-copy { max-width: 390px; color: #a3a1a3; font-family: var(--sans); font-size: 15px; line-height: 1.7; }
.showcase-actions { gap: 26px; margin-top: 31px; }
.primary-cta { padding: 15px 19px; color: #151316; background: #ff765b; box-shadow: none; clip-path: none; }
.primary-cta:hover { box-shadow: none; transform: none; }
.secondary-cta { color: #e1ddda; font-family: var(--sans); font-size: 12px; }
.status-bar { right: auto; bottom: 54px; left: 58px; color: #7e7d83; font-family: var(--sans); font-size: 10px; }
.library-section, .tournament-section { max-width: 1440px; background: #101217; }
.section-heading h2, .tournament-heading h2 { font-size: 42px; letter-spacing: normal; }
.game-card, .match-history-row, .tournament-day, .scheduled-match { border-color: rgba(255,255,255,.12); border-radius: 0; background: #171920; box-shadow: 0 18px 40px rgba(0,0,0,.16); }
.game-card:hover, .match-history-row:hover, .scheduled-match:hover { border-color: rgba(255,118,91,.55); }
.tournament-badge { border-color: rgba(255,118,91,.35); color: #ff927d; background: rgba(255,118,91,.04); }
.scheduled-match button, .coin-custom-form .auth-submit, .withdraw-form .auth-submit { border-color: #ff765b; color: #ffad99; border-radius: 0; }
.auth-modal, .wallet-modal { border-color: rgba(255,118,91,.35); background: linear-gradient(145deg,#1a1b22,#101116); }
@media (max-width: 760px) { .navbar { min-height: 70px; padding: 0 20px; }.menu-toggle { width: 28px; height: auto; margin-left: auto; padding: 5px 0; border: 0; background: transparent; }.menu-toggle span:not(.sr-only) { width: 22px; background: #f4f1ed; }.nav-content { top: 70px; right: 0; left: 0; padding: 12px 20px 20px; border: 0; border-bottom: 1px solid rgba(255,255,255,.1); background: #12141a; box-shadow: none; }.nav-links { display: grid; gap: 0; }.nav-link { padding: 16px 0; }.nav-link::before { display: none; }.nav-actions { gap: 20px; }.nav-showcase { min-height: calc(100vh - 70px); padding: 86px 20px 120px; background-position: center; }.nav-showcase::after { display: none; }.nav-showcase h1 { font-size: clamp(44px, 14vw, 70px); }.status-bar { right: auto; bottom: 32px; left: 20px; } }

/* Subtle refinement of the original composition */
.navbar { background: rgba(11,12,16,.72); backdrop-filter: blur(12px); }
.brand { text-shadow: 0 0 20px rgba(255,98,62,.18); }
.nav-showcase { background: linear-gradient(90deg, rgba(11,12,16,.98) 0%, rgba(11,12,16,.86) 34%, rgba(11,12,16,.32) 78%, rgba(11,12,16,.72) 100%), linear-gradient(0deg, rgba(11,12,16,.42), transparent 55%), url('/assets/image_10d29343-oYB7uswS.jpg') center / cover; }
.nav-showcase::after { opacity: .55; }
.nav-showcase h1 { text-shadow: 0 8px 30px rgba(0,0,0,.38); }
.primary-cta { box-shadow: 0 9px 24px rgba(255,118,91,.2); transition: transform .2s ease, box-shadow .2s ease, background .2s ease; }
.primary-cta:hover { background: #ff927a; box-shadow: 0 12px 28px rgba(255,118,91,.3); transform: translateY(-2px); }
.game-card, .match-history-row, .tournament-day, .scheduled-match { box-shadow: 0 12px 30px rgba(0,0,0,.14), inset 0 1px rgba(255,255,255,.035); transition: border-color .2s ease, transform .2s ease, box-shadow .2s ease; }
.game-card:hover, .match-history-row:hover, .scheduled-match:hover { box-shadow: 0 16px 35px rgba(0,0,0,.22); transform: translateY(-2px); }
.library-back, .secondary-cta { transition: color .2s ease, opacity .2s ease; }
.library-back:hover, .secondary-cta:hover { color: #ffc0ad; }
@media (max-width: 760px) { .navbar { background: rgba(11,12,16,.9); }.nav-showcase { background-position: 58% center; } }

/* Final presentation polish */
.gaming-page { animation: page-enter .55s ease-out both; }
.navbar { animation: nav-enter .5s ease-out both; }
.nav-showcase > * { animation: content-enter .7s ease-out both; }
.nav-showcase > *:nth-child(2) { animation-delay: .08s; }
.nav-showcase > *:nth-child(3) { animation-delay: .14s; }
.nav-showcase > *:nth-child(4) { animation-delay: .2s; }
.nav-showcase > *:nth-child(5) { animation-delay: .26s; }
.nav-link:focus-visible, .primary-cta:focus-visible, .secondary-cta:focus-visible, button:focus-visible { outline: 2px solid #ff927a; outline-offset: 4px; }
.nav-showcase h1 em { text-shadow: 0 0 18px rgba(255,118,91,.16); }
.showcase-copy { border-left: 2px solid rgba(255,118,91,.5); padding-left: 14px; }
.status-bar { display: flex; align-items: center; gap: 0; padding: 9px 12px; border: 1px solid rgba(255,255,255,.1); background: rgba(11,12,16,.55); backdrop-filter: blur(8px); }
.status-pulse { flex: 0 0 auto; background: #ffc247; box-shadow: 0 0 12px rgba(255,194,71,.95); animation: status-pulse-blink 1s ease-in-out infinite; }
.section-heading, .tournament-heading { position: relative; }
.section-heading::after, .tournament-heading::after { position: absolute; right: 0; bottom: 2px; width: 52px; height: 2px; background: #ff765b; content: ''; box-shadow: 0 0 10px rgba(255,118,91,.35); }
.tournament-badge { transition: color .2s ease, background .2s ease, transform .2s ease; }
.tournament-badge:hover { background: rgba(255,118,91,.12); transform: translateY(-2px); }
.day-heading { background: linear-gradient(90deg, rgba(255,118,91,.08), transparent 66%); }
.scheduled-match { overflow: hidden; }
.scheduled-match::before { position: absolute; top: 0; bottom: 0; left: 0; width: 2px; background: transparent; content: ''; transition: background .2s ease; }
.scheduled-match:hover::before { background: #ff765b; }
.auth-modal, .wallet-modal { box-shadow: 0 24px 80px rgba(0,0,0,.55), inset 0 1px rgba(255,255,255,.07); }
@keyframes page-enter { from { opacity: 0; } to { opacity: 1; } }
@keyframes nav-enter { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: translateY(0); } }
@keyframes content-enter { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }
@media (prefers-reduced-motion: reduce) { .gaming-page, .navbar, .nav-showcase > * { animation: none; }.primary-cta, .game-card, .match-history-row, .scheduled-match { transition: none; } }
@media (max-width: 760px) { .status-bar { display: block; line-height: 1.8; }.section-heading::after, .tournament-heading::after { display: none; }.showcase-copy { padding-left: 11px; } }

/* Match schedule reference layout */
.tournament-section { max-width: 1040px; min-height: 100vh; margin: 0 auto; padding: 24px 14px 32px; background: #0b1523; }
.tournament-section.has-expanded-mode { background-position: center top; background-size: cover; background-attachment: fixed; background-color: transparent; }
.tournament-section > .library-back, .tournament-section > .tournament-heading { display: none; }
.tournament-days { gap: 18px; }
.tournament-date-group { display: grid; gap: 12px; }
.date-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 17px 20px 16px; border: 1px solid rgba(105,200,255,.35); background: rgba(13,29,45,.38); backdrop-filter: blur(4px); }
.date-heading h3 { margin: 0; color: #f6f2ec; font-family: var(--heading); font-size: 25px; letter-spacing: .01em; }
.date-heading span { padding: 9px 10px; border: 1px solid #5e3d3b; color: #ff765b; background: rgba(255,118,91,.03); font-family: var(--mono); font-size: 8px; letter-spacing: .1em; text-transform: uppercase; }
.match-category { position: relative; display: grid; gap: 0; }
.category-heading { position: relative; display: block; min-height: 150px; padding: 18px 16px; overflow: hidden; border-bottom: 1px solid #24435d; background-color: #101e2e; background-position: center; background-size: cover; }
.category-heading::before { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(7,16,27,.52), rgba(7,16,27,.2) 58%, rgba(7,16,27,.48)); content: ''; }
.category-heading > * { position: relative; z-index: 1; }
.mode-status-light { position: absolute; z-index: 2; top: 8px; right: 8px; width: 7px; height: 7px; border: 1px solid #101d2c; border-radius: 50%; background: #71e58b; box-shadow: 0 0 10px rgba(113,229,139,.95); animation: joined-dot-blink 1.2s ease-in-out infinite; }
.tournament-date-group { grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
.tournament-date-group .date-heading { grid-column: 1 / -1; }
.tournament-date-group.is-detail-view { grid-template-columns: 1fr; min-height: calc(100vh - 170px); }
.matches-back { justify-self: start; padding: 0; border: 0; color: #65b4f4; background: transparent; font-family: var(--mono); font-size: 9px; letter-spacing: .1em; text-transform: uppercase; cursor: pointer; }
.matches-back:hover { color: #a7d8ff; }
.match-category { min-height: 150px; }
.match-category:not(.is-expanded) .category-heading { min-height: 150px; border-bottom: 0; }
.match-category.is-expanded { min-height: 420px; }
.match-category.is-expanded .category-heading { min-height: clamp(260px, 42vw, 480px); background-position: center center !important; }
.match-joined-dot { display: inline-block; width: 7px; height: 7px; margin-right: 6px; border: 1px solid #0d1a2a; border-radius: 50%; background: #71e58b; box-shadow: 0 0 9px rgba(113,229,139,.95); animation: joined-dot-blink 1.2s ease-in-out infinite; }
.category-heading { cursor: pointer; }
.category-heading:focus-visible { outline: 2px solid #65b4f4; outline-offset: -2px; }
.mode-format-label { position: absolute; top: 14px; left: 16px; z-index: 2; color: #f5f1eb; font-family: Arial, Helvetica, sans-serif; font-size: 10px; font-style: italic; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; text-shadow: 0 2px 8px rgba(0,0,0,.9); }
.category-thumbnail { width: 46px; height: 46px; object-fit: cover; border: 1px solid #a9574d; }
.category-card-copy { align-self: end; max-width: 190px; padding: 7px 0 2px; text-align: right; }
.category-heading h3 { margin: 0; color: #f3f7fb; font-family: Arial, Helvetica, sans-serif; font-size: 24px; font-style: italic; font-weight: 700; line-height: .98; letter-spacing: .025em; text-shadow: 0 2px 10px rgba(0,0,0,.9); }
.category-match-count { position: absolute; top: 14px; right: 14px; overflow: hidden; color: #b9edff; font-family: Arial, Helvetica, sans-serif; font-size: 8px; font-style: italic; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; text-shadow: 0 0 8px rgba(109,231,255,.7); animation: match-count-pulse 1.8s ease-in-out infinite; }
.category-match-count::after { position: absolute; top: 0; bottom: 0; left: -45%; width: 30%; background: rgba(255,255,255,.55); content: ''; transform: skewX(-20deg); animation: match-count-sweep 2.8s ease-in-out infinite; }
.mode-battle-royale .category-card-copy h3 { color: #fff4d6; text-shadow: 0 2px 10px rgba(43,19,3,.95); }
.mode-battle-royale .category-match-count { color: #ffd36f; text-shadow: 0 0 9px rgba(255,180,54,.85); }
.mode-clash-squad .category-card-copy h3 { color: #e6f7ff; text-shadow: 0 2px 10px rgba(2,26,45,.95); }
.mode-clash-squad .category-match-count { color: #73d8ff; text-shadow: 0 0 9px rgba(38,177,255,.9); }
.mode-lone-wolf .category-card-copy h3 { color: #e8fbff; text-shadow: 0 2px 10px rgba(0,22,38,.95); }
.mode-lone-wolf .category-match-count { color: #75ecff; text-shadow: 0 0 9px rgba(50,213,255,.9); }
.category-kicker { color: #ff765b; font-family: var(--mono); font-size: 7px; letter-spacing: .16em; text-transform: uppercase; }
.match-category .match-grid { padding-top: 11px; }
.tournament-day { border: 1px solid rgba(105,200,255,.35); background: rgba(13,26,42,.34); box-shadow: none; }
.day-heading { padding: 17px 20px 16px; border-bottom-color: #24445e; background: #15283a; }
.day-heading h3 { color: #f6f2ec; font-family: var(--heading); font-size: 25px; letter-spacing: .01em; }
.day-heading span { padding: 9px 10px; border: 1px solid #5e3d3b; color: #ff765b; background: rgba(255,118,91,.03); font-family: var(--mono); font-size: 8px; letter-spacing: .1em; }
.match-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 11px 10px; padding: 10px 12px 13px; }
.scheduled-match { grid-template-columns: 42px minmax(0, 1fr) 88px 60px; min-height: 76px; padding: 11px 12px 11px 11px; border: 1px solid rgba(105,200,255,.35); background: rgba(16,29,44,.42); box-shadow: none; transform: none; }
.scheduled-match:hover { border-color: #4e9fe1; background: #132437; box-shadow: none; transform: none; }
.scheduled-match::before { display: none; }
.match-joined-light { position: absolute; z-index: 2; top: 8px; right: 8px; width: 8px; height: 8px; border: 2px solid #101d2c; border-radius: 50%; background: #71e58b; box-shadow: 0 0 11px rgba(113,229,139,.95); animation: joined-dot-blink 1.2s ease-in-out infinite; }
.scheduled-match .match-game-mark { width: 42px; height: 42px; border: 1px solid #a9574d; box-shadow: none; }
.scheduled-match h4 { margin-bottom: 8px; color: #f3eee8; font-family: var(--heading); font-size: 12px; text-align: center; }
.scheduled-match p { color: #8895a1; font-size: 8px; text-align: center; }
.scheduled-match time { color: #ffb33f; font-family: var(--mono); font-size: 10px; }
.match-meta { gap: 6px; }
.match-entry-fee { color: #f2be48; font-family: var(--mono); font-size: 8px; }
.match-capacity-badge { position: relative; display: inline-flex; align-items: center; justify-content: center; min-width: 76px; height: 20px; overflow: hidden; border: 1px solid rgba(103,214,255,.45); color: #bfeeff; background: rgba(5,18,29,.6); font-family: var(--mono); font-size: 7px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; white-space: nowrap; }
.match-capacity-badge::before { position: absolute; inset: 0 auto 0 0; width: var(--capacity-fill); background: rgba(54,163,235,.72); content: ''; transition: width .35s ease; }
.match-capacity-badge span { position: relative; z-index: 1; text-shadow: 0 1px 4px rgba(0,0,0,.9); }
.coin-icon { width: 10px; height: 10px; margin-right: 6px; }
.scheduled-match button { width: 60px; min-height: 46px; padding: 8px 0; border: 1px solid #4b9de4; color: #7ebdf3; background: transparent; font-family: var(--mono); font-size: 8px; letter-spacing: .08em; }
.scheduled-match button:hover:not(:disabled) { color: #07121e; background: #65b4f4; }
.scheduled-match .joined-button { border-color: #254e46; color: #9ab8a9; background: #28483e; }
.scheduled-match .joined-button:hover:not(:disabled) { color: #d8f0e4; background: #31594c; }
.tournament-section .match-grid .scheduled-match:nth-child(odd) { border-left-color: #4e9fe1; }
.tournament-section.has-expanded-mode .tournament-day,
.tournament-section.has-expanded-mode .scheduled-match,
.tournament-section.has-expanded-mode .date-heading { background: rgba(13,26,42,.28); backdrop-filter: blur(3px); }
.gaming-page { padding-top: 82px; }
.navbar { position: fixed; z-index: 20; top: 0; right: 0; left: 0; background: rgba(8,14,24,.42); backdrop-filter: blur(8px); }
@media (max-width: 760px) { .gaming-page { padding-top: 70px; }.navbar { position: fixed; } }
@media (max-width: 760px) {
  .tournament-section { padding: 16px 10px 24px; }
  .date-heading { padding: 14px; }
  .date-heading h3 { font-size: 20px; }
  .category-heading { padding: 11px 13px; }
  .category-thumbnail { width: 40px; height: 40px; }
  .category-heading h3 { font-size: 17px; }
  .match-grid { grid-template-columns: 1fr; padding: 9px; }
  .tournament-date-group { grid-template-columns: 1fr; }
  .tournament-date-group.is-detail-view { min-height: calc(100vh - 130px); }
}
  @keyframes joined-dot-blink { 0%, 100% { opacity: 1; transform: scale(1); } 50% { opacity: .35; transform: scale(.78); } }
  @keyframes player-count-blink { 0%, 100% { opacity: 1; box-shadow: 0 0 9px rgba(255,194,71,.95); } 50% { opacity: .25; box-shadow: 0 0 2px rgba(255,194,71,.3); } }
  @keyframes status-pulse-blink { 0%, 100% { opacity: 1; box-shadow: 0 0 12px rgba(255,194,71,.95); } 50% { opacity: .25; box-shadow: 0 0 2px rgba(255,194,71,.25); } }
@keyframes match-count-pulse { 0%, 100% { opacity: .7; transform: translateY(0); } 50% { opacity: 1; transform: translateY(-1px); } }
@keyframes match-count-sweep { 0%, 55% { left: -45%; } 75%, 100% { left: 130%; } }

/* Additional depth without changing the original visual language */
.nav-showcase { background-position: center; }
.nav-showcase::before { display: block; top: 18%; right: 7%; bottom: 18%; width: 1px; background: rgba(255,118,91,.22); content: ''; }
.nav-showcase::after { right: 7%; width: 28%; background: repeating-linear-gradient(0deg, transparent 0 31px, rgba(255,255,255,.035) 32px 33px); opacity: .65; }
.nav-showcase h1 { max-width: 700px; }

/* Free Fire artwork theme */
body { background: #07111c; }
.gaming-page { background: #07111c; }
.navbar { background: rgba(5,14,25,.48); border-bottom-color: rgba(255,194,71,.22); }
.navbar::after { background: #ffc247; box-shadow: 0 0 14px rgba(255,194,71,.55); }
.brand-dot, .brand-mark i { color: #ffc247; background: #ffc247; }
.nav-link:hover, .nav-link.active { color: #ffc247; }
.nav-link.active::after { background: #ffc247; box-shadow: 0 0 14px rgba(255,194,71,.65); }
.live-dot { color: #ffc247; border-color: rgba(255,194,71,.5); }
.coin-balance { border-color: rgba(255,194,71,.38); background: rgba(255,194,71,.08); }
.avatar { border-color: #67d6ff; color: #67d6ff; background: rgba(103,214,255,.12); }
.nav-showcase { background: linear-gradient(90deg, rgba(4,12,22,.95) 0%, rgba(4,12,22,.72) 34%, rgba(4,12,22,.18) 76%, rgba(4,12,22,.58) 100%), linear-gradient(0deg, rgba(4,12,22,.55), transparent 55%), url('/assets/freefire-D8NNVa7o.png') center / cover; }
.nav-showcase::before { background: linear-gradient(135deg, transparent 0 48%, rgba(255,194,71,.24) 48.2%, transparent 48.5%), repeating-linear-gradient(120deg, transparent 0 54px, rgba(103,214,255,.045) 55px 56px); }
.nav-showcase::after { background: linear-gradient(90deg, transparent, rgba(255,194,71,.55), transparent) 0 100% / 100% 1px no-repeat; }
.eyebrow, .secondary-cta { color: #ffc247; }
.eyebrow span, .status-pulse { background: #ffc247; box-shadow: 0 0 12px rgba(255,194,71,.9); }
.nav-showcase h1 em { color: #ffc247; -webkit-text-stroke-color: #ffc247; filter: drop-shadow(0 0 8px rgba(255,194,71,.35)); }
.primary-cta { color: #171008; background: #ffc247; box-shadow: 0 9px 24px rgba(255,194,71,.28); }
.primary-cta:hover { background: #ffda78; box-shadow: 0 12px 28px rgba(255,194,71,.42); }
.showcase-copy { border-left-color: rgba(255,194,71,.6); }
.status-bar { border-color: rgba(103,214,255,.24); }
.library-section, .tournament-section { background: linear-gradient(180deg, #0b1928, #07111c); border-top-color: rgba(103,214,255,.18); }
.library-section::before, .tournament-section::before { background: #ffc247; box-shadow: 0 0 10px rgba(255,194,71,.5); }
.tournament-badge { border-color: rgba(255,194,71,.45); color: #ffc247; background: rgba(255,194,71,.07); }
.tournament-badge:hover { background: rgba(255,194,71,.14); }
.scheduled-match button, .coin-custom-form .auth-submit, .withdraw-form .auth-submit { border-color: #ffc247; color: #ffc247; }
.scheduled-match button:hover, .coin-custom-form .auth-submit:hover, .withdraw-form .auth-submit:hover { color: #171008; background: #ffc247; }
.auth-modal, .wallet-modal { border-color: rgba(103,214,255,.32); background: linear-gradient(145deg, #132b3e, #081521); }

.primary-cta {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  transition: transform .22s ease, background .22s ease, box-shadow .22s ease;
}
.primary-cta::before {
  position: absolute;
  z-index: -1;
  top: 0;
  bottom: 0;
  left: -45%;
  width: 28%;
  background: rgba(255, 255, 255, .48);
  content: '';
  transform: skewX(-20deg);
  transition: left .45s ease;
}
.primary-cta span { display: inline-block; transition: transform .22s ease; }
.primary-cta:hover {
  background: #ffe08a;
.admin-toolbar input, .admin-card input, .admin-card textarea, .admin-login input { width: 100%; border: 1px solid #373841; padding: 11px 12px; outline: 0; color: #f5f1eb; background: #0e0f14; font-family: var(--mono); font-size: 12px; }.admin-card textarea { resize: vertical; }
  transform: translateY(-3px) scale(1.02);
}
.primary-cta:hover::before { left: 125%; }
.primary-cta:hover span { transform: translateX(6px); }
.primary-cta:active { transform: translateY(-1px) scale(.99); }

@media (max-width: 760px) {
  .gaming-page { padding-top: 70px; }
  .navbar {
    position: fixed;
    z-index: 50;
    top: 0;
    right: 0;
    left: 0;
    display: flex;
    min-height: 70px;
    padding: 0 16px;
    background: rgba(7, 17, 28, .96);
    border-bottom: 1px solid rgba(103, 214, 255, .28);
  }
  .brand { display: inline-flex; visibility: visible; opacity: 1; }
  .menu-toggle {
    z-index: 2;
    display: grid;
    width: 36px;
    height: 36px;
    margin-left: auto;
    padding: 8px;
    gap: 4px;
    border: 1px solid rgba(103, 214, 255, .35);
    background: rgba(103, 214, 255, .08);
  }
  .menu-toggle span:not(.sr-only) { display: block; width: 20px; height: 2px; background: #ffc247; }
  .nav-content {
    position: absolute;
    z-index: 51;
    top: 70px;
    right: 10px;
    left: 10px;
    display: none;
    width: auto;
    margin: 0;
    padding: 10px;
    border: 1px solid rgba(103, 214, 255, .3);
    background: rgba(7, 17, 28, .99);
    box-shadow: 0 18px 40px rgba(0, 0, 0, .45);
  }
  .nav-content.is-open { display: block; }
  .nav-links { display: grid; gap: 2px; }
  .nav-link { display: block; padding: 13px 12px; color: #c0ccd4; }
  .nav-link.active, .nav-link:hover { color: #ffc247; background: rgba(103, 214, 255, .08); }
  .nav-actions { display: flex; justify-content: stretch; gap: 8px; margin-top: 8px; padding-top: 10px; border-top: 1px solid rgba(103, 214, 255, .16); }
  .nav-actions .coin-balance, .nav-actions .profile-button { flex: 1; justify-content: center; min-height: 36px; }
}

.auth-backdrop { z-index: 100; }

.profile-modal {
  width: min(100%, 560px);
  max-height: calc(100vh - 32px);
  overflow-y: auto;
}

@media (max-width: 760px) {
  .auth-backdrop {
    align-items: flex-start;
    overflow-y: auto;
    padding: 18px;
    background: rgba(4, 5, 8, .68);
  }
  .auth-modal,
  .profile-modal {
    width: min(100%, 350px);
    max-height: calc(100dvh - 20px);
    margin: 0;
    overflow-y: auto;
  }
  .profile-modal { width: min(100%, 320px); padding: 23px 11px 14px; }
  .profile-hero { align-items: flex-start; gap: 7px; margin: 12px 0 8px; padding: 10px 8px; }
  .profile-avatar-large { flex: 0 0 38px; width: 38px; height: 38px; font-size: 11px; }
  .profile-hero h2 { max-width: 130px; overflow-wrap: anywhere; font-size: 17px; }
  .profile-hero p { font-size: 8px; }
  .profile-status { top: 8px; right: 8px; font-size: 7px; }
  .profile-stats { margin-bottom: 11px; }
  .profile-stats div { padding: 7px 4px; }
  .profile-contact { gap: 6px; margin-bottom: 12px; padding: 9px; }
  .profile-contact div { align-items: flex-start; flex-direction: column; gap: 3px; }
  .profile-contact strong { max-width: 100%; white-space: normal; overflow-wrap: anywhere; }
}

/* Broadcast glass direction: keep the layout, unify every surface with the artwork */
body { background: #050b12 url('/assets/freefire-D8NNVa7o.png') center / cover fixed; }
.gaming-page { min-height: 100vh; background: linear-gradient(rgba(4,10,17,.72), rgba(4,10,17,.88)), url('/assets/freefire-D8NNVa7o.png') center / cover fixed; }
.navbar { background: rgba(4,10,17,.3); border-bottom-color: rgba(255,194,71,.28); box-shadow: 0 8px 28px rgba(0,0,0,.2); }
.nav-showcase { background: linear-gradient(90deg, rgba(4,10,17,.82), rgba(4,10,17,.42) 52%, rgba(4,10,17,.62)), url('/assets/freefire-D8NNVa7o.png') center / cover; }
.library-section, .tournament-section { background: rgba(5,14,24,.48); backdrop-filter: blur(5px); }
.game-card, .match-history-row, .tournament-day, .scheduled-match { background: rgba(7,19,31,.45); border-color: rgba(103,214,255,.3); box-shadow: inset 0 1px rgba(255,255,255,.08), 0 14px 30px rgba(0,0,0,.2); }
.date-heading, .day-heading { background: rgba(8,22,35,.42); }
.scheduled-match:hover { background: rgba(14,39,55,.58); border-color: rgba(255,194,71,.75); }
.tournament-section.has-expanded-mode { background-color: transparent; }
.tournament-section.has-expanded-mode .tournament-day,
.tournament-section.has-expanded-mode .scheduled-match,
.tournament-section.has-expanded-mode .date-heading { background: rgba(7,19,31,.3); }
.tournament-badge, .coin-balance, .profile-button { background: rgba(5,18,29,.3); }
.auth-modal, .wallet-modal, .join-confirm-modal { background: rgba(7,19,31,.82); backdrop-filter: blur(14px); }
.nav-actions { gap: 7px; }
.nav-actions .icon-button { margin-right: -2px; }
.nav-content { width: auto; gap: 12px; margin-left: auto; justify-content: flex-start; }
.nav-links { gap: 16px; }
.nav-actions { gap: 5px; margin-left: 12px; }
.navbar { width: 100%; max-width: none; padding-inline: clamp(16px, 4vw, 58px); }
.brand { flex: 0 0 auto; }
.nav-content { flex: 1 1 auto; width: auto; min-width: 0; margin-left: clamp(18px, 4vw, 58px); gap: clamp(12px, 2vw, 28px); }
.nav-links { flex: 1 1 auto; justify-content: center; gap: clamp(12px, 2vw, 28px); }
.nav-actions { flex: 0 0 auto; margin-left: 0; }
@media (max-width: 1050px) { .nav-content { margin-left: 18px; }.nav-links { gap: 12px; } }
@media (max-width: 760px) { .navbar { width: 100%; padding-inline: 20px; }.nav-content { flex: initial; margin-left: 0; }.nav-links { justify-content: initial; } }
.showcase-actions { align-items: stretch; }
.secondary-cta { display: inline-flex; align-items: center; }
.library-section, .tournament-section { position: relative; }
.library-section::before, .tournament-section::before { position: absolute; top: 0; left: 58px; width: 46px; height: 2px; background: #ff765b; content: ''; }
.match-history-row, .scheduled-match { position: relative; }
.joined-history-row { cursor: pointer; }
.joined-history-row:hover { border-color: rgba(255,194,71,.72); background: rgba(14,39,55,.58); }
.history-sections { display: grid; gap: 28px; }
.history-group { display: grid; gap: 10px; }
.history-group-title { margin: 0; color: #ffc247; font-family: var(--mono); font-size: 10px; letter-spacing: .16em; }
.match-history-row::after { position: absolute; top: 0; right: 16px; width: 26px; height: 1px; background: rgba(255,118,91,.55); content: ''; }
.wallet-tabs button, .payment-methods button, .signup-methods button { transition: color .2s ease, border-color .2s ease, background .2s ease; }
.wallet-tabs button.selected, .payment-methods button.selected, .signup-methods button.selected { box-shadow: inset 0 -2px #ff765b; }
.coin-packages button { transition: border-color .2s ease, background .2s ease, transform .2s ease; }
.coin-packages button:hover { background: #202028; }
@media (max-width: 760px) { .nav-showcase::before { right: 20px; top: 20%; bottom: 20%; }.nav-showcase::after { right: 20px; width: 38%; }.library-section::before, .tournament-section::before { left: 20px; }.match-history-row::after { right: 12px; } }

/* Blue arena variation */
body { background: #080e18; }
.gaming-page { background: radial-gradient(circle at 78% 24%, rgba(45,126,218,.2), transparent 28%), linear-gradient(135deg, #080e18 0%, #0d1523 54%, #111522 100%); }
.navbar { background: rgba(8,14,24,.78); border-bottom-color: rgba(105,200,255,.16); }
.navbar::after { background: #4d9dff; box-shadow: 0 0 14px rgba(77,157,255,.45); }
.brand { text-shadow: 0 0 20px rgba(105,200,255,.2); }
.brand-dot, .brand-mark i { color: #4d9dff; background: #4d9dff; }
.nav-link:hover, .nav-link.active { color: #69c8ff; }
.nav-link.active::after { background: #4d9dff; box-shadow: 0 0 14px rgba(77,157,255,.65); }
.live-dot { color: #69c8ff; border-color: rgba(105,200,255,.45); }
.coin-balance { border-color: rgba(105,200,255,.24); background: rgba(105,200,255,.05); }
.profile-button { border-left-color: rgba(105,200,255,.18); }
.avatar { border-color: #69c8ff; color: #69c8ff; background: rgba(77,157,255,.14); }
.nav-showcase { background: linear-gradient(90deg, rgba(8,14,24,.98) 0%, rgba(8,14,24,.86) 35%, rgba(8,14,24,.28) 78%, rgba(8,14,24,.7) 100%), linear-gradient(0deg, rgba(8,14,24,.45), transparent 55%), url('/assets/image_10d29343-oYB7uswS.jpg') center / cover; }
.nav-showcase::before { background: rgba(105,200,255,.24); }
.nav-showcase::after { background: repeating-linear-gradient(0deg, transparent 0 31px, rgba(105,200,255,.055) 32px 33px); }
.eyebrow, .secondary-cta { color: #69c8ff; }
.eyebrow span, .status-pulse { background: #4d9dff; box-shadow: 0 0 12px rgba(77,157,255,.8); }
.nav-showcase h1 em { -webkit-text-stroke-color: #69c8ff; text-shadow: 0 0 18px rgba(105,200,255,.18); }
.primary-cta { color: #07101b; background: #69c8ff; box-shadow: 0 9px 24px rgba(77,157,255,.24); }
.primary-cta:hover { background: #a4e1ff; box-shadow: 0 12px 28px rgba(77,157,255,.38); }
.showcase-copy { border-left-color: rgba(105,200,255,.5); }
.status-bar { border-color: rgba(105,200,255,.18); }
.library-section, .tournament-section { background: linear-gradient(180deg, #0d1521, #0a1019); border-top-color: rgba(105,200,255,.15); }
.library-section::before, .tournament-section::before { background: #4d9dff; box-shadow: 0 0 10px rgba(77,157,255,.45); }
.section-heading h2, .tournament-heading h2 { text-shadow: 0 0 20px rgba(105,200,255,.12); }
.game-card, .match-history-row, .tournament-day, .scheduled-match { border-color: rgba(105,200,255,.16); background: #121d2b; }
.game-card:hover, .match-history-row:hover, .scheduled-match:hover { border-color: rgba(105,200,255,.62); }
.match-history-row::after, .scheduled-match:hover::before { background: #4d9dff; }
.tournament-badge { border-color: rgba(105,200,255,.38); color: #69c8ff; background: rgba(105,200,255,.05); }
.tournament-badge:hover { background: rgba(105,200,255,.12); }
.day-heading { background: linear-gradient(90deg, rgba(105,200,255,.08), transparent 66%); }
.scheduled-match button, .coin-custom-form .auth-submit, .withdraw-form .auth-submit { border-color: #4d9dff; color: #69c8ff; }
.scheduled-match button:hover, .coin-custom-form .auth-submit:hover, .withdraw-form .auth-submit:hover { color: #07101b; background: #69c8ff; }
.auth-modal, .wallet-modal { border-color: rgba(105,200,255,.28); background: linear-gradient(145deg, #142235, #0c141f); }
@media (max-width: 760px) { .navbar { background: rgba(8,14,24,.92); }.nav-content { background: rgba(10,18,30,.98); border-bottom-color: rgba(105,200,255,.2); }.nav-showcase { background-position: 58% center; } }

/* Final schedule reference finish */
.tournament-section { max-width: 1040px; min-height: 100vh; margin: 0 auto; padding: 24px 14px 32px; background: #0b1523; }
.tournament-section > .library-back, .tournament-section > .tournament-heading { display: none; }
.tournament-days { gap: 18px; }
.tournament-day { border: 1px solid #203c55; background: #0d1a2a; box-shadow: none; }
.day-heading { padding: 17px 20px 16px; border-bottom-color: #24445e; background: #15283a; }
.day-heading h3 { color: #f6f2ec; font-family: var(--heading); font-size: 25px; letter-spacing: .01em; }
.day-heading span { padding: 9px 10px; border: 1px solid #5e3d3b; color: #ff765b; background: rgba(255,118,91,.03); font-family: var(--mono); font-size: 8px; letter-spacing: .1em; }
.match-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 11px 10px; padding: 10px 12px 13px; }
.scheduled-match { grid-template-columns: 42px minmax(0, 1fr) 88px 60px; min-height: 76px; padding: 11px 12px 11px 11px; border: 1px solid #24435d; background: #101d2c; box-shadow: none; transform: none; }
.scheduled-match:hover { border-color: #4e9fe1; background: #132437; box-shadow: none; transform: none; }
.scheduled-match::before { display: none; }
.scheduled-match .match-game-mark { width: 42px; height: 42px; border: 1px solid #a9574d; box-shadow: none; }
.scheduled-match h4 { margin-bottom: 8px; color: #f3eee8; font-family: var(--heading); font-size: 12px; text-align: center; }
.scheduled-match p { color: #8895a1; font-size: 8px; text-align: center; }
.scheduled-match time { color: #ffb33f; font-family: var(--mono); font-size: 10px; }
.match-meta { gap: 6px; }
.match-entry-fee { color: #f2be48; font-family: var(--mono); font-size: 8px; }
.scheduled-match button { width: 60px; min-height: 46px; padding: 8px 0; border: 1px solid #4b9de4; color: #7ebdf3; background: transparent; font-family: var(--mono); font-size: 8px; letter-spacing: .08em; }
.scheduled-match button:hover:not(:disabled) { color: #07121e; background: #65b4f4; }
.scheduled-match .joined-button { border-color: #254e46; color: #9ab8a9; background: #28483e; }
.scheduled-match .joined-button:hover:not(:disabled) { color: #d8f0e4; background: #31594c; }
.tournament-section .match-grid .scheduled-match:nth-child(odd) { border-left-color: #4e9fe1; }
@media (max-width: 760px) {
  .tournament-section { padding: 16px 10px 24px; }
  .match-grid { grid-template-columns: 1fr; padding: 9px; }
  .day-heading { padding: 14px; }
  .day-heading h3 { font-size: 20px; }
}

/* Free Fire artwork theme */
body { background: #07111c; }
.gaming-page { background: #07111c; }
.navbar { background: rgba(5,14,25,.48); border-bottom-color: rgba(255,194,71,.22); }
.navbar::after { background: #ffc247; box-shadow: 0 0 14px rgba(255,194,71,.55); }
.brand-dot { color: #ffc247; background: none; }
.brand-mark i { background: #ffc247; }
.nav-link:hover, .nav-link.active { color: #ffc247; }
.nav-link.active::after { background: #ffc247; box-shadow: 0 0 14px rgba(255,194,71,.65); }
.live-dot { color: #ffc247; border-color: rgba(255,194,71,.5); }
.coin-balance { border-color: rgba(255,194,71,.38); background: rgba(255,194,71,.08); }
.avatar { border-color: #67d6ff; color: #67d6ff; background: rgba(103,214,255,.12); }
.nav-showcase { background: linear-gradient(90deg, rgba(4,12,22,.95) 0%, rgba(4,12,22,.72) 34%, rgba(4,12,22,.18) 76%, rgba(4,12,22,.58) 100%), linear-gradient(0deg, rgba(4,12,22,.55), transparent 55%), url('/assets/freefire-D8NNVa7o.png') center / cover; }
.nav-showcase::before { background: linear-gradient(135deg, transparent 0 48%, rgba(255,194,71,.24) 48.2%, transparent 48.5%), repeating-linear-gradient(120deg, transparent 0 54px, rgba(103,214,255,.045) 55px 56px); }
.nav-showcase::after { background: linear-gradient(90deg, transparent, rgba(255,194,71,.55), transparent) 0 100% / 100% 1px no-repeat; }
.eyebrow, .secondary-cta { color: #ffc247; }
.eyebrow span, .status-pulse { background: #ffc247; box-shadow: 0 0 12px rgba(255,194,71,.9); }
.nav-showcase h1 em { -webkit-text-stroke-color: #67d6ff; filter: drop-shadow(0 0 8px rgba(103,214,255,.3)); }
.primary-cta { color: #171008; background: #ffc247; box-shadow: 0 9px 24px rgba(255,194,71,.28); }
.primary-cta:hover { background: #ffda78; box-shadow: 0 12px 28px rgba(255,194,71,.42); }
.showcase-copy { border-left-color: rgba(255,194,71,.6); }
.status-bar { border-color: rgba(103,214,255,.24); }
.library-section, .tournament-section { background: linear-gradient(180deg, #0b1928, #07111c); border-top-color: rgba(103,214,255,.18); }
.library-section::before, .tournament-section::before { background: #ffc247; box-shadow: 0 0 10px rgba(255,194,71,.5); }
.tournament-badge { border-color: rgba(255,194,71,.45); color: #ffc247; background: rgba(255,194,71,.07); }
.tournament-badge:hover { background: rgba(255,194,71,.14); }
.scheduled-match button, .coin-custom-form .auth-submit, .withdraw-form .auth-submit { border-color: #ffc247; color: #ffc247; }
.scheduled-match button:hover, .coin-custom-form .auth-submit:hover, .withdraw-form .auth-submit:hover { color: #171008; background: #ffc247; }
.auth-modal, .wallet-modal { border-color: rgba(103,214,255,.32); background: linear-gradient(145deg, #132b3e, #081521); }

/* Admin desk: alerts, review queues and user lookup */
.admin-alerts { position: relative; }
.admin-header-actions .admin-bell { position: relative; display: inline-flex; align-items: center; gap: 7px; }
.admin-header-actions .admin-bell.has-unread { border-color: #f7d889; color: #f7d889; animation: admin-bell-pulse 1.6s ease-in-out infinite; }
.admin-badge, .admin-tab-count { display: inline-grid; place-items: center; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 9px; color: #171216; background: #f7d889; font-family: var(--mono); font-size: 10px; font-weight: 800; letter-spacing: 0; }
.admin-tab-count { margin-left: 6px; min-width: 16px; height: 16px; font-size: 9px; }
@keyframes admin-bell-pulse { 50% { box-shadow: 0 0 0 4px rgba(247,216,137,.14); } }
@media (prefers-reduced-motion: reduce) { .admin-header-actions .admin-bell.has-unread { animation: none; } }
.admin-alert-panel { position: absolute; top: calc(100% + 8px); right: 0; z-index: 40; width: min(380px, calc(100vw - 32px)); max-height: 70vh; overflow-y: auto; border: 1px solid rgba(255,255,255,.14); background: #0e131b; box-shadow: 0 18px 50px rgba(0,0,0,.55); }
.admin-alert-head { position: sticky; top: 0; display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 12px 14px; border-bottom: 1px solid rgba(255,255,255,.1); background: #0e131b; }
.admin-alert-head strong { color: #f5f1eb; font-size: 12px; letter-spacing: .08em; text-transform: uppercase; }
.admin-alert-head div { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 6px; }
.admin-header-actions .admin-alert-head button { padding: 6px 8px; }
.admin-alert-hint { margin: 0; padding: 10px 14px; color: #8d929c; font-size: 10px; }
.admin-alert-panel ul { margin: 0; padding: 0; list-style: none; }
.admin-header-actions .admin-alert-panel li button { display: grid; grid-template-columns: auto 1fr auto; gap: 4px 10px; width: 100%; padding: 12px 14px; border: 0; border-bottom: 1px solid rgba(255,255,255,.06); color: #b9bec7; background: transparent; font-size: 11px; font-weight: 400; letter-spacing: 0; text-align: left; text-transform: none; }
.admin-header-actions .admin-alert-panel li button:hover { color: #f5f1eb; background: rgba(255,118,91,.08); }
.admin-alert-panel li button.is-unread { background: rgba(247,216,137,.05); box-shadow: inset 3px 0 0 #f7d889; }
.admin-alert-panel li strong { color: #f5f1eb; font-size: 12px; }
.admin-alert-panel li small { grid-column: 2 / -1; color: #9297a1; font-family: var(--mono); font-size: 10px; word-break: break-all; }
.admin-alert-panel li time { color: #77767e; font-size: 10px; white-space: nowrap; }
.admin-alert-type { align-self: start; padding: 2px 6px; border: 1px solid currentColor; font-size: 8px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.admin-alert-type.is-payment { color: #8fc99b; }
.admin-alert-type.is-withdrawal { color: #f7d889; }
.admin-alert-empty { padding: 18px 14px; color: #8d929c; font-size: 11px; line-height: 1.5; }

.admin-toasts { position: fixed; top: 92px; right: 16px; z-index: 60; display: grid; gap: 8px; width: min(360px, calc(100vw - 32px)); }
.admin-toast { display: flex; align-items: stretch; border: 1px solid rgba(143,201,155,.5); background: #0e131b; box-shadow: 0 14px 40px rgba(0,0,0,.5); animation: admin-toast-in .25s ease-out; }
.admin-toast.is-withdrawal, .admin-toast.is-info { border-color: rgba(247,216,137,.5); }
.admin-toast > button:first-child { display: grid; flex: 1; gap: 4px; padding: 12px 14px; border: 0; color: #b9bec7; background: transparent; font-size: 11px; text-align: left; cursor: pointer; }
.admin-toast strong { color: #f5f1eb; font-size: 12px; }
.admin-toast span { font-family: var(--mono); font-size: 10px; word-break: break-all; }
.admin-toast-close { padding: 0 12px; border: 0; border-left: 1px solid rgba(255,255,255,.08); color: #8d929c; background: transparent; font-size: 16px; cursor: pointer; }
.admin-toast-close:hover { color: #f5f1eb; }
@keyframes admin-toast-in { from { opacity: 0; transform: translateY(-6px); } }

.admin-summary > button { display: grid; gap: 7px; padding: 16px; border: 1px solid rgba(255,255,255,.12); background: rgba(255,255,255,.035); text-align: left; cursor: pointer; }
.admin-summary > button:hover { border-color: #ff765b; }
.admin-summary > button.needs-review { border-color: rgba(247,216,137,.55); background: rgba(247,216,137,.06); }

.admin-filter-row { display: flex; gap: 6px; margin-bottom: 12px; }
.admin-filter-row button { border: 1px solid rgba(255,255,255,.14); padding: 7px 10px; color: #9fa2a9; background: transparent; font-size: 9px; text-transform: uppercase; cursor: pointer; }
.admin-filter-row button.selected, .admin-filter-row button:hover { border-color: #f7d889; color: #f7d889; }

.admin-review-card { margin-bottom: 14px; }
.admin-table-card tbody tr.is-clickable { cursor: pointer; }
.admin-table-card tbody tr.is-clickable:hover td { color: #ffad99; }
.admin-table-card tbody tr.is-highlighted td { background: rgba(247,216,137,.08); }
.admin-status { display: inline-block; padding: 3px 7px; border: 1px solid currentColor; font-size: 8px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.admin-status.is-pending { color: #f7d889; }
.admin-status.is-approved, .admin-status.is-active, .admin-status.is-online { color: #8fc99b; }
.admin-status.is-rejected, .admin-status.is-inactive { color: #e98778; }
.admin-status.is-offline { color: #77767e; }
.admin-utr { color: #f5f1eb; font-family: var(--mono); font-size: 11px; }
.admin-copy, .admin-user-link { border: 0; padding: 0; background: transparent; font: inherit; cursor: pointer; }
.admin-copy { margin-left: 8px; color: #8d929c; font-size: 9px; text-decoration: underline; }
.admin-copy:hover { color: #f5f1eb; }
.admin-user-link { color: #ffad99; text-decoration: underline; text-underline-offset: 2px; }
.admin-user-link:hover { color: #f5f1eb; }
.admin-review-buttons { display: inline-flex; gap: 6px; }
.admin-review-buttons button { padding: 6px 9px; border: 1px solid; background: transparent; font-size: 9px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; cursor: pointer; }
.admin-review-buttons .is-approve { border-color: #8fc99b; color: #8fc99b; }
.admin-review-buttons .is-approve:hover { color: #0d1410; background: #8fc99b; }
.admin-review-buttons .is-reject { border-color: #e98778; color: #e98778; }
.admin-review-buttons .is-reject:hover { color: #171216; background: #e98778; }
.admin-review-buttons button:disabled, .admin-adjust-buttons button:disabled { opacity: .5; cursor: wait; }

.admin-user-lookup .admin-lookup-row { margin-top: 14px; }
.admin-page > .admin-user-lookup { margin-bottom: 14px; }
.admin-user-detail { margin-bottom: 14px; border: 1px solid rgba(247,216,137,.35); padding: 20px; background: rgba(12,18,26,.92); }
.admin-user-detail .admin-card-heading { align-items: flex-start; flex-wrap: wrap; }
.admin-user-detail h2 { margin: 0 0 8px; color: #f5f1eb; font-family: var(--heading); font-size: 28px; }
.admin-user-detail .admin-card-heading > div > span { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.admin-user-detail code { color: #b9bec7; font-family: var(--mono); font-size: 11px; }
.admin-inline-actions { display: flex; flex-wrap: wrap; gap: 6px; }
.admin-inline-actions button, .admin-subtabs button, .admin-wallet-toggle button { border: 1px solid rgba(255,255,255,.16); padding: 8px 10px; color: #b9bec7; background: transparent; font-size: 9px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; cursor: pointer; }
.admin-inline-actions button:hover, .admin-subtabs button:hover, .admin-subtabs button.selected, .admin-wallet-toggle button:hover { border-color: #ff765b; color: #ffad99; }
.admin-user-facts { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin: 0 0 16px; }
.admin-user-facts div { min-width: 0; }
.admin-user-facts dt { color: #8d929c; font-size: 9px; letter-spacing: .1em; text-transform: uppercase; }
.admin-user-facts dd { margin: 4px 0 0; overflow: hidden; color: #f5f1eb; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.admin-user-columns { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 18px; margin-bottom: 18px; }
.admin-balance-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: 8px; margin-bottom: 8px; }
.admin-balance-grid div { display: grid; gap: 5px; padding: 12px; border: 1px solid rgba(231,185,94,.3); background: rgba(231,185,94,.05); }
.admin-balance-grid span { color: #aaa6aa; font-size: 9px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.admin-balance-grid strong { color: #f7d889; font-family: var(--mono); font-size: 22px; }
.admin-balance-grid small { color: #77767e; font-size: 9px; }
.admin-balance-grid.is-muted div { border-color: rgba(255,255,255,.1); background: rgba(255,255,255,.025); }
.admin-balance-grid.is-muted strong { color: #f5f1eb; font-size: 16px; }
.admin-adjust-form { display: grid; align-content: start; gap: 10px; padding: 14px; border: 1px solid rgba(255,255,255,.12); background: rgba(255,255,255,.025); }
.admin-adjust-form h3 { margin: 0; color: #ffad99; font-size: 11px; letter-spacing: .1em; text-transform: uppercase; }
.admin-adjust-form label { display: grid; gap: 6px; color: #b9bec7; font-size: 10px; text-transform: uppercase; }
.admin-adjust-form input { width: 100%; border: 1px solid #373841; padding: 10px 12px; outline: 0; color: #f5f1eb; background: #0e0f14; font-family: var(--mono); font-size: 12px; }
.admin-adjust-form input:focus, .admin-card input:focus { border-color: #ff765b; }
.admin-wallet-toggle { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.admin-wallet-toggle button.selected { border-color: #f7d889; color: #171216; background: #f7d889; }
.admin-adjust-buttons { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.admin-adjust-buttons button { padding: 11px; border: 1px solid; font-size: 10px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; cursor: pointer; }
.admin-adjust-buttons .is-add { border-color: #8fc99b; color: #0d1410; background: #8fc99b; }
.admin-adjust-buttons .is-deduct { border-color: #e98778; color: #e98778; background: transparent; }
.admin-adjust-buttons .is-deduct:hover { color: #171216; background: #e98778; }
.admin-form-error { margin: 0; color: #e98778; font-size: 11px; }
.admin-subtabs { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 10px; }
.admin-user-detail table { width: 100%; min-width: 620px; border-collapse: collapse; }
.admin-user-detail th, .admin-user-detail td { padding: 10px; border-bottom: 1px solid rgba(255,255,255,.08); color: #b9bec7; font-size: 10px; text-align: left; white-space: nowrap; }
.admin-user-detail th { color: #ffad99; font-size: 9px; letter-spacing: .08em; text-transform: uppercase; }
.admin-amount-plus { color: #8fc99b !important; font-family: var(--mono); font-weight: 700; }
.admin-amount-minus { color: #e98778 !important; font-family: var(--mono); font-weight: 700; }
@media (max-width: 900px) { .admin-user-columns { grid-template-columns: 1fr; } .admin-user-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 760px) { .admin-header-actions { flex-wrap: wrap; } .admin-alert-panel { position: fixed; top: 80px; right: 16px; left: 16px; width: auto; } .admin-user-detail { padding: 14px; } }

/* Player wallet: top-up history */
.wallet-history { display: grid; gap: 6px; margin-top: 16px; }
.wallet-history h3 { margin: 0 0 2px; color: #aaa6aa; font-size: 9px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.wallet-history-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2px 10px; padding: 9px 11px; border: 1px solid rgba(255,255,255,.1); background: rgba(255,255,255,.025); }
.wallet-history-row strong { color: #f7d889; font-family: var(--mono); font-size: 12px; }
.wallet-history-row small { overflow: hidden; color: #77767e; font-family: var(--mono); font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.wallet-history-row em { grid-row: span 2; align-self: center; padding: 3px 7px; border: 1px solid currentColor; font-size: 8px; font-style: normal; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.wallet-history-row em.is-pending { color: #f7d889; }
.wallet-history-row em.is-approved { color: #8fc99b; }
.wallet-history-row em.is-rejected { color: #e98778; }
.wallet-history-row p { grid-column: 1 / -1; margin: 2px 0 0; color: #e98778; font-size: 10px; }

/* Join flow on phones: the popups sit above the fixed mobile navbar, and scroll when they are
   taller than the screen (long match briefing, squad names, open keyboard), so the buttons stay reachable. */
.join-confirm-backdrop { z-index: 120; display: flex; align-items: flex-start; justify-content: center; overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch; }
.join-confirm-backdrop > .join-confirm-modal { flex-shrink: 0; margin: auto; }
.join-confirm-players { max-height: none; overflow: visible; }
.join-confirm-field input { font-size: 16px; }
.join-confirm-primary:disabled { opacity: .6; cursor: wait; }
.scheduled-match .match-action { min-width: 0; }
.scheduled-match button { touch-action: manipulation; }
.scheduled-match button:disabled { opacity: .5; cursor: not-allowed; }
@media (max-width: 760px) {
  .join-confirm-backdrop { padding: 16px 12px calc(16px + env(safe-area-inset-bottom)); }
  .join-confirm-actions button { min-height: 44px; }
}

/* Player notices: join results and closed matches */
.app-notice { position: fixed; z-index: 130; right: 16px; bottom: calc(16px + env(safe-area-inset-bottom)); left: 16px; display: flex; align-items: flex-start; gap: 12px; max-width: 460px; margin: 0 auto; padding: 13px 14px; border: 1px solid rgba(105,200,255,.45); color: #eef6fb; background: rgba(8,18,30,.97); box-shadow: 0 18px 40px rgba(0,0,0,.45); font-size: 13px; line-height: 1.45; }
.app-notice span { flex: 1; }
.app-notice button { flex: none; width: 28px; height: 28px; border: 1px solid rgba(255,255,255,.18); color: inherit; background: transparent; font-size: 18px; line-height: 1; cursor: pointer; }
.app-notice.is-success { border-color: rgba(143,201,155,.7); }
.app-notice.is-error { border-color: rgba(233,135,120,.75); }
.match-details-modal .match-detail-header { padding-right: 40px; }
.join-confirm-close { z-index: 2; }
.profile-form-hint { display: block; margin: -4px 0 4px; color: #8895a1; font-size: 11px; line-height: 1.4; }