@import url('https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700;800;900&family=JetBrains+Mono:wght@400;600&display=swap');

:root{
  --ui-cyan:#00d4ff;
  --ui-cyan2:#00b8e0;
  --ui-gold:#f7b731;
  --ui-green:#00e676;
  --ui-red:#ff4d6d;
  --ui-bg:#0d1117;
  --ui-bg2:#0f1923;
  --ui-card:#131d2a;
  --ui-card2:#192534;
  --ui-border:rgba(255,255,255,.075);
  --ui-border-cyan:rgba(0,212,255,.14);
  --ui-text:#e2e8f0;
  --ui-muted:#8ba3b8;
  --ui-radius:14px;
  --ui-radius-sm:9px;
  --ui-font:'Outfit',system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --ui-mono:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
}

html,body{
  font-family:var(--ui-font)!important;
  background:
    radial-gradient(900px 500px at 15% -120px,rgba(0,212,255,.055),transparent 60%),
    linear-gradient(180deg,var(--ui-bg),var(--ui-bg2))!important;
  color:var(--ui-text)!important;
  -webkit-font-smoothing:antialiased;
}
body{min-height:100vh;}

/* Page header below the global ui_tabs bar */
html body .topbar,
html body header.help-head,
html body header.header{
  font-family:var(--ui-font)!important;
  color:var(--ui-text)!important;
  background:rgba(13,17,23,.96)!important;
  border:0!important;
  border-bottom:1px solid var(--ui-border-cyan)!important;
  box-shadow:0 5px 18px rgba(0,0,0,.14)!important;
  backdrop-filter:none!important;
}
html body .topbar{
  min-height:50px!important;
  padding:8px 10px!important;
  display:flex!important;
  align-items:center!important;
  gap:10px!important;
  flex-wrap:wrap!important;
  box-sizing:border-box!important;
}
html body .topbar h1,
html body .topbar h1.section-title,
html body .topbar .section-title,
html body header.help-head h1,
html body header.header h1{
  flex:1 1 auto!important;
  min-width:0!important;
  margin:0!important;
  font-family:var(--ui-font)!important;
  font-size:20px!important;
  line-height:1.08!important;
  font-weight:850!important;
  letter-spacing:-.2px!important;
  text-transform:none!important;
  text-shadow:none!important;
  background:linear-gradient(100deg,#fff 30%,var(--ui-cyan) 100%)!important;
  -webkit-background-clip:text!important;
  background-clip:text!important;
  -webkit-text-fill-color:transparent!important;
  color:transparent!important;
}
html body .topbar h1 .small-muted,
html body .topbar .small-muted,
html body .topbar small{
  display:block!important;
  margin-top:3px!important;
  color:var(--ui-muted)!important;
  -webkit-text-fill-color:var(--ui-muted)!important;
  background:none!important;
  font-size:.78rem!important;
  line-height:1.2!important;
  font-weight:500!important;
  letter-spacing:0!important;
  text-transform:none!important;
}

/* Main page rhythm */
html body .wrap,
html body main,
html body .container{
  color:var(--ui-text);
}
html body .wrap{padding-top:12px!important;}

/* Cards / panels */
html body .card,
html body .panel,
html body .box,
html body .mode-card,
html body .help-card,
html body .stat-card,
html body .kpi-card{
  font-family:var(--ui-font)!important;
  color:var(--ui-text)!important;
  background:var(--ui-card)!important;
  border:1px solid var(--ui-border)!important;
  border-radius:var(--ui-radius)!important;
  box-shadow:0 1px 3px rgba(0,0,0,.35),0 7px 22px rgba(0,0,0,.18)!important;
}
html body .card{margin-bottom:12px;}

/* Section titles */
html body h2.section-title,
html body h3.section-title,
html body .card > h2,
html body .card > h3,
html body .card-h,
html body .card-h > span:first-child,
html body .panel-title,
html body .title,
html body .h2{
  font-family:var(--ui-font)!important;
  color:var(--ui-cyan)!important;
  text-shadow:0 0 18px rgba(0,212,255,.16)!important;
}
html body h2.section-title,
html body h3.section-title,
html body .card > h2,
html body .card > h3,
html body .panel-title,
html body .title,
html body .h2{
  font-size:.96rem!important;
  line-height:1.2!important;
  font-weight:700!important;
  letter-spacing:.075em!important;
  text-transform:uppercase!important;
  margin-top:0!important;
  margin-bottom:10px!important;
}
html body h1:not(.section-title):not(.hh-title){font-family:var(--ui-font);}
html body .small-muted,
html body .muted,
html body .hint,
html body .sub,
html body small{color:var(--ui-muted)!important;}

/* Buttons */
html body a.btn,
html body button:not(.lfAvatarBtn):not(.lfPushBellBtn),
html body input[type=submit],
html body input[type=button],
html body .btn,
html body .btn-sm,
html body .button{
  font-family:var(--ui-font)!important;
  font-size:.82rem!important;
  line-height:1.15!important;
  font-weight:650!important;
  border-radius:var(--ui-radius-sm)!important;
  min-height:34px;
  padding:7px 11px!important;
  box-sizing:border-box!important;
  transition:background .14s ease,border-color .14s ease,color .14s ease,transform .08s ease!important;
}
html body .btn:not(.btn-green):not(.btn-red):not(.btn-amber):not(.btn-blue):not(.btn-primary):not(.danger):not(.primary),
html body .btn-sm,
html body .button,
html body button:not(.lfAvatarBtn):not(.lfPushBellBtn):not(.danger):not(.primary),
html body input[type=button]{
  background:rgba(255,255,255,.055)!important;
  border:1px solid rgba(255,255,255,.10)!important;
  color:var(--ui-text)!important;
}
html body .btn:hover,
html body .btn-sm:hover,
html body .button:hover,
html body button:not(.lfAvatarBtn):not(.lfPushBellBtn):hover{
  border-color:rgba(0,212,255,.32)!important;
  background:rgba(0,212,255,.10)!important;
  color:#fff!important;
}
html body .btn-primary,
html body .btn.primary,
html body button.primary,
html body input[type=submit]:not(.danger){
  background:linear-gradient(135deg,var(--ui-cyan),var(--ui-cyan2))!important;
  border:1px solid transparent!important;
  color:#00131b!important;
  font-weight:750!important;
  box-shadow:0 2px 11px rgba(0,212,255,.20)!important;
}
html body .btn-green{background:rgba(0,230,118,.12)!important;border:1px solid rgba(0,230,118,.28)!important;color:#a7f3d0!important;}
html body .btn-red,
html body .danger,
html body button.danger,
html body input[type=submit].danger{background:rgba(255,77,109,.11)!important;border:1px solid rgba(255,77,109,.28)!important;color:#ff9aac!important;}
html body .btn-amber,
html body .warning-action{background:rgba(247,183,49,.10)!important;border:1px solid rgba(247,183,49,.25)!important;color:#fde68a!important;}
html body .btn-blue{background:rgba(0,212,255,.10)!important;border:1px solid rgba(0,212,255,.25)!important;color:var(--ui-cyan)!important;}
html body button:disabled,
html body .btn.disabled,
html body .btn[disabled]{opacity:.38!important;cursor:not-allowed!important;transform:none!important;}

/* Forms */
html body input[type=text],
html body input[type=email],
html body input[type=password],
html body input[type=number],
html body input[type=date],
html body input[type=datetime-local],
html body input[type=time],
html body input[type=search],
html body select,
html body textarea{
  font-family:var(--ui-font)!important;
  font-size:.88rem!important;
  color:var(--ui-text)!important;
  background:#0a101a!important;
  border:1px solid rgba(255,255,255,.12)!important;
  border-radius:var(--ui-radius-sm)!important;
  min-height:36px;
  box-sizing:border-box!important;
}
html body textarea{min-height:78px;}
html body input:focus,
html body select:focus,
html body textarea:focus{
  outline:none!important;
  border-color:rgba(0,212,255,.44)!important;
  box-shadow:0 0 0 3px rgba(0,212,255,.08)!important;
}
html body label{font-family:var(--ui-font)!important;color:#a9bdcc!important;font-size:.82rem!important;font-weight:550!important;}
html body fieldset{border:1px solid var(--ui-border)!important;border-radius:var(--ui-radius)!important;}
html body legend{color:var(--ui-cyan)!important;font-family:var(--ui-font)!important;font-size:.76rem!important;font-weight:700!important;letter-spacing:.07em!important;text-transform:uppercase!important;}

/* Tables */
html body .table-wrap{overflow-x:auto!important;-webkit-overflow-scrolling:touch;background:var(--ui-card)!important;border:1px solid var(--ui-border)!important;border-radius:var(--ui-radius)!important;}
html body table{font-family:var(--ui-font)!important;color:var(--ui-text)!important;}
html body th,
html body td{border-color:rgba(255,255,255,.06)!important;}
html body thead th{
  background:var(--ui-card2)!important;
  color:#9ab0c0!important;
  font-size:.70rem!important;
  font-weight:700!important;
  letter-spacing:.055em!important;
  text-transform:uppercase!important;
  border-bottom:1px solid rgba(0,212,255,.10)!important;
}
html body tbody tr:hover td{background:rgba(255,255,255,.025)!important;}

/* Messages */
html body .error,
html body .alert-error{background:rgba(255,77,109,.075)!important;border:1px solid rgba(255,77,109,.23)!important;color:#ffabb9!important;border-radius:var(--ui-radius-sm)!important;padding:9px 11px!important;}
html body .flash,
html body .success,
html body .ok{background:rgba(0,230,118,.065)!important;border:1px solid rgba(0,230,118,.20)!important;color:#a7f3d0!important;border-radius:var(--ui-radius-sm)!important;padding:9px 11px!important;}
html body .notice,
html body .notice-info,
html body .info,
html body .alert-info{background:rgba(0,212,255,.055)!important;border:1px solid rgba(0,212,255,.16)!important;color:#a8efff!important;border-radius:var(--ui-radius-sm)!important;padding:9px 11px!important;}
html body .warning,
html body .warn{background:rgba(247,183,49,.065)!important;border:1px solid rgba(247,183,49,.20)!important;color:#fde68a!important;border-radius:var(--ui-radius-sm)!important;padding:9px 11px!important;}

/* Pills / badges */
html body .badge,
html body .pill,
html body .chip,
html body [class*="badge-"]{
  font-family:var(--ui-font)!important;
  border-radius:999px!important;
  font-size:.69rem!important;
  font-weight:650!important;
  line-height:1.2!important;
}

/* Links */
html body a:not(.btn):not(.button){color:var(--ui-cyan)!important;}
html body a:not(.btn):not(.button):hover{color:#fff!important;}
html body hr{border-color:var(--ui-border)!important;}

/* Admin / monitoring blocks */
html body .stats-wide,
html body .admin-section,
html body .kpi-box,
html body .monitor-box{background:var(--ui-card)!important;border-color:var(--ui-border)!important;border-radius:var(--ui-radius)!important;}
html body pre,
html body code{font-family:var(--ui-mono)!important;}
html body pre{background:#09101a!important;color:#cfeef5!important;border:1px solid var(--ui-border)!important;border-radius:10px!important;}

/* Help page */
html body .help-head{padding:10px 14px!important;}
html body .help-head .hh-title{font-family:var(--ui-font)!important;font-size:20px!important;font-weight:850!important;color:var(--ui-text)!important;}
html body .help-head .hh-sub{color:var(--ui-muted)!important;}
html body .help-card h2{color:var(--ui-cyan)!important;font-size:1rem!important;}

/* choose_mode legacy header */
html body header.header{min-height:54px!important;padding:8px 12px!important;}

/* Scrollbars */
html body ::-webkit-scrollbar{width:6px;height:6px;}
html body ::-webkit-scrollbar-track{background:rgba(255,255,255,.02);}
html body ::-webkit-scrollbar-thumb{background:rgba(0,212,255,.19);border-radius:99px;}
html body ::-webkit-scrollbar-thumb:hover{background:rgba(0,212,255,.34);}

@media(max-width:700px){
  html body .topbar{padding:7px 8px!important;gap:7px!important;}
  html body .topbar h1,
  html body .topbar h1.section-title,
  html body .topbar .section-title,
  html body header.help-head h1,
  html body header.header h1{font-size:18px!important;}
  html body h2.section-title,
  html body h3.section-title,
  html body .card > h2,
  html body .card > h3,
  html body .panel-title,
  html body .title,
  html body .h2{font-size:.82rem!important;letter-spacing:.055em!important;}
  html body .card{border-radius:12px!important;}
  html body a.btn,
  html body button:not(.lfAvatarBtn):not(.lfPushBellBtn),
  html body input[type=submit],
  html body input[type=button],
  html body .btn,
  html body .btn-sm{font-size:.78rem!important;min-height:32px;padding:6px 9px!important;}
  html body thead th{font-size:.65rem!important;}
}


/* =============================================================
   UI 20.1 — compact admin, topbar returns, button contrast
   ============================================================= */

/* A topbar is always one line: title/context left, navigation right. */
html body .topbar,
html body header.head,
html body header.help-head{
  flex-wrap:nowrap!important;
  align-items:center!important;
}
html body .topbar > h1,
html body .topbar > .section-title,
html body header.head > div:first-child,
html body header.help-head > div:first-child{
  flex:1 1 0!important;
  min-width:0!important;
}
html body .topbar > .icon-stack,
html body .topbar > .ui-topbar-return,
html body header.head > .icon-stack,
html body header.help-head > .icon-stack,
html body .topbar > .right,
html body .topbar > .top-actions{
  margin-left:auto!important;
  flex:0 0 auto!important;
}

/* Uniform compact return control. */
html body .icon-stack,
html body .ui-topbar-return{
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  gap:2px!important;
  min-width:38px!important;
  margin-top:0!important;
  margin-right:4px!important;
}
html body .create-icon,
html body .icon-stack .create-icon,
html body .ui-topbar-return .create-icon{
  width:32px!important;
  height:32px!important;
  min-height:32px!important;
  padding:0!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  border-radius:9px!important;
  background:rgba(0,212,255,.075)!important;
  border:1px solid rgba(0,212,255,.23)!important;
  color:#7be9ff!important;
  -webkit-text-fill-color:#7be9ff!important;
  text-decoration:none!important;
  font-size:18px!important;
  line-height:1!important;
  font-weight:800!important;
  box-shadow:none!important;
}
html body .create-icon:hover,
html body .icon-stack .create-icon:hover{
  background:rgba(0,212,255,.14)!important;
  border-color:rgba(0,212,255,.40)!important;
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
}
html body .icon-caption{
  margin:0!important;
  color:var(--ui-muted)!important;
  -webkit-text-fill-color:var(--ui-muted)!important;
  font-size:.64rem!important;
  line-height:1!important;
  font-weight:650!important;
  white-space:nowrap!important;
}

/* Legacy detail headers use the same visual grammar as .topbar. */
html body header.head,
html body header.help-head{
  min-height:50px!important;
  padding:8px 10px!important;
  display:flex!important;
  gap:10px!important;
  color:var(--ui-text)!important;
  background:rgba(13,17,23,.96)!important;
  border:0!important;
  border-bottom:1px solid var(--ui-border-cyan)!important;
  border-radius:0!important;
  box-shadow:0 5px 18px rgba(0,0,0,.14)!important;
}
html body header.head .h-title,
html body header.help-head .hh-title{
  margin:0!important;
  font-family:var(--ui-font)!important;
  font-size:20px!important;
  line-height:1.08!important;
  font-weight:850!important;
  letter-spacing:-.2px!important;
  color:#f4fbff!important;
  -webkit-text-fill-color:#f4fbff!important;
  background:none!important;
}
html body header.head .h-sub,
html body header.help-head .hh-sub{
  margin:3px 0 0!important;
  font-family:var(--ui-font)!important;
  color:var(--ui-muted)!important;
  -webkit-text-fill-color:var(--ui-muted)!important;
  font-size:.78rem!important;
  line-height:1.2!important;
}

/* Text must always stay readable inside controls. */
html body a.btn,
html body .btn,
html body .btn-sm,
html body .btn-xs,
html body button:not(.lfAvatarBtn):not(.lfPushBellBtn),
html body input[type=submit],
html body input[type=button],
html body .mini,
html body .tabpill{
  text-shadow:none!important;
  -webkit-background-clip:border-box!important;
  background-clip:border-box!important;
}
html body .btn-secondary,
html body .btn-light,
html body .btn-ghost,
html body a.btn-secondary,
html body a.btn-light,
html body a.btn-ghost,
html body button.btn-secondary,
html body button.btn-light,
html body button.btn-ghost,
html body .mini:not(.ok):not(.danger){
  background:#182433!important;
  border:1px solid rgba(255,255,255,.13)!important;
  color:#e8f2f8!important;
  -webkit-text-fill-color:#e8f2f8!important;
}
html body .btn-danger,
html body button.btn-danger,
html body a.btn-danger,
html body .mini.danger{
  background:rgba(255,77,109,.14)!important;
  border:1px solid rgba(255,77,109,.34)!important;
  color:#ffb3c0!important;
  -webkit-text-fill-color:#ffb3c0!important;
}
html body .mini.ok{
  background:rgba(0,230,118,.12)!important;
  border:1px solid rgba(0,230,118,.28)!important;
  color:#a7f3d0!important;
  -webkit-text-fill-color:#a7f3d0!important;
}
html body .btn-primary,
html body .btn.primary,
html body button.primary,
html body input[type=submit]:not(.danger):not(.btn-danger){
  color:#00131b!important;
  -webkit-text-fill-color:#00131b!important;
}
html body .btn-green,
html body .btn.btn-green{
  color:#a7f3d0!important;
  -webkit-text-fill-color:#a7f3d0!important;
}
html body .btn-red,
html body .btn.btn-red{
  color:#ffb3c0!important;
  -webkit-text-fill-color:#ffb3c0!important;
}
html body .btn-blue,
html body .btn.btn-blue{
  color:#7be9ff!important;
  -webkit-text-fill-color:#7be9ff!important;
}
html body .btn-amber,
html body .btn.btn-amber{
  color:#fde68a!important;
  -webkit-text-fill-color:#fde68a!important;
}

/* Admin screens: same density as competition_home/lotofoot. High specificity is
   intentional because these historical pages inject their own CSS late. */
html body.ui-page-admin{
  font-size:14px!important;
}
html body.ui-page-admin .topbar{
  min-height:50px!important;
  padding:8px 10px!important;
}
html body.ui-page-admin .topbar h1,
html body.ui-page-admin .topbar .section-title,
html body.ui-page-admin .topbar h1 > span:first-child:not(.small-muted),
html body.ui-page-admin .topbar .section-title > span:first-child:not(.small-muted){
  font-size:20px!important;
  line-height:1.08!important;
  font-weight:850!important;
  letter-spacing:-.2px!important;
}
html body.ui-page-admin .topbar h1 .small-muted,
html body.ui-page-admin .topbar .section-title .small-muted,
html body.ui-page-admin .topbar small{
  font-size:.78rem!important;
  line-height:1.2!important;
  font-weight:500!important;
}
html body.ui-page-admin .card,
html body.ui-page-admin .panel,
html body.ui-page-admin .node,
html body.ui-page-admin details{
  border-radius:12px!important;
}
html body.ui-page-admin .card{
  padding:12px!important;
}
html body.ui-page-admin summary{
  padding:10px 12px!important;
}
html body.ui-page-admin .row,
html body.ui-page-admin .node{
  padding:8px 10px!important;
  margin-top:6px!important;
  margin-bottom:6px!important;
}
html body.ui-page-admin .gtitle,
html body.ui-page-admin .sum-left strong{
  font-size:.96rem!important;
}
html body.ui-page-admin .section-h,
html body.ui-page-admin .card-h,
html body.ui-page-admin h2,
html body.ui-page-admin h3{
  font-size:.78rem!important;
}
html body.ui-page-admin table{
  font-size:.79rem!important;
}
html body.ui-page-admin th{
  font-size:.67rem!important;
  padding:7px 8px!important;
}
html body.ui-page-admin td{
  font-size:.78rem!important;
  padding:7px 8px!important;
}
html body.ui-page-admin input,
html body.ui-page-admin select,
html body.ui-page-admin textarea{
  font-size:.80rem!important;
  min-height:32px!important;
  padding:5px 8px!important;
}
html body.ui-page-admin .mini,
html body.ui-page-admin .btn-sm,
html body.ui-page-admin .tabpill{
  font-size:.74rem!important;
  min-height:29px!important;
  padding:4px 8px!important;
  border-radius:8px!important;
}
html body.ui-page-admin .badge,
html body.ui-page-admin .badge-mini,
html body.ui-page-admin .pill{
  font-size:.66rem!important;
}
html body.ui-page-admin .kpi-card,
html body.ui-page-admin .stat-card{
  padding:10px!important;
}

/* Accounts title must share the exact left edge of other page titles. */
html body .topbar .rd-grad-title{
  margin-left:0!important;
}

@media(max-width:560px){
  html body .topbar,
  html body header.head,
  html body header.help-head{gap:7px!important;padding-left:8px!important;padding-right:8px!important;}
  html body .topbar h1,
  html body header.head .h-title,
  html body header.help-head .hh-title{font-size:18px!important;}
  html body .icon-stack,
  html body .ui-topbar-return{margin-right:0!important;min-width:34px!important;}
  html body .create-icon,
  html body .icon-stack .create-icon{width:30px!important;height:30px!important;min-height:30px!important;font-size:17px!important;}
}


/* ================================================================
   UI23 - Admin density pass
   Match the compact rhythm of lotofoot / competition_home.
   ================================================================ */
html body.ui-page-admin-group .admin-group-selector{
  padding:8px 10px!important;
  margin-top:4px!important;
  margin-bottom:5px!important;
}
html body.ui-page-admin-group .admin-group-selector > .row.between{
  gap:8px!important;
  padding:0!important;
  margin:0!important;
  align-items:center!important;
}
html body.ui-page-admin-group .admin-group-selector .row{
  gap:6px!important;
  padding:0!important;
  margin-top:0!important;
  margin-bottom:0!important;
}
html body.ui-page-admin-group .admin-group-selector .k{
  font-size:.94rem!important;
  line-height:1.08!important;
  font-weight:850!important;
}
html body.ui-page-admin-group .admin-group-selector .muted{
  font-size:.70rem!important;
  line-height:1.15!important;
  margin-top:2px!important;
}
html body.ui-page-admin-group .admin-group-selector select{
  min-height:29px!important;
  height:29px!important;
  padding:3px 8px!important;
  font-size:.75rem!important;
}
html body.ui-page-admin-group .admin-group-selector .badge{
  font-size:.62rem!important;
  padding:2px 6px!important;
}
html body.ui-page-admin-group .admin-group-selector .mini{
  min-height:27px!important;
  padding:3px 7px!important;
  font-size:.69rem!important;
}

html body.ui-page-admin-group .wrap{
  padding:4px 6px!important;
}
html body.ui-page-admin-group .tabsbar{
  gap:6px!important;
  padding:7px 8px!important;
  margin-top:5px!important;
  border-radius:14px!important;
}
html body.ui-page-admin-group .tabpill{
  gap:5px!important;
  min-height:28px!important;
  padding:4px 8px!important;
  font-size:.70rem!important;
  font-weight:800!important;
}
html body.ui-page-admin-group .tabpill .dot{
  width:6px!important;
  height:6px!important;
}
html body.ui-page-admin-group .tabpill .badge-mini{
  font-size:.60rem!important;
  padding:1px 5px!important;
}
html body.ui-page-admin-group .panes{
  padding:5px 0 9px!important;
  margin-top:3px!important;
}
html body.ui-page-admin-group .pane{
  padding:0 3px!important;
}
html body.ui-page-admin-group .pane .card{
  margin-top:6px!important;
}
html body.ui-page-admin-group .card{
  padding:9px!important;
}
html body.ui-page-admin-group .section-head{
  gap:6px!important;
  margin-top:4px!important;
  margin-bottom:5px!important;
  padding-bottom:4px!important;
}
html body.ui-page-admin-group .section-head h2{
  font-size:.88rem!important;
  line-height:1.1!important;
}
html body.ui-page-admin-group .section-head .hint{
  font-size:.68rem!important;
}
html body.ui-page-admin-group .kpi-grid{
  gap:6px!important;
  margin-top:6px!important;
}
html body.ui-page-admin-group .kpi{
  min-height:57px!important;
  padding:7px 8px!important;
  border-radius:10px!important;
}
html body.ui-page-admin-group .kpi .v{
  font-size:1.12rem!important;
  line-height:1.05!important;
}
html body.ui-page-admin-group .kpi .t{
  font-size:.70rem!important;
}
html body.ui-page-admin-group .kpi .s{
  font-size:.64rem!important;
}
html body.ui-page-admin-group .quick-actions{
  gap:5px!important;
  margin-top:6px!important;
}
html body.ui-page-admin-group .muted{
  font-size:.74rem!important;
}
html body.ui-page-admin-group th{
  font-size:.64rem!important;
  padding:6px 7px!important;
}
html body.ui-page-admin-group td{
  font-size:.74rem!important;
  padding:6px 7px!important;
}

/* Main superadmin screen: tighten the old hierarchical UI as well. */
html body.ui-page-superadmin .wrap{
  padding:4px 6px!important;
}
html body.ui-page-superadmin .card{
  padding:9px!important;
  margin-top:7px!important;
  margin-bottom:7px!important;
}
html body.ui-page-superadmin details.lvl-group,
html body.ui-page-superadmin details.lvl-comp{
  border-radius:10px!important;
  margin-top:6px!important;
  margin-bottom:6px!important;
}
html body.ui-page-superadmin details.lvl-group > summary,
html body.ui-page-superadmin details.lvl-comp > summary,
html body.ui-page-superadmin summary{
  padding:7px 8px!important;
}
html body.ui-page-superadmin .sum-left,
html body.ui-page-superadmin .actions,
html body.ui-page-superadmin .node-left{
  gap:6px!important;
}
html body.ui-page-superadmin .gtitle,
html body.ui-page-superadmin .sum-left strong{
  font-size:.88rem!important;
}
html body.ui-page-superadmin .pill{
  font-size:.62rem!important;
  padding:2px 6px!important;
}
html body.ui-page-superadmin .sublist{
  margin-top:5px!important;
  padding:7px 8px 8px!important;
}
html body.ui-page-superadmin .section-h{
  font-size:.68rem!important;
  margin:5px 0!important;
}
html body.ui-page-superadmin .node{
  gap:6px!important;
  padding:5px 6px!important;
}
html body.ui-page-superadmin .mini-in{
  height:27px!important;
  min-height:27px!important;
  font-size:.72rem!important;
  padding:3px 7px!important;
}
html body.ui-page-superadmin .mini{
  min-height:27px!important;
  padding:3px 7px!important;
  font-size:.68rem!important;
}
html body.ui-page-superadmin .kpi-value{
  font-size:1.22rem!important;
}
html body.ui-page-superadmin .llm-kpi-card{
  padding:9px 10px!important;
  border-radius:11px!important;
}
html body.ui-page-superadmin .llm-kpi-card .v{
  font-size:18px!important;
  margin-top:4px!important;
}
html body.ui-page-superadmin .llm-kpi-card .s{
  font-size:10px!important;
  margin-top:4px!important;
}

@media(max-width:560px){
  html body.ui-page-admin-group .admin-group-selector > .row.between{
    align-items:flex-start!important;
  }
  html body.ui-page-admin-group .tabsbar{
    padding:6px!important;
  }
  html body.ui-page-admin-group .tabpill{
    padding:4px 7px!important;
  }
}


/* ============================================================
   UI25 — actions des pages intermédiaires / alertes
   Les anciens .go.play utilisaient du texte très sombre sur cyan.
   ============================================================ */
html body a.go,
html body .go{
  color:#dff7ff!important;
  -webkit-text-fill-color:#dff7ff!important;
  text-shadow:none!important;
}
html body a.go *,
html body .go *{color:inherit!important;-webkit-text-fill-color:inherit!important;}
html body a.go.play,
html body .go.play{
  background:linear-gradient(135deg,#087da3,#075a78)!important;
  border:1px solid rgba(123,233,255,.38)!important;
  color:#f5fcff!important;
  -webkit-text-fill-color:#f5fcff!important;
  text-shadow:0 1px 1px rgba(0,0,0,.24)!important;
  box-shadow:0 4px 12px rgba(0,120,160,.16)!important;
}
html body a.go.play:hover,
html body .go.play:hover{
  background:linear-gradient(135deg,#0a8db6,#086888)!important;
  border-color:rgba(123,233,255,.60)!important;
  color:#fff!important;-webkit-text-fill-color:#fff!important;
}


/* UI31 — badge de contexte RÉEL / FUN dans les listes multi-compétitions. */
.lf-context-mode{display:inline-flex;align-items:center;justify-content:center;vertical-align:1px;margin-left:6px;padding:2px 6px;border-radius:999px;font-family:"Outfit",system-ui,sans-serif;font-size:.60rem;font-weight:800;line-height:1.15;letter-spacing:.12px;white-space:nowrap;}
.lf-context-mode.is-real{color:#ffedc4;background:rgba(247,183,49,.11);border:1px solid rgba(247,183,49,.28);}
.lf-context-mode.is-fun{color:#d9faff;background:rgba(0,212,255,.10);border:1px solid rgba(0,212,255,.27);}
@media(max-width:520px){.lf-context-mode{font-size:.54rem;padding:2px 5px;margin-left:4px;}}

/* UI BTN FIX v1.0 — readability only.
   Some historical <button class="btn btn-primary"> controls keep the
   anthracite background from the generic button rule while inheriting the
   dark text intended for cyan-filled primary controls.  Do not change the
   background here: only restore readable active text. */
html body button.btn.btn-primary:not(:disabled):not([aria-disabled="true"]){
  color:#7be9ff!important;
  -webkit-text-fill-color:#7be9ff!important;
}

/* UI BUTTON PALETTE v2 — one visual family for active action buttons.
   The button surface stays anthracite and every active label uses the same cyan.
   Semantic classes keep only a colored border, so danger/success/warning remain
   identifiable without pink/green/amber filled buttons. Disabled controls are untouched. */
html body .btn:not(:disabled):not(.disabled):not([aria-disabled="true"]),
html body .button:not(:disabled):not(.disabled):not([aria-disabled="true"]),
html body .mini:not(:disabled):not(.disabled):not([aria-disabled="true"]){
  background:#182433!important;
  border:1px solid rgba(123,233,255,.28)!important;
  color:#7be9ff!important;
  -webkit-text-fill-color:#7be9ff!important;
  box-shadow:none!important;
  text-shadow:none!important;
}
html body .btn:not(:disabled):not(.disabled):not([aria-disabled="true"]):hover,
html body .button:not(:disabled):not(.disabled):not([aria-disabled="true"]):hover,
html body .mini:not(:disabled):not(.disabled):not([aria-disabled="true"]):hover{
  background:#1d2c3d!important;
  border-color:rgba(123,233,255,.48)!important;
  color:#dffaff!important;
  -webkit-text-fill-color:#dffaff!important;
}
html body .btn-danger:not(:disabled):not(.disabled),
html body .btn-red:not(:disabled):not(.disabled),
html body .danger.btn:not(:disabled):not(.disabled),
html body .mini.danger:not(:disabled):not(.disabled){border-color:rgba(255,77,109,.48)!important;}
html body .btn-green:not(:disabled):not(.disabled),
html body .mini.ok:not(:disabled):not(.disabled){border-color:rgba(0,230,118,.42)!important;}
html body .btn-amber:not(:disabled):not(.disabled),
html body .warning-action.btn:not(:disabled):not(.disabled){border-color:rgba(247,183,49,.45)!important;}
html body .btn-blue:not(:disabled):not(.disabled),
html body .btn-primary:not(:disabled):not(.disabled){border-color:rgba(123,233,255,.40)!important;}