:root{
  --bg:#050505;--bg2:#0b0b0b;--panel:#111;--panel2:#171717;
  --gold:#f6c744;--gold2:#fff0a3;--gold3:#a87412;
  --text:#f7f7f7;--muted:#a6a6a6;--line:rgba(255,255,255,.09);
  --goldline:rgba(246,199,68,.28);--danger:#ff7474;--success:#68e49a;
  --shadow:0 24px 80px rgba(0,0,0,.5);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  font-family:Inter,system-ui,sans-serif;color:var(--text);
  background:
    radial-gradient(circle at 12% 7%,rgba(246,199,68,.085),transparent 30%),
    radial-gradient(circle at 88% 28%,rgba(246,199,68,.05),transparent 25%),
    var(--bg);
  min-height:100vh;
}
a{color:inherit;text-decoration:none}
button,input,textarea,select{font:inherit}
button{cursor:pointer}
img{display:block;max-width:100%}
.container{width:min(1180px,calc(100% - 32px));margin:auto}
.section{padding:96px 0}
.section-alt{background:linear-gradient(180deg,rgba(255,255,255,.018),transparent)}
.eyebrow{color:var(--gold);font-size:.78rem;text-transform:uppercase;letter-spacing:.18em;font-weight:800;margin-bottom:12px}
h1,h2,h3{font-family:Cinzel,serif}
h2{font-size:clamp(2.1rem,4vw,3.4rem);line-height:1.1;margin-bottom:14px}
.lead{color:var(--muted);line-height:1.8}
.topbar{
  position:sticky;top:0;z-index:80;background:rgba(5,5,5,.82);
  backdrop-filter:blur(18px);border-bottom:1px solid var(--line);
}
.nav{min-height:76px;display:flex;align-items:center;justify-content:space-between;gap:20px}
.brand{display:flex;align-items:center;gap:12px;color:var(--gold);font:800 1.25rem Cinzel,serif}
.logo{
    width:42px;
    height:42px;
    object-fit:contain;
}
.logo-fallback{width:44px;height:44px;display:grid;place-items:center;border-radius:13px;border:1px solid var(--goldline);background:#17130a;color:var(--gold);font:800 1.3rem Cinzel,serif}
.navlinks{display:flex;align-items:center;gap:18px;color:#ddd;font-size:.88rem}
.navlinks a:hover{color:var(--gold)}
.menu-btn{display:none;padding:9px 12px;border-radius:10px;border:1px solid var(--line);background:#101010;color:#fff}
.hero{
  min-height:88vh;display:grid;place-items:center;text-align:center;padding:100px 0;
  background:
    linear-gradient(rgba(5,5,5,.35),rgba(5,5,5,.96)),
    url("https://images.unsplash.com/photo-1542751371-adc38448a05e?auto=format&fit=crop&w=1800&q=88") center/cover;
  position:relative;overflow:hidden;
}
.hero::after{content:"";position:absolute;inset:0;background:radial-gradient(circle at center,rgba(246,199,68,.14),transparent 42%);pointer-events:none}
.hero-inner{max-width:920px;position:relative;z-index:1}
.vip-login-logo{
  display:block;
  width:96px;
  height:96px;
  margin:0 auto 18px;
  object-fit:contain;
  border:1px solid var(--goldline);
  border-radius:22px;
  box-shadow:0 12px 35px rgba(0,0,0,.45),0 0 24px color-mix(in srgb,var(--brand-primary) 22%,transparent);
}

.admin-brand-logo{
  width:38px;
  height:38px;
  flex:0 0 38px;
  object-fit:contain;
  border:1px solid color-mix(in srgb,var(--brand-primary) 50%,transparent);
  border-radius:10px;
  background:#080808;
}

.branding-preview-top img{
  width:34px;
  height:34px;
  object-fit:contain;
  border-radius:9px;
}

.branding-preview-hero img{
  width:118px;
  height:118px;
  object-fit:contain;
  border:1px solid color-mix(in srgb,var(--brand-primary) 55%,transparent);
  border-radius:25px;
  box-shadow:0 0 38px color-mix(in srgb,var(--brand-primary) 17%,transparent);
}

.site-main-logo{
  object-fit:contain;
}

.site-hero-logo{
  object-fit:contain;
}
.badge{display:inline-block;padding:9px 15px;border:1px solid var(--goldline);border-radius:999px;color:var(--gold2);background:rgba(0,0,0,.4);font-size:.8rem;font-weight:800}
h1{font-size:clamp(3.2rem,8vw,7rem);color:var(--gold);margin:18px 0 12px}
.actions{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin-top:28px}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 20px;border-radius:11px;border:1px solid transparent;font-weight:800;transition:.22s}
.btn:hover{transform:translateY(-2px)}
.btn-primary{background:linear-gradient(135deg,var(--gold),var(--gold3));color:#111;box-shadow:0 14px 40px rgba(246,199,68,.18)}
.btn-secondary{background:#111;border-color:var(--line)}
.btn-danger{background:#241010;border-color:rgba(255,116,116,.35);color:#ffb4b4}
.stats-strip{margin-top:-48px;position:relative;z-index:4;display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.stat-card{padding:22px;border:1px solid var(--goldline);border-radius:18px;background:rgba(16,16,16,.95);box-shadow:var(--shadow);text-align:center}
.stat-card strong{display:block;color:var(--gold);font:800 1.5rem Cinzel,serif}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.card{border:1px solid var(--line);background:linear-gradient(160deg,rgba(255,255,255,.05),rgba(255,255,255,.015));border-radius:20px;overflow:hidden;transition:.25s}
.card:hover{transform:translateY(-5px);border-color:var(--goldline);box-shadow:var(--shadow)}
.cover{min-height:225px;padding:20px;display:flex;align-items:flex-end;background:
 linear-gradient(to top,rgba(5,5,5,.97),rgba(5,5,5,.1)),
 url("https://images.unsplash.com/photo-1560253023-3ec5d502959f?auto=format&fit=crop&w=1200&q=85") center/cover}
.cover h3{color:var(--gold);font-size:1.45rem}
.card-body{padding:22px}
.meta-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin:16px 0}
.meta{padding:11px;border:1px solid var(--line);border-radius:11px;background:#0b0b0b}
.meta small{display:block;color:var(--muted);margin-bottom:4px}
.status{display:inline-flex;margin-bottom:12px;padding:7px 10px;border-radius:999px;border:1px solid var(--goldline);color:var(--gold2);font-size:.74rem;font-weight:800}
.empty,.notice{padding:24px;border:1px solid var(--line);border-radius:16px;background:#111;color:var(--muted)}
.contact-grid,.register-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px}
.contact-list{display:grid;gap:11px;margin-top:18px}
.contact-item{display:flex;justify-content:space-between;padding:14px;border:1px solid var(--line);border-radius:11px}
.sponsor-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.sponsor-card{min-height:150px;display:grid;place-items:center;padding:22px;border:1px solid var(--line);border-radius:18px;background:#101010;text-align:center}
.sponsor-card img{max-height:80px;max-width:160px;object-fit:contain;margin:auto}
.bracket{display:grid;gap:16px}
.round{padding:18px;border:1px solid var(--line);border-radius:16px;background:#0f0f0f}
.round h3{color:var(--gold);margin-bottom:12px}
.match{display:grid;grid-template-columns:1fr auto 1fr;gap:12px;align-items:center;padding:12px;border:1px solid var(--line);border-radius:12px;background:#090909;margin-top:10px}
.match strong:last-child{text-align:right}
.live-frame{width:100%;aspect-ratio:16/9;border:1px solid var(--goldline);border-radius:18px;overflow:hidden;background:#0d0d0d}
.live-frame iframe{width:100%;height:100%;border:0}
footer{padding:30px 0;border-top:1px solid var(--line);text-align:center;color:var(--muted)}
/* admin */
.admin-shell{display:grid;grid-template-columns:280px 1fr;min-height:100vh}
.sidebar{padding:24px;border-right:1px solid var(--line);background:#090909;position:sticky;top:0;height:100vh;overflow:auto}
.sidebar .brand{margin-bottom:28px}
.side-nav{display:grid;gap:8px}
.side-nav button,.side-nav a{padding:12px 14px;text-align:left;border:1px solid transparent;border-radius:10px;background:transparent;color:#ddd}
.side-nav button.active,.side-nav button:hover,.side-nav a:hover{border-color:var(--goldline);color:var(--gold);background:#14120c}
.admin-main{padding:30px}
.admin-top{display:flex;justify-content:space-between;gap:16px;align-items:center;margin-bottom:24px}
.panel{padding:24px;border:1px solid var(--line);border-radius:18px;background:#101010}
.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.form-full{grid-column:1/-1}
label{display:grid;gap:7px;color:#ddd;font-size:.9rem}
input,textarea,select{width:100%;padding:13px 14px;border-radius:10px;border:1px solid var(--line);background:#090909;color:#fff;outline:none}
input:focus,textarea:focus,select:focus{border-color:var(--gold)}
textarea{min-height:120px;resize:vertical}
.table-wrap{overflow:auto;margin-top:18px}
table{width:100%;border-collapse:collapse;min-width:960px}
th,td{padding:13px;border-bottom:1px solid var(--line);text-align:left;font-size:.9rem}
th{color:var(--gold2)}
.auth-wrap{min-height:100vh;display:grid;place-items:center;padding:24px}
.auth-card{width:min(430px,100%);padding:28px;border:1px solid var(--goldline);border-radius:20px;background:#101010}
.auth-card h1{font-size:2rem;margin:0 0 10px}
.hidden{display:none!important}
.message{margin-top:12px;font-size:.9rem}
.message.error{color:#ff9b9b}.message.success{color:#8df0ad}
.tab-panel{display:none}.tab-panel.active{display:block}
.admin-stats{display:grid;grid-template-columns:repeat(6,1fr);gap:12px;margin-bottom:22px}
.admin-stat{padding:18px;border:1px solid var(--line);border-radius:15px;background:#101010}
.admin-stat strong{display:block;font:800 1.6rem Cinzel,serif;color:var(--gold)}
.file-note{font-size:.8rem;color:var(--muted)}
@media(max-width:980px){
  .navlinks{display:none;position:absolute;top:76px;left:16px;right:16px;padding:16px;flex-direction:column;background:#101010;border:1px solid var(--line);border-radius:14px}
  .navlinks.open{display:flex}.menu-btn{display:block}
  .grid,.contact-grid,.register-grid{grid-template-columns:1fr 1fr}
  .sponsor-grid{grid-template-columns:repeat(2,1fr)}
  .stats-strip{grid-template-columns:repeat(2,1fr)}
  .admin-shell{grid-template-columns:1fr}.sidebar{position:relative;height:auto;border-right:0;border-bottom:1px solid var(--line)}
  .side-nav{grid-template-columns:repeat(2,1fr)}.form-grid{grid-template-columns:1fr}.form-full{grid-column:auto}
  .admin-stats{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:640px){
  .container{width:min(100% - 24px,1180px)}
  .section{padding:76px 0}
  .grid,.contact-grid,.register-grid,.stats-strip,.sponsor-grid{grid-template-columns:1fr}
  .meta-grid{grid-template-columns:1fr}
  .actions{flex-direction:column}.btn{width:100%}
  .admin-main{padding:18px}.admin-top{align-items:flex-start;flex-direction:column}
  .admin-stats{grid-template-columns:repeat(2,1fr)}
  .match{grid-template-columns:1fr;text-align:center}.match strong:last-child{text-align:center}
}


/* =========================================================
   DOSMOS VIP — MOBILE DRAWER
========================================================= */

.mobile-admin-header,
.sidebar-overlay,
.sidebar-close-btn,
.sidebar-profile,
.sidebar-logout-btn{
  display:none;
}

.admin-account-card{
  display:flex;
  align-items:center;
  gap:12px;
  padding:10px 12px;
  border:1px solid var(--goldline);
  border-radius:14px;
  background:linear-gradient(145deg,#151515,#0b0b0b);
  box-shadow:0 10px 30px rgba(0,0,0,.32);
}

.admin-account-avatar{
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  flex:0 0 42px;
  border-radius:12px;
  color:#111;
  font:800 18px Cinzel,serif;
  background:linear-gradient(135deg,var(--gold),var(--gold3));
}

.admin-account-info{
  min-width:112px;
  display:flex;
  flex-direction:column;
}

.admin-account-info strong{
  color:#fff;
  font-size:14px;
}

.admin-account-info span{
  margin-top:2px;
  color:var(--gold);
  font-size:11px;
  font-weight:800;
  letter-spacing:.35px;
}

.admin-account-info small,
.sidebar-profile small{
  display:flex;
  align-items:center;
  gap:6px;
  margin-top:4px;
  color:#75f29a;
  font-size:11px;
}

.admin-account-info small i,
.sidebar-profile small i{
  width:7px;
  height:7px;
  border-radius:50%;
  background:#22c55e;
  box-shadow:0 0 9px #22c55e;
}

.logout-btn,
.sidebar-logout-btn{
  min-height:42px;
  padding:0 17px;
  border:1px solid rgba(255,90,90,.55);
  border-radius:10px;
  background:linear-gradient(135deg,#d92f2f,#8e1717);
  color:#fff;
  font-weight:800;
  cursor:pointer;
  transition:.2s ease;
}

.logout-btn:hover,
.sidebar-logout-btn:hover{
  transform:translateY(-2px);
  background:linear-gradient(135deg,#ef4444,#a91d1d);
  box-shadow:0 10px 25px rgba(217,47,47,.32);
}

.sidebar-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
}

@media (max-width:980px){
  html,body{
    width:100%;
    max-width:100%;
    overflow-x:hidden;
  }

  body.admin-menu-open{
    overflow:hidden;
  }

  .admin-shell{
    display:block;
    padding-top:66px;
  }

  .mobile-admin-header{
    position:fixed;
    inset:0 0 auto;
    z-index:1200;
    height:66px;
    display:grid;
    grid-template-columns:44px 1fr auto;
    align-items:center;
    gap:12px;
    padding:0 14px;
    border-bottom:1px solid var(--line);
    background:rgba(7,7,7,.96);
    backdrop-filter:blur(18px);
  }

  .mobile-menu-btn{
    width:42px;
    height:42px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:5px;
    border:1px solid var(--goldline);
    border-radius:11px;
    background:#14120c;
  }

  .mobile-menu-btn span{
    width:20px;
    height:2px;
    border-radius:99px;
    background:var(--gold);
  }

  .mobile-admin-brand{
    min-width:0;
    display:flex;
    align-items:center;
    gap:9px;
    color:var(--gold);
    font:800 14px Cinzel,serif;
  }

  .mobile-admin-brand .logo-fallback{
    width:34px;
    height:34px;
    font-size:13px;
  }

  .mobile-online{
    display:flex;
    align-items:center;
    gap:6px;
    color:#ddd;
    font-size:12px;
    font-weight:700;
  }

  .mobile-online-dot{
    width:7px;
    height:7px;
    border-radius:50%;
    background:#22c55e;
    box-shadow:0 0 8px #22c55e;
  }

  .sidebar-overlay{
    position:fixed;
    inset:0;
    z-index:1250;
    display:block;
    visibility:hidden;
    opacity:0;
    background:rgba(0,0,0,.68);
    backdrop-filter:blur(4px);
    transition:.25s ease;
  }

  .sidebar-overlay.show{
    visibility:visible;
    opacity:1;
  }

  .sidebar{
    position:fixed;
    top:0;
    bottom:0;
    left:0;
    z-index:1300;
    width:min(86vw,320px);
    height:100dvh;
    padding:18px;
    overflow-y:auto;
    border-right:1px solid var(--goldline);
    background:#080808;
    box-shadow:20px 0 60px rgba(0,0,0,.55);
    transform:translateX(-105%);
    transition:transform .26s ease;
  }

  .sidebar.open{
    transform:translateX(0);
  }

  .sidebar-close-btn{
    width:38px;
    height:38px;
    display:grid;
    place-items:center;
    border:1px solid var(--line);
    border-radius:10px;
    background:#141414;
    color:#fff;
    font-size:25px;
    line-height:1;
  }

  .sidebar-profile{
    display:flex;
    align-items:center;
    gap:12px;
    margin:18px 0;
    padding:13px;
    border:1px solid var(--goldline);
    border-radius:14px;
    background:linear-gradient(145deg,#151515,#0c0c0c);
  }

  .sidebar-avatar{
    width:42px;
    height:42px;
    display:grid;
    place-items:center;
    flex:0 0 42px;
    border-radius:12px;
    color:#111;
    font:800 18px Cinzel,serif;
    background:linear-gradient(135deg,var(--gold),var(--gold3));
  }

  .sidebar-profile div:last-child{
    display:flex;
    flex-direction:column;
  }

  .sidebar-profile strong{
    color:#fff;
    font-size:14px;
  }

  .sidebar-profile span{
    margin-top:2px;
    color:var(--gold);
    font-size:11px;
    font-weight:800;
  }

  .side-nav{
    display:grid;
    grid-template-columns:1fr;
    gap:8px;
  }

  .side-nav button,
  .side-nav a{
    width:100%;
    min-height:44px;
    padding:11px 13px;
    border:1px solid var(--line);
    border-radius:10px;
    background:#101010;
    color:#eee;
    font-size:13px;
    text-align:left;
  }

  .side-nav button.active{
    border-color:rgba(246,199,68,.55);
    background:#18140a;
    color:var(--gold);
  }

  .sidebar-logout-btn{
    display:block;
    margin-top:10px;
    text-align:center !important;
  }

  .admin-main{
    width:100%;
    max-width:none;
    padding:20px 14px 32px;
  }

  .admin-top{
    display:block;
    margin-bottom:20px;
  }

  .admin-top h2{
    font-size:clamp(28px,8vw,40px);
  }

  .admin-account-card{
    display:none;
  }

  .admin-stats{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
  }

  .admin-stat{
    min-width:0;
    padding:15px;
  }

  .admin-stat strong{
    font-size:22px;
  }

  .admin-stat span{
    font-size:11px;
  }

  .panel{
    padding:16px;
    border-radius:14px;
  }

  .form-grid{
    grid-template-columns:1fr;
    gap:12px;
  }

  .form-full{
    grid-column:auto;
  }

  input,textarea,select{
    font-size:16px;
  }

  .table-wrap{
    width:100%;
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
  }

  table{
    min-width:780px;
  }
}

@media (max-width:420px){
  .mobile-admin-header{
    grid-template-columns:42px 1fr;
  }

  .mobile-online{
    display:none;
  }

  .admin-main{
    padding-inline:12px;
  }
}


/* =========================================================
   DOSMOS VIP
========================================================= */
.auth-card{
  position:relative;
  overflow:hidden;
  border-color:rgba(246,199,68,.38);
  box-shadow:0 25px 80px rgba(0,0,0,.55),0 0 60px rgba(246,199,68,.06);
}
.auth-card::before{
  content:"VIP";
  position:absolute;
  top:18px;
  right:20px;
  padding:5px 9px;
  border:1px solid var(--goldline);
  border-radius:999px;
  color:var(--gold);
  font-size:10px;
  font-weight:900;
  letter-spacing:.15em;
}
.auth-card h1{
  color:var(--gold);
}

.vip-welcome-card{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:22px;
  margin-bottom:18px;
  padding:26px;
  border:1px solid var(--goldline);
  border-radius:20px;
  background:
    radial-gradient(circle at 90% 10%,rgba(246,199,68,.13),transparent 34%),
    linear-gradient(145deg,#151515,#0c0c0c);
  box-shadow:0 20px 50px rgba(0,0,0,.35);
}
.vip-welcome-card h3{
  margin-bottom:7px;
  color:var(--gold);
  font-size:clamp(22px,3vw,34px);
}
.vip-welcome-badge{
  display:flex;
  align-items:center;
  gap:8px;
  flex:0 0 auto;
  padding:10px 13px;
  border:1px solid rgba(117,242,154,.2);
  border-radius:999px;
  background:rgba(34,197,94,.07);
  color:#8df0ad;
  font-size:12px;
  font-weight:800;
}
.vip-live-dot{
  width:8px;
  height:8px;
  border-radius:50%;
  background:#22c55e;
  box-shadow:0 0 10px #22c55e;
}

.vip-quick-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
  margin-bottom:22px;
}
.vip-quick-grid button{
  min-height:54px;
  padding:12px;
  border:1px solid var(--line);
  border-radius:14px;
  background:#101010;
  color:#eee;
  font-weight:800;
  transition:.2s ease;
}
.vip-quick-grid button:hover{
  transform:translateY(-2px);
  border-color:var(--goldline);
  color:var(--gold);
  background:#16130b;
}

.vip-panel-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
}
.vip-table-search{
  width:min(260px,100%);
  min-height:40px;
  padding:9px 12px;
}

.vip-toast{
  position:fixed;
  right:22px;
  bottom:22px;
  z-index:2000;
  min-width:230px;
  max-width:min(380px,calc(100vw - 32px));
  padding:14px 16px;
  border:1px solid var(--goldline);
  border-radius:13px;
  background:#111;
  color:#fff;
  box-shadow:0 18px 50px rgba(0,0,0,.48);
  transform:translateY(25px);
  opacity:0;
  pointer-events:none;
  transition:.24s ease;
}
.vip-toast.show{
  transform:translateY(0);
  opacity:1;
}
.vip-toast.success{border-color:rgba(104,228,154,.35)}
.vip-toast.error{border-color:rgba(255,116,116,.4)}

@media(max-width:980px){
  .vip-welcome-card{
    align-items:flex-start;
    flex-direction:column;
    padding:19px;
  }
  .vip-quick-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .vip-panel-head{
    align-items:stretch;
    flex-direction:column;
  }
  .vip-table-search{
    width:100%;
  }
}
@media(max-width:480px){
  .vip-quick-grid{
    grid-template-columns:1fr;
  }
}


/* =========================================================
   DOSMOS VIP — MOBILE-FIRST REFINEMENT
========================================================= */

.mobile-page-intro{
  display:none;
}

/* Desktop remains spacious */
@media (min-width:981px){
  .admin-main{
    max-width:1600px;
    width:100%;
    margin:0 auto;
    padding:34px 38px 50px;
  }

  .admin-top{
    align-items:flex-start;
  }

  .panel{
    padding:26px;
  }
}

/* Tablet and phone */
@media (max-width:980px){
  .admin-shell{
    min-height:100dvh;
    padding-top:72px;
    background:
      radial-gradient(circle at 50% 0,rgba(246,199,68,.06),transparent 240px),
      var(--bg);
  }

  .mobile-admin-header{
    height:72px;
    grid-template-columns:46px minmax(0,1fr) auto;
    gap:11px;
    padding:0 14px;
  }

  .mobile-menu-btn{
    width:44px;
    height:44px;
    flex:0 0 44px;
  }

  .mobile-admin-brand{
    overflow:hidden;
  }

  .mobile-admin-brand > span:last-child{
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
    font-size:14px;
  }

  .sidebar{
    width:min(88vw,340px);
    padding:20px 16px calc(24px + env(safe-area-inset-bottom));
  }

  .sidebar-profile{
    margin:20px 0 16px;
    padding:14px;
  }

  .side-nav{
    gap:9px;
  }

  .side-nav button,
  .side-nav a{
    min-height:48px;
    padding:12px 14px;
    font-size:14px;
  }

  .admin-main{
    width:100%;
    padding:22px 16px calc(42px + env(safe-area-inset-bottom));
  }

  .mobile-page-intro{
    display:block;
    margin-bottom:18px;
  }

  .mobile-page-intro strong{
    display:block;
    color:var(--gold);
    font:800 clamp(27px,8vw,38px) Cinzel,serif;
    line-height:1.06;
  }

  .admin-top{
    display:none;
  }

  .admin-stats{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px;
    margin-bottom:18px;
  }

  .admin-stat{
    min-height:92px;
    display:flex;
    flex-direction:column;
    justify-content:center;
    padding:16px;
    border-radius:16px;
  }

  .admin-stat strong{
    font-size:25px;
  }

  .admin-stat span{
    margin-top:5px;
    font-size:12px;
  }

  .vip-welcome-card{
    margin-bottom:16px;
    padding:20px;
    border-radius:18px;
  }

  .vip-welcome-card h3{
    font-size:25px;
  }

  .vip-welcome-badge{
    width:100%;
    justify-content:center;
  }

  .vip-quick-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:10px;
  }

  .vip-quick-grid button{
    min-height:58px;
    padding:12px 10px;
    font-size:13px;
    line-height:1.3;
  }

  .panel{
    margin-top:0;
    padding:18px;
    border-radius:16px;
  }

  .tab-panel > .panel + .panel{
    margin-top:16px !important;
  }

  .panel h3{
    font-size:18px;
    line-height:1.3;
  }

  .form-grid{
    grid-template-columns:1fr;
    gap:14px;
  }

  label{
    font-size:13px;
  }

  input,textarea,select{
    min-height:48px;
    padding:13px 14px;
    border-radius:11px;
    font-size:16px;
  }

  textarea{
    min-height:132px;
  }

  .form-full .btn,
  form > .form-full .btn{
    width:100%;
    min-height:50px;
  }

  .vip-panel-head{
    gap:12px;
    margin-bottom:4px;
  }

  .vip-table-search{
    width:100%;
    min-height:46px;
  }

  .table-wrap{
    margin-top:14px;
    border:1px solid var(--line);
    border-radius:13px;
    background:#090909;
    overflow-x:auto;
    overscroll-behavior-x:contain;
  }

  table{
    min-width:820px;
  }

  th,td{
    padding:13px 12px;
    white-space:nowrap;
  }
}

@media (max-width:520px){
  .mobile-admin-header{
    grid-template-columns:46px minmax(0,1fr);
  }

  .mobile-online{
    display:none;
  }

  .admin-main{
    padding-inline:13px;
  }

  .admin-stats{
    gap:9px;
  }

  .admin-stat{
    min-height:86px;
    padding:14px;
  }

  .vip-quick-grid{
    grid-template-columns:1fr;
  }

  .vip-quick-grid button{
    min-height:52px;
  }

  .vip-welcome-card{
    padding:17px;
  }

  .panel{
    padding:15px;
  }

  .sidebar{
    width:min(91vw,330px);
  }
}

@media (max-width:360px){
  .admin-stats{
    grid-template-columns:1fr;
  }
}


/* =========================================================
   DOSMOS VIP — BRAND MANAGER
========================================================= */
:root{
  --brand-primary:#f6c744;
  --brand-background:#080808;
}
body{
  background:var(--brand-background);
}
.vip-login-logo{
  display:block;
  width:96px;
  height:96px;
  margin:0 auto 18px;
  object-fit:contain;
  border:1px solid var(--goldline);
  border-radius:22px;
  box-shadow:0 12px 35px rgba(0,0,0,.45),0 0 24px color-mix(in srgb,var(--brand-primary) 22%,transparent);
}
.admin-brand-logo{
  width:38px;
  height:38px;
  flex:0 0 38px;
  object-fit:contain;
  border:1px solid color-mix(in srgb,var(--brand-primary) 50%,transparent);
  border-radius:10px;
  background:#080808;
}
.mobile-admin-brand .admin-brand-logo{
  width:34px;
  height:34px;
  flex-basis:34px;
}
.branding-status{
  padding:7px 11px;
  border:1px solid rgba(104,228,154,.25);
  border-radius:999px;
  background:rgba(34,197,94,.07);
  color:#8df0ad;
  font-size:11px;
  font-weight:800;
}
.branding-layout{
  display:grid;
  grid-template-columns:minmax(0,1.3fr) minmax(310px,.7fr);
  gap:22px;
  margin-top:22px;
}
.branding-form{
  align-content:start;
}
.color-control{
  display:grid;
  grid-template-columns:58px 1fr;
  gap:10px;
}
.color-control input[type="color"]{
  width:58px;
  padding:5px;
  cursor:pointer;
}
.branding-actions{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:10px;
}
.branding-actions .message{
  width:100%;
}
.branding-preview-card{
  position:sticky;
  top:24px;
  align-self:start;
  overflow:hidden;
  border:1px solid var(--goldline);
  border-radius:19px;
  background:#080808;
  box-shadow:0 22px 60px rgba(0,0,0,.42);
}
.branding-preview-label{
  padding:11px 14px;
  border-bottom:1px solid var(--line);
  color:var(--gold);
  font-size:10px;
  font-weight:900;
  letter-spacing:.18em;
}
.branding-preview-top{
  display:flex;
  align-items:center;
  gap:9px;
  padding:12px 15px;
  border-bottom:1px solid var(--line);
  background:#070707;
}
.branding-preview-top img{
  width:34px;
  height:34px;
  object-fit:contain;
  border-radius:9px;
}
.branding-preview-top strong{
  color:var(--brand-primary);
  font-family:Cinzel,serif;
}
.branding-preview-hero{
  min-height:350px;
  display:flex;
  align-items:center;
  flex-direction:column;
  justify-content:center;
  padding:26px 20px;
  text-align:center;
  background:
    radial-gradient(circle at 50% 30%,color-mix(in srgb,var(--brand-primary) 13%,transparent),transparent 38%),
    linear-gradient(180deg,#121212,var(--brand-background));
}
.branding-preview-hero img{
  width:118px;
  height:118px;
  object-fit:contain;
  border:1px solid color-mix(in srgb,var(--brand-primary) 55%,transparent);
  border-radius:25px;
  box-shadow:0 0 38px color-mix(in srgb,var(--brand-primary) 17%,transparent);
}
.branding-preview-hero span{
  margin-top:13px;
  padding:5px 9px;
  border-radius:999px;
  background:var(--brand-primary);
  color:#080808;
  font-size:9px;
  font-weight:900;
}
.branding-preview-hero h4{
  margin:14px 0 5px;
  color:var(--brand-primary);
  font:800 35px Cinzel,serif;
}
.branding-preview-hero p{
  margin:0;
  color:#cfcfcf;
  font-size:12px;
}
.branding-preview-hero button{
  margin-top:18px;
  padding:9px 15px;
  border:0;
  border-radius:8px;
  background:var(--brand-primary);
  color:#080808;
  font-weight:900;
}
.branding-preview-card > small{
  display:block;
  padding:12px 15px;
  border-top:1px solid var(--line);
  color:var(--muted);
  line-height:1.45;
}
.site-main-logo{
    object-fit:contain;
}

.site-hero-logo{
    object-fit:contain;
}

@media(max-width:980px){
  .branding-layout{
    grid-template-columns:1fr;
  }
  .branding-preview-card{
    position:static;
    order:-1;
  }
  .branding-preview-hero{
    min-height:310px;
  }
}
@media(max-width:520px){
  .branding-layout{
    gap:15px;
  }
  .branding-preview-hero{
    min-height:280px;
    padding:22px 14px;
  }
  .branding-preview-hero img{
    width:96px;
    height:96px;
  }
  .branding-actions{
    display:grid;
    grid-template-columns:1fr;
  }
  .branding-actions .btn{
    width:100%;
  }
}

/* =========================================================
   FINAL LOGO FIX — DOSMOS
========================================================= */

/* Navbar logo */
.logo,
.site-main-logo{
  width:42px;
  height:42px;
  object-fit:contain !important;
  background:transparent;
  flex:0 0 42px;
}

/* Hero logo — sengaja tidak mengikuti ukuran logo navbar */
.hero-logo,
.site-hero-logo{
  display:block;
  width:160px;
  height:160px;
  max-width:160px;
  margin:0 auto 14px;
  object-fit:contain !important;
  background:transparent;
}

/* Admin, login, dan preview */
.admin-brand-logo,
.vip-login-logo,
.branding-preview-top img,
.branding-preview-hero img{
  object-fit:contain !important;
  background:transparent;
}

/* Fallback hanya muncul bila gambar gagal dimuat */
.brand img + .logo-fallback,
.hero-logo + .logo-fallback{
  display:none;
}

.brand img[style*="display: none"] + .logo-fallback,
.hero-logo[style*="display: none"] + .logo-fallback{
  display:grid;
}

@media(max-width:640px){
  .hero-logo,
  .site-hero-logo{
    width:125px;
    height:125px;
    max-width:125px;
  }
}

/* =========================================================
   DOSMOS VIP V14.1 — BACKGROUND MANAGER
========================================================= */
:root{
  --hero-bg-image:url("https://images.unsplash.com/photo-1542751371-adc38448a05e?auto=format&fit=crop&w=1800&q=88");
  --hero-mobile-bg-image:var(--hero-bg-image);
  --hero-overlay:.65;
  --hero-position:center;
  --login-bg-image:none;
  --footer-bg-image:none;
}

.hero{
  background-image:
    linear-gradient(
      rgba(5,5,5,var(--hero-overlay)),
      rgba(5,5,5,calc(var(--hero-overlay) + .25))
    ),
    var(--hero-bg-image);
  background-position:center,var(--hero-position);
  background-size:cover,cover;
  background-repeat:no-repeat,no-repeat;
}

.auth-wrap{
  position:relative;
  isolation:isolate;
  background-image:
    linear-gradient(rgba(5,5,5,.76),rgba(5,5,5,.92)),
    var(--login-bg-image);
  background-position:center;
  background-size:cover;
  background-repeat:no-repeat;
}

footer{
  background-image:
    linear-gradient(rgba(5,5,5,.82),rgba(5,5,5,.94)),
    var(--footer-bg-image);
  background-position:center;
  background-size:cover;
  background-repeat:no-repeat;
}

.range-control{
  display:grid;
  grid-template-columns:1fr auto;
  align-items:center;
  gap:12px;
  min-height:48px;
  padding:9px 12px;
  border:1px solid var(--line);
  border-radius:10px;
  background:#090909;
}

.range-control input[type="range"]{
  min-height:auto;
  padding:0;
}

.range-control output{
  min-width:46px;
  color:var(--gold);
  font-weight:800;
  text-align:right;
}

@media(max-width:640px){
  .hero{
    background-image:
      linear-gradient(
        rgba(5,5,5,var(--hero-overlay)),
        rgba(5,5,5,calc(var(--hero-overlay) + .25))
      ),
      var(--hero-mobile-bg-image);
  }
}



/* =========================================================
   DOSMOS VIP V14.2 — CONTENT MANAGER
========================================================= */
.content-manager-form{
  margin-top:20px;
}
.content-group-title{
  margin-top:10px;
  padding:12px 14px;
  border-left:3px solid var(--gold);
  border-radius:8px;
  background:rgba(246,199,68,.06);
  color:var(--gold);
  font:800 14px Cinzel,serif;
  letter-spacing:.04em;
}
.content-manager-form textarea{
  min-height:110px;
}

/* DOSMOS VIP V14.3 — LIVE CENTER */
.live-center-shell{display:grid;grid-template-columns:minmax(0,1.75fr) minmax(280px,.75fr);gap:22px;align-items:stretch}.live-player-card,.live-info-card{overflow:hidden;border:1px solid rgba(246,199,68,.22);border-radius:18px;background:linear-gradient(145deg,rgba(24,24,24,.96),rgba(8,8,8,.98));box-shadow:0 22px 60px rgba(0,0,0,.35)}.live-player-frame{position:relative;min-height:480px;aspect-ratio:16/9;background:#030303}.live-player-frame iframe{width:100%;height:100%;min-height:480px;border:0;display:block}.live-placeholder{width:100%;height:100%;min-height:480px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;padding:34px;text-align:center;background-position:center;background-size:cover}.live-placeholder h3{margin:0;font-size:clamp(26px,4vw,48px)}.live-placeholder p{max-width:650px;margin:0;color:var(--muted)}.live-info-card{padding:28px;display:flex;flex-direction:column}.live-meta-row,.live-channel-row{display:flex;align-items:center;justify-content:space-between;gap:12px}.live-status-pill{display:inline-flex;width:max-content;align-items:center;gap:8px;padding:8px 12px;border-radius:999px;font-size:12px;font-weight:900;letter-spacing:.08em}.live-status-pill:before{content:"";width:8px;height:8px;border-radius:50%;background:currentColor;box-shadow:0 0 14px currentColor}.live-status-pill.is-live{color:#ff4d55;background:rgba(255,77,85,.12)}.live-status-pill.is-coming{color:var(--gold);background:rgba(246,199,68,.1)}.live-status-pill.is-offline{color:#aaa;background:rgba(255,255,255,.06)}.live-platform{color:var(--gold);font-weight:800;font-size:13px}.live-info-card h3{margin:26px 0 12px;font-size:clamp(25px,3vw,38px)}.live-info-card p{margin:0 0 22px;color:var(--muted);line-height:1.75}.live-channel-row{margin-top:auto;padding:18px 0;border-top:1px solid var(--line);color:#ddd;font-size:13px}.live-watch-btn{width:100%;margin-top:8px;text-align:center}.live-countdown{display:grid;grid-template-columns:repeat(4,minmax(70px,1fr));gap:10px;width:min(520px,100%);margin-top:8px}.live-countdown div{padding:14px 10px;border:1px solid rgba(246,199,68,.2);border-radius:12px;background:rgba(0,0,0,.42)}.live-countdown strong,.live-countdown span{display:block}.live-countdown strong{color:var(--gold);font-size:24px}.live-countdown span{margin-top:4px;color:#aaa;font-size:11px}.live-admin-preview{min-height:130px;padding:24px;border:1px solid rgba(246,199,68,.2);border-radius:14px;background:radial-gradient(circle at top right,rgba(246,199,68,.14),transparent 40%),#090909;display:flex;flex-direction:column;justify-content:center;gap:8px}.live-admin-preview-badge{width:max-content;padding:6px 10px;border-radius:999px;font-size:11px;font-weight:900}.live-admin-preview-badge.live{color:#ff5b63;background:rgba(255,91,99,.12)}.live-admin-preview-badge.coming_soon{color:var(--gold);background:rgba(246,199,68,.1)}.live-admin-preview-badge.offline{color:#aaa;background:rgba(255,255,255,.06)}@media(max-width:900px){.live-center-shell{grid-template-columns:1fr}.live-player-frame,.live-player-frame iframe,.live-placeholder{min-height:320px}}@media(max-width:520px){.live-player-frame,.live-player-frame iframe,.live-placeholder{min-height:250px}.live-countdown{grid-template-columns:repeat(2,1fr)}.live-info-card{padding:20px}}


/* =========================================================
   DOSMOS VIP V14.4 — ANNOUNCEMENT CENTER
========================================================= */
#announcementTopbarRoot,#announcementTickerRoot,#announcementFloatingRoot,#announcementToastRoot,#announcementPopupRoot{position:relative;z-index:9999}
.dosmos-ann{--ann:#f6c744;--ann-rgb:246,199,68;border:1px solid rgba(var(--ann-rgb),.4);background:linear-gradient(135deg,rgba(var(--ann-rgb),.18),rgba(8,8,8,.98));color:#fff;box-shadow:0 18px 55px rgba(0,0,0,.42)}
.dosmos-ann.theme-red{--ann:#ff525e;--ann-rgb:255,82,94}.dosmos-ann.theme-blue{--ann:#4f9cff;--ann-rgb:79,156,255}.dosmos-ann.theme-green{--ann:#42d392;--ann-rgb:66,211,146}.dosmos-ann.theme-purple{--ann:#a970ff;--ann-rgb:169,112,255}
.dosmos-ann.is-emergency{--ann:#ff3b45;--ann-rgb:255,59,69;box-shadow:0 0 35px rgba(255,59,69,.3)}
.ann-badge{display:inline-flex;align-items:center;padding:5px 9px;border-radius:999px;background:var(--ann);color:#090909;font-size:10px;font-weight:950;letter-spacing:.08em}
.ann-btn{display:inline-flex;align-items:center;justify-content:center;padding:9px 14px;border-radius:10px;background:var(--ann);color:#090909!important;text-decoration:none;font-size:12px;font-weight:900;white-space:nowrap}
.ann-close{position:absolute;top:10px;right:12px;border:0;background:transparent;color:#fff;font-size:22px;cursor:pointer;opacity:.75}.ann-close:hover{opacity:1}
.ann-topbar{position:relative;width:100%;border-left:0;border-right:0;border-radius:0}.ann-topbar .ann-inner{min-height:48px;padding:9px 54px 9px 18px;display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap;text-align:center}.ann-topbar span:not(.ann-badge){color:#ddd;font-size:13px}
.ann-ticker{overflow:hidden;border-left:0;border-right:0;border-radius:0;padding:9px 0;white-space:nowrap}.ann-ticker-track{display:flex;width:max-content;animation:annTicker 30s linear infinite}.ann-ticker-track span{padding-right:80px}.ann-ticker b{color:var(--ann)}
@keyframes annTicker{to{transform:translateX(-50%)}}
.ann-popup-overlay{position:fixed;inset:0;z-index:10000;display:flex;align-items:center;justify-content:center;padding:20px;background:rgba(0,0,0,.72);backdrop-filter:blur(9px)}
.ann-popup-card{position:relative;width:min(540px,100%);padding:38px;border-radius:22px;text-align:center}.ann-popup-card h3{margin:14px 0 10px;font-size:clamp(28px,5vw,44px)}.ann-popup-card p{margin:0 0 24px;color:#d7d7d7;line-height:1.75}
.ann-floating{position:fixed;left:20px;bottom:20px;z-index:9998;width:min(430px,calc(100vw - 40px));padding:22px 48px 22px 22px;border-radius:18px}.ann-floating strong,.ann-toast strong{display:block;margin:10px 0 5px;font-size:18px}.ann-floating p,.ann-toast p{margin:0 0 14px;color:#ccc;line-height:1.55}
#announcementToastRoot{position:fixed;right:20px;bottom:20px;z-index:9998;display:grid;gap:12px;width:min(370px,calc(100vw - 40px))}
.ann-toast{position:relative;padding:18px 46px 18px 18px;border-radius:16px}
.anim-fade{animation:annFade .45s ease both}.anim-slide{animation:annSlide .5s ease both}.anim-zoom{animation:annZoom .42s ease both}.anim-glow{animation:annGlow 1.6s ease-in-out infinite alternate}
@keyframes annFade{from{opacity:0}to{opacity:1}}@keyframes annSlide{from{opacity:0;transform:translateY(-22px)}to{opacity:1;transform:none}}@keyframes annZoom{from{opacity:0;transform:scale(.9)}to{opacity:1;transform:scale(1)}}@keyframes annGlow{from{box-shadow:0 18px 55px rgba(0,0,0,.42)}to{box-shadow:0 18px 70px rgba(var(--ann-rgb),.42)}}
.announcement-preview-box{position:relative;min-height:180px;padding:28px;border:1px solid rgba(246,199,68,.25);border-radius:18px;background:linear-gradient(135deg,rgba(246,199,68,.1),rgba(5,5,5,.96));display:flex;flex-direction:column;align-items:flex-start;justify-content:center;gap:10px}.announcement-preview-box.theme-red{border-color:rgba(255,82,94,.4)}.announcement-preview-box.theme-blue{border-color:rgba(79,156,255,.4)}.announcement-preview-box.theme-green{border-color:rgba(66,211,146,.4)}.announcement-preview-box.theme-purple{border-color:rgba(169,112,255,.4)}
.announcement-preview-badge{padding:5px 9px;border-radius:999px;background:var(--gold);color:#090909;font-size:10px;font-weight:900}.announcement-preview-box p{margin:0;color:#bbb}.announcement-actions{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.announcement-admin-list{display:grid;gap:14px}.announcement-admin-card{display:flex;justify-content:space-between;gap:20px;padding:20px;border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.025)}.announcement-admin-card h4{margin:8px 0}.announcement-admin-card p{margin:0 0 8px;color:#bbb}.announcement-admin-card small{color:#888}.announcement-admin-meta{display:flex;gap:7px;flex-wrap:wrap}.announcement-admin-meta span{padding:4px 7px;border-radius:999px;background:rgba(246,199,68,.08);color:var(--gold);font-size:9px;font-weight:850;letter-spacing:.06em}.announcement-admin-buttons{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.btn-danger{background:rgba(255,70,80,.12)!important;border-color:rgba(255,70,80,.3)!important;color:#ff7b82!important}
@media(max-width:760px){.ann-topbar .ann-inner{justify-content:flex-start;text-align:left}.announcement-admin-card{flex-direction:column}.announcement-admin-buttons{justify-content:flex-start}.ann-popup-card{padding:30px 22px}.ann-floating{left:12px;bottom:12px;width:calc(100vw - 24px)}#announcementToastRoot{right:12px;bottom:12px;width:calc(100vw - 24px)}}


/* =========================================================
   DOSMOS VIP V14.5 — TOURNAMENT BRACKET CENTER
========================================================= */
.field-help{display:block;margin-top:7px;color:#888;font-size:11px;line-height:1.5}
.bracket-create-actions{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.bracket-admin-toolbar{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.bracket-admin-toolbar select{min-width:250px}
.bracket-admin-summary{margin-top:18px;padding:16px 18px;border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.025);display:flex;justify-content:space-between;gap:14px;align-items:center;flex-wrap:wrap}.bracket-admin-summary>div:first-child{display:grid;gap:3px}.bracket-admin-summary strong{font-size:18px}.bracket-admin-summary span{color:#999;font-size:12px}.bracket-summary-pills{display:flex;gap:8px;flex-wrap:wrap}.bracket-summary-pills span{padding:6px 9px;border:1px solid rgba(246,199,68,.18);border-radius:999px;background:rgba(246,199,68,.07);color:var(--gold);font-size:10px;font-weight:850}
.bracket-admin-board{margin-top:16px}.bracket-admin-scroll{overflow:auto;padding:8px 4px 18px;scrollbar-color:rgba(246,199,68,.35) transparent}.bracket-admin-rounds{display:flex;gap:28px;min-width:max-content;align-items:stretch}.bracket-admin-round{width:310px}.bracket-admin-round>h4{position:sticky;top:0;z-index:2;margin:0 0 12px;padding:10px 12px;border-radius:10px;background:#111;color:var(--gold);text-align:center;font-size:12px;letter-spacing:.1em}.bracket-admin-round-stack{display:grid;gap:15px}.bracket-admin-match{padding:14px;border:1px solid var(--line);border-radius:14px;background:linear-gradient(145deg,rgba(255,255,255,.04),rgba(0,0,0,.28))}.bracket-admin-match-meta{display:flex;justify-content:space-between;gap:8px;align-items:center;margin-bottom:10px;color:#888;font-size:10px;text-transform:uppercase}.bracket-admin-match-meta select{width:auto;padding:6px 8px;font-size:10px}.bracket-admin-team{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px;border:1px solid rgba(255,255,255,.06);background:rgba(255,255,255,.025)}.bracket-admin-team+.bracket-admin-team{border-top:0}.bracket-admin-team.is-winner{border-color:rgba(66,211,146,.35);background:rgba(66,211,146,.07)}.bracket-team-identity{display:flex;align-items:center;gap:8px;min-width:0}.bracket-team-identity img,.bracket-team-fallback{width:25px;height:25px;border-radius:7px;object-fit:contain;background:#191919;display:grid;place-items:center;color:var(--gold);font-weight:900}.bracket-team-identity span:last-child{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:185px}.bracket-admin-team input{width:52px;padding:7px;text-align:center}.bracket-match-time{display:grid;gap:6px;margin:10px 0;font-size:10px;color:#888}.bracket-match-time input{padding:8px}.bracket-save-result{width:100%}

/* Public tournament tree */
.bracket-public-head{margin:22px 0 14px;display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}.bracket-public-head select{min-width:min(340px,100%);border:1px solid rgba(246,199,68,.22);border-radius:12px;background:#101010;color:#fff;padding:11px 13px}.bracket-zoom-controls{display:flex;gap:6px}.bracket-zoom-controls button{min-width:42px;height:38px;border:1px solid rgba(246,199,68,.22);border-radius:10px;background:#111;color:#fff;font-weight:900;cursor:pointer}.bracket-zoom-controls button:hover{border-color:var(--gold);color:var(--gold)}
.bracket-viewport{position:relative;width:100%;min-height:500px;overflow:auto;cursor:grab;overscroll-behavior:contain;border:1px solid rgba(246,199,68,.13);border-radius:20px;background:radial-gradient(circle at 50% 0%,rgba(246,199,68,.06),transparent 34%),linear-gradient(180deg,rgba(255,255,255,.015),rgba(0,0,0,.18));scrollbar-color:rgba(246,199,68,.34) transparent}.bracket-viewport.is-dragging{cursor:grabbing;user-select:none}.bracket-stage{position:relative;transform-origin:top left;min-width:max-content;min-height:500px;padding:34px 48px 48px;transition:transform .2s ease}.bracket-tree{position:relative;z-index:2;display:flex;gap:92px;align-items:stretch;min-width:max-content}.bracket-connectors{position:absolute;z-index:1;inset:0;pointer-events:none;overflow:visible}.bracket-connector-path{fill:none;stroke:rgba(246,199,68,.45);stroke-width:2;vector-effect:non-scaling-stroke;filter:drop-shadow(0 0 4px rgba(246,199,68,.18))}
.bracket-round-column{width:250px;display:flex;flex-direction:column}.bracket-round-title{height:54px;margin-bottom:14px;display:flex;justify-content:space-between;align-items:center;gap:8px;border-bottom:1px solid rgba(246,199,68,.18)}.bracket-round-title span{color:var(--gold);font-weight:950;font-size:12px;letter-spacing:.12em}.bracket-round-title small{color:#777;font-size:9px;text-transform:uppercase}.bracket-round-matches{flex:1;display:flex;flex-direction:column;justify-content:space-around;gap:24px;min-height:430px}
.bracket-match-card{position:relative;width:250px;border:1px solid rgba(246,199,68,.2);border-radius:14px;overflow:hidden;background:linear-gradient(145deg,rgba(25,25,25,.98),rgba(7,7,7,.98));box-shadow:0 13px 35px rgba(0,0,0,.28)}.bracket-match-card.is-final{border-color:rgba(246,199,68,.55);box-shadow:0 0 34px rgba(246,199,68,.13)}.bracket-match-card.is-live{border-color:rgba(255,69,78,.65);box-shadow:0 0 30px rgba(255,69,78,.12)}
.bracket-match-top,.bracket-match-bottom{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:7px 10px;color:#777;font-size:8px;text-transform:uppercase;letter-spacing:.06em}.bracket-match-top{border-bottom:1px solid rgba(255,255,255,.05)}.bracket-match-bottom{border-top:1px solid rgba(255,255,255,.05)}.bracket-status{font-weight:900}.bracket-status.status-live{color:#ff5963}.bracket-status.status-finished,.bracket-status.status-bye{color:#42d392}.bracket-status.status-upcoming{color:var(--gold)}
.bracket-team{height:43px;padding:0 10px;display:flex;align-items:center;justify-content:space-between;gap:8px;border-bottom:1px solid rgba(255,255,255,.055)}.bracket-team.is-winner{background:linear-gradient(90deg,rgba(66,211,146,.12),transparent);color:#fff}.bracket-team.is-loser{opacity:.42;filter:saturate(.5)}.bracket-team-main{display:flex;align-items:center;gap:8px;min-width:0}.bracket-team-main img,.bracket-logo-fallback{width:25px;height:25px;object-fit:contain;border-radius:7px;background:#151515;display:grid;place-items:center;color:var(--gold);font-size:10px;font-weight:950;flex:0 0 auto}.bracket-team-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px;font-weight:760}.bracket-score{font-size:15px;color:#fff}.bracket-team.is-winner .bracket-score{color:#42d392}
.bracket-champion-column{width:260px;display:flex;flex-direction:column}.bracket-champion-card{margin:auto 0;padding:28px 20px;border:1px solid rgba(246,199,68,.55);border-radius:20px;background:radial-gradient(circle at 50% 0%,rgba(246,199,68,.22),transparent 55%),#0b0b0b;text-align:center;box-shadow:0 0 50px rgba(246,199,68,.13)}.bracket-champion-card img{width:76px;height:76px;object-fit:contain;margin:5px auto 12px}.bracket-champion-card strong{display:block;color:#fff;font-size:24px}.bracket-champion-card span{display:block;margin-top:5px;color:var(--gold);font-size:10px;text-transform:uppercase;letter-spacing:.1em}.bracket-trophy{font-size:45px;filter:drop-shadow(0 0 14px rgba(246,199,68,.35))}
.bracket-mobile-hint{margin-top:10px;color:#777;font-size:10px;text-align:center}
@media(max-width:760px){.bracket-admin-toolbar{width:100%}.bracket-admin-toolbar select{width:100%;min-width:0}.bracket-admin-summary{align-items:flex-start}.bracket-stage{padding:24px 30px 36px}.bracket-tree{gap:72px}.bracket-round-column,.bracket-match-card{width:225px}.bracket-viewport{min-height:450px}.bracket-public-head select{width:100%}.bracket-zoom-controls{width:100%;justify-content:flex-end}}


/* =========================================================
   DOSMOS VIP V14.6 — MEDIA LIBRARY PRO
========================================================= */
.media-stat-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}
.media-stat-card{padding:16px;border:1px solid var(--line);border-radius:14px;background:linear-gradient(145deg,rgba(246,199,68,.065),rgba(255,255,255,.018));display:grid;gap:6px}
.media-stat-card span{color:#888;font-size:10px;text-transform:uppercase;letter-spacing:.08em}
.media-stat-card strong{font-size:24px;color:#fff}
.media-upload-form{padding-top:20px;border-top:1px solid var(--line)}
.media-upload-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.media-library-toolbar{display:grid;grid-template-columns:minmax(220px,1fr) repeat(3,minmax(145px,190px));gap:10px;margin:20px 0 12px}
.media-picker-bar{padding:14px 16px;margin-bottom:18px;border:1px solid rgba(246,199,68,.17);border-radius:14px;background:rgba(246,199,68,.045);display:flex;justify-content:space-between;align-items:center;gap:16px}
.media-picker-bar>div{display:grid;gap:3px}.media-picker-bar strong{font-size:12px}.media-picker-bar small{color:#888}.media-picker-bar select{min-width:290px}
.media-library-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:16px}
.media-grid-empty{grid-column:1/-1}
.media-card{overflow:hidden;border:1px solid var(--line);border-radius:17px;background:linear-gradient(160deg,rgba(255,255,255,.035),rgba(0,0,0,.25));transition:.2s ease}
.media-card:hover{transform:translateY(-3px);border-color:rgba(246,199,68,.3);box-shadow:0 18px 42px rgba(0,0,0,.25)}
.media-card.status-hidden{opacity:.74}.media-card.status-archive{opacity:.55;filter:saturate(.65)}
.media-card-image{position:relative;height:170px;background:#080808;overflow:hidden}
.media-card-image img{width:100%;height:100%;object-fit:cover;display:block}
.media-status-badge{position:absolute;top:10px;right:10px;padding:5px 8px;border-radius:999px;background:#42d392;color:#07110d;font-size:9px;font-weight:950;letter-spacing:.08em}
.status-hidden .media-status-badge{background:#888;color:#111}.status-archive .media-status-badge{background:#7b6d9c;color:#fff}
.media-card-body{padding:14px}.media-card-body h4{margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-size:14px}
.media-card-meta{display:flex;justify-content:space-between;gap:8px;margin:8px 0;color:var(--gold);font-size:9px;font-weight:850;letter-spacing:.06em}
.media-card-body>small{display:block;color:#777;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.media-card-actions{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:13px}
.media-card-actions .btn:first-child{grid-column:1/-1}
.media-card-actions .btn{padding:8px 9px;font-size:10px}
.media-status-actions{display:grid;grid-template-columns:repeat(4,1fr);gap:5px;margin-top:9px}
.media-status-actions button{padding:7px 3px;border:1px solid rgba(255,255,255,.08);border-radius:8px;background:rgba(255,255,255,.025);color:#888;font-size:8px;font-weight:800;cursor:pointer}
.media-status-actions button:hover,.media-status-actions button.current{border-color:rgba(246,199,68,.3);color:var(--gold);background:rgba(246,199,68,.07)}
.media-status-actions .media-delete-action:hover{border-color:rgba(255,73,83,.3);color:#ff737b;background:rgba(255,73,83,.07)}
@media(max-width:980px){.media-stat-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.media-library-toolbar{grid-template-columns:1fr 1fr}.media-picker-bar{align-items:flex-start;flex-direction:column}.media-picker-bar select{width:100%;min-width:0}}
@media(max-width:560px){.media-stat-grid{grid-template-columns:1fr 1fr}.media-library-toolbar{grid-template-columns:1fr}.media-library-grid{grid-template-columns:1fr}.media-card-image{height:210px}}


/* =========================================================
   DOSMOS VIP V15.1 — THEME STUDIO ULTRA
========================================================= */
#themeStudioTab{padding:0!important}
.theme-ultra-shell{
  width:100%;
  display:grid;
  gap:20px;
}
.theme-ultra-header{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:24px;
  padding:24px;
  border:1px solid rgba(255,255,255,.07);
  border-radius:18px;
  background:
    radial-gradient(circle at 10% 0%,rgba(246,199,68,.09),transparent 30%),
    linear-gradient(145deg,#111,#0b0b0b);
}
.theme-ultra-header h2{
  margin:5px 0 8px;
  font-family:"Cinzel",serif;
  font-size:30px;
}
.theme-ultra-header p{
  max-width:680px;
  margin:0;
  color:#888;
  line-height:1.65;
  font-size:11px;
}
.theme-ultra-header-actions{display:flex;gap:10px;flex-wrap:wrap}
.theme-ultra-workspace{
  display:grid;
  grid-template-columns:360px minmax(0,1fr);
  gap:20px;
  align-items:start;
}
.theme-ultra-controls,.theme-ultra-preview-area{display:grid;gap:16px}
.theme-ultra-card{
  padding:18px;
  border:1px solid rgba(255,255,255,.075);
  border-radius:16px;
  background:linear-gradient(145deg,#101010,#0a0a0a);
  box-shadow:0 16px 50px rgba(0,0,0,.18);
}
.theme-ultra-card-head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  margin-bottom:16px;
}
.theme-ultra-card-head>div{display:flex;align-items:center;gap:9px}
.theme-ultra-card-head span{
  width:27px;height:27px;
  display:grid;place-items:center;
  border:1px solid rgba(246,199,68,.22);
  border-radius:8px;
  color:var(--gold);
  font-size:8px;
  font-weight:900;
}
.theme-ultra-card-head h3{margin:0;font-size:11px;letter-spacing:.03em}
.theme-ultra-card-head>small{color:#666;font-size:8px}
.theme-ultra-presets{display:grid;gap:8px}
.theme-ultra-presets button{
  width:100%;
  display:grid;
  grid-template-columns:34px 1fr;
  align-items:center;
  gap:11px;
  padding:11px;
  border:1px solid rgba(255,255,255,.07);
  border-radius:11px;
  background:#0b0b0b;
  color:#fff;
  text-align:left;
  cursor:pointer;
  transition:.22s ease;
}
.theme-ultra-presets button:hover,
.theme-ultra-presets button.active{
  border-color:rgba(246,199,68,.42);
  background:rgba(246,199,68,.055);
  transform:translateX(3px);
}
.theme-ultra-presets button>span{display:grid;gap:2px}
.theme-ultra-presets strong{font-size:9px}
.theme-ultra-presets small{font-size:7px;color:#777}
.theme-swatch{
  width:32px;height:32px;border-radius:9px;
  display:block;
  box-shadow:inset 0 0 15px rgba(255,255,255,.13),0 0 16px rgba(0,0,0,.35);
}
.swatch-gold{background:linear-gradient(135deg,#f6c744,#9b7208)}
.swatch-blue{background:linear-gradient(135deg,#38a7ff,#0d4e93)}
.swatch-red{background:linear-gradient(135deg,#ff4c4c,#8f1111)}
.swatch-purple{background:linear-gradient(135deg,#b86cff,#5f2498)}
.swatch-emerald{background:linear-gradient(135deg,#34d399,#08785b)}
.swatch-cyber{background:linear-gradient(135deg,#00f0ff,#7b2cff)}
.theme-ultra-colors{display:grid;gap:9px}
.theme-ultra-colors label{
  min-height:52px;
  display:grid;
  grid-template-columns:1fr 42px;
  align-items:center;
  gap:12px;
  padding:9px 10px;
  border:1px solid rgba(255,255,255,.065);
  border-radius:10px;
  background:#0b0b0b;
}
.theme-ultra-colors label>span{display:grid;gap:2px}
.theme-ultra-colors b{font-size:9px}
.theme-ultra-colors small{font-size:7px;color:#6d6d6d}
.theme-ultra-colors input[type="color"]{
  width:42px;height:34px;
  padding:2px;
  border:1px solid rgba(255,255,255,.11);
  border-radius:8px;
  background:#111;
  cursor:pointer;
}
.theme-ultra-selects{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.theme-ultra-selects label{display:grid;gap:6px;color:#777;font-size:8px}
.theme-ultra-selects select{width:100%;min-height:38px}
.theme-ultra-preview-toolbar{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:18px;
  padding:14px 16px;
  border:1px solid rgba(255,255,255,.075);
  border-radius:14px;
  background:#0d0d0d;
}
.theme-ultra-preview-toolbar>div:first-child{display:grid;gap:3px}
.theme-ultra-preview-toolbar strong{font-size:10px}
.theme-ultra-preview-toolbar small{font-size:8px;color:#6d6d6d}
.theme-device-switcher{
  display:flex;
  gap:4px;
  padding:4px;
  border:1px solid rgba(255,255,255,.07);
  border-radius:10px;
  background:#080808;
}
.theme-device-switcher button{
  min-height:30px;
  padding:0 11px;
  border:0;
  border-radius:7px;
  background:transparent;
  color:#777;
  font-size:8px;
  cursor:pointer;
}
.theme-device-switcher button.active{
  background:var(--gold);
  color:#070707;
  font-weight:900;
}
.theme-preview-stage{
  min-height:590px;
  display:grid;
  place-items:center;
  padding:24px;
  border:1px solid rgba(255,255,255,.075);
  border-radius:18px;
  background:
    linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px),
    linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),
    #080808;
  background-size:24px 24px;
  overflow:auto;
}
.theme-live-preview{
  width:100%;
  max-width:100%;
  min-height:0!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
  transition:width .3s ease;
}
.theme-live-preview[data-preview-size="tablet"]{width:720px}
.theme-live-preview[data-preview-size="mobile"]{width:390px}
.theme-preview-browser{
  width:100%;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.11);
  border-radius:15px;
  background:var(--preview-bg);
  box-shadow:0 28px 90px rgba(0,0,0,.45);
}
.theme-preview-browser-bar{
  height:36px;
  display:flex;
  align-items:center;
  gap:6px;
  padding:0 12px;
  border-bottom:1px solid rgba(255,255,255,.07);
  background:#111;
}
.theme-preview-browser-bar>span{
  width:7px;height:7px;border-radius:50%;background:#444
}
.theme-preview-browser-bar>div{
  margin-left:8px;
  flex:1;
  padding:5px 10px;
  border-radius:6px;
  background:#090909;
  color:#666;
  font-size:7px;
}
.theme-preview-site{background:var(--preview-bg);color:var(--preview-text)}
.theme-preview-topbar{
  min-height:42px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:0 22px;
  border-bottom:1px solid color-mix(in srgb,var(--preview-primary) 16%,transparent);
}
.theme-preview-topbar strong{color:var(--preview-primary);font-size:12px}
.theme-preview-topbar nav{font-size:7px;color:var(--preview-muted)}
.theme-preview-hero{
  min-height:250px;
  display:grid;
  place-items:center;
  align-content:center;
  padding:35px 20px;
  text-align:center;
  background:
    radial-gradient(circle at 50% 40%,color-mix(in srgb,var(--preview-primary) 16%,transparent),transparent 48%),
    linear-gradient(180deg,rgba(255,255,255,.02),transparent);
}
.theme-preview-hero h2{
  margin:6px 0 2px;
  font-family:"Cinzel",serif;
  font-size:46px;
  color:var(--preview-primary);
}
.theme-preview-hero p{margin:0;color:var(--preview-muted);font-size:9px}
.theme-preview-actions{display:flex;justify-content:center;gap:7px;margin-top:16px}
.theme-preview-actions button{min-width:90px}
.theme-preview-section{padding:22px}
.theme-preview-section-head{display:flex;justify-content:space-between;align-items:end;margin-bottom:13px}
.theme-preview-section-head>div{display:grid;gap:2px}
.theme-preview-section-head small{font-size:6px;color:var(--preview-primary)}
.theme-preview-section-head strong{font-family:"Cinzel",serif;font-size:16px}
.theme-preview-section-head>span{font-size:7px;color:var(--preview-primary)}
.theme-preview-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.theme-preview-cards article{min-height:100px}
.theme-preview-footer{
  padding:14px 20px;
  border-top:1px solid rgba(255,255,255,.06);
  color:var(--preview-muted);
  font-size:7px;
  text-align:center;
}
.theme-live-preview[data-preview-size="mobile"] .theme-preview-topbar nav{display:none}
.theme-live-preview[data-preview-size="mobile"] .theme-preview-cards{grid-template-columns:1fr}
.theme-live-preview[data-preview-size="mobile"] .theme-preview-hero h2{font-size:36px}
.theme-live-preview[data-preview-size="tablet"] .theme-preview-cards{grid-template-columns:repeat(2,1fr)}
.theme-effects-card{padding:18px}
.theme-ultra-effects{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.theme-ultra-effects label{position:relative}
.theme-ultra-effects input{
  position:absolute;
  opacity:0;
  pointer-events:none;
}
.theme-ultra-effects label>span{
  min-height:112px;
  display:grid;
  align-content:start;
  gap:5px;
  padding:14px;
  border:1px solid rgba(255,255,255,.075);
  border-radius:12px;
  background:#0b0b0b;
  cursor:pointer;
  transition:.22s ease;
}
.theme-ultra-effects i{font-style:normal;font-size:20px}
.theme-ultra-effects b{font-size:9px}
.theme-ultra-effects small{color:#6f6f6f;font-size:7px;line-height:1.5}
.theme-ultra-effects input:checked+span{
  border-color:rgba(246,199,68,.45);
  background:rgba(246,199,68,.055);
  box-shadow:inset 0 0 22px rgba(246,199,68,.035);
}
.theme-ultra-effects input:checked+span:after{
  content:"ON";
  position:absolute;
  top:10px;right:10px;
  padding:4px 6px;
  border-radius:999px;
  background:var(--gold);
  color:#070707;
  font-size:6px;
  font-weight:900;
}
.theme-ultra-footer-note{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:15px;
  padding:14px 16px;
  border:1px solid rgba(246,199,68,.16);
  border-radius:12px;
  background:rgba(246,199,68,.035);
}
.theme-ultra-footer-note>div:first-child{display:grid;gap:3px}
.theme-ultra-footer-note strong{font-size:9px;color:var(--gold)}
.theme-ultra-footer-note span{font-size:7px;color:#777}
#themeStudioTab .message{margin:0}
@media(max-width:1150px){
  .theme-ultra-workspace{grid-template-columns:320px minmax(0,1fr)}
  .theme-ultra-effects{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:920px){
  .theme-ultra-workspace{grid-template-columns:1fr}
  .theme-ultra-controls{grid-template-columns:1fr 1fr}
  .theme-ultra-controls .theme-ultra-card:first-child{grid-column:1/-1}
}
@media(max-width:680px){
  .theme-ultra-header{align-items:flex-start;flex-direction:column}
  .theme-ultra-header-actions{width:100%}
  .theme-ultra-header-actions .btn{flex:1}
  .theme-ultra-controls{grid-template-columns:1fr}
  .theme-ultra-controls .theme-ultra-card:first-child{grid-column:auto}
  .theme-ultra-selects{grid-template-columns:1fr}
  .theme-ultra-effects{grid-template-columns:1fr}
  .theme-ultra-preview-toolbar{align-items:flex-start;flex-direction:column}
  .theme-device-switcher{width:100%}
  .theme-device-switcher button{flex:1}
  .theme-preview-stage{padding:12px;min-height:480px}
  .theme-live-preview[data-preview-size="tablet"],
  .theme-live-preview[data-preview-size="mobile"]{width:100%}
  .theme-ultra-footer-note{align-items:flex-start;flex-direction:column}
}


/* =========================================================
   DOSMOS VIP V16.0 — ADMIN POLISH + USER MANAGEMENT PRO
========================================================= */
:root{
  --admin-card:#101010;
  --admin-card-2:#0b0b0b;
  --admin-line:rgba(255,255,255,.09);
  --admin-soft:rgba(246,199,68,.055);
}
.admin-main{min-width:0}
#themeStudioTab .theme-ultra-shell,
#userManagementTab .user-pro-shell{font-family:"Inter",sans-serif}
#themeStudioTab .theme-ultra-header,
#themeStudioTab .theme-ultra-card,
#themeStudioTab .theme-ultra-preview-toolbar,
#themeStudioTab .theme-preview-stage{
  box-sizing:border-box;
}
#themeStudioTab input,
#themeStudioTab select,
#themeStudioTab button{
  font-family:"Inter",sans-serif;
}
#themeStudioTab .theme-ultra-presets button{
  appearance:none;
  -webkit-appearance:none;
}
.user-pro-shell{display:grid;gap:18px}
.user-pro-header{
  display:flex;justify-content:space-between;align-items:flex-end;gap:20px;
  padding:24px;border:1px solid var(--admin-line);border-radius:18px;
  background:
    radial-gradient(circle at 10% 0%,rgba(246,199,68,.1),transparent 35%),
    linear-gradient(145deg,#111,#090909);
}
.user-pro-header h2{margin:5px 0 8px;font-family:"Cinzel",serif;font-size:28px}
.user-pro-header p{margin:0;color:#858585;font-size:11px;line-height:1.6}
.user-pro-stats{
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;
}
.user-pro-stat{
  padding:17px;border:1px solid var(--admin-line);border-radius:14px;
  background:linear-gradient(145deg,#101010,#0a0a0a);
}
.user-pro-stat span{display:block;color:#737373;font-size:8px;text-transform:uppercase;letter-spacing:.12em}
.user-pro-stat strong{display:block;margin-top:7px;color:#fff;font-size:24px;font-family:"Cinzel",serif}
.user-pro-grid{
  display:grid;grid-template-columns:360px minmax(0,1fr);gap:18px;align-items:start;
}
.user-pro-card{
  padding:19px;border:1px solid var(--admin-line);border-radius:16px;
  background:linear-gradient(145deg,#101010,#090909);
  box-shadow:0 18px 55px rgba(0,0,0,.2);
}
.user-pro-card-head{
  display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:16px;
}
.user-pro-card-head h3{margin:0;font-size:12px}
.user-pro-card-head small{color:#717171;font-size:8px}
.user-create-form{display:grid;gap:11px}
.user-create-form label{display:grid;gap:6px;font-size:8px;color:#a3a3a3}
.user-create-form input,.user-create-form select{
  width:100%;box-sizing:border-box;min-height:42px;
  border:1px solid rgba(255,255,255,.1);border-radius:10px;
  background:#090909;color:#fff;padding:0 12px;
}
.user-create-form input:focus,.user-create-form select:focus{
  outline:none;border-color:rgba(246,199,68,.55);
  box-shadow:0 0 0 3px rgba(246,199,68,.07);
}
.user-create-form .user-password-row{display:grid;grid-template-columns:1fr auto;gap:8px}
.user-create-form .user-password-row button{min-width:92px}
.user-pro-toolbar{
  display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:14px;
}
.user-pro-search{
  flex:1;min-height:40px;border:1px solid var(--admin-line);border-radius:10px;
  background:#080808;color:#fff;padding:0 12px;
}
.user-pro-filter{
  min-height:40px;border:1px solid var(--admin-line);border-radius:10px;
  background:#080808;color:#fff;padding:0 10px;
}
.user-list{display:grid;gap:9px}
.user-row{
  display:grid;grid-template-columns:minmax(180px,1.4fr) 120px 100px 130px;
  align-items:center;gap:12px;padding:12px;
  border:1px solid rgba(255,255,255,.07);border-radius:12px;background:#0a0a0a;
}
.user-identity{display:grid;grid-template-columns:38px 1fr;align-items:center;gap:10px;min-width:0}
.user-avatar{
  width:38px;height:38px;display:grid;place-items:center;border-radius:11px;
  color:#090909;background:linear-gradient(135deg,#f7df7c,#b58308);
  font-weight:900;font-size:13px;
}
.user-identity>div{min-width:0;display:grid;gap:3px}
.user-identity strong,.user-identity small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.user-identity strong{font-size:9px}
.user-identity small{font-size:7px;color:#747474}
.role-badge,.status-badge,.protected-badge{
  width:max-content;padding:5px 7px;border-radius:999px;font-size:7px;font-weight:900;
}
.role-badge{border:1px solid rgba(246,199,68,.2);background:rgba(246,199,68,.07);color:#f6c744}
.status-badge.active{background:rgba(34,197,94,.1);color:#5ee78b;border:1px solid rgba(34,197,94,.25)}
.status-badge.suspended{background:rgba(239,68,68,.1);color:#ff7b7b;border:1px solid rgba(239,68,68,.25)}
.protected-badge{background:rgba(59,130,246,.1);color:#7cb5ff;border:1px solid rgba(59,130,246,.25)}
.user-actions{display:flex;justify-content:flex-end;gap:6px;flex-wrap:wrap}
.user-action-btn{
  min-height:30px;padding:0 8px;border:1px solid var(--admin-line);border-radius:8px;
  background:#111;color:#d0d0d0;font-size:7px;cursor:pointer;
}
.user-action-btn:hover{border-color:rgba(246,199,68,.4);color:#fff}
.user-action-btn.danger:hover{border-color:rgba(239,68,68,.45);color:#ff8585}
.user-action-btn:disabled{opacity:.35;cursor:not-allowed}
.user-empty{
  padding:32px;border:1px dashed rgba(255,255,255,.12);border-radius:12px;
  text-align:center;color:#707070;font-size:9px;
}
.user-security-note{
  display:grid;grid-template-columns:auto 1fr;gap:10px;padding:13px;
  border:1px solid rgba(246,199,68,.15);border-radius:11px;background:rgba(246,199,68,.035);
}
.user-security-note i{font-style:normal;font-size:18px}
.user-security-note strong{display:block;color:#f6c744;font-size:8px;margin-bottom:3px}
.user-security-note span{display:block;color:#777;font-size:7px;line-height:1.5}
.user-edit-modal{
  position:fixed;inset:0;z-index:9999;display:none;place-items:center;padding:18px;
  background:rgba(0,0,0,.78);backdrop-filter:blur(8px);
}
.user-edit-modal.open{display:grid}
.user-edit-dialog{
  width:min(480px,100%);padding:22px;border:1px solid rgba(255,255,255,.11);
  border-radius:17px;background:#0d0d0d;box-shadow:0 30px 100px rgba(0,0,0,.65);
}
.user-edit-dialog-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}
.user-edit-dialog h3{margin:0;font-size:13px}
.user-edit-close{
  width:32px;height:32px;border:1px solid var(--admin-line);border-radius:9px;
  background:#111;color:#fff;cursor:pointer;
}
@media(max-width:1100px){
  .user-pro-grid{grid-template-columns:320px minmax(0,1fr)}
  .user-row{grid-template-columns:minmax(170px,1fr) 110px 90px}
  .user-actions{grid-column:1/-1;justify-content:flex-start;padding-left:48px}
}
@media(max-width:850px){
  .user-pro-grid{grid-template-columns:1fr}
  .user-pro-stats{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:620px){
  .user-pro-header{align-items:flex-start;flex-direction:column}
  .user-pro-header .btn{width:100%}
  .user-pro-toolbar{align-items:stretch;flex-direction:column}
  .user-row{grid-template-columns:1fr 1fr}
  .user-identity{grid-column:1/-1}
  .user-actions{grid-column:1/-1;padding-left:0}
}