.app-card,
.card-soft{
  position:relative;
  overflow:clip;
  background:var(--card-primary-bg);
  border:1px solid var(--color-border);
  border-radius:var(--radius-md);
  box-shadow:var(--shadow-xs);
  transition:
    transform var(--motion-base) var(--ease-standard),
    box-shadow var(--motion-base) var(--ease-standard),
    border-color var(--motion-fast) var(--ease-standard),
    background-color var(--motion-fast) var(--ease-standard);
}

.app-card--primary{
  background:var(--card-primary-bg);
}

.app-card--secondary{
  background:var(--card-secondary-bg);
}

.app-card::before,
.card-soft::before{
  content:"";
  position:absolute;
  inset:0 0 auto 0;
  height:3px;
  background:linear-gradient(90deg, rgba(var(--club-primary-rgb), .15), rgba(var(--club-primary-rgb), .7), rgba(var(--club-primary-rgb), .15));
  opacity:.9;
}

.app-section-head{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:12px;
  margin-bottom:14px;
}

.app-section-head__copy{
  min-width:0;
}

.app-section-stack,
.ol-section-head{
  display:flex;
  flex-direction:column;
  gap:.15rem;
}

.app-card-head,
.home-card-head,
.ol-card-head,
.convocatoria-card .card-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  flex-wrap:nowrap;
}

.app-card-head{
  margin-bottom:16px;
}

.app-card-head__copy,
.home-card-head__copy{
  min-width:0;
  flex:1 1 auto;
}

.app-card-head__copy .app-title,
.home-card-head__copy .app-title{
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.app-kicker{
  display:inline-flex;
  align-items:center;
  min-height:26px;
  padding:4px 10px;
  border-radius:999px;
  background:var(--color-primary-ghost);
  color:var(--color-primary);
  font-size:.72rem;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.app-title{
  margin:8px 0 0;
  font-size:1.08rem;
  font-weight:900;
  line-height:1.15;
}

.app-subtitle{
  margin:4px 0 0;
  color:var(--color-muted);
  font-size:.9rem;
  font-weight:700;
}

.app-actions,
.app-button-row{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}

.app-actions-stack,
.ol-actions-stack{
  display:flex;
  flex-direction:column;
  gap:.45rem;
}

.app-action-link,
.home-action-link{
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  align-self:center;
  white-space:nowrap;
  min-height:30px;
  padding:4px 10px;
  border-radius:10px;
  font-size:.78rem;
  font-weight:800;
  line-height:1.05;
  color:var(--color-text-inverse);
  background:linear-gradient(135deg, var(--color-primary), var(--color-primary-dark));
  border:1px solid transparent;
  box-shadow:var(--shadow-xs);
  transition:
    background-color var(--motion-fast) var(--ease-standard),
    border-color var(--motion-fast) var(--ease-standard),
    color var(--motion-fast) var(--ease-standard),
    transform var(--motion-fast) var(--ease-standard);
}

.app-action-link:hover,
.app-action-link:focus,
.home-action-link:hover,
.home-action-link:focus{
  color:var(--color-text-inverse);
  background:linear-gradient(135deg, var(--color-primary-dark), var(--color-primary));
  border-color:transparent;
}

.app-action-link:active,
.home-action-link:active{
  transform:translateY(0) scale(.985);
}

.btn.app-action-link,
.btn.home-action-link,
.btn.btn-outline-primary.app-action-link,
.btn.btn-outline-primary.home-action-link{
  color:var(--color-text-inverse);
  background:linear-gradient(135deg, var(--color-primary), var(--color-primary-dark));
  border-color:transparent;
}

.btn.app-action-link:hover,
.btn.app-action-link:focus,
.btn.home-action-link:hover,
.btn.home-action-link:focus,
.btn.btn-outline-primary.app-action-link:hover,
.btn.btn-outline-primary.app-action-link:focus,
.btn.btn-outline-primary.home-action-link:hover,
.btn.btn-outline-primary.home-action-link:focus{
  color:var(--color-text-inverse);
  background:linear-gradient(135deg, var(--color-primary-dark), var(--color-primary));
  border-color:transparent;
}

.app-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:30px;
  padding:6px 12px;
  border-radius:999px;
  border:1px solid var(--color-border);
  background:var(--color-bg-elevated);
  color:var(--color-text);
  font-size:.78rem;
  font-weight:900;
  line-height:1;
  transition:
    background-color var(--motion-fast) var(--ease-standard),
    border-color var(--motion-fast) var(--ease-standard),
    color var(--motion-fast) var(--ease-standard);
}

.app-badge.is-primary{background:var(--color-primary-ghost);border-color:var(--color-primary-border-soft);color:var(--color-primary)}
.app-badge.is-success{background:var(--color-success-soft);border-color:var(--color-success-border);color:var(--color-success)}
.app-badge.is-danger{background:var(--color-danger-soft);border-color:var(--color-danger-border);color:var(--color-danger)}
.app-badge.is-warning{background:var(--color-warning-soft);border-color:var(--color-warning-border);color:var(--color-warning)}

.app-pill-badge,
.ol-pair-badge,
.ol-mini-badge,
.ol-player-chip,
.user-mgmt-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.25rem;
  min-height:26px;
  padding:.18rem .54rem;
  border-radius:999px;
  border:1px solid var(--color-border);
  font-size:.74rem;
  font-weight:800;
  line-height:1.1;
}

.app-pill-badge.is-primary,
.ol-pair-badge,
.ol-mini-badge.is-info{
  background:var(--color-primary-ghost);
  color:var(--color-primary);
  border-color:var(--color-primary-border-soft);
}

.app-pill-badge.is-neutral,
.ol-mini-badge.is-neutral,
.ol-player-chip.is-neutral{
  background:var(--color-bg-elevated);
  color:var(--color-muted);
}

.app-pill-badge.is-success,
.ol-mini-badge.is-valid,
.user-mgmt-badge.is-active{
  background:var(--color-success-soft);
  color:var(--color-success);
  border-color:var(--color-success-border);
}

.app-pill-badge.is-danger,
.ol-mini-badge.is-invalid,
.ol-player-chip.is-invalid,
.user-mgmt-badge.is-inactive{
  background:var(--color-danger-soft);
  color:var(--color-danger);
  border-color:var(--color-danger-border);
}

.app-pill-badge.is-info,
.ol-mini-badge.is-info{
  background:var(--color-primary-ghost);
  color:var(--color-primary-dark);
  border-color:var(--color-primary-border-soft);
}

.ol-pair-badge,
.user-mgmt-badge{
  border:0;
}

.app-list-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:14px 16px;
  border:1px solid var(--color-border);
  border-radius:16px;
  background:var(--color-surface-overlay-subtle);
  transition:
    border-color var(--motion-fast) var(--ease-standard),
    box-shadow var(--motion-fast) var(--ease-standard),
    background-color var(--motion-fast) var(--ease-standard);
}

.app-empty-state{
  display:grid;
  gap:8px;
  justify-items:start;
  padding:18px;
  border:1px dashed var(--color-border-strong);
  border-radius:20px;
  background:var(--color-surface-overlay-ghost);
  transition:
    border-color var(--motion-fast) var(--ease-standard),
    background-color var(--motion-fast) var(--ease-standard);
}

.app-status-block,
.jornada-status,
.cf-status,
.user-mgmt-status,
.password-change-status{
  min-height:0;
  padding:10px 12px;
  border:1px solid var(--color-border);
  border-radius:14px;
  background:var(--color-surface-overlay-subtle);
  font-weight:700;
  transition:
    border-color var(--motion-fast) var(--ease-standard),
    background-color var(--motion-fast) var(--ease-standard),
    color var(--motion-fast) var(--ease-standard),
    box-shadow var(--motion-fast) var(--ease-standard);
}

.app-status-block:empty,
.jornada-status:empty,
.cf-status:empty{
  display:none;
}

.app-status-block:not(:empty),
.jornada-status:not(:empty),
.cf-status:not(:empty){
  box-shadow:var(--shadow-xs);
  animation:appStatusReveal var(--motion-base) var(--ease-standard);
}

.user-mgmt-status,
.password-change-status{
  display:none;
}

.user-mgmt-status:not([hidden]),
.password-change-status:not([hidden]){
  display:block;
}

.app-status-block.is-info,
.user-mgmt-status.info,
.password-change-status.info{
  background:var(--color-primary-ghost);
  border-color:var(--color-primary-border-soft);
  color:var(--color-primary);
}

.app-status-block.is-success,
.user-mgmt-status.ok,
.password-change-status.ok{
  background:var(--color-success-soft);
  border-color:var(--color-success-border);
  color:var(--color-success);
}

.app-status-block.is-error,
.user-mgmt-status.err,
.password-change-status.err{
  background:var(--color-danger-soft);
  border-color:var(--color-danger-border);
  color:var(--color-danger);
}

.app-status-block.is-warning{
  background:var(--color-warning-soft);
  border-color:var(--color-warning-border);
  color:var(--color-warning);
}

.app-micro-feedback,
.refresh,
.clas-status,
.ol-pair-note{
  font-size:.84rem;
  font-weight:700;
}

.app-micro-feedback.is-ok,
.clas-status.ok,
.ol-status-ok,
.ol-pair-note-ok{
  color:var(--color-success);
}

.app-micro-feedback.is-warn,
.clas-status.warn,
.ol-status-warn{
  color:var(--color-warning);
}

.app-micro-feedback.is-err,
.clas-status.err,
.ol-status-err,
.ol-pair-note-error{
  color:var(--color-danger);
}

.app-micro-feedback.is-info,
.clas-status.info{
  color:var(--color-muted);
}

.app-context-card{
  background:linear-gradient(180deg, rgba(var(--club-primary-rgb), .10), rgba(255,255,255,.9));
  transition:
    border-color var(--motion-fast) var(--ease-standard),
    box-shadow var(--motion-fast) var(--ease-standard),
    background-color var(--motion-fast) var(--ease-standard);
}

.app-context-card .ol-jcompact{
  display:flex;
  align-items:center;
  gap:12px;
  padding:4px 0;
  min-width:0;
  width:100%;
}

.app-context-card .ol-jteams{
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:4px;
  min-width:0;
  flex:1 1 auto;
  width:100%;
}

.app-context-card .ol-jline1,
.app-context-card .ol-jline2{
  display:flex;
  align-items:center;
  gap:10px;
  line-height:1.1;
  min-width:0;
  flex:1 1 auto;
}

.app-context-card .ol-jtag{
  display:flex;
  align-items:center;
  justify-content:center;
  min-width:40px;
  height:40px;
  padding:0 10px;
  border-radius:var(--radius-pill);
  background:var(--color-primary-ghost);
  color:var(--color-primary);
  border:1px solid var(--color-primary-border-mid);
  font-weight:900;
  white-space:nowrap;
  flex:0 0 auto;
}

.app-context-card .ol-jteam{
  display:block;
  flex:1 1 auto;
  font-weight:900;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  min-width:0;
  max-width:100%;
}

.app-context-card .ol-jteam.team-ours{
  color:var(--color-primary);
}

.app-context-card .ol-jscore{
  margin-left:auto;
  flex:0 0 64px;
  min-width:64px;
  justify-content:center;
  color:var(--color-text-inverse);
  background:linear-gradient(135deg, var(--club-secondary) 0%, var(--club-primary) 100%);
  border-color:rgba(var(--club-primary-rgb), .42);
  box-shadow:0 8px 22px rgba(var(--club-primary-rgb), .22);
}

.app-context-card .ol-jscore.d-none{
  display:inline-flex !important;
  visibility:hidden;
  opacity:0;
  pointer-events:none;
}

.app-context-card .ol-jvs{
  opacity:.55;
  font-weight:900;
  margin:0 2px;
}

.app-team-switch-mount{
  margin-bottom:18px;
}

.app-team-switch-card{
  display:grid;
  gap:12px;
}

.app-team-switch-head{
  margin-bottom:0;
}

.app-team-switch-select{
  width:min(100%, 360px);
}

.app-data-page-head{
  margin-bottom:14px;
}

.app-data-page-title,
.app-data-page-head .h4{
  margin-top:8px;
  margin-bottom:0;
  color:var(--color-text);
  font-size:var(--data-page-title-size);
  font-weight:900;
  line-height:1.1;
}

.app-data-filter{
  padding:5px 8px;
  border:1px solid var(--color-border);
  border-radius:12px;
  background:rgba(255,255,255,.72);
}

.app-data-filter label{
  font-size:var(--data-filter-label-size);
  font-weight:700;
}

.app-data-filter select{
  min-height:34px;
  padding-top:4px;
  padding-bottom:4px;
  border-radius:10px;
  font-size:var(--data-filter-select-size);
}

.app-data-table-wrap{
  overflow:visible;
}

.app-data-table{
  width:100%;
  table-layout:fixed;
}

.app-data-table,
.app-data-mobile-table,
.app-data-head-card{
  --app-data-header-color:var(--color-text);
  --app-data-header-bg:rgba(var(--club-primary-rgb), .08);
  --app-data-header-border:rgba(var(--club-primary-rgb), .14);
  --app-data-header-size:.84rem;
  --app-data-header-size-mobile:.74rem;
  --app-data-header-letter-spacing:.09em;
  --app-data-header-letter-spacing-mobile:.04em;
}

.app-data-table thead th{
  padding:0 10px 10px;
  border:0;
  background:transparent;
  color:var(--app-data-header-color);
  font-size:var(--app-data-header-size);
  font-weight:900;
  letter-spacing:var(--app-data-header-letter-spacing);
  text-transform:uppercase;
  white-space:nowrap;
  line-height:1.1;
}

.app-data-table.has-header-card,
.app-data-mobile-table.has-header-card{
  border-collapse:separate;
}

.app-data-table.has-header-card thead th,
.app-data-mobile-table.has-header-card thead th{
  padding:10px 12px;
  border-top:1px solid var(--app-data-header-border);
  border-bottom:1px solid var(--app-data-header-border);
  background:var(--app-data-header-bg);
  box-shadow:none;
}

.app-data-table.has-header-card thead th:first-child,
.app-data-mobile-table.has-header-card thead th:first-child{
  border-left:1px solid var(--app-data-header-border);
  border-radius:16px 0 0 16px;
}

.app-data-table.has-header-card thead th:last-child,
.app-data-mobile-table.has-header-card thead th:last-child{
  border-right:1px solid var(--app-data-header-border);
  border-radius:0 16px 16px 0;
}

.app-data-table tbody td{
  font-size:var(--data-table-cell-size);
  line-height:1.2;
}

.app-data-table tbody td:first-child{
  font-size:var(--data-table-name-size);
  font-weight:800;
}

.app-data-table tbody td:nth-child(n+2),
.app-data-table thead th:nth-child(n+2){
  text-align:center;
}

.app-data-table .sort-ind{
  margin-left:6px;
  font-size:var(--data-sort-ind-size);
  color:var(--color-primary);
}

.app-data-head-card{
  color:var(--app-data-header-color);
  font-size:var(--app-data-header-size);
  font-weight:900;
  letter-spacing:var(--app-data-header-letter-spacing);
  text-transform:uppercase;
  line-height:1.1;
  border:1px solid var(--app-data-header-border);
  border-radius:16px;
  background:var(--app-data-header-bg);
}

.app-data-mobile-table thead th{
  padding:0 4px 8px;
  border:0;
  background:transparent;
  color:var(--app-data-header-color);
  font-size:var(--app-data-header-size-mobile);
  letter-spacing:var(--app-data-header-letter-spacing-mobile);
  line-height:1.1;
}

.app-data-mobile-table tbody td{
  font-size:var(--data-table-cell-size);
  line-height:1.2;
}

.app-data-mobile-table tbody td:first-child{
  font-size:var(--data-table-name-size);
  font-weight:800;
}

.app-data-mobile-table tbody td:nth-child(n+2){
  font-size:var(--data-table-number-size);
  font-weight:800;
}

.app-data-mobile-table .sort-ind{
  margin-left:3px;
  font-size:var(--data-sort-ind-size-mobile);
  color:var(--color-primary);
}

@media (max-width:768px){
  .app-card-head,
  .home-card-head{
    align-items:center;
    gap:10px;
  }

  .app-action-link,
  .home-action-link{
    min-height:28px;
    padding:2px 9px;
    font-size:.74rem;
    line-height:1;
  }

  .app-data-page-title,
  .app-data-page-head .h4{
    font-size:var(--data-page-title-size-mobile);
  }

  .app-data-filter{
    width:100%;
    justify-content:space-between;
    padding:4px 8px;
  }

  .app-data-filter select{
    max-width:154px;
    min-height:30px;
    font-size:var(--data-filter-select-size-mobile);
  }

  .app-data-table thead th{
    padding:0 4px 8px;
    font-size:var(--app-data-header-size-mobile);
    letter-spacing:var(--app-data-header-letter-spacing-mobile);
  }

  .app-data-table tbody td{
    font-size:var(--data-table-cell-size);
  }

  .app-data-table tbody td:first-child{
    font-size:var(--data-table-name-size);
  }

  .app-data-table tbody td:nth-child(n+2){
    font-size:var(--data-table-number-size);
    font-weight:800;
  }

  .app-data-table .sort-ind{
    margin-left:3px;
    font-size:var(--data-sort-ind-size-mobile);
  }

  .app-data-head-card{
    font-size:var(--app-data-header-size-mobile);
    letter-spacing:var(--app-data-header-letter-spacing-mobile);
  }
}

.top3-body{
  display:flex;
  flex-direction:column;
  gap:var(--space-4);
}

.top3-item,
.top-item{
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:12px 14px;
  border-radius:14px;
  border:1px solid var(--border);
}

.top-item{
  margin-bottom:6px;
  box-shadow:var(--shadow-float);
  transition:transform .15s ease, box-shadow .15s ease;
}
.top-item:hover{
  transform:translateY(-2px);
  box-shadow:var(--shadow-float-hover);
}

.top-line{
  display:flex;
  align-items:center;
  width:100%;
  justify-content:space-between;
  font-size:.9rem;
  white-space:nowrap;
}
.top-line span:first-child{
  flex:1;
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.top-medal{
  margin-left:auto;
  font-size:1.2rem;
  display:flex;
  align-items:center;
}
.top-footnote{
  margin-top:0;
  padding-top:4px;
  margin-left:6px;
  font-size:.72rem;
  color:var(--color-muted);
  opacity:.8;
  text-align:left;
}

.rank-1{background:linear-gradient(135deg,var(--color-primary-dark) 0%,var(--color-primary) 100%);color:var(--color-text-inverse);}
.rank-2{background:linear-gradient(135deg,color-mix(in srgb, var(--color-primary-dark) 88%, var(--color-success) 12%) 0%,color-mix(in srgb, var(--color-primary) 78%, var(--color-success) 22%) 100%);color:var(--color-text-inverse);}
.rank-3{background:linear-gradient(135deg,color-mix(in srgb, var(--color-primary-dark) 74%, var(--color-success) 26%) 0%,color-mix(in srgb, var(--color-primary) 58%, var(--color-success-soft) 42%) 100%);color:var(--color-text-inverse);}
.rank-4{background:linear-gradient(135deg,color-mix(in srgb, var(--color-primary) 52%, var(--color-success-soft) 48%) 0%,color-mix(in srgb, var(--color-surface) 62%, var(--color-success-soft) 38%) 100%);color:var(--color-text);}
.rank-5{background:linear-gradient(135deg,color-mix(in srgb, var(--color-success-soft) 72%, var(--color-primary-ghost) 28%) 0%,color-mix(in srgb, var(--color-surface) 84%, var(--color-success-soft) 16%) 100%);color:var(--color-text);}

.teams-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:10px;
  min-width:0;
}
.teams{
  display:grid;
  gap:2px;
  line-height:1.15;
  min-width:0;
  flex:1 1 auto;
}
.teams .team{
  display:block;
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-weight:700;
}
.teams .vs{font-size:.85em;opacity:.65}

.teams-head-inline{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  min-width:0;
}
.teams-inline{
  display:block;
  min-width:0;
  flex:1 1 auto;
  font-weight:800;
  line-height:1.2;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.teams-inline .team-inline{
  font-weight:800;
}
.teams-inline .sep{opacity:.6;font-weight:700}

.score-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:72px;
  padding:8px 14px;
  border-radius:var(--radius-pill);
  border:1px solid var(--color-border-subtle-strong);
  background:var(--color-surface);
  font-weight:900;
  font-size:1rem;
  letter-spacing:.01em;
  box-shadow:var(--shadow-xs);
  white-space:nowrap;
}
.score-badge.score-win{
  color:var(--win);
  background:var(--win-bg);
  border-color:var(--color-success-border);
}
.score-badge.score-lose{
  color:var(--lose);
  background:var(--lose-bg);
  border-color:var(--color-danger-border);
}
.score-badge.score-draw{color:var(--muted);background:var(--color-neutral-ghost)}
.score-badge.score-pending{color:var(--muted);background:var(--color-neutral-ghost-soft)}
.score-badge.score-neutral{color:var(--color-text);background:var(--color-surface)}

.app-pair-card,
.pair-card,
.ol-pair-card{
  border:1px solid var(--color-border);
  border-radius:16px;
  background:var(--card-primary-bg);
  box-shadow:var(--shadow-xs);
  transition:
    transform var(--motion-base) var(--ease-standard),
    border-color var(--motion-fast) var(--ease-standard),
    box-shadow var(--motion-fast) var(--ease-standard),
    background-color var(--motion-fast) var(--ease-standard);
}

.app-pair-card.pair-win,
.pair-card.pair-win{
  border-color:var(--color-success-border-strong);
  background:linear-gradient(0deg, color-mix(in srgb, var(--color-success-soft) 70%, var(--color-surface) 30%), var(--color-surface));
}

.app-pair-card.pair-lose,
.pair-card.pair-lose{
  border-color:var(--color-danger-border-strong);
  background:linear-gradient(0deg, color-mix(in srgb, var(--color-danger-soft) 75%, var(--color-surface) 25%), var(--color-surface));
}

.app-pair-card.pair-neutral,
.pair-card.pair-neutral{
  border-color:var(--color-border-subtle);
}

.app-pair-card:focus-within,
.ol-pair-card:focus-within{
  border-color:var(--color-primary-border-soft);
  box-shadow:0 0 0 1px rgba(var(--club-primary-rgb), .08), 0 8px 18px rgba(var(--club-primary-rgb), .06);
  background:var(--color-surface);
}

.app-pair-status,
.pair-status{
  font-size:.85rem;
  font-weight:700;
  padding:4px 10px;
  border-radius:999px;
  border:1px solid color-mix(in srgb, var(--color-border-subtle) 75%, var(--color-surface) 25%);
  background:var(--color-bg-elevated);
  color:var(--color-text-placeholder);
}

.app-pair-status.pair-win,
.pair-status.pair-win{
  background:var(--win-bg);
  color:var(--win);
  border-color:var(--color-success-border);
}

.app-pair-status.pair-lose,
.pair-status.pair-lose{
  background:var(--lose-bg);
  color:var(--lose);
  border-color:var(--color-danger-border);
}

.mobile-results{
  margin-top:10px;
  display:flex;
  flex-wrap:wrap;
  gap:var(--space-3);
}
.match-chip{
  display:inline-flex;
  align-items:center;
  gap:var(--space-3);
  padding:5px 9px;
  border-radius:var(--radius-pill);
  border:1px solid var(--color-border-subtle);
  background:var(--color-surface-overlay);
  line-height:1.05;
  white-space:nowrap;
}
.match-n{font-weight:800;opacity:.68;font-size:.76rem;letter-spacing:.01em}
.pair-names{font-weight:600;font-size:.93rem}
.match-chip .sets{display:inline-flex;gap:5px;font-weight:700}

.set{
  padding:1px 6px;
  border-radius:var(--radius-pill);
  border:1px solid var(--color-border-subtle);
  font-size:.75rem;
  line-height:1.2;
}
.set-win{
  color:var(--win);
  background:var(--win-bg);
  border-color:var(--color-success-border);
}
.set-lose{
  color:var(--lose);
  background:var(--lose-bg);
  border-color:var(--color-danger-border);
}
.set-unk{color:var(--muted);background:var(--color-neutral-ghost)}

.match-win{
  border-color:var(--color-success-border-strong);
  box-shadow:0 0 0 1px var(--color-success-shadow-inset) inset;
}
.match-lose{
  border-color:var(--color-danger-border-strong);
  box-shadow:0 0 0 1px var(--color-danger-shadow-inset) inset;
}
.match-pending{opacity:.75}

.badge-online{
  padding:3px 10px;
  border-radius:var(--radius-pill);
  font-size:.78rem;
  font-weight:800;
  color:var(--color-primary);
  background:var(--color-primary-ghost);
  border:1px solid var(--color-primary-border-soft);
  text-decoration:none;
  white-space:nowrap;
}
.badge-online:hover,
.badge-online:focus{
  color:var(--color-primary-dark);
  background:var(--color-primary-ghost-strong);
  border-color:var(--color-primary);
}

.cal-detail-toggle{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:3px 9px;
  border-radius:var(--radius-pill);
  font-size:.78rem;
  font-weight:700;
  line-height:1.1;
  white-space:nowrap;
}

.btn.btn-club-inverse.cal-detail-toggle,
.btn.btn-club-inverse.cal-detail-toggle:hover,
.btn.btn-club-inverse.cal-detail-toggle:focus,
.btn.btn-club-inverse.cal-detail-toggle[aria-expanded="true"]{
  color:var(--color-primary-dark);
  background:var(--color-surface);
  border-color:var(--color-primary);
}

.btn.btn-club-inverse.cal-detail-toggle:active{
  color:var(--color-primary-dark);
  background:var(--color-surface);
  border-color:var(--color-primary);
}

.cal-gestion-btn{
  min-height:30px;
  padding:5px 12px;
  font-size:.78rem;
  font-weight:800;
  letter-spacing:.01em;
  justify-content:center;
}

.ol-toggle-btn{
  min-width:110px !important;
  padding:.35rem .85rem !important;
  font-size:.95rem !important;
  line-height:1.1 !important;
  border-width:2px !important;
  border-radius:.6rem !important;
  opacity:1 !important;
}

.logout-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:40px;
  height:40px;
  border-radius:var(--radius-pill);
  border:1px solid var(--color-border-subtle-strong);
  background:var(--color-surface);
  color:var(--color-text);
  font-weight:900;
  cursor:pointer;
  box-shadow:var(--shadow-sm);
}
.logout-btn:hover{background:var(--color-overlay-dark-soft);}
.logout-btn:active{transform:scale(.97);}

.logout-ico{
  width:22px;
  height:22px;
  filter:brightness(0) invert(1);
}
@media (max-width:768px){
  .logout-ico{width:24px;height:24px;}
}
#logoutBtn:hover .logout-ico{transform:rotate(-15deg);}
#logoutBtn:active .logout-ico{transform:scale(.9);}

.card-soft .card-header h3{
  margin:0;
  font-size:18px;
  font-weight:800;
  line-height:1.2;
}

.btn{
  min-height:var(--control-height);
  border-radius:16px;
  border-width:1px;
  color:var(--color-text-inverse);
  font-weight:900;
  letter-spacing:.01em;
  padding:10px 16px;
  box-shadow:var(--shadow-xs);
  transition:
    background-color var(--motion-fast) var(--ease-standard),
    border-color var(--motion-fast) var(--ease-standard),
    color var(--motion-fast) var(--ease-standard),
    transform var(--motion-fast) var(--ease-standard),
    box-shadow var(--motion-fast) var(--ease-standard),
    opacity var(--motion-fast) var(--ease-standard);
}

.btn:hover{
  transform:translateY(-1px);
  box-shadow:0 8px 18px rgba(17, 24, 39, .08);
}

.btn:active{
  transform:translateY(0) scale(.985);
}

.btn:focus-visible{
  box-shadow:var(--focus-ring);
}

.btn.btn-dark,
.btn.btn-primary,
.btn.btn-success{
  color:var(--color-text-inverse);
  background:linear-gradient(135deg, var(--color-primary), var(--color-primary-dark));
  border-color:transparent;
}

.btn.btn-dark:hover,
.btn.btn-dark:focus,
.btn.btn-primary:hover,
.btn.btn-primary:focus,
.btn.btn-success:hover,
.btn.btn-success:focus{
  color:var(--color-text-inverse);
  background:linear-gradient(135deg, var(--color-primary-dark), var(--color-primary));
  border-color:transparent;
}

.btn.btn-outline-dark,
.btn.btn-outline-success{
  color:var(--color-primary);
  background:var(--color-surface-overlay-soft);
  border-color:var(--color-primary-border-mid);
}

.btn.btn-outline-dark:hover,
.btn.btn-outline-dark:focus,
.btn.btn-outline-success:hover,
.btn.btn-outline-success:focus{
  color:var(--color-primary-dark);
  background:var(--color-primary-ghost);
  border-color:var(--color-primary);
}

.btn.btn-outline-secondary{
  color:var(--color-muted);
  background:var(--color-surface-overlay-soft);
  border-color:var(--color-border);
}

.btn.btn-outline-secondary:hover,
.btn.btn-outline-secondary:focus{
  color:var(--color-text);
  background:var(--color-overlay-dark-soft);
  border-color:var(--color-border-strong);
}

.btn.btn-outline-primary,
.btn.btn-ghost{
  color:var(--color-primary);
  background:var(--color-primary-ghost);
  border-color:var(--color-primary-border-soft);
}

.btn.btn-outline-primary:hover,
.btn.btn-outline-primary:focus,
.btn.btn-ghost:hover,
.btn.btn-ghost:focus{
  color:var(--color-primary-dark);
  background:var(--color-primary-ghost-strong);
  border-color:var(--color-primary);
}

.btn.btn-club-inverse{
  color:var(--color-primary-dark);
  background:var(--color-surface);
  border-color:var(--color-primary);
}

.btn.btn-club-inverse:hover,
.btn.btn-club-inverse:focus{
  color:var(--color-primary-dark);
  background:var(--color-primary-ghost);
  border-color:var(--color-primary);
}

.btn.btn-club-inverse:active{
  color:var(--color-primary-dark);
  background:var(--color-primary-ghost-strong);
  border-color:var(--color-primary);
}

.btn.btn-club-inverse:disabled,
.btn.btn-club-inverse.disabled{
  opacity:.58;
}

.btn.btn-danger{
  color:var(--color-text-inverse);
  background:linear-gradient(135deg, color-mix(in srgb, var(--color-danger) 82%, var(--color-warning) 18%), var(--color-danger));
  border-color:transparent;
}

.btn.btn-danger:hover,
.btn.btn-danger:focus{
  color:var(--color-text-inverse);
  background:linear-gradient(135deg, var(--color-danger), color-mix(in srgb, var(--color-danger) 78%, var(--color-black) 22%));
  border-color:transparent;
}

.btn-whatsapp{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:10px !important;
  border:0 !important;
  border-radius:14px !important;
  padding:.55rem .9rem !important;
  font-weight:900 !important;
  color:var(--color-text-inverse) !important;
  background:var(--color-whatsapp) !important;
  box-shadow:0 6px 16px var(--color-overlay-dark-softest);
}
.btn-whatsapp:hover{filter:brightness(.96);}
.btn-whatsapp:active{transform:translateY(1px);}
.btn-whatsapp .wa-ico{width:18px;height:18px;display:block;}
.btn-whatsapp .wa-txt{white-space:nowrap;}

@keyframes appStatusReveal{
  from{
    opacity:.01;
    transform:translateY(3px);
  }
  to{
    opacity:1;
    transform:translateY(0);
  }
}

.badge-online.cal-gestion-btn,
.btn.ol-btn-main,
#btnRefresh,
.cf-actions > .btn.btn-outline-secondary{
  color:var(--color-text-inverse) !important;
  background:linear-gradient(135deg, var(--color-primary), var(--color-primary-dark));
  border-color:transparent !important;
  box-shadow:var(--shadow-xs);
}

.badge-online.cal-gestion-btn:hover,
.badge-online.cal-gestion-btn:focus,
.btn.ol-btn-main:hover,
.btn.ol-btn-main:focus,
#btnRefresh:hover,
#btnRefresh:focus,
.cf-actions > .btn.btn-outline-secondary:hover,
.cf-actions > .btn.btn-outline-secondary:focus{
  color:var(--color-text-inverse) !important;
  background:linear-gradient(135deg, var(--color-primary-dark), var(--color-primary));
  border-color:transparent !important;
}

.btn.ol-btn-secondary{
  color:var(--color-text-inverse) !important;
  background:linear-gradient(
    135deg,
    color-mix(in srgb, var(--color-success) 88%, var(--color-primary) 12%),
    var(--color-success)
  );
  border-color:transparent !important;
  box-shadow:var(--shadow-xs);
}

.btn.ol-btn-secondary:hover,
.btn.ol-btn-secondary:focus{
  color:var(--color-text-inverse) !important;
  background:linear-gradient(
    135deg,
    color-mix(in srgb, var(--color-success) 72%, var(--color-black) 28%),
    color-mix(in srgb, var(--color-success) 88%, var(--color-primary-dark) 12%)
  );
  border-color:transparent !important;
}

.app-card:hover,
.card-soft:hover,
.app-list-row:hover{
  box-shadow:0 14px 34px rgba(17, 24, 39, .09);
}