.topbar .container{
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 16px;
    }

    .brand{
      min-height: 56px;
      display: flex;
      align-items: center;
      gap: 12px;
      min-width: 0;
      flex: 1 1 auto;
    }

    .brand img{
      height: 54px;
      width: auto;
      max-width: 100%;
      flex: 0 0 auto;
    }

    .brand-text{
      color: #ffffff;
      font-size: clamp(1rem, 1.1vw + .7rem, 1.45rem);
      font-weight: 800;
      letter-spacing: .08em;
      line-height: 1.05;
      text-transform: uppercase;
      white-space: nowrap;
      flex: 1 1 auto;
      min-width: 0;
    }

    .top-actions{
      gap: 10px;
      margin-left: auto;
      flex: 0 0 auto;
      justify-content: flex-end;
      align-items: center;
    }

    .top-actions .btn{
      white-space: nowrap;
      width: auto;
      min-width: 112px;
      flex: 0 0 auto;
    }

    @media (max-width: 991.98px){
      .topbar .container{
        flex-wrap: nowrap;
        gap: 12px;
      }
      .brand{
        min-height: 50px;
        gap: 10px;
      }
      .brand img{
        height: 48px;
      }
      .brand-text{
        font-size: clamp(.9rem, 1vw + .65rem, 1.2rem);
        letter-spacing: .06em;
      }
      .top-actions{
        width: auto;
        margin-top: 0;
        justify-content: flex-end;
        flex-wrap: nowrap;
      }
    }

    @media (max-width: 575.98px){
      .topbar{
        padding-top: .75rem !important;
        padding-bottom: .75rem !important;
      }
      .topbar .container{
        gap: 8px;
      }
      .brand{
        min-height: 44px;
        gap: 6px;
      }
      .brand img{
        height: 38px;
      }
      .brand-text{
        font-size: clamp(.82rem, 3.1vw, 1rem);
        letter-spacing: .035em;
        line-height: 1;
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
      }
      .top-actions{
        gap: 8px !important;
        flex: 0 0 auto;
      }
      .top-actions .btn{
        width: auto;
        min-width: 102px;
        padding-left: .8rem;
        padding-right: .8rem;
      }
      .top-actions .btn-access{
        width: 44px;
        min-width: 44px;
        padding-left: 0;
        padding-right: 0;
      }
      .top-actions .btn-access .btn-label{
        display: none;
      }
      .top-actions .btn-access i{
        margin-right: 0 !important;
      }
      .glass-card{ padding: 16px !important; }
      .hero-left h3{ font-size: 1.35rem; margin-bottom: .35rem !important; }
      .hero-actions{ display: flex; flex-direction: column; gap: 10px; }
      .hero-actions .btn{ width: 100%; }
      .hero-right{ text-align: center !important; margin-top: 14px !important; }
      .hero-right img{ max-width: 200px !important; width: 100%; }
      .splash-logo{ width: 170px !important; height: 240px !important; }
    }

    .ui-autocomplete { z-index: 2000 !important; }

    #tablaInscriptosWrap{ max-height: 420px; overflow-y: auto; }
    #tablaInscriptos th, #tablaInscriptos td{ vertical-align: middle; }

    .ranking-empty{
      padding: 18px;
      text-align: center;
      color: #e9ecef;
      font-size: .95rem;
      font-weight: 500;
    }

    .ranking-groups{
      display: flex;
      flex-direction: column;
      gap: 16px;
    }

    .ranking-group-card{
      border: 1px solid rgba(255,255,255,.08);
      border-radius: 16px;
      background: rgba(15,23,42,.72);
      overflow: hidden;
      box-shadow: 0 16px 32px rgba(0,0,0,.22);
    }

    .ranking-group-head{
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      padding: 14px 16px;
      background: linear-gradient(135deg, rgba(30,41,59,.98), rgba(15,23,42,.98));
      border-bottom: 1px solid rgba(255,255,255,.08);
    }

    .ranking-group-title{
      margin: 0;
      color: #fff;
      font-size: 1rem;
      font-weight: 800;
      letter-spacing: .02em;
    }

    .ranking-group-count{
      display: inline-flex;
      align-items: center;
      justify-content: center;
      min-width: 34px;
      padding: 4px 10px;
      border-radius: 999px;
      background: rgba(59,130,246,.18);
      border: 1px solid rgba(96,165,250,.24);
      color: #dbeafe;
      font-size: .82rem;
      font-weight: 700;
    }

    .ranking-table-wrap{
      overflow-x: auto;
    }

    .ranking-table{
      margin: 0;
      color: #f8fafc;
    }

    .ranking-table thead th{
      background: #1e293b !important;
      color: #ffffff !important;
      border-color: #334155 !important;
      text-transform: uppercase;
      font-size: .78rem;
      letter-spacing: .06em;
    }

    .ranking-table tbody td{
      color: #f8f9fa !important;
      background: #0f172a;
      border-color: #334155;
      vertical-align: middle;
    }

    .ranking-table tbody tr:nth-child(even) td{
      background: #111c31;
    }

    .ranking-table tbody tr:hover td{
      background: #162338;
    }

    .modal-content{
      background: #111827;
      color: #f8f9fa;
      border: 1px solid rgba(255,255,255,.08);
      border-radius: 14px;
      overflow: hidden;
      box-shadow: 0 20px 50px rgba(0,0,0,.45);
    }

    .modal-header{
      background: linear-gradient(135deg, #0b1220, #1f2937);
      color: #ffffff;
      border-bottom: 1px solid rgba(255,255,255,.08);
    }

    .modal-header .modal-title{
      color: #ffffff;
      font-weight: 700;
    }

    .modal-header .close{
      color: #ffffff !important;
      opacity: 1;
      text-shadow: none;
    }

    .modal-body{
      background: #111827;
      color: #f8f9fa;
    }

    .modal-body label{
      color: #ffffff;
      font-weight: 600;
      margin-bottom: .35rem;
    }

    .modal-body .text-muted,
    .modal-body small.text-muted,
    .modal-body .small-muted,
    .modal-body .small{
      color: #cbd5e1 !important;
    }

    .modal-body p,
    .modal-body div,
    .modal-body span{
      color: inherit;
    }

    .modal-body .form-control,
    .modal-body select.form-control{
      background-color: #0f172a;
      border: 1px solid #334155;
      color: #ffffff;
    }

    .modal-body .form-control:focus,
    .modal-body select.form-control:focus{
      background-color: #0f172a;
      border-color: #60a5fa;
      color: #ffffff;
      box-shadow: 0 0 0 0.2rem rgba(96,165,250,.18);
    }

    .modal-body .form-control::placeholder{
      color: #94a3b8;
      opacity: 1;
    }

    .modal-body select.form-control option{
      background: #0f172a;
      color: #ffffff;
    }

    .modal-body .form-control.field-locked,
    .modal-body select.form-control.field-locked,
    .modal-body .form-control[readonly].field-locked{
      background-color: #1f2937 !important;
      border-color: #475569 !important;
      color: #f8fafc !important;
      opacity: 1;
      box-shadow: none;
    }

    .modal-body select.form-control.field-locked{
      pointer-events: none;
    }

    .modal-footer{
      background: #0b1220;
      border-top: 1px solid rgba(255,255,255,.08);
    }

    .modal-footer .btn-secondary{
      background: #475569;
      border-color: #475569;
      color: #ffffff;
    }

    .modal-footer .btn-secondary:hover{
      background: #334155;
      border-color: #334155;
    }

    .modal-body .alert-info{
      background: rgba(59,130,246,.16);
      border: 1px solid rgba(96,165,250,.35);
      color: #dbeafe;
    }

    .modal-body .alert-danger{
      background: rgba(220,53,69,.16);
      border: 1px solid rgba(220,53,69,.35);
      color: #f8d7da;
    }

    .modal-body .alert-success{
      background: rgba(25,135,84,.16);
      border: 1px solid rgba(25,135,84,.35);
      color: #d1e7dd;
    }

    .modal-body .alert-warning{
      background: rgba(245,158,11,.14);
      border: 1px solid rgba(245,158,11,.35);
      color: #fde68a;
    }

    #tablaInscriptos,
    #tablaDesafiosPublicos,
    #tablaDesafiosModal,
    #tablaResultadosPendientesPublicos{
      background: #0f172a;
      color: #f8f9fa;
      border-color: #334155;
    }

    #tablaInscriptos thead th,
    #tablaDesafiosPublicos thead th,
    #tablaDesafiosModal thead th,
    #tablaResultadosPendientesPublicos thead th{
      background: #1e293b !important;
      color: #ffffff !important;
      border-color: #334155 !important;
      position: sticky;
      top: 0;
      z-index: 1;
    }

    #tablaInscriptos tbody td,
    #tablaDesafiosPublicos tbody td,
    #tablaDesafiosModal tbody td,
    #tablaResultadosPendientesPublicos tbody td{
      color: #f8f9fa !important;
      background: #0f172a;
      border-color: #334155;
    }

    #tablaInscriptos tbody tr:nth-child(even) td,
    #tablaDesafiosPublicos tbody tr:nth-child(even) td,
    #tablaDesafiosModal tbody tr:nth-child(even) td,
    #tablaResultadosPendientesPublicos tbody tr:nth-child(even) td{
      background: #111c31;
    }

    #tablaInscriptos tbody tr:hover td,
    #tablaDesafiosPublicos tbody tr:hover td,
    #tablaDesafiosModal tbody tr:hover td,
    #tablaResultadosPendientesPublicos tbody tr:hover td{
      background: #162338;
    }

    #listadoRankingError,
    #desafiosError,
    #desafiosModalError,
    #resultadosError{
      color: #f8d7da !important;
    }

    #loginModal .text-center.mt-3.mb-0{ color: #cbd5e1 !important; }
    #loginModal a{ color: #93c5fd !important; }
    #loginModal a:hover{ color: #bfdbfe !important; }

    .ui-widget.ui-widget-content{
      border: 1px solid #334155;
      background: #0f172a;
      color: #f8f9fa;
      border-radius: 8px;
      box-shadow: 0 10px 25px rgba(0,0,0,.35);
    }

    .ui-menu .ui-menu-item-wrapper{
      color: #f8f9fa;
      padding: .45rem .75rem;
    }

    .ui-menu .ui-menu-item-wrapper:hover{
      background: #1e293b;
      color: #ffffff;
      border: none;
    }

    .ui-state-active,
    .ui-widget-content .ui-state-active{
      border: 1px solid #60a5fa !important;
      background: #2563eb !important;
      color: #ffffff !important;
      margin: 0;
    }

    .hero-actions .btn-outline-light{
      border-width: 2px;
      font-weight: 600;
      color: #ffffff;
    }

    .hero-actions .btn-outline-light:hover{
      color: #111827;
      background: #ffffff;
      border-color: #ffffff;
    }

    .section-card{
      background: rgba(15, 23, 42, .72);
      border: 1px solid rgba(255,255,255,.08);
      border-radius: 18px;
      box-shadow: 0 20px 45px rgba(0,0,0,.28);
      backdrop-filter: blur(10px);
      color: #fff;
    }

    .section-card,
    .section-card p,
    .section-card div,
    .section-card span,
    .section-card td,
    .section-card th,
    .section-card label,
    .section-card strong{
      color: #f8fafc;
    }

    .section-card .section-title{
      font-size: 1.15rem;
      font-weight: 800;
      margin-bottom: .35rem;
      letter-spacing: .2px;
    }

    .section-card .section-subtitle{
      color: #cbd5e1;
      font-size: .92rem;
    }

    .section-card .text-muted,
    .section-card small,
    .section-card small.text-muted{
      color: #cbd5e1 !important;
    }

    .table-wrap-dark{
      color: #f8fafc;
    }

    .table-wrap-dark .btn{
      color: inherit;
    }

    .badge-ob{ font-size: .78rem; }

    .table-wrap-dark{
      max-height: 420px;
      overflow-y: auto;
      border-radius: 10px;
    }

    .btn-block-mobile{ white-space: nowrap; }

    @media (max-width: 575.98px){
      .btn-block-mobile{ width: 100%; }
    }

    .home-stack{
      display: flex;
      flex-direction: column;
      gap: 20px;
    }

    .home-card{
      background: rgba(15, 23, 42, .76);
      border: 1px solid rgba(255,255,255,.10);
      border-radius: 24px;
      box-shadow: 0 24px 55px rgba(0,0,0,.26);
      backdrop-filter: blur(12px);
      -webkit-backdrop-filter: blur(12px);
    }

    .home-hero{
      display: grid;
      grid-template-columns: minmax(0, 1.25fr) minmax(220px, .75fr);
      gap: 22px;
      align-items: center;
      padding: 28px;
    }

    .home-kicker{
      display: inline-flex;
      align-items: center;
      gap: 8px;
      padding: 7px 14px;
      border-radius: 999px;
      background: rgba(59,130,246,.14);
      border: 1px solid rgba(96,165,250,.28);
      color: #dbeafe;
      font-size: .78rem;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: .08em;
    }

    .home-hero-title{
      margin: 16px 0 10px;
      color: #fff;
      font-size: clamp(2rem, 3.2vw, 3rem);
      line-height: 1.02;
      font-weight: 900;
      letter-spacing: -.02em;
    }

    .home-hero-copy{
      margin: 0;
      max-width: 760px;
      color: #d8e3f0;
      font-size: 1rem;
      line-height: 1.7;
    }

    .home-hero-art{
      padding: 18px;
      border-radius: 20px;
      background:
        radial-gradient(circle at top, rgba(125,211,252,.18), transparent 58%),
        linear-gradient(160deg, rgba(15,23,42,.92), rgba(17,28,49,.84));
      border: 1px solid rgba(148,163,184,.16);
      text-align: center;
    }

    .home-hero-art img{
      width: 100%;
      max-width: 220px;
      display: block;
      margin: 0 auto;
      padding: 10px;
      border-radius: 18px;
      background: rgba(255,255,255,.04);
      border: 1px solid rgba(255,255,255,.08);
      box-shadow: 0 18px 34px rgba(0,0,0,.26);
    }

    .home-hero-art small{
      display: block;
      margin-top: 12px;
      color: #cbd5e1;
      font-size: .9rem;
      line-height: 1.55;
    }

    .home-actions-wrap,
    .home-rules-wrap{
      padding: 22px;
    }

    .home-block-title{
      margin: 0 0 6px;
      color: #fff;
      font-size: 1.02rem;
      font-weight: 800;
      text-transform: uppercase;
      letter-spacing: .07em;
    }

    .home-block-copy{
      margin: 0 0 16px;
      color: #cbd5e1;
      font-size: .94rem;
    }

    .home-actions-grid{
      display: grid;
      grid-template-columns: repeat(4, minmax(0, 1fr));
      gap: 14px;
    }

    .home-action-tile{
      position: relative;
      overflow: hidden;
      min-height: 164px;
      border-radius: 20px;
      border: 1px solid rgba(255,255,255,.10);
      box-shadow: 0 20px 40px rgba(0,0,0,.24);
    }

    .home-action-tile .inner{
      position: relative;
      z-index: 2;
      padding: 18px 18px 56px;
    }

    .home-action-tile h5{
      margin: 0 0 8px;
      color: #fff;
      font-size: 1.16rem;
      font-weight: 800;
    }

    .home-action-tile p{
      margin: 0;
      color: rgba(255,255,255,.92);
      font-size: .92rem;
      line-height: 1.45;
    }

    .home-action-tile .icon{
      position: absolute;
      right: 16px;
      top: 14px;
      font-size: 3rem;
      color: rgba(255,255,255,.18);
      pointer-events: none;
    }

    .home-action-tile button{
      position: absolute;
      left: 0;
      right: 0;
      bottom: 0;
      z-index: 3;
      width: 100%;
      border: 0;
      padding: 11px 14px;
      background: rgba(0,0,0,.12);
      color: #fff;
      font-weight: 700;
      text-align: center;
      cursor: pointer;
    }

    .home-action-tile button:hover{
      background: rgba(0,0,0,.22);
    }

    .home-action--ranking{ background: linear-gradient(145deg, #f59e0b, #d97706); }
    .home-action--players{ background: linear-gradient(145deg, #16a34a, #15803d); }
    .home-action--challenge{ background: linear-gradient(145deg, #0891b2, #0f766e); }
    .home-action--pending{ background: linear-gradient(145deg, #2563eb, #1d4ed8); }

    .home-rules-layout{
      display: grid;
      grid-template-columns: minmax(220px, .72fr) minmax(0, 1fr);
      gap: 18px;
      align-items: start;
    }

    .home-rules-side,
    .home-rules-panel{
      padding: 18px;
      border-radius: 18px;
      background: rgba(255,255,255,.04);
      border: 1px solid rgba(148,163,184,.14);
    }

    .home-rules-badge{
      display: inline-flex;
      align-items: center;
      gap: 8px;
      padding: 7px 12px;
      border-radius: 999px;
      background: rgba(245,158,11,.12);
      border: 1px solid rgba(245,158,11,.25);
      color: #fde68a;
      font-size: .8rem;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: .06em;
    }

    .home-rules-side h4{
      margin: 12px 0 8px;
      color: #fff;
      font-size: 1.22rem;
      font-weight: 800;
    }

    .home-rules-side p{
      margin: 0;
      color: #d6e2f0;
      line-height: 1.65;
    }

    .home-rules-tags{
      display: flex;
      flex-wrap: wrap;
      gap: 10px;
      margin-top: 16px;
    }

    .home-rules-tag{
      padding: 8px 12px;
      border-radius: 999px;
      background: rgba(59,130,246,.12);
      border: 1px solid rgba(96,165,250,.24);
      color: #dbeafe;
      font-size: .88rem;
      font-weight: 600;
    }

    .home-rules-grid{
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 14px;
    }

    .home-rules-panel-title{
      display: flex;
      align-items: center;
      gap: 10px;
      margin-bottom: 12px;
      color: #fff;
      font-size: .94rem;
      font-weight: 800;
      text-transform: uppercase;
      letter-spacing: .05em;
    }

    .home-rules-panel-title i{ color: #7dd3fc; }

    .home-rules-list{
      margin: 0;
      padding-left: 18px;
      color: #dbe7f3;
    }

    .home-rules-list li{ margin-bottom: 8px; }

    .home-rules-note{
      margin-top: 16px;
      padding: 14px 16px;
      border-left: 4px solid rgba(245,158,11,.8);
      border-radius: 14px;
      background: rgba(245,158,11,.08);
      color: #f8fafc;
      font-size: .93rem;
      line-height: 1.6;
    }

    @media (max-width: 991.98px){
      .home-hero,
      .home-rules-layout{
        grid-template-columns: 1fr;
      }

      .home-actions-grid{
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }
    }

    @media (max-width: 575.98px){
      .home-hero,
      .home-actions-wrap,
      .home-rules-wrap{
        padding: 18px;
      }

      .home-actions-grid,
      .home-rules-grid{
        grid-template-columns: 1fr;
      }
    }
