/* Elencos públicos · Botafogo Futsal */
.roster-public { background: #08090b; }
.roster-header { position: relative; background: rgba(6,6,7,.96); }
.roster-header .header-inner { min-height: 86px; }
.roster-header .site-nav { gap: 0; }
.roster-header .site-nav a { padding-inline: 9px; font-size: 8px; }
.roster-header .site-nav a.active { color: #101215; background: #fff; }
.roster-hero { position: relative; overflow: hidden; padding: 105px 0 82px; color: #fff; background: radial-gradient(circle at 82% 22%,rgba(255,255,255,.1),transparent 27rem),linear-gradient(130deg,#131519,#060708 65%); }
.roster-hero::after { content: 'BFR'; position: absolute; right: -18px; bottom: -105px; color: rgba(255,255,255,.03); font: 900 clamp(220px,30vw,460px)/.7 'Barlow Condensed',sans-serif; letter-spacing: -.07em; pointer-events: none; }
.roster-hero .site-shell { position: relative; z-index: 1; }
.roster-back { display: inline-flex; align-items: center; gap: 9px; margin-bottom: 60px; color: rgba(255,255,255,.62)!important; text-decoration: none; font-size: 9px; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.roster-back:hover { color: #fff!important; }
.roster-kicker { display: block; color: #c5ccd6; font-size: 9px; font-weight: 900; letter-spacing: .14em; }
.roster-hero h1 { max-width: 900px; margin: 14px 0 12px; font: 900 clamp(86px,13vw,180px)/.75 'Barlow Condensed',sans-serif; letter-spacing: -.045em; text-transform: uppercase; }
.roster-hero h1 em { font-style: normal; }
@supports (-webkit-text-stroke: 2px #fff) {
  .roster-hero h1 em { color: transparent; -webkit-text-stroke: 2px #fff; }
}
.roster-hero p { max-width: 620px; margin: 0; color: rgba(255,255,255,.58); font-size: 14px; line-height: 1.7; }
.roster-alert { display: flex; align-items: center; gap: 10px; margin-top: 22px; padding: 15px 18px; border-radius: 8px; font-size: 12px; font-weight: 800; }
.roster-alert.success { color: #dbffeb; border: 1px solid rgba(36,191,112,.38); background: rgba(22,128,75,.22); }
.roster-alert.error { color: #ffe1e6; border: 1px solid rgba(239,68,68,.38); background: rgba(153,27,27,.25); }
.roster-categories { padding: 90px 0 105px; color: #101215; background: #eef1f5; }
.roster-categories.compact { padding-block: 35px; border-bottom: 1px solid rgba(16,18,22,.1); }
.roster-section-heading span { color: #6b727c; font-size: 9px; font-weight: 900; letter-spacing: .14em; }
.roster-section-heading h2 { margin: 10px 0 42px; font: 900 clamp(48px,6vw,82px)/.9 'Barlow Condensed',sans-serif; text-transform: uppercase; }
.roster-category-grid { display: grid; grid-template-columns: repeat(4,1fr); gap: 8px; }
.roster-category-grid a { position: relative; min-height: 126px; display: grid; grid-template-columns: 1fr auto; align-items: end; gap: 12px; padding: 21px; overflow: hidden; border: 1px solid rgba(16,18,22,.13); color: #101215!important; background: rgba(255,255,255,.72); text-decoration: none; transition: .25s ease; }
.roster-category-grid a::before { content: ''; position: absolute; inset: auto 0 0; height: 4px; transform: scaleX(0); transform-origin: left; background: #fff; transition: transform .25s ease; }
.roster-category-grid a:hover,.roster-category-grid a.active { color: #fff!important; background: #101215; transform: translateY(-4px); box-shadow: 0 22px 45px rgba(16,18,22,.22); }
.roster-category-grid a:hover::before,.roster-category-grid a.active::before { transform: scaleX(1); }
.roster-category-grid small { display: block; margin-bottom: 7px; color: #767d87; font-size: 7px; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }
.roster-category-grid a:hover small,.roster-category-grid a.active small { color: rgba(255,255,255,.55); }
.roster-category-grid strong { display: block; font: 900 27px/1 'Barlow Condensed',sans-serif; text-transform: uppercase; }
.roster-category-grid i { align-self: start; font-size: 10px; }
.category-total { position: absolute; top: 17px; right: 17px; min-width: 29px; height: 29px; display: grid; place-items: center; border-radius: 50%; color: #fff; background: #101215; font: 900 13px/1 'Barlow Condensed',sans-serif; transition: .25s ease; }
.roster-category-grid a:hover .category-total,.roster-category-grid a.active .category-total { color: #101215; background: #fff; }
.roster-categories.compact .roster-category-grid { display: flex; gap: 7px; overflow-x: auto; scrollbar-width: thin; }
.roster-categories.compact .roster-category-grid a { min-width: 155px; min-height: 74px; padding: 14px; }
.roster-categories.compact .roster-category-grid small,.roster-categories.compact .roster-category-grid i { display: none; }
.roster-categories.compact .roster-category-grid strong { font-size: 20px; }
.roster-categories.compact .category-total { top: 9px; right: 9px; min-width: 24px; height: 24px; font-size: 11px; }
.roster-content { padding: 80px 0 120px; color: #131519; background: #eef1f5; }
.roster-admin-bar { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-bottom: 48px; padding: 16px 18px; border: 1px solid rgba(16,18,22,.2); border-radius: 7px; color: #3b414a; background: #fff; font-size: 11px; }
.roster-admin-bar span { display: flex; align-items: center; gap: 8px; }
.roster-admin-bar i { color: #101215; }
.roster-admin-bar a { padding: 9px 13px; border-radius: 999px; color: #fff!important; background: #101215; text-decoration: none; font-weight: 900; white-space: nowrap; }
.position-group + .position-group { margin-top: 92px; }
.position-heading { display: grid; grid-template-columns: auto 1fr auto; align-items: baseline; gap: 13px; margin-bottom: 28px; border-bottom: 1px solid rgba(16,18,22,.16); }
.position-heading>span { color: #101215; font: 900 25px/1 'Barlow Condensed',sans-serif; }
.position-heading h2 { margin: 0 0 12px; font: 900 clamp(44px,5vw,66px)/.9 'Barlow Condensed',sans-serif; letter-spacing: -.02em; text-transform: uppercase; }
.position-heading em { color: #838a94; font-size: 9px; font-style: normal; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.players-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 20px; }
.player-card { min-width: 0; overflow: hidden; background: #101215; box-shadow: 0 22px 48px rgba(13,15,19,.18); transition: transform .3s cubic-bezier(.22,1,.36,1),box-shadow .3s ease; }
.player-card:hover { transform: translateY(-7px); box-shadow: 0 30px 60px rgba(13,15,19,.28); }
.player-photo { position: relative; aspect-ratio: 2/3; overflow: hidden; isolation: isolate; background: #101215; }
.player-photo::after { content: ''; position: absolute; inset: 0; z-index: 1; pointer-events: none; background: linear-gradient(180deg,transparent 0%,transparent 58%,rgba(16,18,21,.08) 70%,rgba(16,18,21,.78) 100%); }
.player-photo>img { width: 100%; height: 100%; display: block; object-fit: contain; object-position: center top; transform-origin: center top; transition: transform .45s cubic-bezier(.22,1,.36,1); }
.player-card:hover .player-photo>img { transform: scale(1.025); }
.player-placeholder { width: 100%; height: 100%; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 17px; background: radial-gradient(circle at center,rgba(255,255,255,.09),transparent 52%); }
.player-placeholder img { width: 32%; max-height: 44%; object-fit: contain; filter: invert(1) grayscale(1); opacity: .32; }
.player-placeholder span { color: #848b95; font-size: 8px; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }
.player-edit { position: absolute; top: 13px; right: 13px; z-index: 2; min-height: 36px; display: inline-flex; align-items: center; gap: 7px; padding: 0 12px; border: 1px solid rgba(255,255,255,.45); border-radius: 999px; color: #fff; background: rgba(8,9,11,.78); font-size: 9px; font-weight: 900; cursor: pointer; backdrop-filter: blur(12px); }
.player-edit:hover { color: #101215; background: #fff; }
.player-identity { min-height: 118px; padding: 22px 22px 20px; border-top: 4px solid #fff; }
.player-identity h3 { margin: 0; color: #fff; font: 900 clamp(25px,2.6vw,36px)/.95 'Barlow Condensed',sans-serif; letter-spacing: -.012em; text-transform: uppercase; overflow-wrap: anywhere; }
.player-identity p { margin: 10px 0 0; color: #c5ccd6; font-size: 9px; font-weight: 900; letter-spacing: .1em; text-transform: uppercase; }
.roster-empty { max-width: 720px; margin: 25px auto 0; padding: 75px 30px; text-align: center; }
.roster-empty img { width: 105px; filter: grayscale(1); opacity: .35; }
.roster-empty span { display: block; margin-top: 25px; color: #6b727c; font-size: 9px; font-weight: 900; letter-spacing: .13em; }
.roster-empty h2 { margin: 12px auto 28px; font: 900 clamp(38px,6vw,64px)/.94 'Barlow Condensed',sans-serif; text-transform: uppercase; }
.roster-footer { background: #060708; }
.roster-edit-dialog { width: min(780px,calc(100% - 28px)); max-height: calc(100dvh - 28px); padding: 0; overflow: auto; border: 0; border-radius: 20px; color: #15181c; background: #f5f7f9; box-shadow: 0 35px 100px rgba(0,0,0,.55); }
.roster-edit-dialog::backdrop { background: rgba(0,0,0,.76); backdrop-filter: blur(8px); }
.dialog-head { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 21px 24px; color: #fff; background: #101215; }
.dialog-head small { display: block; margin-bottom: 4px; color: #c5ccd6; font-size: 7px; font-weight: 900; letter-spacing: .13em; }
.dialog-head strong { font: 900 27px/1 'Barlow Condensed',sans-serif; text-transform: uppercase; }
.dialog-head button { width: 38px; height: 38px; border: 1px solid rgba(255,255,255,.2); border-radius: 50%; color: #fff; background: transparent; cursor: pointer; }
.dialog-body { display: grid; grid-template-columns: 230px 1fr; gap: 24px; padding: 26px; }
.dialog-photo { aspect-ratio: 4/5; overflow: hidden; border-radius: 12px; background: #e4e8ed; }
.dialog-photo img { width: 100%; height: 100%; object-fit: contain; object-position: center top; background: #101215; }
.dialog-fields { display: flex; flex-direction: column; gap: 16px; }
.dialog-fields label { color: #434a54; font-size: 10px; font-weight: 900; text-transform: uppercase; }
.dialog-fields input { width: 100%; min-height: 48px; display: block; margin-top: 7px; padding: 10px 13px; border: 1px solid #d3d8de; border-radius: 9px; color: #15181c; background: #fff; font: 600 14px 'Manrope',sans-serif; text-transform: none; }
.dialog-fields input:focus { outline: 3px solid rgba(16,18,22,.16); border-color: #101215; }
.dialog-fields label small { display: block; margin-top: 6px; color: #7d848e; font-size: 8px; font-weight: 600; text-transform: none; }
.dialog-actions { display: flex; justify-content: flex-end; gap: 9px; padding: 18px 26px 24px; border-top: 1px solid #dfe3e8; }
.dialog-actions button { min-height: 46px; padding: 0 18px; border-radius: 999px; font-size: 10px; font-weight: 900; cursor: pointer; }
.dialog-cancel { border: 1px solid #ccd2d9; color: #434a54; background: transparent; }
.dialog-save { border: 0; color: #fff; background: #101215; }

@media (max-width:1050px) {
  .roster-header .site-nav { display: none; }
  .roster-category-grid { grid-template-columns: repeat(2,1fr); }
  .players-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width:700px) {
  .roster-header .header-actions .button:first-child { display: none; }
  .roster-hero { padding: 72px 0 58px; }
  .roster-back { margin-bottom: 42px; }
  .roster-hero h1 { font-size: clamp(72px,25vw,112px); }
  .roster-categories { padding-block: 65px; }
  .roster-categories.compact { padding-block: 20px; }
  .roster-category-grid { grid-template-columns: 1fr 1fr; }
  .roster-category-grid a { min-height: 103px; padding: 15px; }
  .roster-category-grid strong { font-size: 21px; }
  .roster-content { padding: 55px 0 85px; }
  .roster-admin-bar { align-items: flex-start; flex-direction: column; }
  .players-grid { grid-template-columns: 1fr; }
  .player-identity { min-height: 105px; }
  .player-identity h3 { font-size: 32px; }
  .position-group + .position-group { margin-top: 68px; }
  .position-heading { grid-template-columns: auto 1fr; }
  .position-heading em { display: none; }
  .dialog-body { grid-template-columns: 92px 1fr; gap: 14px; padding: 18px; }
  .dialog-photo { align-self: start; }
  .dialog-actions { padding: 15px 18px 20px; }
  .dialog-actions button { flex: 1; padding-inline: 10px; }
}