/* RefGame Premium UI v3
   RefGo-inspired hierarchy, redesigned for tournament operations. */
:root{
  --rg-navy:#091c31;
  --rg-navy-2:#0f2f50;
  --rg-blue:#174d7c;
  --rg-red:#e31d2d;
  --rg-red-soft:#fff1f3;
  --rg-ink:#17202b;
  --rg-text:#283544;
  --rg-muted:#778391;
  --rg-line:#e7ebef;
  --rg-bg:#f4f6f8;
  --rg-card:#ffffff;
  --rg-shadow:0 10px 34px rgba(17,34,53,.055);
}
html,body{background:var(--rg-bg);color:var(--rg-ink)}
body{font-family:Inter,-apple-system,BlinkMacSystemFont,"SF Pro Display","PingFang SC","Microsoft YaHei",Arial,sans-serif}
button,input,select,textarea{font-family:inherit}
.eyebrow{color:var(--rg-red)!important;font-size:9px!important;font-weight:900!important;letter-spacing:.16em!important}

/* ---------- LOGIN ---------- */
.login{
  min-height:100vh!important;
  display:grid!important;
  grid-template-columns:minmax(520px,1.08fr) minmax(460px,.92fr)!important;
  background:#f5f6f8!important;
}
.splash{
  position:relative!important;
  min-height:100vh!important;
  padding:54px clamp(48px,6vw,92px)!important;
  background:
    radial-gradient(circle at 18% 12%,rgba(227,29,45,.17),transparent 27%),
    radial-gradient(circle at 88% 84%,rgba(69,121,170,.15),transparent 33%),
    linear-gradient(145deg,#081522 0%,#0b2138 62%,#0a1929 100%)!important;
  color:#fff!important;
  display:flex!important;
  flex-direction:column!important;
  justify-content:space-between!important;
  overflow:hidden!important;
}
.splash:before{
  content:""!important;
  position:absolute!important;
  inset:0!important;
  background:
    linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px),
    linear-gradient(rgba(255,255,255,.028) 1px,transparent 1px)!important;
  background-size:64px 64px!important;
  opacity:.55!important;
  pointer-events:none!important;
}
.splash:after{
  content:""!important;
  position:absolute!important;
  right:-180px!important;
  bottom:-190px!important;
  width:560px!important;
  height:560px!important;
  border:1px solid rgba(255,255,255,.07)!important;
  border-radius:50%!important;
  box-shadow:
    0 0 0 68px rgba(255,255,255,.018),
    0 0 0 136px rgba(255,255,255,.012)!important;
  pointer-events:none!important;
}
.splash>*{position:relative!important;z-index:1!important}
.splash-badge{
  display:inline-flex;
  align-items:center;
  gap:10px;
  width:max-content;
  padding:9px 12px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:999px;
  background:rgba(255,255,255,.045);
  color:#c8d5e2;
  font-size:9px;
  font-weight:850;
  letter-spacing:.14em;
  backdrop-filter:blur(12px);
}
.splash-badge:before{content:"";width:7px;height:7px;border-radius:50%;background:var(--rg-red);box-shadow:0 0 0 4px rgba(227,29,45,.12)}
.splash-copy{max-width:650px}
.splash .eyebrow{color:#ff7180!important;margin-bottom:14px!important}
.splash h1{
  max-width:680px!important;
  margin:0 0 20px!important;
  font-size:clamp(44px,5.1vw,72px)!important;
  line-height:1.03!important;
  letter-spacing:-.06em!important;
  font-weight:900!important;
  color:#fff!important;
}
.splash p{
  max-width:570px!important;
  margin:0!important;
  color:#aebdcc!important;
  line-height:1.9!important;
  font-size:14px!important;
}
.login-points{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:28px;max-width:660px}
.login-point{padding:13px 14px;border:1px solid rgba(255,255,255,.085);background:rgba(255,255,255,.035);border-radius:12px}
.login-point b{display:block;font-size:11px;color:#fff;margin-bottom:3px}.login-point span{font-size:9px;color:#8799ab}
.splash small{color:#657b90!important;font-size:9px!important;letter-spacing:.12em!important}

.login-main{
  min-height:100vh!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:48px clamp(38px,5vw,76px)!important;
  background:
    radial-gradient(circle at 100% 0%,rgba(227,29,45,.045),transparent 25%),
    linear-gradient(180deg,#f9fafb 0%,#f2f4f7 100%)!important;
}
.auth{width:min(470px,100%)!important}
.auth-brand{
  margin-bottom:34px;
  padding-bottom:25px;
  border-bottom:1px solid #e4e8ed;
}
.auth-brand img{display:block;width:min(360px,92%);height:auto}
.login-mark{
  display:flex!important;
  align-items:center!important;
  gap:9px!important;
  margin:0 0 13px!important;
  color:var(--rg-red)!important;
  font-size:9px!important;
  font-weight:900!important;
  letter-spacing:.16em!important;
}
.login-mark:before{content:""!important;width:24px!important;height:2px!important;background:var(--rg-red)!important}
.auth>h2{margin:0!important;font-size:32px!important;font-weight:850!important;letter-spacing:-.045em!important;color:#142030!important}
.auth>p{margin:8px 0 24px!important;font-size:12px!important;line-height:1.75!important;color:#7f8b98!important}
.auth-card{
  margin:0!important;
  padding:26px!important;
  border:1px solid #e0e5ea!important;
  border-radius:16px!important;
  background:rgba(255,255,255,.94)!important;
  box-shadow:0 18px 60px rgba(15,31,48,.065)!important;
}
.auth-card .field{margin-bottom:16px!important}
.auth-card .field label{margin-bottom:7px!important;color:#536070!important;font-size:11px!important;font-weight:760!important}
.auth-card .field input{
  min-height:50px!important;
  border:1px solid #dbe1e7!important;
  border-radius:10px!important;
  background:#fbfcfd!important;
  padding:10px 13px!important;
  font-size:13px!important;
  transition:.18s ease!important;
}
.auth-card .field input:focus{background:#fff!important;border-color:#8fa2b5!important;box-shadow:0 0 0 4px rgba(15,47,80,.065)!important}
.auth-card .btn{
  width:100%!important;
  min-height:50px!important;
  margin-top:5px!important;
  border-radius:10px!important;
  background:linear-gradient(135deg,var(--rg-navy),var(--rg-navy-2))!important;
  box-shadow:0 9px 22px rgba(9,28,49,.16)!important;
  font-size:13px!important;
  font-weight:850!important;
}
.auth-card .btn:hover{transform:translateY(-1px)!important;background:linear-gradient(135deg,#061526,#0b2948)!important}
.auth-footnote{margin-top:14px;color:#9aa4ae;font-size:10px;line-height:1.65}

/* ---------- APP SHELL ---------- */
.shell{grid-template-columns:268px minmax(0,1fr)!important;background:var(--rg-bg)!important}
aside.side{
  position:sticky!important;
  top:0!important;
  height:100vh!important;
  padding:22px 14px 18px!important;
  background:#fff!important;
  color:var(--rg-text)!important;
  border-right:1px solid #e5e9ee!important;
  box-shadow:none!important;
  overflow-y:auto!important;
}
.side .brand{
  width:100%!important;
  max-width:none!important;
  margin:0 0 24px!important;
  padding:6px 8px 16px!important;
  border-bottom:1px solid #edf0f3!important;
}
.side .brand img{
  display:block!important;
  width:100%!important;
  max-width:220px!important;
  height:auto!important;
  margin:0 auto!important;
  border-radius:0!important;
}
.side .label{
  margin:18px 12px 6px!important;
  color:#a2abb5!important;
  font-size:8px!important;
  font-weight:900!important;
  letter-spacing:.18em!important;
  text-transform:uppercase!important;
}
.side nav{display:block!important}
.side nav a{
  display:flex!important;
  align-items:center!important;
  gap:10px!important;
  margin:2px 0!important;
  padding:10px 11px!important;
  border-radius:9px!important;
  color:#566474!important;
  font-size:11px!important;
  font-weight:650!important;
  transition:.16s ease!important;
}
.side nav a:hover:not(.active){background:#f4f6f8!important;color:#182738!important}
.side nav a.active{
  position:relative!important;
  background:linear-gradient(135deg,#0c2743,#123b63)!important;
  color:#fff!important;
  box-shadow:0 7px 18px rgba(10,36,62,.13)!important;
  font-weight:800!important;
}
.side nav a.active:before{
  content:"";
  position:absolute;
  left:0;
  top:9px;
  bottom:9px;
  width:3px;
  border-radius:0 3px 3px 0;
  background:var(--rg-red);
}
.nav-icon{
  width:23px!important;
  height:23px!important;
  border-radius:7px!important;
  background:#f0f3f6!important;
  color:#697786!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  font-size:9px!important;
  font-weight:900!important;
  flex:none!important;
}
.side nav a.active .nav-icon{background:rgba(255,255,255,.12)!important;color:#fff!important}
.side .foot{
  margin-top:22px!important;
  padding:18px 10px 4px!important;
  border-top:1px solid #edf0f3!important;
  color:#9aa4ae!important;
  font-size:9px!important;
  line-height:1.8!important;
}
.content{min-width:0!important;background:var(--rg-bg)!important}
.top{
  position:sticky!important;
  top:0!important;
  z-index:25!important;
  padding:13px clamp(20px,3vw,38px)!important;
  background:rgba(255,255,255,.92)!important;
  backdrop-filter:blur(16px)!important;
  border-bottom:1px solid rgba(222,227,232,.92)!important;
  box-shadow:0 4px 20px rgba(19,37,56,.025)!important;
}
.top small{color:#98a2ad!important;font-size:9px!important;letter-spacing:.04em!important}
.top strong{color:#273444!important;font-size:11px!important}
.top .btn.alt{min-height:36px!important;padding:7px 11px!important;font-size:10px!important;border-radius:8px!important}
.main{max-width:1480px!important;padding:28px clamp(20px,3vw,42px) 80px!important}
.header{align-items:center!important;margin-bottom:22px!important}
.header h1{margin:5px 0 4px!important;font-size:29px!important;font-weight:850!important;letter-spacing:-.04em!important;color:#172333!important}
.header p{max-width:780px!important;color:#7a8693!important;font-size:11px!important;line-height:1.75!important}

/* ---------- COMPONENTS ---------- */
.btn{
  min-height:40px!important;
  padding:8px 14px!important;
  border-radius:9px!important;
  background:var(--rg-navy)!important;
  color:#fff!important;
  font-size:11px!important;
  font-weight:820!important;
  box-shadow:none!important;
  transition:.16s ease!important;
}
.btn:hover{background:var(--rg-navy-2)!important;transform:translateY(-1px)!important}
.btn.alt{background:#fff!important;color:#435161!important;border:1px solid #dce2e8!important}
.btn.alt:hover{background:#f6f8fa!important;border-color:#cfd7df!important}
button.danger,.danger.btn{background:#fff!important;color:#c63b49!important;border:1px solid #efcfd4!important;border-radius:8px!important;padding:8px 11px!important}
.panel{
  margin-bottom:17px!important;
  border:1px solid var(--rg-line)!important;
  border-radius:14px!important;
  background:#fff!important;
  box-shadow:var(--rg-shadow)!important;
}
.panel-head{padding:17px 20px!important;border-bottom:1px solid #edf0f3!important}
.panel-head h2{font-size:14px!important;font-weight:820!important;color:#1f2d3d!important}
.panel-head small{font-size:9px!important;color:#929ca7!important}
.panel-body{padding:20px!important}
.stat,.kpi,.metric{
  border:1px solid var(--rg-line)!important;
  border-radius:13px!important;
  background:#fff!important;
  box-shadow:0 7px 22px rgba(17,34,53,.035)!important;
}
.dashboard-kpis{gap:12px!important;margin-bottom:18px!important}
.kpi{position:relative!important;padding:18px!important;overflow:hidden!important}
.kpi:after{content:"";position:absolute;right:-28px;top:-30px;width:86px;height:86px;border-radius:50%;background:#f5f7f9}
.kpi>*{position:relative!important;z-index:1!important}
.kpi.primary,.kpi.accent{border-top:1px solid var(--rg-line)!important}
.kpi.primary:before,.kpi.accent:before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--rg-navy)}
.kpi.accent:before{background:var(--rg-red)}
.kpi .kpi-label{color:#8995a1!important;font-size:9px!important;font-weight:750!important}
.kpi strong{font-size:25px!important;font-weight:880!important;color:#172638!important}
.kpi small{font-size:8px!important;color:#a0a9b2!important}
.module-grid{gap:13px!important}
.module-card{
  min-height:150px!important;
  padding:18px!important;
  border:1px solid var(--rg-line)!important;
  border-radius:14px!important;
  background:linear-gradient(180deg,#fff,#fbfcfd)!important;
  box-shadow:0 7px 22px rgba(16,34,53,.032)!important;
}
.module-card:hover{transform:translateY(-2px)!important;border-color:#d1d9e1!important;box-shadow:0 14px 32px rgba(17,34,53,.07)!important}
.module-card .icon{width:38px!important;height:38px!important;border-radius:11px!important;background:#edf2f6!important;color:#3d5368!important}
.module-card.primary .icon{background:var(--rg-red-soft)!important;color:var(--rg-red)!important}
.module-card h3{font-size:13px!important;font-weight:820!important}.module-card p{font-size:10px!important;color:#7c8793!important}.module-card .go{font-size:10px!important;color:#315f8b!important}
table{min-width:720px!important}
th{background:#f7f9fb!important;color:#7e8995!important;font-size:9px!important;font-weight:850!important;letter-spacing:.025em!important}
th,td{padding:12px 15px!important;border-bottom:1px solid #edf0f3!important}
td{font-size:11px!important;color:#465361!important}td strong{color:#1f2c3b!important}
tr:hover td{background:#fbfcfd}
.field label{font-size:10px!important;color:#596675!important;font-weight:760!important;margin-bottom:6px!important}
.field input,.field select,.field textarea{
  border:1px solid #dce2e7!important;
  border-radius:9px!important;
  background:#fff!important;
  color:#263442!important;
}
.field input:focus,.field select:focus,.field textarea:focus{border-color:#90a2b4!important;box-shadow:0 0 0 4px rgba(15,47,80,.055)!important}
.flash{border-radius:10px!important;font-size:11px!important}
.quick-action{border-radius:11px!important;padding:14px!important}.quick-action b{font-size:11px!important}.quick-action span{font-size:8px!important}
.alert-item{border-radius:10px!important}.alert-item strong{font-size:11px!important}.alert-item b{font-size:17px!important}
.status{font-size:9px!important;padding:5px 8px!important}
.review-chip{font-size:9px!important}
.warning{border-radius:11px!important;font-size:10px!important}
.copy-box{border-radius:10px!important}
.bracket-match{border-radius:12px!important;box-shadow:0 6px 18px rgba(18,36,55,.035)!important}

/* Scrollbars */
.side::-webkit-scrollbar,.table-wrap::-webkit-scrollbar{width:6px;height:6px}.side::-webkit-scrollbar-thumb,.table-wrap::-webkit-scrollbar-thumb{background:#d7dde3;border-radius:6px}

/* Responsive */
@media(max-width:1050px){
  .login{grid-template-columns:1fr!important}
  .splash{min-height:380px!important;padding:38px 36px!important}
  .splash h1{font-size:42px!important}
  .login-points{max-width:100%}
  .login-main{min-height:auto!important;padding:46px 26px 64px!important}
}
@media(max-width:760px){
  .splash{min-height:320px!important;padding:28px 22px!important}
  .splash h1{font-size:34px!important}
  .splash p{font-size:12px!important}.login-points{grid-template-columns:1fr!important;gap:7px!important;margin-top:18px!important}
  .login-point{padding:10px 12px!important}.login-main{padding:32px 16px 50px!important}.auth-brand{margin-bottom:24px!important}
  .shell{display:block!important}
  aside.side{display:block!important;position:relative!important;height:auto!important;padding:12px!important;border-right:0!important;border-bottom:1px solid #e5e9ee!important}
  .side .brand{max-width:210px!important;margin:0 0 10px!important;padding:4px 6px 12px!important}
  .side .label,.side .foot{display:none!important}
  .side nav{display:flex!important;gap:6px!important;overflow-x:auto!important;margin-bottom:6px!important;padding-bottom:2px!important}
  .side nav a{flex:0 0 auto!important;white-space:nowrap!important;padding:8px 10px!important;font-size:10px!important}
  .nav-icon{width:21px!important;height:21px!important}
  .main{padding:20px 13px 60px!important}.top{padding:12px 13px!important}.header h1{font-size:25px!important}
}