:root {
    --metro-red: #e02020;
    --metro-card: #ffffff;
    --metro-text: #111111;
    --metro-muted: #777777;
    --shadow-soft: 0 18px 45px rgba(0, 0, 0, 0.10)
}

/* Placeholders dos campos de seleção em todo o portal. */
select:has(> option:checked[value=""]) {
    color: #999 !important;
}

select option[value=""] {
    color: #999 !important;
}

select option:not([value=""]) {
    color: #111 !important;
}

/* Ampulheta vermelha usada em todos os modais de gravação/carregamento do
   portal (padronização de mensagens "Esse processo pode levar até 10
   segundos. / Por favor, aguarde finalizar o processo"). Classe global, sem
   escopo de página, para poder ser reaproveitada em qualquer modal. */
.ampulheta-processando.ampulheta-processando {
    position: relative;
    width: 30px;
    height: 44px;
    margin: 0 auto 12px;
    overflow: hidden;
}

.ampulheta-processando .ampulheta-tampa-topo,
.ampulheta-processando .ampulheta-tampa-base {
    position: absolute;
    left: 1px;
    width: calc(100% - 2px);
    height: 3px;
    background: #4a4a4a;
    border-radius: 1px;
}

.ampulheta-processando .ampulheta-tampa-topo { top: 0; }
.ampulheta-processando .ampulheta-tampa-base { bottom: 0; }

.ampulheta-processando::before,
.ampulheta-processando::after {
    content: "";
    position: absolute;
    left: 0;
    width: 100%;
    height: 20px;
    border: 2px solid #4a4a4a;
    box-sizing: border-box;
}

.ampulheta-processando::before {
    top: 0;
    border-bottom: none;
    clip-path: polygon(0 0, 100% 0, 55% 90%, 45% 90%);
}

.ampulheta-processando::after {
    bottom: 0;
    border-top: none;
    clip-path: polygon(45% 10%, 55% 10%, 100% 100%, 0 100%);
}

.ampulheta-processando .ampulheta-areia-topo,
.ampulheta-processando .ampulheta-areia-base,
.ampulheta-processando .ampulheta-grao {
    position: absolute;
    left: 6px;
    background: var(--metro-red, #e02020);
}

.ampulheta-processando .ampulheta-areia-topo {
    top: 3px;
    width: calc(100% - 12px);
    height: 12px;
    clip-path: polygon(0 0, 100% 0, 55% 100%, 45% 100%);
    transform-origin: top center;
    animation: ampulheta-esvaziar 1.6s linear infinite;
}

.ampulheta-processando .ampulheta-areia-base {
    bottom: 3px;
    width: calc(100% - 12px);
    height: 12px;
    clip-path: polygon(45% 0, 55% 0, 100% 100%, 0 100%);
    transform-origin: bottom center;
    opacity: 0;
    animation: ampulheta-empilhar 1.6s linear infinite;
}

.ampulheta-processando .ampulheta-grao {
    top: 20px;
    left: 50%;
    width: 2px;
    height: 4px;
    background: #ffb3b3;
    animation: ampulheta-cair 0.5s linear infinite;
}

@keyframes ampulheta-esvaziar {
    0% { transform: scaleY(1); opacity: 1; }
    90% { transform: scaleY(0.05); opacity: 1; }
    100% { transform: scaleY(0.05); opacity: 0; }
}

@keyframes ampulheta-empilhar {
    0% { transform: scaleY(0.05); opacity: 0; }
    10% { opacity: 1; }
    100% { transform: scaleY(1); opacity: 1; }
}

@keyframes ampulheta-cair {
    0% { transform: translateY(0); opacity: 1; }
    100% { transform: translateY(16px); opacity: 0; }
}

.svg-icon {
    width: 1.15em;
    height: 1.15em;
    flex: 0 0 auto;
    fill: none;
    stroke: currentColor;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
    vertical-align: -0.2em;
}

.page-breadcrumb.page-breadcrumb {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 8px;
    min-width: 0;
    color: var(--metro-muted, #777777);
    font-family: "Space Grotesk", sans-serif;
    font-size: 12px;
    line-height: 1.4;
}

.page-breadcrumb span {
    flex: 0 0 auto;
}

.page-breadcrumb strong {
    min-width: 0;
    color: var(--metro-text, #111111);
    font-weight: 700;
}

.section-nav>.page-breadcrumb {
    flex: 0 0 100%;
    width: 100%;
}

body.page-training-planner .planner-title-block {
    width: 100%;
    min-width: 0;
}

body.page-form:not(.page-training-planner) .form-title-block {
    width: 100%;
    min-width: 0;
}

#profile-card-container .profile-card {
    background: var(--metro-card);
    border-radius: 32px;
    box-shadow: var(--shadow-soft);
    padding: 32px;
    display: flex;
    flex-direction: column
}

#profile-card-container .top-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 24px
}

#profile-card-container .logo-wrap {
    width: 110px;
    height: 110px;
    border-radius: 50%;
    overflow: hidden;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.12)
}

#profile-card-container .logo-wrap img {
    width: 100%;
    height: 100%;
    object-fit: cover
}

#profile-card-container .badges {
    display: flex;
    align-items: center;
    gap: 14px
}

#profile-card-container .badges img {
    width: auto;
    object-fit: contain;
    filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.15))
}

#profile-card-container .badge-fpf {
    height: 38px
}

#profile-card-container .badge-cbf {
    height: 47px
}

#profile-card-container .badge-formador {
    height: 40px
}

#profile-card-container .club-name {
    font-size: 24px;
    font-weight: 700;
    margin-bottom: 12px;
    color: var(--metro-text)
}

#profile-card-container .club-description {
    list-style: none;
    margin-bottom: 11px;
    padding: 0
}

#profile-card-container .club-description li {
    margin: 6px 0;
    color: var(--metro-muted);
    font-size: 15px
}

#profile-card-container .pill-row {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 12px
}

#profile-card-container .tag {
    flex: 0 0 auto;
    padding: 8px 18px;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    border: 1px solid rgba(224, 32, 32, 0.28);
    background: rgba(224, 32, 32, 0.06);
    color: #555555;
    white-space: nowrap
}

#profile-card-container .profile-update {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    margin-top: 16px;
    padding: 12px 14px;
    border: 1px solid rgba(0, 0, 0, .08);
    border-radius: 16px;
    background: #fafafa;
    text-align: center
}

#profile-card-container .profile-update-icon {
    display: grid;
    width: 32px;
    height: 32px;
    flex: 0 0 32px;
    place-items: center;
    border-radius: 50%;
    background: rgba(224, 32, 32, .08);
    color: var(--metro-red);
    font-size: 18px;
    font-weight: 700;
    line-height: 1
}

#profile-card-container .profile-update-copy {
    display: flex;
    min-width: 0;
    flex-direction: column;
    align-items: center;
    gap: 2px
}

#profile-card-container .profile-update-copy span {
    color: var(--metro-muted);
    font-size: 10px;
    font-weight: 600;
    line-height: 1.25;
    letter-spacing: .08em;
    text-transform: uppercase
}

#profile-card-container .profile-update-copy strong {
    color: var(--metro-text);
    font-size: 12px;
    font-weight: 700;
    line-height: 1.3
}

#profile-card-container .next-matches-card {
    background: #ffffff;
    border-radius: 24px;
    padding: 24px;
    box-shadow: var(--shadow-soft);
    border: 1px solid rgba(0, 0, 0, 0.08);
    margin-top: 28px;
    text-align: center
}

#profile-card-container .next-title {
    font-size: 16px;
    font-weight: 700;
    margin-bottom: 18px;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    color: var(--metro-red)
}

#profile-card-container .next-match {
    margin-bottom: 20px;
    padding-bottom: 18px;
    border-bottom: 1px solid #eeeeee
}

#profile-card-container .next-match:last-child {
    margin-bottom: 0;
    padding-bottom: 0;
    border-bottom: none
}

#profile-card-container .match-category {
    font-size: 13px;
    font-weight: 600;
    color: var(--metro-red);
    margin-bottom: 6px
}

#profile-card-container .match-date {
    font-size: 13px;
    font-weight: 600;
    color: #111111;
    margin-bottom: 4px
}

#profile-card-container .match-info {
    font-size: 13px;
    font-weight: 700;
    color: #111111;
    margin-bottom: 4px
}

#profile-card-container .match-location {
    font-size: 12px;
    color: var(--metro-muted)
}

.modal-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.6);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9999;
    animation: fadeIn .4s
}

.modal-box {
    background: white;
    padding: 30px;
    border-radius: 14px;
    max-width: 420px;
    width: 90%;
    text-align: center;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
    animation: slideUp .4s
}

.modal-box h2 {
    color: #d40000;
    margin-bottom: 10px
}

.modal-box p {
    font-size: 14px;
    line-height: 1.5;
    margin-bottom: 15px
}

.modal-box button {
    background: #d40000;
    color: white;
    border: none;
    padding: 12px 22px;
    border-radius: 8px;
    cursor: pointer;
    font-weight: 600;
    font-size: 14px
}

.modal-box button:hover {
    background: #b30000
}

#profile-card-container .match-stream {
    margin-top: 8px;
    display: flex;
    align-items: center;
    gap: 6px;
    color: #ff0000;
    font-weight: 600
}

#profile-card-container .match-stage {
    font-size: 13px;
    font-weight: 600;
    color: var(--metro-red);
    margin-bottom: 6px
}

#profile-card-container .match-competition {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 10px;
    padding: 6px 12px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    line-height: 1;
    border: 1px solid transparent
}

#profile-card-container .competition-paulista-cup {
    background: linear-gradient(135deg, rgba(246, 19, 3, 0.12), rgba(246, 19, 3, 0.04));
    color: #f61303;
    border: 1px solid rgba(246, 19, 3, 0.35);
    box-shadow: 0 4px 10px rgba(246, 19, 3, 0.12);
    font-size: 14px
}

#profile-card-container .competition-libraef {
    background: linear-gradient(135deg, rgba(40, 167, 69, 0.12), rgba(40, 167, 69, 0.04));
    color: #28a745;
    border: 1px solid rgba(40, 167, 69, 0.7);
    box-shadow: 0 6px 14px rgba(0, 0, 0, 0.10)
}

#profile-card-container .competition-amistoso {
    background: linear-gradient(135deg, rgba(255, 193, 7, 0.15), rgba(255, 193, 7, 0.05));
    color: #b8860b;
    border: 1px solid rgba(255, 193, 7, 0.35);
    box-shadow: 0 4px 10px rgba(255, 193, 7, 0.12)
}

#profile-card-container .competition-uniaocup {
    background: linear-gradient(135deg, rgba(40, 167, 69, 0.15), rgba(40, 167, 69, 0.05));
    color: #218838;
    border: 1px solid rgba(40, 167, 69, 0.45);
    box-shadow: 0 4px 10px rgba(40, 167, 69, 0.14)
}

#profile-card-container .competition-apf {
    background: linear-gradient(135deg, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.25));
    color: #ffffff;
    border: 1px solid rgba(0, 0, 0, 0.45);
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.18);
    font-size: 14px
}

@media (max-width:850px) {
    #profile-card-container .top-header {
        flex-direction: column;
        align-items: flex-start;
        gap: 16px
    }

    #profile-card-container .badges {
        justify-content: flex-start
    }
}

@keyframes fadeIn {
    from {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

@keyframes slideUp {
    from {
        transform: translateY(40px);
        opacity: 0
    }

    to {
        transform: translateY(0);
        opacity: 1
    }
}

.btn-metro-jogar {
    background: #d40000;
    color: white;
    border: none;
    padding: 12px 22px;
    border-radius: 8px;
    cursor: pointer;
    font-weight: 600;
    font-size: 14px;
    text-decoration: none
}

.btn-metro-jogar:hover {
    background: #b80000
}

.footer-container,
#footer-container {
    width: 100%
}

#footer-container .footer {
    margin-top: 24px
}

.u-team-width-120 {
    width: 120px
}

.u-team-width-110 {
    width: 110px
}

.u-inline-1 {
    padding: 24px;
    border-radius: 24px;
    border: 1px dashed #ddd;
    color: #aaa
}

.u-inline-2 {
    padding: 24px;
    color: #999
}

.u-inline-3 {
    margin-top: 8px
}

.u-inline-4 {
    text-align: center;
    color: #777
}

.u-inline-5 {
    width: 100%;
    height: auto;
    max-height: 380px
}

.u-inline-6 {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    align-items: center
}

.u-inline-7 {
    color: #111;
    margin: 0 0 8px 0;
    font-size: 13px
}

.u-inline-8 {
    display: flex;
    gap: 20px;
    flex-wrap: wrap;
    margin-top: 12px
}

.u-inline-9 {
    border-color: #eeeeee;
    margin: 14px 0
}

.u-inline-10 {
    background: rgba(224, 32, 32, 0.06);
    border-left: 4px solid #E02020;
    padding: 12px;
    border-radius: 16px;
    margin-top: 12px
}

.u-inline-11 {
    font-weight: bold
}

.u-inline-12 {
    background: #f7f7f7;
    border-left: 4px solid #111;
    padding: 12px;
    border-radius: 16px;
    margin-top: 12px
}

.u-inline-13 {
    color: #777;
    margin-top: 8px
}

.u-inline-14 {
    padding: 24px;
    border-radius: 24px;
    border: 1px dashed #ddd;
    color: #999
}

.u-inline-15 {
    color: #e02020;
    font-size: 12px;
    display: none
}

.u-inline-16 {
    color: #e02020;
    font-weight: 700
}

.u-inline-17 {
    display: none;
    visibility: hidden
}

.u-inline-18 {
    width: 120px;
    height: 120px;
    object-fit: cover;
    border-radius: 50%
}

.u-inline-19 {
    margin-top: 10px;
    margin-bottom: 18px
}

.u-inline-20 {
    margin-top: 24px
}

.u-inline-21 {
    margin-top: 10px;
    margin-bottom: 18px
}

.u-inline-22 {
    margin-top: 20px
}

.u-inline-23 {
    margin-bottom: 20px
}

.u-inline-24 {
    width: 200px;
    display: block;
    margin: 20px auto;
    border-radius: 16px;
    background: transparent;
    box-shadow: none
}

.u-inline-25 {
    width: 35mm;
    height: auto
}

.u-inline-26 {
    cursor: pointer
}

.u-inline-27 {
    margin-top: 18px
}

.u-inline-28 {
    display: none
}

.u-inline-29 {
    justify-content: center
}

.u-inline-30 {
    padding: 24px;
    border: 1px dashed #ddd;
    border-radius: 24px;
    color: #aaa
}

.u-inline-31 {
    margin-bottom: 12px
}

.u-inline-32 {
    margin-bottom: 20px
}

.u-inline-33 {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 6px;
    font-size: 13px
}

.u-inline-34 {
    height: 180px;
    border-radius: 16px
}

.u-inline-35 {
    height: 220px;
    border-radius: 16px
}

.u-inline-36 {
    padding: 20px;
    border-radius: 20px;
    border: 1px solid #eee
}

.u-inline-37 {
    margin-bottom: 10px
}

.u-inline-38 {
    color: #777;
    font-size: 14px
}

.u-hidden-file-input {
    display: none
}

body.page-404 {
    margin: 0;
    background: #f5f6f8;
    font-family: Arial, sans-serif;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100vh
}

body.page-404 .error-card {
    background: var(--metro-card);
    border-radius: 32px;
    box-shadow: var(--shadow-soft);
    padding: 50px 40px;
    text-align: center;
    max-width: 480px;
    width: 90%
}

body.page-404 .error-code {
    font-size: 110px;
    font-weight: 800;
    color: var(--metro-red);
    margin: 0
}

body.page-404 .error-title {
    font-size: 20px;
    font-weight: 700;
    margin-top: 10px;
    color: var(--metro-text)
}

body.page-404 .error-desc {
    font-size: 14px;
    color: var(--metro-muted);
    margin: 20px 0 30px
}

body.page-404 .divider {
    width: 50px;
    height: 3px;
    background: var(--metro-red);
    margin: 20px auto;
    border-radius: 2px
}

body.page-404 .btn-area {
    display: flex;
    justify-content: center;
    gap: 10px;
    flex-wrap: wrap
}

body.page-404 .secondary-link {
    font-size: 13px;
    color: var(--metro-red);
    text-decoration: none;
    margin-top: 10px;
    display: inline-block
}

body.page-404 .secondary-link:hover {
    text-decoration: underline
}

body.page-agenda {
    --metro-red: #e02020;
    --metro-muted: #777;
    --shadow-soft: 0 14px 35px rgba(0, 0, 0, .08)
}

body.page-agenda * {
    box-sizing: border-box;
    margin: 0;
    padding: 0
}

body.page-agenda {
    font-family: "Space Grotesk", sans-serif;
    background: #fff;
    padding: 32px 16px 24px
}

body.page-agenda .page {
    max-width: 1120px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 420px 1fr;
    gap: 40px;
    align-items: flex-start
}

body.page-agenda .agenda-card {
    background: #fff;
    border-radius: 24px;
    padding: 24px;
    box-shadow: var(--shadow-soft);
    border: 1px solid rgba(0, 0, 0, .08)
}

body.page-agenda .agenda-card>.page-breadcrumb {
    margin-bottom: 20px
}

body.page-agenda .agenda-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 20px;
    margin-bottom: 18px
}

body.page-agenda .agenda-title {
    font-size: 22px;
    font-weight: 700
}

body.page-agenda .agenda-header p {
    margin-top: 5px;
    color: var(--metro-muted);
    font-size: 13px
}

body.page-agenda .agenda-reference {
    display: grid;
    gap: 8px;
    min-width: 280px
}

body.page-agenda .agenda-reference>span:first-child {
    color: #68686d;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase
}

body.page-agenda .agenda-month-picker {
    display: grid;
    grid-template-columns: minmax(150px, 1fr) 94px;
    gap: 8px
}

body.page-agenda .agenda-month-picker select {
    width: 100%;
    min-height: 44px;
    padding: 9px 12px;
    border: 1px solid #d8d8dc;
    border-radius: 13px;
    background: #fff;
    color: #222226;
    font: 600 13px/1.35 "Space Grotesk", sans-serif
}

body.page-agenda .agenda-status {
    margin-bottom: 14px;
    color: var(--metro-muted);
    font-size: 12px
}

body.page-agenda .agenda-status.is-error {
    color: #b30000
}

body.page-agenda .agenda-calendar-weekdays,
body.page-agenda .agenda-grid {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 9px
}

body.page-agenda .agenda-calendar-weekdays {
    margin-bottom: 9px
}

body.page-agenda .agenda-calendar-weekdays span {
    color: #77777c;
    font-size: 10px;
    font-weight: 700;
    text-align: center;
    text-transform: uppercase
}

body.page-agenda .agenda-calendar-spacer {
    min-width: 0
}

body.page-agenda .agenda-day {
    border-radius: 15px;
    border: 1px solid #e1e1e4;
    padding: 10px;
    background: #fafafa;
    display: flex;
    flex-direction: column;
    gap: 8px;
    height: 132px;
    min-width: 0;
    position: relative
}

body.page-agenda .agenda-day.has-events {
    cursor: pointer;
    transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease
}

body.page-agenda .agenda-day.has-events:hover,
body.page-agenda .agenda-day.has-events:focus-visible {
    outline: 0;
    transform: translateY(-3px);
    border-color: rgba(224, 32, 32, .65);
    background: #fff;
    box-shadow: 0 12px 28px rgba(0, 0, 0, .1)
}

body.page-agenda .day-header {
    display: flex;
    justify-content: flex-start;
    align-items: center
}

body.page-agenda .day-number {
    font-size: 15px;
    font-weight: 700;
    color: var(--metro-red)
}

body.page-agenda .day-week {
    display: none
}

body.page-agenda .day-events {
    display: flex;
    min-height: 0;
    flex: 1;
    flex-direction: column;
    gap: 8px
}

body.page-agenda .agenda-day.today {
    border: 2px solid #f2c94c;
    background: #fff9e6;
    box-shadow: 0 8px 22px rgba(242, 201, 76, 0.35)
}

body.page-agenda .agenda-day.today .day-number {
    color: #f2c94c
}

body.page-agenda .agenda-day.today::after {
    content: "HOJE";
    position: absolute;
    top: 9px;
    right: 8px;
    padding: 3px 5px;
    text-align: center;
    font-size: 7px;
    font-weight: 700;
    letter-spacing: .08em;
    color: #fff;
    background: #f2c94c;
    border-radius: 999px
}

body.page-agenda .event {
    display: flex;
    align-items: stretch;
    gap: 8px;
    min-width: 0;
    font-size: 12px;
    padding: 8px;
    border-radius: 9px;
    background: #fff;
    border: 1px solid #e5e5e5
}

body.page-agenda .event-content {
    display: grid;
    min-width: 0;
    flex: 1;
    gap: 4px
}

body.page-agenda .event-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 7px
}

body.page-agenda .event-heading strong {
    min-width: 0;
    color: #222226;
    font-size: 12px;
    line-height: 1.3
}

body.page-agenda .event-time {
    flex: 0 0 auto;
    color: #333338;
    font-size: 11px;
    font-weight: 700
}

body.page-agenda .event-meta,
body.page-agenda .event-content p {
    color: var(--metro-muted);
    font-size: 10px;
    line-height: 1.35
}

body.page-agenda .agenda-day-empty {
    margin: auto 0;
    color: #aaa;
    font-size: 9px;
    line-height: 1.25
}

body.page-agenda .agenda-day.has-events .day-events {
    display: flex;
    flex-direction: column;
    align-content: stretch
}

body.page-agenda .agenda-day-summary {
    display: grid;
    grid-template-columns: 4px minmax(0, 1fr) auto;
    align-items: center;
    gap: 3px;
    min-width: 0;
    padding: 4px;
    border: 1px solid #e5e5e5;
    border-radius: 8px;
    background: #fff
}

body.page-agenda .agenda-summary-color {
    width: 4px;
    height: 18px;
    border-radius: 999px
}

body.page-agenda .agenda-summary-color.treino {
    background: #000
}

body.page-agenda .agenda-summary-color.jogo {
    background: #e02020
}

body.page-agenda .agenda-summary-color.avaliacao {
    background: #03f503
}

body.page-agenda .agenda-summary-color.extra {
    background: #9a9a9a
}

body.page-agenda .agenda-summary-color.staff {
    background: #059500
}

body.page-agenda .agenda-summary-color.reuniao {
    background: #4169e1
}

body.page-agenda .agenda-day-rest {
    margin: auto 0;
    color: #aaa;
    font-size: 9px;
    font-weight: 700;
    text-align: center;
    text-transform: uppercase
}

body.page-agenda .agenda-day-summary strong {
    color: #222226;
    font-size: 12px;
    line-height: 1
}

body.page-agenda .agenda-summary-label {
    overflow-wrap: anywhere;
    color: var(--metro-muted);
    font-size: 7px;
    font-weight: 700;
    line-height: 1.05
}

body.page-agenda .event-preview {
    min-height: 0;
    overflow: hidden
}

body.page-agenda .event-preview .event-content p {
    display: none
}

body.page-agenda .event-preview.event-match .event-heading {
    display: grid;
    grid-template-columns: 1fr;
    gap: 5px
}

body.page-agenda .event-preview.event-match .event-time {
    grid-row: 1;
    width: max-content;
    padding: 3px 7px;
    border-radius: 999px;
    background: rgba(224, 32, 32, .09);
    color: var(--metro-red);
    font-size: 10px
}

body.page-agenda .event-preview.event-match .event-heading strong {
    grid-row: 2;
    display: -webkit-box;
    overflow: hidden;
    font-size: 11px;
    line-height: 1.25;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2
}

body.page-agenda .event-preview.event-match .event-meta {
    display: -webkit-box;
    overflow: hidden;
    line-height: 1.3;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2
}

body.page-agenda .agenda-day-action {
    margin-top: auto;
    color: var(--metro-red);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase
}

body.page-agenda .badge {
    width: 6px;
    height: 100%;
    border-radius: 4px;
    flex: 0 0 6px
}

body.page-agenda .badge.treino {
    background: #000
}

body.page-agenda .badge.jogo {
    background: #e02020
}

body.page-agenda .badge.avaliacao {
    background: #03f503
}

body.page-agenda .badge.extra {
    background: #9a9a9a
}

body.page-agenda .badge.staff {
    background: #059500
}

body.page-agenda .badge.reuniao {
    background: #4169e1
}

body.page-agenda .badge.folga {
    background: #c5c5c9
}

body.page-agenda .badge.amistoso {
    background: #fadd00
}

body.agenda-modal-open {
    overflow: hidden
}

body.page-agenda .agenda-modal-backdrop {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 20px;
    background: rgba(0, 0, 0, .42)
}

body.page-agenda .agenda-modal-backdrop.is-visible {
    display: flex
}

body.page-agenda .agenda-day-modal {
    width: min(92vw, 620px);
    max-height: min(82vh, 720px);
    overflow: hidden;
    padding: 26px;
    border: 1px solid #e2e2e2;
    border-radius: 26px;
    background: #fff;
    box-shadow: 0 24px 60px rgba(0, 0, 0, .2)
}

body.page-agenda .agenda-day-modal>header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 18px
}

body.page-agenda .agenda-day-modal>header span {
    color: var(--metro-red);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase
}

body.page-agenda .agenda-day-modal h2 {
    margin-top: 4px;
    color: #202024;
    font-size: 22px
}

body.page-agenda .agenda-day-modal header p {
    margin-top: 5px;
    color: var(--metro-muted);
    font-size: 12px
}

body.page-agenda #agendaModalClose {
    display: grid;
    flex: 0 0 36px;
    width: 36px;
    height: 36px;
    place-items: center;
    border: 1px solid #dedee2;
    border-radius: 50%;
    background: #fff;
    color: #55555a;
    font: 400 24px/1 sans-serif;
    cursor: pointer
}

body.page-agenda .agenda-modal-events {
    display: grid;
    gap: 10px;
    max-height: calc(min(82vh, 720px) - 130px);
    padding-right: 4px;
    overflow-y: auto
}

body.page-agenda .agenda-modal-events .event {
    padding: 12px
}

body.page-agenda .agenda-modal-events .event-heading strong {
    font-size: 14px
}

body.page-agenda .agenda-modal-events .event-match .event-heading {
    align-items: center
}

body.page-agenda .agenda-modal-events .event-match .event-time {
    padding: 4px 8px;
    border-radius: 999px;
    background: rgba(224, 32, 32, .09);
    color: var(--metro-red)
}

body.page-agenda .agenda-modal-events .event-time {
    font-size: 12px
}

body.page-agenda .agenda-modal-events .event-meta,
body.page-agenda .agenda-modal-events .event-content p {
    font-size: 11px
}

body.page-agenda .footer {
    text-align: center;
    margin-top: 8px
}

body.page-agenda .footer-main {
    font-size: 14px;
    color: #666;
    margin: 0
}

body.page-agenda .footer-sub {
    font-size: 11px;
    color: #999;
    margin-top: 4px;
    line-height: 1.4
}

@media(max-width:900px) {
    body.page-agenda .page {
        grid-template-columns: 1fr
    }

    body.page-agenda .agenda-grid {
        grid-template-columns: repeat(7, minmax(0, 1fr))
    }
}

@media(max-width:620px) {
    body.page-agenda .agenda-header {
        align-items: stretch;
        flex-direction: column
    }

    body.page-agenda .agenda-reference {
        min-width: 0
    }

    body.page-agenda .agenda-calendar-weekdays {
        display: none
    }

    body.page-agenda .agenda-calendar-spacer {
        display: none
    }

    body.page-agenda .agenda-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }

    body.page-agenda .agenda-day {
        height: 142px
    }

    body.page-agenda .day-header {
        justify-content: space-between
    }

    body.page-agenda .day-week {
        display: inline;
        font-size: 9px;
        color: var(--metro-muted);
        text-transform: uppercase;
        letter-spacing: .08em
    }
}

body.page-analise-atleta {
    --metro-red: #e02020;
    --metro-card: #ffffff;
    --metro-text: #111111;
    --metro-muted: #777777;
    --shadow-soft: 0 18px 45px rgba(0, 0, 0, 0.10)
}

body.page-analise-atleta .profile-card {
    background: var(--metro-card);
    border-radius: 32px;
    box-shadow: var(--shadow-soft);
    padding: 32px;
    display: flex;
    flex-direction: column
}

body.page-analise-atleta .top-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 24px
}

body.page-analise-atleta .logo-wrap {
    width: 110px;
    height: 110px;
    border-radius: 50%;
    overflow: hidden;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.12)
}

body.page-analise-atleta .logo-wrap img {
    width: 100%;
    height: 100%;
    object-fit: cover
}

body.page-analise-atleta .badges {
    display: flex;
    align-items: center;
    gap: 14px
}

body.page-analise-atleta .badges img {
    width: auto;
    object-fit: contain;
    filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.15))
}

body.page-analise-atleta .badge-fpf {
    height: 38px
}

body.page-analise-atleta .badge-cbf {
    height: 47px
}

body.page-analise-atleta .badge-formador {
    height: 40px
}

body.page-analise-atleta .club-name {
    font-size: 24px;
    font-weight: 700;
    margin-bottom: 12px;
    color: var(--metro-text)
}

body.page-analise-atleta .club-description {
    list-style: none;
    margin-bottom: 11px;
    padding: 0
}

body.page-analise-atleta .club-description li {
    margin: 6px 0;
    color: var(--metro-muted);
    font-size: 15px
}

body.page-analise-atleta .pill-row {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 12px
}

body.page-analise-atleta .tag {
    padding: 8px 18px;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    border: 1px solid rgba(224, 32, 32, 0.28);
    background: rgba(224, 32, 32, 0.06);
    color: #555555;
    white-space: nowrap
}

body.page-analise-atleta .next-matches-card {
    background: #ffffff;
    border-radius: 24px;
    padding: 24px;
    box-shadow: var(--shadow-soft);
    border: 1px solid rgba(0, 0, 0, 0.08);
    margin-top: 28px;
    text-align: center
}

body.page-analise-atleta .next-title {
    font-size: 16px;
    font-weight: 700;
    margin-bottom: 18px;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    color: var(--metro-red)
}

body.page-analise-atleta .next-match {
    margin-bottom: 20px;
    padding-bottom: 18px;
    border-bottom: 1px solid #eeeeee
}

body.page-analise-atleta .next-match:last-child {
    margin-bottom: 0;
    padding-bottom: 0;
    border-bottom: none
}

body.page-analise-atleta .match-category {
    font-size: 13px;
    font-weight: 600;
    color: var(--metro-red);
    margin-bottom: 6px
}

body.page-analise-atleta .match-date {
    font-size: 14px;
    font-weight: 600;
    color: #111111;
    margin-bottom: 4px
}

body.page-analise-atleta .match-info {
    font-size: 15px;
    font-weight: 700;
    color: #111111;
    margin-bottom: 4px
}

body.page-analise-atleta .match-location {
    font-size: 12px;
    color: var(--metro-muted)
}

body.page-analise-atleta .modal-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.6);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 9999;
    animation: fadeIn .4s
}

body.page-analise-atleta .modal-box {
    background: white;
    padding: 30px;
    border-radius: 14px;
    max-width: 420px;
    width: 90%;
    text-align: center;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
    animation: slideUp .4s
}

body.page-analise-atleta .modal-box h2 {
    color: #d40000;
    margin-bottom: 10px
}

body.page-analise-atleta .modal-box p {
    font-size: 14px;
    line-height: 1.5;
    margin-bottom: 15px
}

body.page-analise-atleta .modal-box button {
    background: #d40000;
    color: white;
    border: none;
    padding: 12px 22px;
    border-radius: 8px;
    cursor: pointer;
    font-weight: 600;
    font-size: 14px
}

body.page-analise-atleta .modal-box button:hover {
    background: #b30000
}

body.page-analise-atleta .match-competition {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 10px;
    padding: 6px 12px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    line-height: 1;
    border: 1px solid transparent
}

body.page-analise-atleta .competition-paulista {
    background: linear-gradient(135deg, rgba(246, 19, 3, 0.12), rgba(246, 19, 3, 0.04));
    color: #f61303;
    border: 1px solid rgba(246, 19, 3, 0.35);
    box-shadow: 0 4px 10px rgba(246, 19, 3, 0.12)
}

body.page-analise-atleta .competition-libraef {
    background: linear-gradient(135deg, rgba(40, 167, 69, 0.12), rgba(40, 167, 69, 0.04));
    color: #28a745;
    border: 1px solid rgba(40, 167, 69, 0.7);
    box-shadow: 0 6px 14px rgba(0, 0, 0, 0.10)
}

body.page-analise-atleta .competition-amistoso {
    background: linear-gradient(135deg, rgba(255, 193, 7, 0.15), rgba(255, 193, 7, 0.05));
    color: #b8860b;
    border: 1px solid rgba(255, 193, 7, 0.35);
    box-shadow: 0 4px 10px rgba(255, 193, 7, 0.12)
}

body.page-analise-atleta .competition-uniaocup {
    background: linear-gradient(135deg, rgba(13, 110, 253, 0.15), rgba(13, 110, 253, 0.05));
    color: #0d6efd;
    border: 1px solid rgba(13, 110, 253, 0.35);
    box-shadow: 0 4px 10px rgba(13, 110, 253, 0.12)
}

body.page-analise-atleta .competition-liesp {
    background: linear-gradient(135deg, rgba(108, 117, 125, 0.15), rgba(108, 117, 125, 0.05));
    color: #343a40;
    border: 1px solid rgba(108, 117, 125, 0.35);
    box-shadow: 0 4px 10px rgba(108, 117, 125, 0.12)
}

body.page-analise-atleta .competition-apf {
    background: linear-gradient(135deg, rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.25));
    color: #ffffff;
    border: 1px solid rgba(0, 0, 0, 0.45);
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.18)
}

@media (max-width:850px) {
    body.page-analise-atleta .top-header {
        flex-direction: column;
        align-items: flex-start;
        gap: 16px
    }

    body.page-analise-atleta .badges {
        justify-content: flex-start
    }
}

body.page-analise-atleta .btn-metro-jogar {
    background: #d40000;
    color: white;
    border: none;
    padding: 12px 22px;
    border-radius: 8px;
    cursor: pointer;
    font-weight: 600;
    font-size: 14px;
    text-decoration: none
}

body.page-analise-atleta .btn-metro-jogar:hover {
    background: #b80000
}

body.page-analise-atleta {
    --metro-red: #E02020;
    --metro-text: #111;
    --metro-muted: #777;
    --metro-border: rgba(0, 0, 0, 0.08)
}

body.page-analise-atleta * {
    margin: 0;
    padding: 0;
    box-sizing: border-box
}

body.page-analise-atleta *::before,
body.page-analise-atleta *::after {
    background: none !important
}

body.page-analise-atleta {
    font-family: "Space Grotesk", sans-serif;
    background: #fff;
    color: var(--metro-text);
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    padding: 32px 16px 24px;
    opacity: 1 !important
}

body.page-analise-atleta .page {
    flex: 1;
    width: 100%;
    max-width: 1120px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 420px 1fr;
    gap: 40px;
    align-items: flex-start
}

body.page-analise-atleta #profile-card-container {
    min-width: 420px
}

body.page-analise-atleta .analysis-wrapper {
    display: flex
}

body.page-analise-atleta .analysis-card {
    background: #fff;
    border-radius: 28px;
    padding: 24px;
    box-shadow: 0 14px 35px rgba(0, 0, 0, 0.06);
    border: 1px solid var(--metro-border);
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 18px;
    font-size: 13px
}

body.page-analise-atleta .form-title {
    font-size: 22px;
    font-weight: 700;
    color: var(--metro-text)
}

body.page-analise-atleta .form-subtitle {
    font-size: 13px;
    color: var(--metro-muted);
    margin-top: 4px
}

body.page-analise-atleta .analysis-section {
    border-top: 1px solid #eeeeee;
    padding-top: 18px;
    min-width: 0
}

body.page-analise-atleta .analysis-section h3 {
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    color: var(--metro-muted);
    margin-bottom: 14px;
    font-weight: 700
}

body.page-analise-atleta .grid-2col {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
    align-items: start
}

body.page-analise-atleta .input-group {
    margin-bottom: 14px
}

body.page-analise-atleta label {
    display: block;
    font-size: 13px;
    font-weight: 500;
    color: var(--metro-text);
    margin-bottom: 6px
}

body.page-analise-atleta input,
body.page-analise-atleta select {
    width: 100%;
    height: 40px;
    border-radius: 999px;
    border: 1px solid #d5d5d5;
    padding: 0 14px;
    font-size: 13px;
    line-height: 40px;
    outline: none;
    background: #fff;
    color: var(--metro-text);
    font-family: "Space Grotesk", sans-serif
}

body.page-analise-atleta select {
    cursor: pointer
}

body.page-analise-atleta input:focus,
body.page-analise-atleta select:focus {
    border-color: var(--metro-red);
    box-shadow: 0 0 0 1px rgba(224, 32, 32, 0.08)
}

body.page-analise-atleta input[type="number"] {
    -moz-appearance: textfield
}

body.page-analise-atleta .attrs-row {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 12px
}

body.page-analise-atleta .metrics-grid {
    row-gap: 0
}

body.page-analise-atleta .metrics-category {
    position: relative;
    margin-bottom: 18px;
    padding: 22px 22px 8px;
    border: 1px solid #dedee3;
    border-radius: 22px;
    background: #fff;
    box-shadow: 0 10px 26px rgba(0, 0, 0, .055)
}

body.page-analise-atleta .metrics-category h4 {
    margin: 0 0 18px;
    padding-bottom: 12px;
    border-bottom: 1px solid #ededf0;
    color: var(--metro-text);
    font-size: 16px;
    font-weight: 700
}

body.page-analise-atleta .metric-scale {
    display: inline-block;
    margin-left: 6px;
    padding: 3px 8px;
    border-radius: 999px;
    background: #f0f0f2;
    color: #555;
    font-size: 10px;
    letter-spacing: .04em;
    vertical-align: middle
}

body.page-analise-atleta .potential-analysis-section {
    padding: 22px;
    border: 1px solid #dedee3;
    border-radius: 22px;
    background: #fff;
    box-shadow: 0 10px 26px rgba(0, 0, 0, .055)
}

body.page-analise-atleta .button-group {
    display: flex;
    justify-content: center;
    gap: 12px;
    flex-wrap: wrap
}

body.page-analise-atleta .btn-primary {
    padding: 11px 20px;
    border-radius: 999px;
    border: none;
    background: var(--metro-red);
    color: #fff;
    font-weight: 600;
    font-size: 13px;
    cursor: pointer;
    transition: 0.15s;
    font-family: "Space Grotesk", sans-serif
}

body.page-analise-atleta .btn-primary:hover {
    transform: translateY(-1px);
    box-shadow: 0 10px 25px rgba(224, 32, 32, 0.35);
    background: #c01818
}

body.page-analise-atleta .btn-pdf {
    background: #9f1c1c
}

body.page-analise-atleta .btn-pdf:hover {
    background: #7f1515;
    box-shadow: 0 10px 25px rgba(159, 28, 28, .28)
}

body.page-analise-atleta .relatorio-box,
body.page-analise-atleta .radar-container {
    background: #fff;
    border-radius: 24px;
    padding: 20px;
    border: 1px solid var(--metro-border);
    margin-top: 12px
}

body.page-analise-atleta .relatorio-box {
    color: var(--metro-text);
    font-size: 13px;
    line-height: 1.5
}

body.page-analise-atleta .diagnostic-block {
    margin-top: 14px
}

body.page-analise-atleta .diagnostic-title {
    font-weight: 700;
    margin-bottom: 8px
}

body.page-analise-atleta .diagnostic-line {
    margin: 4px 0
}

body.page-analise-atleta .diagnostic-highlights {
    margin-top: 20px;
    font-weight: 700
}

body.page-analise-atleta .radar-container {
    margin-top: 18px
}

body.page-analise-atleta .charts-page {
    display: grid;
    grid-template-columns: 1fr;
    gap: 18px;
    background: #fff
}

body.page-analise-atleta .radar-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px
}

body.page-analise-atleta .radar-grid .radar-container:last-child {
    grid-column: 1 / -1
}

body.page-analise-atleta .charts-page .radar-container {
    margin-top: 0
}

body.page-analise-atleta .charts-page h3 {
    margin: 0 0 14px;
    color: var(--metro-text);
    font-size: 14px;
    font-weight: 700;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: .08em
}

body.page-analise-atleta .potential-chart-container canvas {
    max-height: 350px
}

body.page-analise-atleta .report-hero {
    display: grid;
    grid-template-columns: 92px 1fr 132px;
    gap: 20px;
    align-items: center;
    padding: 22px;
    border: 1px solid rgba(224, 32, 32, .22);
    border-radius: 22px;
    background: linear-gradient(135deg, #fff 0%, #fff4f4 100%);
    color: var(--metro-text);
    text-align: center
}

body.page-analise-atleta .report-hero .report-athlete-photo {
    width: 92px;
    height: 92px;
    border: 3px solid rgba(255, 255, 255, .75)
}

body.page-analise-atleta .report-hero h2 {
    margin: 2px 0 6px;
    color: var(--metro-text);
    font-size: 24px;
    line-height: 1.1
}

body.page-analise-atleta .report-kicker {
    color: #8a7777;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: .14em
}

body.page-analise-atleta .potential-stars {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    color: #ffd14a;
    font-size: 15px
}

body.page-analise-atleta .potential-stars strong {
    margin-left: 7px;
    color: var(--metro-text);
    font-size: 11px
}

body.page-analise-atleta .stars-base {
    position: relative;
    display: inline-block;
    color: #dedede;
    font-size: 20px;
    line-height: 1;
    letter-spacing: 1px
}

body.page-analise-atleta .stars-fill {
    position: absolute;
    inset: 0 auto 0 0;
    overflow: hidden;
    color: #ffc62f;
    white-space: nowrap
}

body.page-analise-atleta .status-pill {
    display: inline-block;
    margin: 9px 0 6px;
    padding: 5px 10px;
    border-radius: 999px;
    color: #111;
    font-size: 10px;
    font-weight: 800
}

body.page-analise-atleta .status-pill.excellent {
    background: #65d98b
}

body.page-analise-atleta .status-pill.good {
    background: #ffd45c
}

body.page-analise-atleta .status-pill.priority {
    background: #ff826f
}

body.page-analise-atleta .score-ring {
    position: relative;
    width: 118px;
    height: 118px;
    display: grid;
    place-items: center
}

body.page-analise-atleta .score-ring svg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    transform: rotate(-90deg)
}

body.page-analise-atleta .score-ring circle {
    fill: none;
    stroke-width: 12
}

body.page-analise-atleta .score-ring-track {
    stroke: #eadede
}

body.page-analise-atleta .score-ring-value {
    stroke: #e02020;
    stroke-linecap: butt
}

body.page-analise-atleta .score-ring>div {
    position: relative;
    z-index: 1;
    width: 88px;
    height: 88px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    border-radius: 50%;
    background: #fff;
    color: var(--metro-text)
}

body.page-analise-atleta .score-ring strong {
    font-size: 28px
}

body.page-analise-atleta .score-ring span {
    color: #777;
    font-size: 11px
}

body.page-analise-atleta .report-score-strip {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
    margin: 14px 0
}

body.page-analise-atleta .report-score-strip div {
    padding: 13px 15px;
    border: 1px solid #e7e7ea;
    border-radius: 14px;
    background: #fafafa;
    text-align: center
}

body.page-analise-atleta .report-score-strip span {
    display: block;
    color: #777;
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: .08em
}

body.page-analise-atleta .report-score-strip strong {
    display: block;
    margin-top: 3px;
    font-size: 17px
}

body.page-analise-atleta .report-details {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0;
    margin-bottom: 14px;
    padding: 8px;
    border: 1px solid #e2e2e6;
    border-radius: 18px;
    background: #fff;
    color: #555;
    box-shadow: 0 8px 22px rgba(0, 0, 0, .04)
}

body.page-analise-atleta .report-details>div {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 5px;
    min-height: 64px;
    padding: 10px 14px;
    text-align: center
}

body.page-analise-atleta .report-details>div:not(:nth-child(3n)) {
    border-right: 1px solid #ececef
}

body.page-analise-atleta .report-details>div:nth-child(-n+3) {
    border-bottom: 1px solid #ececef
}

body.page-analise-atleta .report-details span {
    color: #888;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase
}

body.page-analise-atleta .report-details strong {
    color: #333;
    font-size: 12px;
    line-height: 1.25
}

body.page-analise-atleta .report-context-strip {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin-bottom: 14px
}

body.page-analise-atleta .report-context-strip>div {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 4px;
    min-height: 70px;
    padding: 12px 16px;
    border: 1px solid #e2e2e6;
    border-radius: 16px;
    background: #fff;
    text-align: center
}

body.page-analise-atleta .report-context-strip span {
    color: #888;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase
}

body.page-analise-atleta .report-context-strip strong {
    color: #333;
    font-size: 13px
}

body.page-analise-atleta .report-context-strip small {
    color: #777;
    font-size: 10px
}

body.page-analise-atleta #resultadoArea.pdf-wide-report {
    width: 125%;
    max-width: none
}

body.page-analise-atleta #resultadoArea,
body.page-analise-atleta .compact-diagnostic,
body.page-analise-atleta .summary-line,
body.page-analise-atleta .action-plan {
    text-align: center
}

body.page-analise-atleta .performance-groups {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 18px
}

body.page-analise-atleta .performance-group {
    padding: 16px;
    border: 1px solid #e5e5e8;
    border-radius: 16px;
    background: #fff;
    text-align: center
}

body.page-analise-atleta .performance-row {
    margin: 9px 0
}

body.page-analise-atleta .performance-row-heading {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 4px;
    color: #444;
    font-size: 11px
}

body.page-analise-atleta .performance-row-heading strong {
    color: var(--metro-red);
    font-size: 12px
}

body.page-analise-atleta .performance-track {
    height: 7px;
    overflow: hidden;
    border-radius: 999px;
    background: #ececef
}

body.page-analise-atleta .performance-track span {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, #e02020, #ff6969)
}

body.page-analise-atleta .executive-grid,
body.page-analise-atleta .insights-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
    margin-top: 14px
}

body.page-analise-atleta .report-panel,
body.page-analise-atleta .insights-grid>section {
    padding: 16px;
    border: 1px solid #e5e5e8;
    border-radius: 16px;
    background: #fff;
    text-align: center
}

body.page-analise-atleta .report-panel h3,
body.page-analise-atleta .insights-grid h3 {
    margin: 0 0 11px;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: .08em
}

body.page-analise-atleta .summary-line {
    margin: 6px 0
}

body.page-analise-atleta .benchmark-row,
body.page-analise-atleta .pillar-row {
    margin: 9px 0
}

body.page-analise-atleta .benchmark-row label,
body.page-analise-atleta .pillar-row label {
    display: flex;
    justify-content: space-between;
    margin-bottom: 4px;
    font-size: 11px
}

body.page-analise-atleta .benchmark-row>div,
body.page-analise-atleta .pillar-row>div {
    height: 7px;
    overflow: hidden;
    border-radius: 999px;
    background: #ececef
}

body.page-analise-atleta .benchmark-row span,
body.page-analise-atleta .pillar-row span {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, #e02020, #ff6969)
}

body.page-analise-atleta .pillars-panel {
    margin-top: 14px
}

body.page-analise-atleta .insight-card {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 2px 10px;
    align-items: center;
    margin: 7px 0;
    padding: 10px 12px;
    border-radius: 12px;
    text-align: center
}

body.page-analise-atleta .insight-card.strong {
    background: #eefaf2;
    border: 1px solid #cdebd7
}

body.page-analise-atleta .insight-card.evolve {
    background: #fff7e7;
    border: 1px solid #f2dfb5
}

body.page-analise-atleta .insight-card small {
    grid-column: 1 / -1;
    color: #8a6513;
    font-size: 9px;
    text-transform: uppercase
}

body.page-analise-atleta .action-plan {
    margin-top: 14px
}

body.page-analise-atleta .action-plan div {
    margin: 6px 0
}

body.page-analise-atleta .action-plan>strong {
    display: block;
    margin-top: 10px;
    color: var(--metro-red)
}

body.page-analise-atleta .compact-diagnostic {
    margin-top: 14px;
    padding: 14px;
    border-radius: 14px;
    background: #f8f8f9
}

body.page-analise-atleta canvas {
    max-height: 380px;
    width: 100%;
    margin: 0 auto
}

body.page-analise-atleta .tag-elite {
    background: rgba(224, 32, 32, 0.08);
    color: var(--metro-red);
    padding: 4px 10px;
    border-radius: 999px;
    border: 1px solid rgba(224, 32, 32, 0.25);
    font-weight: 700;
    font-size: 13px;
    display: inline-block;
    margin-left: 8px
}

body.page-analise-atleta .metric-highlight {
    grid-column: 1 / -1;
    background: #f7f7f7;
    border-radius: 28px;
    padding: 14px 28px;
    margin-top: 0;
    min-height: 90px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    flex-wrap: wrap;
    gap: 8px;
    color: #555;
    border: 1px solid #eeeeee;
    font-size: 14px;
    line-height: 1.35;
    text-align: center
}

body.page-analise-atleta .metric-highlight>span:first-child {
    font-weight: 600;
    font-size: 14px
}

body.page-analise-atleta .imc-chart {
    width: min(100%, 760px);
    margin: 0 auto;
    padding: 4px 8px 2px
}

body.page-analise-atleta .imc-chart-summary {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 18px;
    margin-bottom: 24px;
    font-size: 14px
}

body.page-analise-atleta .imc-scale {
    position: relative;
    width: 100%;
    height: 14px;
    border-radius: 999px;
    background: linear-gradient(90deg, #62a8df 0 21.43%, #4eb878 21.43% 52.38%, #f2b84b 52.38% 76.19%, #df5b55 76.19% 100%);
    box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .08)
}

body.page-analise-atleta .imc-marker {
    position: absolute;
    top: 0;
    width: 0;
    height: 0;
    background: transparent;
    transform: translateX(-50%);
    z-index: 1
}

body.page-analise-atleta .imc-marker span {
    position: absolute;
    top: 7px;
    left: 50%;
    padding: 2px 7px;
    border-radius: 999px;
    background: #111;
    color: #fff;
    font-size: 10px;
    font-weight: 700;
    line-height: 1.4;
    transform: translate(-50%, -50%);
    white-space: nowrap
}

body.page-analise-atleta .imc-range-labels {
    display: grid;
    grid-template-columns: 21.43fr 30.95fr 23.81fr 23.81fr;
    margin-top: 8px;
    color: #666;
    font-size: 9px;
    font-weight: 600;
    line-height: 1.2;
    text-align: center
}

body.page-analise-atleta .report-imc-chart {
    margin-top: 14px;
    margin-bottom: 28px;
    padding: 12px 14px;
    border: 1px solid #eee;
    border-radius: 16px;
    background: #fafafa
}

body.page-analise-atleta .report-imc-chart .imc-chart-summary {
    margin-bottom: 22px
}

body.page-analise-atleta .helper-text {
    color: var(--metro-muted);
    font-size: 13px;
    line-height: 1.4
}

body.page-analise-atleta .profile-analysis-section,
body.page-analise-atleta .metrics-analysis-section {
    grid-column: 1 / -1
}

body.page-analise-atleta .athlete-native-select {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    white-space: nowrap
}

body.page-analise-atleta .athlete-picker-group>label {
    margin-bottom: 6px;
    color: #5f5f66;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase
}

body.page-analise-atleta .athlete-picker {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 6px;
    max-height: 260px;
    padding: 1px;
    overflow-y: auto
}

body.page-analise-atleta .analysis-athlete-card {
    min-width: 0;
    min-height: 97px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 3px;
    padding: 7px 5px;
    border: 1px solid #d9d9df;
    border-radius: 12px;
    background: #fff;
    color: var(--metro-text);
    font-family: "Space Grotesk", sans-serif;
    text-align: center;
    cursor: pointer;
    transition: .18s ease
}

body.page-analise-atleta .analysis-athlete-card:hover,
body.page-analise-atleta .analysis-athlete-card:focus-visible {
    border-color: rgba(224, 32, 32, .55);
    box-shadow: 0 8px 22px rgba(0, 0, 0, .08);
    outline: none;
    transform: translateY(-2px)
}

body.page-analise-atleta .analysis-athlete-card.is-selected {
    border-color: var(--metro-red);
    background: rgba(224, 32, 32, .04);
    box-shadow: 0 0 0 2px rgba(224, 32, 32, .12)
}

body.page-analise-atleta .analysis-athlete-photo {
    width: 52px;
    height: 52px;
    display: block;
    overflow: hidden;
    border: 1px solid #dedee3;
    border-radius: 50%;
    background: #f4f4f5
}

body.page-analise-atleta .analysis-athlete-photo img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    object-position: center 8%
}

body.page-analise-atleta .analysis-athlete-card strong {
    max-width: 100%;
    overflow: hidden;
    font-size: 10px;
    font-weight: 700;
    line-height: 1.15;
    text-overflow: ellipsis;
    text-transform: uppercase;
    white-space: nowrap
}

body.page-analise-atleta .analysis-athlete-position {
    color: #77777f;
    font-size: 9px;
    font-weight: 700;
    line-height: 1.15;
    text-transform: uppercase
}

body.page-analise-atleta .athlete-picker-empty {
    grid-column: 1 / -1;
    padding: 24px;
    border: 1px dashed #d9d9df;
    border-radius: 18px;
    color: var(--metro-muted);
    font-size: 13px;
    text-align: center
}

body.page-analise-atleta .report-athlete-summary {
    display: flex;
    align-items: center;
    gap: 16px;
    padding-bottom: 14px;
    border-bottom: 1px solid #eeeeee
}

body.page-analise-atleta .report-athlete-photo {
    flex: 0 0 92px;
    width: 92px;
    height: 92px;
    aspect-ratio: 1 / 1;
    overflow: hidden;
    border: 2px solid #dedee3;
    border-radius: 50%;
    background: #f4f4f5
}

body.page-analise-atleta .report-athlete-photo img {
    width: 100%;
    height: 100%;
    max-width: none;
    aspect-ratio: 1 / 1;
    display: block;
    object-fit: cover;
    object-position: center 8%
}

body.page-analise-atleta .report-athlete-heading {
    min-width: 0;
    display: flex;
    flex: 1;
    flex-direction: column;
    gap: 6px
}

body.page-analise-atleta .footer {
    text-align: center;
    margin-top: 24px
}

body.page-analise-atleta .footer-main {
    font-size: 14px;
    color: #666;
    margin: 0
}

body.page-analise-atleta .footer-sub {
    font-size: 11px;
    color: #999;
    margin-top: 4px;
    line-height: 1.4
}

@media (max-width:900px) {
    body.page-analise-atleta .page {
        grid-template-columns: 1fr
    }

    body.page-analise-atleta #profile-card-container {
        min-width: auto
    }
}

@media (max-width:640px) {
    body.page-analise-atleta {
        padding: 20px 12px
    }

    body.page-analise-atleta .analysis-card {
        padding: 20px;
        border-radius: 24px
    }

    body.page-analise-atleta .grid-2col,
    body.page-analise-atleta .attrs-row {
        grid-template-columns: 1fr
    }

    body.page-analise-atleta .metrics-category,
    body.page-analise-atleta .potential-analysis-section {
        padding: 18px 16px 6px;
        border-radius: 18px
    }

    body.page-analise-atleta .report-hero {
        grid-template-columns: 72px 1fr;
        padding: 16px
    }

    body.page-analise-atleta .report-hero .report-athlete-photo {
        width: 72px;
        height: 72px
    }

    body.page-analise-atleta .score-ring {
        grid-column: 1 / -1;
        justify-self: center
    }

    body.page-analise-atleta .report-score-strip,
    body.page-analise-atleta .report-details,
    body.page-analise-atleta .report-context-strip,
    body.page-analise-atleta .executive-grid,
    body.page-analise-atleta .insights-grid,
    body.page-analise-atleta .radar-grid,
    body.page-analise-atleta .performance-groups {
        grid-template-columns: 1fr
    }

    body.page-analise-atleta .report-details>div {
        border-right: 0 !important;
        border-bottom: 1px solid #ececef
    }

    body.page-analise-atleta .report-details>div:last-child {
        border-bottom: 0
    }

    body.page-analise-atleta .button-group {
        flex-direction: column
    }

    body.page-analise-atleta .button-group button {
        width: 100%
    }

    body.page-analise-atleta .athlete-picker {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }

    body.page-analise-atleta .analysis-athlete-card {
        min-height: 87px
    }

    body.page-analise-atleta .analysis-athlete-photo {
        width: 44px;
        height: 44px
    }

    body.page-analise-atleta .report-athlete-summary {
        align-items: flex-start
    }
}

body.page-atletas {
    --metro-red: #e02020;
    --metro-text: #111;
    --metro-muted: #777;
    --shadow-soft: 0 18px 45px rgba(0, 0, 0, .08)
}

body.page-atletas * {
    margin: 0;
    padding: 0;
    box-sizing: border-box
}

body.page-atletas {
    scroll-behavior: smooth
}

body.page-atletas {
    font-family: "Space Grotesk", sans-serif;
    background: #fff;
    color: var(--metro-text);
    padding: 32px 16px 24px
}

body.page-atletas .page {
    max-width: 1120px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 420px 1fr;
    gap: 40px;
    align-items: flex-start
}

body.page-atletas .content-column {
    display: flex;
    flex-direction: column;
    gap: 24px
}

body.page-atletas .athlete-navigation {
    background: #fff;
    border-radius: 24px;
    box-shadow: 0 14px 35px rgba(0, 0, 0, .06);
    border: 1px solid rgba(0, 0, 0, .08);
    padding: 16px 20px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    position: sticky;
    top: 24px;
    z-index: 5
}

body.page-atletas .program-nav,
body.page-atletas .section-nav {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px
}

body.page-atletas .program-nav {
    padding-bottom: 14px;
    margin-bottom: 14px;
    border-bottom: 1px solid #ececef
}

body.page-atletas .unit-navigation {
    padding-bottom: 14px;
    margin-bottom: 14px;
    border-bottom: 1px solid #ececef;
    text-align: center
}

body.page-atletas .unit-navigation[hidden] {
    display: none
}

body.page-atletas .unit-navigation>span {
    display: block;
    margin-bottom: 10px;
    color: #777;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase
}

body.page-atletas .unit-nav {
    display: flex;
    justify-content: center;
    gap: 10px;
    flex-wrap: wrap
}

body.page-atletas .unit-nav button {
    border: 1px solid #d5d5d5;
    border-radius: 999px;
    padding: 8px 14px;
    background: #fff;
    color: #555;
    font-family: inherit;
    font-size: 12px;
    font-weight: 600;
    line-height: normal;
    text-transform: uppercase;
    cursor: pointer
}

body.page-atletas .unit-nav button.active,
body.page-atletas .unit-nav button:hover {
    border-color: var(--metro-red);
    background: var(--metro-red);
    color: #fff
}

body.page-atletas .unit-nav button:focus-visible {
    outline: 0;
    box-shadow: 0 0 0 3px rgba(224, 32, 32, .24)
}

body.page-atletas .program-nav button {
    border: 0;
    border-radius: 999px;
    padding: 10px 16px;
    background: #f0f0f2;
    color: #444;
    font: inherit;
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .05em;
    cursor: pointer
}

body.page-atletas .program-nav button.active,
body.page-atletas .program-nav button:hover {
    background: var(--metro-red);
    color: #fff
}

body.page-atletas .program-nav button:focus-visible {
    outline: 0;
    box-shadow: 0 0 0 3px rgba(224, 32, 32, .24)
}

body.page-atletas .section-nav a {
    font-size: 12px;
    text-transform: uppercase;
    padding: 8px 14px;
    border-radius: 999px;
    border: 1px solid #d5d5d5;
    background: #fff;
    color: #555;
    letter-spacing: .08em;
    font-weight: 500;
    text-decoration: none;
    transition: .18s
}

body.page-atletas .section-nav a.active,
body.page-atletas .section-nav a:hover {
    background: var(--metro-red);
    color: #fff;
    border-color: var(--metro-red)
}

body.page-atletas .section-card {
    background: #fff;
    border-radius: 28px;
    padding: 24px;
    box-shadow: var(--shadow-soft);
    border: 1px solid rgba(0, 0, 0, .08);
    scroll-margin-top: 160px
}

body.page-atletas .section-eyebrow {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: .16em;
    color: var(--metro-red);
    font-weight: 700;
    margin-bottom: 6px
}

body.page-atletas .section-title {
    font-size: 22px;
    font-weight: 700;
    margin-bottom: 14px
}

body.page-atletas .athlete-list {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 16px
}

body.page-atletas .athlete-card {
    background: #fafafa;
    border: 1px solid #e0e0e0;
    border-radius: 18px;
    padding: 14px 10px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
    text-align: center
}

body.page-atletas .athlete-photo {
    width: 130px;
    height: 150px;
    border-radius: 10px;
    background: #e5e5e5;
    border: 2px solid #f2b8b5;
    overflow: hidden
}

body.page-atletas .athlete-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center 5%
}

body.page-atletas .athlete-name {
    font-size: 13px;
    font-weight: 600
}

body.page-atletas .athlete-position {
    font-size: 11px;
    color: var(--metro-red);
    font-weight: 700;
    line-height: 1.2;
    text-transform: uppercase
}

body.page-atletas .athlete-id {
    font-size: 11px;
    color: #999;
    line-height: 1.2
}

body.page-atletas .athlete-meta {
    font-size: 12px;
    color: var(--metro-muted)
}

body.page-atletas .athletes-status {
    grid-column: 1 / -1;
    padding: 18px;
    border-radius: 18px;
    background: #fafafa;
    border: 1px solid #e0e0e0;
    color: #666;
    font-size: 13px;
    line-height: 1.5;
    text-align: center
}

body.page-atletas .footer {
    text-align: center;
    margin-top: 8px
}

body.page-atletas .footer-main {
    font-size: 14px;
    color: #666;
    margin: 0
}

body.page-atletas .footer-sub {
    font-size: 11px;
    color: #999;
    margin-top: 4px;
    line-height: 1.4
}

@media (max-width:900px) {
    body.page-atletas .page {
        grid-template-columns: 1fr
    }

    body.page-atletas .athlete-list {
        grid-template-columns: repeat(2, 1fr)
    }

    body.page-atletas .athlete-navigation {
        position: static
    }
}

@media (max-width:480px) {
    body.page-atletas .athlete-list {
        grid-template-columns: 1fr
    }
}

body.page-competicoes {
    --metro-red: #e02020;
    --metro-text: #111;
    --metro-muted: #777;
    --metro-warning: #fff3cd
}

body.page-competicoes * {
    box-sizing: border-box;
    margin: 0;
    padding: 0
}

body.page-competicoes body {
    font-family: "Space Grotesk", sans-serif;
    background: #fff;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    padding: 32px 16px 24px;
    color: var(--metro-text)
}

body.page-competicoes .page {
    flex: 1;
    max-width: 1120px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 420px 1fr;
    gap: 40px;
    align-items: flex-start
}

body.page-competicoes #profile-card-container {
    min-width: 420px
}

body.page-competicoes .content-column {
    display: flex;
    flex-direction: column;
    gap: 24px
}

body.page-competicoes .section-nav {
    background: #fff;
    border-radius: 24px;
    border: 1px solid rgba(0, 0, 0, .08);
    box-shadow: 0 14px 35px rgba(0, 0, 0, .06);
    padding: 16px 20px;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    position: sticky;
    top: 24px;
    z-index: 10
}

body.page-competicoes .section-nav a {
    font-size: 12px;
    text-transform: uppercase;
    padding: 8px 14px;
    border-radius: 999px;
    border: 1px solid #d5d5d5;
    background: #fff;
    color: #555;
    letter-spacing: .08em;
    font-weight: 600;
    text-decoration: none
}

body.page-competicoes .section-nav a.active,
body.page-competicoes .section-nav a:hover {
    background: var(--metro-red);
    color: #fff;
    border-color: var(--metro-red)
}

body.page-competicoes .section-card {
    background: #fff;
    border-radius: 28px;
    padding: 24px;
    border: 1px solid rgba(0, 0, 0, .08);
    box-shadow: 0 14px 35px rgba(0, 0, 0, .06);
    scroll-margin-top: 20px
}

body.page-competicoes .category-card {
    margin-top: 24px
}

body.page-competicoes .section-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    cursor: pointer;
    margin-bottom: 18px
}

body.page-competicoes .section-header-left {
    display: flex;
    align-items: center;
    gap: 14px
}

body.page-competicoes .section-header img {
    width: 48px;
    height: auto;
    object-fit: contain
}

body.page-competicoes .section-title {
    font-size: 22px;
    font-weight: 700
}

body.page-competicoes .toggle-btn {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    border: none;
    background: var(--metro-red);
    color: #fff;
    font-size: 18px;
    cursor: pointer;
    transition: .3s
}

body.page-competicoes .section-header.active .toggle-btn {
    transform: rotate(45deg)
}

body.page-competicoes .competition-content {
    overflow: hidden
}

body.page-competicoes h3 {
    font-size: 18px;
    margin-bottom: 10px
}

body.page-competicoes h4 {
    font-size: 13px;
    margin: 12px 0 8px;
    text-transform: uppercase;
    letter-spacing: .08em;
    color: var(--metro-muted)
}

body.page-competicoes table {
    width: 100%;
    border-collapse: collapse;
    font-size: 14px;
    margin-bottom: 16px
}

body.page-competicoes th,
body.page-competicoes td {
    padding: 10px 8px;
    border-bottom: 1px solid #eee;
    text-align: center
}

body.page-competicoes th {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: .1em;
    color: var(--metro-muted)
}

body.page-competicoes td:first-child {
    width: 40px
}

body.page-competicoes .team-cell {
    display: flex;
    align-items: center;
    gap: 10px;
    font-weight: 600
}

body.page-competicoes .team-cell img {
    width: 28px;
    height: 28px;
    object-fit: contain
}

body.page-competicoes .metro {
    color: var(--metro-red);
    font-weight: 700
}

body.page-competicoes .proximo-jogo {
    background-color: #e9e9e9;
    border-left: 4px solid #000
}

body.page-competicoes .jogo-remarcado {
    background: var(--metro-warning);
    font-weight: bold
}

body.page-competicoes .aviso-remarcado td {
    background: var(--metro-warning);
    font-size: 13px;
    text-align: center
}

body.page-competicoes .footer {
    text-align: center;
    margin-top: 8px
}

body.page-competicoes .footer-main {
    font-size: 14px;
    color: #666;
    margin: 0
}

body.page-competicoes .footer-sub {
    font-size: 11px;
    color: #999;
    margin-top: 4px;
    line-height: 1.4
}

@media (max-width:850px) {
    body.page-competicoes .page {
        grid-template-columns: 1fr
    }

    body.page-competicoes #profile-card-container {
        min-width: auto
    }
}

body.page-crias {
    --metro-red: #e02020;
    --metro-text: #111;
    --metro-muted: #777;
    --shadow-soft: 0 14px 35px rgba(0, 0, 0, .06)
}

body.page-crias * {
    margin: 0;
    padding: 0;
    box-sizing: border-box
}

body.page-crias {
    scroll-behavior: smooth
}

body.page-crias {
    font-family: "Space Grotesk", sans-serif;
    background: #fff;
    color: var(--metro-text);
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    padding: 32px 16px 24px
}

body.page-crias .page {
    flex: 1;
    width: 100%;
    max-width: 1120px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 420px 1fr;
    gap: 40px;
    align-items: flex-start
}

body.page-crias #profile-card-container {
    min-width: 420px
}

body.page-crias .content-column {
    display: flex;
    flex-direction: column;
    gap: 24px
}

body.page-crias .intro-card {
    background: #fff;
    border-radius: 28px;
    padding: 24px;
    border: 1px solid rgba(0, 0, 0, .08);
    box-shadow: var(--shadow-soft)
}

body.page-crias .page-title {
    font-size: 22px;
    font-weight: 700;
    margin-bottom: 10px
}

body.page-crias .page-subtitle {
    color: #666;
    font-size: 14px;
    line-height: 1.7;
    max-width: 760px
}

body.page-crias .stats {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px
}

body.page-crias .stat {
    background: #fafafa;
    border: 1px solid #e0e0e0;
    border-radius: 18px;
    padding: 16px;
    color: #555;
    font-size: 13px;
    line-height: 1.4;
    min-height: 120px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center
}

body.page-crias .stat strong {
    display: block;
    color: var(--metro-red);
    font-size: 28px;
    line-height: 1;
    margin-bottom: 6px
}

body.page-crias .section-nav {
    background: #fff;
    border-radius: 24px;
    border: 1px solid rgba(0, 0, 0, .08);
    box-shadow: var(--shadow-soft);
    padding: 16px 20px;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    position: sticky;
    top: 24px;
    z-index: 10
}

body.page-crias .section-nav a {
    font-size: 12px;
    text-transform: uppercase;
    padding: 8px 14px;
    border-radius: 999px;
    border: 1px solid #d5d5d5;
    background: #fff;
    color: #555;
    letter-spacing: .08em;
    font-weight: 600;
    text-decoration: none;
    transition: .18s
}

body.page-crias .section-nav a.active,
body.page-crias .section-nav a:hover {
    background: var(--metro-red);
    color: #fff;
    border-color: var(--metro-red)
}

body.page-crias .section-card {
    background: #fff;
    border-radius: 28px;
    padding: 24px;
    border: 1px solid rgba(0, 0, 0, .08);
    box-shadow: var(--shadow-soft);
    scroll-margin-top: 160px
}

body.page-crias .section-eyebrow {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: .16em;
    color: var(--metro-red);
    font-weight: 700;
    margin-bottom: 6px
}

body.page-crias .section-title {
    font-size: 22px;
    font-weight: 700;
    margin-bottom: 18px
}

body.page-crias .crias-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(170px, 1fr));
    gap: 16px
}

body.page-crias .cria-card {
    background: #fafafa;
    border: 1px solid #e0e0e0;
    border-radius: 18px;
    overflow: hidden;
    cursor: pointer;
    transition: .18s ease;
    text-align: center
}

body.page-crias .cria-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 14px 35px rgba(0, 0, 0, .10);
    border-color: #f2b8b5
}

body.page-crias .cria-card img.foto {
    width: 100%;
    height: 190px;
    object-fit: cover;
    object-position: center 10%;
    background: #e5e5e5;
    border-bottom: 2px solid #f2b8b5
}

body.page-crias .info {
    padding: 14px 10px 16px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px
}

body.page-crias .info h3 {
    font-size: 13px;
    font-weight: 700;
    line-height: 1.25
}

body.page-crias .info p {
    color: var(--metro-muted);
    font-size: 12px
}

body.page-crias .info strong {
    color: var(--metro-red);
    font-size: 12px;
    text-transform: uppercase;
    line-height: 1.2
}

body.page-crias .logo {
    width: 52px;
    height: 52px;
    object-fit: contain;
    margin: 4px auto;
    display: block
}

body.page-crias .modal {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, .55);
    justify-content: center;
    align-items: center;
    z-index: 999;
    padding: 18px
}

body.page-crias .modal-content {
    width: 700px;
    max-width: 95%;
    background: #fff;
    border-radius: 28px;
    padding: 24px;
    position: relative;
    border: 1px solid rgba(0, 0, 0, .08);
    box-shadow: 0 20px 60px rgba(0, 0, 0, .18)
}

body.page-crias .close {
    position: absolute;
    right: 18px;
    top: 14px;
    width: 32px;
    height: 32px;
    border-radius: 999px;
    display: grid;
    place-items: center;
    font-size: 24px;
    line-height: 1;
    cursor: pointer;
    color: #555;
    background: #fafafa;
    border: 1px solid #e0e0e0
}

body.page-crias .modal-grid {
    display: grid;
    grid-template-columns: 240px 1fr;
    gap: 24px;
    align-items: start
}

body.page-crias .modal-grid img:first-child {
    width: 100%;
    border-radius: 18px;
    border: 1px solid #e0e0e0;
    background: #e5e5e5
}

body.page-crias .modal-grid h2 {
    font-size: 24px;
    margin: 4px 38px 8px 0
}

body.page-crias .modal-grid h3 {
    color: var(--metro-red);
    font-size: 15px;
    text-transform: uppercase
}

body.page-crias .modal-grid p {
    color: #666;
    font-size: 14px;
    line-height: 1.6
}

body.page-crias .footer {
    text-align: center;
    margin-top: 8px
}

body.page-crias .footer-main {
    font-size: 14px;
    color: #666;
    margin: 0
}

body.page-crias .footer-sub {
    font-size: 11px;
    color: #999;
    margin-top: 4px;
    line-height: 1.4
}

@media(max-width:900px) {
    body.page-crias .page {
        grid-template-columns: 1fr
    }

    body.page-crias #profile-card-container {
        min-width: auto
    }

    body.page-crias .section-nav {
        position: static
    }

    body.page-crias .stats {
        grid-template-columns: 1fr
    }

    body.page-crias .modal-grid {
        grid-template-columns: 1fr
    }

    body.page-crias .cria-card img.foto {
        height: 220px
    }
}

@media(max-width:480px) {
    body.page-crias {
        padding: 20px 12px
    }

    body.page-crias .intro-card,
    body.page-crias .section-card {
        padding: 18px
    }

    body.page-crias .crias-grid {
        grid-template-columns: 1fr
    }
}

body.page-dashboard {
    --metro-red: #e02020;
    --metro-text: #111111;
    --metro-muted: #777777;
    --metro-line: rgba(0, 0, 0, .08);
    --metro-soft: #fafafa;
    --metro-panel: #f6f6f6;
    --shadow-soft: 0 16px 38px rgba(0, 0, 0, .07)
}

body.page-dashboard * {
    margin: 0;
    padding: 0;
    box-sizing: border-box
}

body.page-dashboard {
    font-family: "Space Grotesk", sans-serif;
    background: #ffffff;
    color: var(--metro-text);
    min-height: 100vh;
    padding: 32px 16px 24px
}

body.page-dashboard button,
body.page-dashboard input {
    font: inherit
}

body.page-dashboard .page {
    max-width: 1180px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 420px minmax(0, 1fr);
    gap: 40px;
    align-items: flex-start
}

body.page-dashboard #profile-card-container {
    min-width: 420px
}

body.page-dashboard .profile-fallback {
    padding: 24px;
    border-radius: 24px;
    border: 1px dashed #dddddd;
    color: #aaaaaa
}

body.page-dashboard .content-column {
    display: flex;
    flex-direction: column;
    gap: 18px;
    min-width: 0
}

body.page-dashboard .dashboard-hero,
body.page-dashboard .section-card {
    background: #ffffff;
    border-radius: 24px;
    box-shadow: var(--shadow-soft);
    border: 1px solid var(--metro-line)
}

body.page-dashboard .dashboard-hero {
    padding: 24px;
    display: grid;
    gap: 20px
}

body.page-dashboard .hero-top {
    display: flex;
    justify-content: space-between;
    gap: 18px;
    align-items: flex-start
}

body.page-dashboard .section-eyebrow {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: .16em;
    color: var(--metro-red);
    font-weight: 700;
    margin-bottom: 7px
}

body.page-dashboard .page-title {
    font-size: 26px;
    line-height: 1.08;
    font-weight: 700;
    text-transform: uppercase;
    margin-bottom: 6px
}

body.page-dashboard .page-subtitle,
body.page-dashboard .status-text {
    font-size: 13px;
    color: var(--metro-muted);
    line-height: 1.55
}

body.page-dashboard .refresh-button {
    width: 42px;
    height: 42px;
    border: 1px solid #dddddd;
    background: #ffffff;
    color: var(--metro-text);
    border-radius: 50%;
    cursor: pointer;
    display: grid;
    place-items: center;
    transition: .18s ease;
    flex: 0 0 auto
}

body.page-dashboard .refresh-button:hover {
    border-color: var(--metro-red);
    color: var(--metro-red);
    transform: rotate(18deg)
}

body.page-dashboard .refresh-button svg {
    width: 18px;
    height: 18px
}

body.page-dashboard .summary-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(120px, 1fr));
    gap: 12px
}

body.page-dashboard .summary-card {
    background: var(--metro-panel);
    border: 1px solid #e9e9e9;
    border-radius: 16px;
    padding: 16px;
    min-height: 148px;
    text-align: center;
    display: grid;
    align-content: center;
    gap: 8px
}

body.page-dashboard .summary-label,
body.page-dashboard .metric-label {
    font-size: 11px;
    color: var(--metro-muted);
    line-height: 1.35
}

body.page-dashboard .summary-label {
    color: var(--metro-red);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .08em
}

body.page-dashboard .summary-value {
    font-size: 28px;
    font-weight: 700;
    line-height: 1
}

body.page-dashboard .summary-insight {
    color: #777777;
    font-size: 12px;
    line-height: 1.45;
    max-width: 220px;
    margin: 0 auto;
    min-height: calc(12px * 1.45 * 3)
}

body.page-dashboard .tabs-card {
    background: #fff;
    border-radius: 24px;
    box-shadow: var(--shadow-soft);
    border: 1px solid var(--metro-line);
    padding: 26px;
    display: flex;
    flex-direction: column;
    gap: 22px
}

body.page-dashboard .section-intro {
    display: flex;
    flex-direction: column
}

body.page-dashboard #tabs {
    display: flex;
    flex-wrap: wrap;
    gap: 12px
}

body.page-dashboard .tab-button {
    border: 1px solid transparent;
    background: var(--metro-panel);
    color: #555555;
    border-radius: 999px;
    padding: 7px 13px;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: .08em;
    font-weight: 700;
    cursor: pointer;
    transition: .18s ease;
    min-height: 34px;
    width: auto;
    white-space: normal;
    line-height: 1.15;
    text-align: center
}

body.page-dashboard .tab-button:hover,
body.page-dashboard .tab-button.active {
    background: var(--metro-red);
    color: #ffffff;
    border-color: var(--metro-red)
}

body.page-dashboard .section-card {
    padding: 24px;
    display: grid;
    gap: 20px
}

body.page-dashboard .section-header {
    display: flex;
    justify-content: space-between;
    gap: 18px;
    align-items: flex-start
}

body.page-dashboard .section-title {
    font-size: 22px;
    font-weight: 700;
    margin-bottom: 6px
}

body.page-dashboard .section-meta {
    font-size: 12px;
    color: var(--metro-muted);
    line-height: 1.5
}

body.page-dashboard .status-pill {
    border-radius: 999px;
    border: 1px solid rgba(224, 32, 32, .22);
    background: rgba(224, 32, 32, .06);
    color: #555555;
    padding: 8px 14px;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .12em;
    white-space: nowrap
}

body.page-dashboard .metrics-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px
}

body.page-dashboard .metric-card {
    background: var(--metro-panel);
    border: 1px solid #e8e8e8;
    border-radius: 16px;
    padding: 16px;
    min-height: 108px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    text-align: center
}

body.page-dashboard .metric-card.is-featured {
    background: #ffffff;
    border-color: rgba(224, 32, 32, .2);
    box-shadow: 0 12px 30px rgba(224, 32, 32, .08)
}

body.page-dashboard .metric-card.is-empty {
    opacity: .54
}

body.page-dashboard .metric-value {
    font-size: 30px;
    line-height: 1;
    font-weight: 700;
    text-align: center
}

body.page-dashboard .details-block {
    display: grid;
    gap: 14px
}

body.page-dashboard .details-title {
    font-size: 12px;
    color: var(--metro-muted);
    text-transform: uppercase;
    letter-spacing: .12em;
    font-weight: 700
}

body.page-dashboard .period-highlight {
    color: var(--metro-red);
    font-weight: 700
}

body.page-dashboard .indicator-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px 14px
}

body.page-dashboard .indicator-card {
    background: #ffffff;
    border: 1px solid #eeeeee;
    border-radius: 14px;
    padding: 13px 14px;
    min-height: 64px;
    display: grid;
    grid-template-columns: 8px minmax(0, 1fr) auto;
    align-items: center;
    gap: 12px;
    text-align: left
}

body.page-dashboard .indicator-name {
    color: #666666;
    font-size: 12px;
    line-height: 1.35;
    min-width: 0
}

body.page-dashboard .indicator-value {
    color: var(--metro-text);
    font-size: 21px;
    line-height: 1.25;
    font-weight: 700;
    text-align: right;
    white-space: normal
}

body.page-dashboard .indicator-dot {
    width: 8px;
    height: 8px;
    border-radius: 999px;
    background: var(--metro-red)
}

body.page-dashboard .comparison-card {
    background: #ffffff;
    border: 1px solid #eeeeee;
    border-radius: 16px;
    overflow: hidden
}

body.page-dashboard .comparison-row {
    display: grid;
    grid-template-columns: minmax(170px, 1.25fr) repeat(4, minmax(120px, 1fr));
    align-items: center;
    border-bottom: 1px solid #eeeeee
}

body.page-dashboard .comparison-row:last-child {
    border-bottom: none
}

body.page-dashboard .comparison-cell {
    padding: 13px 14px;
    font-size: 12px;
    color: #666666;
    min-height: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    min-width: 0;
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: normal
}

body.page-dashboard .comparison-label {
    justify-content: flex-start;
    text-align: left;
    color: var(--metro-text);
    font-weight: 700
}

body.page-dashboard .comparison-head .comparison-cell {
    color: var(--metro-red);
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .1em;
    background: #fafafa
}

body.page-dashboard .comparison-value {
    color: var(--metro-text);
    font-size: 16px;
    line-height: 1.25;
    font-weight: 700;
    white-space: normal;
    overflow-wrap: anywhere;
    word-break: normal;
    max-width: 100%
}

@media (max-width:720px) {
    body.page-dashboard .indicator-grid {
        grid-template-columns: 1fr
    }

    body.page-dashboard .comparison-card {
        overflow-x: auto
    }

    body.page-dashboard .comparison-row {
        min-width: 720px
    }
}

body.page-dashboard .empty-state {
    padding: 22px;
    border-radius: 18px;
    background: var(--metro-soft);
    border: 1px solid #e4e4e4;
    color: var(--metro-muted);
    font-size: 13px;
    line-height: 1.55
}

body.page-dashboard .footer {
    text-align: center;
    margin-top: 8px
}

body.page-dashboard .footer-main {
    font-size: 14px;
    color: #666666;
    margin: 0
}

body.page-dashboard .footer-sub {
    font-size: 11px;
    color: #999999;
    margin-top: 4px;
    line-height: 1.4
}

@media (max-width:980px) {
    body.page-dashboard .page {
        grid-template-columns: 1fr
    }

    body.page-dashboard #profile-card-container {
        min-width: 0
    }

    body.page-dashboard .tabs-card {
        position: static
    }
}

@media (max-width:720px) {
    body.page-dashboard {
        padding: 18px 12px
    }

    body.page-dashboard .dashboard-hero,
    body.page-dashboard .section-card {
        border-radius: 22px;
        padding: 20px
    }

    body.page-dashboard .hero-top,
    body.page-dashboard .section-header {
        flex-direction: column
    }

    body.page-dashboard .summary-grid,
    body.page-dashboard .metrics-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }
}

@media (max-width:460px) {
    body.page-dashboard .tabs-card {
        padding: 14px;
        gap: 10px
    }

    body.page-dashboard .summary-grid,
    body.page-dashboard .metrics-grid {
        grid-template-columns: 1fr
    }

    body.page-dashboard .page-title {
        font-size: 24px
    }
}

body.page-form {
    --metro-text: #111;
    --metro-muted: #777
}

body.page-form .form-validation-message {
    display: none;
    color: #e02020;
    font-size: 12px
}

body.page-form * {
    box-sizing: border-box;
    margin: 0;
    padding: 0
}

body.page-form {
    font-family: "Space Grotesk", sans-serif;
    background: #fff;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    padding: 32px 16px 24px
}

body.page-form .page {
    flex: 1;
    width: 100%;
    max-width: 1120px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 420px 1fr;
    gap: 40px;
    align-items: flex-start
}

body.page-form #profile-card-container {
    min-width: 420px
}

body.page-form .top-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 24px
}

body.page-form .logo-wrap {
    width: 110px;
    height: 110px;
    border-radius: 50%;
    overflow: hidden;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.12)
}

body.page-form .logo-wrap img {
    width: 100%;
    height: 100%;
    object-fit: cover
}

body.page-form .badges {
    display: flex;
    align-items: center;
    gap: 14px
}

body.page-form .badges img {
    width: auto;
    object-fit: contain;
    filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.15))
}

body.page-form .form-wrapper {
    display: flex
}

body.page-form .form-card {
    background: #fff;
    border-radius: 28px;
    padding: 24px;
    box-shadow: 0 14px 35px rgba(0, 0, 0, 0.06);
    border: 1px solid rgba(0, 0, 0, 0.08);
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 18px
}

body.page-form .form-title {
    font-size: 22px;
    font-weight: 700
}

body.page-form .form-subtitle {
    font-size: 13px;
    color: var(--metro-muted);
    margin-bottom: 8px
}

body.page-form .section-label {
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    color: var(--metro-muted);
    margin-top: 8px;
    font-weight: 700
}

body.page-form .field-group {
    display: flex;
    flex-direction: column;
    gap: 6px;
    width: 100%
}

body.page-form .field-label {
    font-size: 13px;
    font-weight: 500
}

body.page-form .field-row {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 12px
}

body.page-form input[type="text"],
body.page-form input[type="email"],
body.page-form input[type="tel"],
body.page-form input[type="date"],
body.page-form input[type="url"],
body.page-form textarea,
body.page-form select {
    width: 100%;
    border-radius: 999px;
    border: 1px solid #d5d5d5;
    padding: 10px 14px;
    font-size: 14px;
    transition: 0.15s border-color ease, 0.15s box-shadow ease, 0.15s background-color ease;
    outline: none;
    background: #fff;
    color: var(--metro-text)
}

body.page-form textarea {
    min-height: 92px;
    border-radius: 18px;
    resize: vertical;
    font-family: inherit
}

body.page-form input[type="text"]::placeholder,
body.page-form input[type="email"]::placeholder,
body.page-form input[type="tel"]::placeholder,
body.page-form input[type="url"]::placeholder,
body.page-form textarea::placeholder {
    color: #999999
}

body.page-form input[type="text"]:focus,
body.page-form input[type="email"]:focus,
body.page-form input[type="tel"]:focus,
body.page-form input[type="date"]:focus,
body.page-form input[type="url"]:focus,
body.page-form textarea:focus,
body.page-form select:focus {
    border-color: var(--metro-red);
    box-shadow: 0 0 0 1px rgba(224, 32, 32, 0.08);
    background: #ffffff
}

body.page-form input[type="date"] {
    color: transparent;
    position: relative
}

body.page-form input[type="date"]::before {
    content: "dd/mm/aaaa";
    color: #999;
    font-size: 14px;
    position: absolute;
    left: 14px;
    top: 10px;
    pointer-events: none
}

body.page-form input[type="date"]:focus {
    color: var(--metro-text)
}

body.page-form input[type="date"]:focus::before {
    content: ""
}

body.page-form input[type="date"]:valid {
    color: var(--metro-text)
}

body.page-form input[type="date"]:valid::before {
    content: ""
}

body.page-form select:invalid {
    color: #999
}

body.page-form select option[disabled][value=""] {
    color: #999
}

body.page-form .required {
    color: var(--metro-red)
}

body.page-form .terms-wrapper {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-top: 4px
}

body.page-form .term-item {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-size: 11px;
    font-weight: 400;
    line-height: 1.55
}

body.page-form .term-item input[type="checkbox"] {
    width: 18px;
    height: 18px;
    margin-top: 3px;
    flex-shrink: 0
}

body.page-form .no-games {
    text-align: center;
    padding: 24px 10px;
    opacity: 0.7
}

body.page-form .no-games-text {
    font-size: 15px;
    line-height: 1.5
}

body.page-form .footer {
    text-align: center;
    margin-top: 8px
}

body.page-form .footer-main {
    font-size: 14px;
    color: #666;
    margin: 0
}

body.page-form .footer-sub {
    font-size: 11px;
    color: #999;
    margin-top: 4px;
    line-height: 1.4
}

body.page-form .form-footer {
    display: flex;
    justify-content: flex-end
}

body.page-form .btn-submit {
    padding: 11px 26px;
    border-radius: 999px;
    border: none;
    background: var(--metro-red);
    color: #fff;
    font-weight: 600;
    cursor: pointer;
    transition: 0.15s
}

body.page-form .btn-submit:hover {
    transform: translateY(-1px);
    box-shadow: 0 10px 25px rgba(224, 32, 32, 0.35);
    background: #c01818
}

body.page-form .agendamento-box {
    margin-top: 4px;
    padding: 12px 16px;
    border-radius: 18px;
    text-align: center;
    background: rgba(224, 32, 32, 0.03);
    border: 1px solid rgba(224, 32, 32, 0.18)
}

body.page-form .agendamento-title {
    font-size: 13px;
    font-weight: 600;
    margin-bottom: 4px
}

body.page-form .agendamento-data {
    font-size: 13px;
    font-weight: 700;
    margin-bottom: 12px
}

body.page-form .agendamento-info {
    font-size: 12px;
    color: var(--metro-muted)
}

body.page-form .conditional-hidden {
    display: none !important
}

body.page-form .modal-backdrop {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.35);
    display: none;
    align-items: center;
    justify-content: center;
    z-index: 999
}

body.page-form .modal {
    background: #ffffff;
    border-radius: 24px;
    padding: 24px 28px;
    max-width: 550px;
    width: 90%;
    box-shadow: 0 18px 45px rgba(0, 0, 0, 0.18);
    text-align: center
}

body.page-form .modal-title {
    font-size: 20px;
    font-weight: 700;
    margin-bottom: 10px
}

body.page-form .modal-text {
    font-size: 14px;
    color: var(--metro-muted);
    margin-bottom: 20px
}

body.page-form .btn-modal {
    padding: 10px 24px;
    border-radius: 999px;
    border: none;
    background: var(--metro-red);
    color: #fff;
    font-weight: 600;
    cursor: pointer;
    transition: 0.15s
}

body.page-form .btn-modal:hover {
    transform: translateY(-1px);
    box-shadow: 0 10px 25px rgba(224, 32, 32, 0.35);
    background: #c01818
}

body.page-form .auth-modal-field {
    margin-bottom: 18px;
    align-items: center;
    text-align: center
}

body.page-form .auth-modal-actions {
    display: flex;
    gap: 10px;
    justify-content: center
}

body.page-form .btn-modal-secondary {
    background: #8a8a8a
}

body.page-form .btn-modal-secondary:hover {
    background: #6f6f6f;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2)
}

@media (max-width:850px) {
    body.page-form .page {
        grid-template-columns: 1fr
    }

    body.page-form .field-row {
        grid-template-columns: 1fr
    }
}

body.page-form #profile-card-container {
    min-width: 420px
}

@media (max-width:900px) {
    body.page-form #profile-card-container {
        min-width: auto
    }
}

body.page-form select.readonly {
    pointer-events: none;
    background-color: rgba(224, 32, 32, 0.03);
    border-color: rgba(224, 32, 32, 0.25);
    color: #555;
    appearance: none
}

body.page-index {
    --metro-text: #111;
    --metro-muted: #777
}

body.page-index * {
    box-sizing: border-box;
    margin: 0;
    padding: 0
}

body.page-index {
    font-family: "Space Grotesk", sans-serif;
    background: #fff;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    padding: 32px 16px 24px;
    radial-gradient(circle at top left, rgba(224, 32, 32, .04), transparent 40%),
    #f5f5f5
}

body.page-index .page {
    flex: 1;
    width: 100%;
    max-width: 1120px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 420px 1fr;
    gap: 40px;
    align-items: flex-start
}

body.page-index .group-card {
    background: #fff;
    border-radius: 24px;
    padding: 22px;
    border: 1px solid rgba(0, 0, 0, .06);
    box-shadow: 0 10px 25px rgba(0, 0, 0, .05);
    margin-bottom: 24px
}

body.page-index .group-title {
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: .12em;
    font-weight: 700;
    color: #999;
    margin-bottom: 16px
}

body.page-index .group-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px
}

body.page-index #profile-card-container {
    min-width: 420px
}

body.page-index .links-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(420px, 1fr));
    gap: 8px;
    align-items: start
}

body.page-index .link-card {
    background: #fff;
    border-radius: 28px;
    height: 123px;
    padding: 10px 17px;
    text-decoration: none;
    color: var(--metro-text);
    display: flex;
    flex-direction: column;
    gap: 4px;
    border: 1px solid rgba(0, 0, 0, .08);
    box-shadow: 0 14px 35px rgba(0, 0, 0, .06);
    transition: all .25s ease
}

body.page-index .link-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 16px 40px rgba(0, 0, 0, .08)
}

body.page-index .link-row {
    display: flex;
    align-items: center;
    gap: 12px
}

body.page-index .icon {
    width: 32px;
    height: 32px;
    flex-shrink: 0;
    color: #E10600;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round
}

body.page-index .icon use {
    fill: none;
    stroke: inherit
}

body.page-index .label {
    font-size: 16px;
    font-weight: 600
}

body.page-index .sub {
    font-size: 13px;
    line-height: 17px;
    min-height: 51px;
    max-height: 51px;
    color: var(--metro-muted);
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 3;
    overflow: hidden
}

body.page-index .cta {
    margin-top: auto;
    font-weight: 600;
    font-size: 14px;
    color: #111;
    display: inline-flex;
    align-items: center;
    gap: 6px
}

body.page-index .link-card:hover .cta {
    color: #E10600
}

body.page-index .cookie-banner {
    position: fixed;
    bottom: 20px;
    left: 20px;
    right: 20px;
    display: none;
    justify-content: center;
    z-index: 9999
}

body.page-index .cookie-box {
    background: #ffffff;
    border-radius: 24px;
    box-shadow: 0 18px 45px rgba(0, 0, 0, 0.10);
    padding: 24px;
    max-width: 700px;
    width: 100%;
    text-align: center;
    font-size: 14px
}

body.page-index .cookie-header {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    margin-bottom: 10px
}

body.page-index .cookie-header span {
    grid-column: 2;
    font-weight: 700;
    color: #111
}

body.page-index .cookie-header button {
    position: absolute;
    top: 12px;
    right: 16px;
    background: transparent;
    border: none;
    color: #E10600;
    font-size: 18px;
    cursor: pointer;
    padding: 0;
    line-height: 1
}

body.page-index .cookie-header button:hover {
    opacity: 0.7
}

body.page-index .cookie-box p {
    font-size: 14px;
    color: #777;
    line-height: 1.5
}

body.page-index .cookie-box a {
    color: #E10600;
    text-decoration: none
}

body.page-index .cookie-box a:hover {
    text-decoration: underline
}

body.page-index .cookie-box {
    position: relative
}

body.page-index .cookie-actions {
    margin-top: 18px;
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
    justify-content: center
}

body.page-index .btn-accept {
    background: #E10600;
    color: white;
    border: none;
    padding: 12px 18px;
    border-radius: 8px;
    cursor: pointer;
    font-weight: 600;
    transition: 0.2s
}

body.page-index .btn-accept:hover {
    background: #b80000
}

body.page-index .btn-reject {
    background: #e5e5e5;
    color: #333;
    border: none;
    padding: 12px 18px;
    border-radius: 8px;
    cursor: pointer
}

body.page-index .btn-config {
    background: #f0f0f0;
    border: none;
    padding: 12px 18px;
    border-radius: 8px;
    cursor: pointer
}

body.page-index .cookie-link {
    display: inline-block;
    margin-top: 20px;
    text-align: center;
    color: #b80000;
    text-decoration: underline;
    font-size: 12px
}

body.page-index .cookie-links {
    margin-top: 10px;
    display: flex;
    justify-content: center;
    gap: 20px;
    flex-wrap: wrap
}

body.page-index .cookie-links a {
    display: inline-block
}

body.page-index .footer {
    text-align: center;
    margin-top: 8px
}

body.page-index .footer-main {
    font-size: 14px;
    color: #666;
    margin: 0
}

body.page-index .whatsapp-float {
    position: fixed;
    bottom: 20px;
    right: 20px;
    width: 52px;
    height: 52px;
    background: #25D366;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.2);
    z-index: 9999;
    transition: 0.2s
}

body.page-index .whatsapp-float:hover {
    transform: scale(1.1)
}

body.page-index .footer-sub {
    font-size: 11px;
    color: #999;
    margin-top: 4px;
    line-height: 1.4
}

@media (max-width:900px) {
    body.page-index .page {
        grid-template-columns: 1fr
    }

    body.page-index #profile-card-container {
        min-width: auto
    }

    body.page-index .links-grid {
        grid-template-columns: 1fr
    }
}

body.page-institucional {
    --metro-red: #e02020;
    --metro-text: #111;
    --metro-muted: #777;
    --shadow-soft: 0 18px 45px rgba(0, 0, 0, 0.1)
}

body.page-institucional * {
    margin: 0;
    padding: 0;
    box-sizing: border-box
}

body.page-institucional {
    scroll-behavior: smooth
}

body.page-institucional {
    font-family: "Space Grotesk", sans-serif;
    background: #ffffff;
    color: var(--metro-text);
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    padding: 32px 16px 24px
}

body.page-institucional .page {
    flex: 1;
    max-width: 1120px;
    width: 100%;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 420px 1fr;
    gap: 40px;
    align-items: flex-start
}

body.page-institucional #profile-card-container {
    min-width: 420px
}

body.page-institucional .profile-card {
    background: var(--metro-card);
    border-radius: 32px;
    box-shadow: var(--shadow-soft);
    padding: 32px;
    height: 100%;
    display: flex;
    flex-direction: column;
    position: sticky;
    top: 24px;
    align-self: flex-start
}

body.page-institucional .top-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 24px
}

body.page-institucional .logo-wrap {
    width: 110px;
    height: 110px;
    border-radius: 50%;
    overflow: hidden;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.12);
    flex-shrink: 0
}

body.page-institucional .logo-wrap img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block
}

body.page-institucional .badges {
    display: flex;
    align-items: center;
    gap: 14px
}

body.page-institucional .badges img {
    width: auto;
    object-fit: contain;
    filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.15))
}

body.page-institucional .badge-fpf {
    height: 38px
}

body.page-institucional .badge-cbf {
    height: 47px
}

body.page-institucional .badge-formador {
    height: 40px
}

body.page-institucional .club-name {
    font-size: 32px;
    font-weight: 700;
    margin-bottom: 12px
}

body.page-institucional .club-description {
    list-style: none;
    margin-bottom: 12px
}

body.page-institucional .club-description li {
    margin: 6px 0;
    color: var(--metro-muted);
    font-size: 15px
}

body.page-institucional .tags {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    justify-content: center
}

body.page-institucional .tag {
    padding: 8px 18px;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 500;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    border: 1px solid rgba(224, 32, 32, 0.28);
    background: rgba(224, 32, 32, 0.06);
    color: #555555;
    white-space: nowrap
}

body.page-institucional .section-card .pill-row .pill {
    padding: 10px 22px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.14em;
    background-color: #fff3f3 !important;
    border: 1.5px solid #ffb3b3 !important;
    color: #5a5a5a !important;
    white-space: nowrap
}

body.page-institucional .school-units {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
    margin: 28px 0
}

body.page-institucional .school-unit-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 7px;
    padding: 20px;
    border: 1px solid #dedee2;
    border-radius: 20px;
    background: #fafafa;
    color: #222;
    font: inherit;
    text-align: center;
    cursor: pointer;
    transition: .18s ease
}

body.page-institucional .school-unit-card:hover {
    border-color: #dedee2;
    background: rgba(224, 32, 32, .06);
    transform: translateY(-2px);
    box-shadow: 0 12px 24px rgba(0, 0, 0, .08)
}

body.page-institucional .school-unit-label,
body.page-institucional .school-unit-card small {
    color: #666;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase
}

body.page-institucional .school-unit-label {
    color: var(--metro-red)
}

body.page-institucional .school-unit-card:focus-visible,
body.page-institucional .school-unit-modal-close:focus-visible {
    outline: 0;
    box-shadow: 0 0 0 3px rgba(224, 32, 32, .24)
}

body.page-institucional .school-unit-card strong {
    font-size: 20px;
    font-weight: 500
}

body.page-institucional .school-unit-card>span:not(.school-unit-label) {
    color: var(--metro-muted);
    font-size: 13px
}

body.page-institucional .school-unit-modal {
    position: fixed;
    inset: 0;
    width: min(820px, calc(100% - 32px));
    height: fit-content;
    max-height: calc(100vh - 32px);
    margin: auto;
    padding: 30px;
    border: 0;
    border-radius: 26px;
    box-shadow: 0 28px 80px rgba(0, 0, 0, .28);
    overflow: auto;
    text-align: center;
    outline: 0
}

body.page-institucional .school-unit-modal .section-eyebrow {
    color: #666
}

body.page-institucional .school-unit-modal-heading {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 18px;
    margin-bottom: 22px
}

body.page-institucional .school-unit-logo {
    width: 84px;
    height: 84px;
    flex: 0 0 auto;
    border-radius: 16px;
    object-fit: contain;
    background: #fff
}

body.page-institucional .school-unit-modal::backdrop {
    background: rgba(0, 0, 0, .55);
    backdrop-filter: blur(4px)
}

body.page-institucional .school-unit-modal-close {
    position: absolute;
    top: 16px;
    right: 18px;
    width: 38px;
    height: 38px;
    border: 0;
    border-radius: 50%;
    background: #f1f1f3;
    color: #333;
    font-size: 24px;
    cursor: pointer
}

body.page-institucional .school-unit-location {
    margin: -6px 0 0;
    color: #555;
    font-weight: 400
}

body.page-institucional .school-unit-details {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px
}

body.page-institucional .school-unit-details>div {
    min-width: 0;
    padding: 14px;
    border: 0;
    border-radius: 14px;
    background: #f6f6f7;
    text-align: center
}

body.page-institucional .school-unit-details span,
body.page-institucional .school-unit-details strong {
    display: block
}

body.page-institucional .school-unit-details span {
    margin-bottom: 5px;
    color: #777;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase
}

body.page-institucional .school-unit-details strong {
    font-size: 14px;
    font-weight: 400;
    line-height: 1.5;
    white-space: pre-line
}

body.page-institucional .school-unit-email {
    display: block;
    margin-top: 6px;
    color: #0563c1;
    font-size: 13px;
    line-height: 1.4;
    white-space: nowrap;
    text-decoration-color: currentColor;
    text-underline-offset: 3px
}

body.page-institucional .school-unit-email:hover {
    color: #034b91
}

@media (max-width:720px) {

    body.page-institucional .school-units,
    body.page-institucional .school-unit-details {
        grid-template-columns: 1fr
    }

    body.page-institucional .school-unit-modal-heading {
        flex-direction: column;
        gap: 10px
    }

    body.page-institucional .school-unit-email {
        white-space: normal;
        overflow-wrap: anywhere
    }
}

body.page-institucional .content-column {
    display: flex;
    flex-direction: column;
    gap: 24px
}

body.page-institucional .section-nav {
    background: #fff;
    border-radius: 24px;
    box-shadow: 0 14px 35px rgba(0, 0, 0, 0.06);
    border: 1px solid rgba(0, 0, 0, 0.08);
    padding: 16px 20px;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    position: sticky;
    top: 24px;
    z-index: 5;
    backdrop-filter: blur(10px)
}

body.page-institucional .section-nav a {
    font-size: 12px;
    text-transform: uppercase;
    padding: 8px 14px;
    border-radius: 999px;
    border: 1px solid #d5d5d5;
    background: #ffffff;
    color: #555;
    letter-spacing: 0.08em;
    font-weight: 500;
    text-decoration: none;
    transition: 0.18s ease-out
}

body.page-institucional .section-nav a:hover {
    border-color: var(--metro-red);
    color: #fff;
    background: var(--metro-red)
}

body.page-institucional .section-card {
    background: #fff;
    border-radius: 28px;
    padding: 24px 24px 26px;
    box-shadow: 0 14px 35px rgba(0, 0, 0, 0.06);
    border: 1px solid rgba(0, 0, 0, 0.08)
}

body.page-institucional .section-eyebrow {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.16em;
    color: var(--metro-red);
    font-weight: 700;
    margin-bottom: 6px
}

body.page-institucional .section-title {
    font-size: 22px;
    font-weight: 700;
    margin-bottom: 10px
}

body.page-institucional .section-subtitle {
    font-size: 14px;
    color: var(--metro-muted);
    margin-bottom: 18px
}

body.page-institucional .section-body {
    font-size: 14px;
    line-height: 1.6;
    color: #333
}

body.page-institucional .section-body strong {
    font-weight: 700
}

body.page-institucional .section-list {
    margin-top: 12px;
    padding-left: 18px;
    font-size: 14px;
    color: #333
}

body.page-institucional .section-list li {
    margin: 4px 0
}

body.page-institucional .pill-row {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 12px
}

body.page-institucional .pill {
    font-size: 12px;
    padding: 6px 12px;
    border-radius: 999px;
    background: #f5f5f5;
    color: #555;
    border: 1px solid #e0e0e0
}

body.page-institucional .staff-section-group {
    margin-top: 18px
}

body.page-institucional .staff-section-heading {
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.16em;
    color: var(--metro-muted);
    font-weight: 700;
    margin-bottom: 8px
}

body.page-institucional .staff-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 14px
}

body.page-institucional .staff-card {
    border-radius: 18px;
    border: 1px solid #e0e0e0;
    padding: 12px 14px;
    background: #fafafa;
    display: flex;
    gap: 10px;
    align-items: flex-start
}

body.page-institucional .staff-photo {
    width: 80px;
    height: 80px;
    border-radius: 50%;
    overflow: hidden;
    background: #e5e5e5;
    flex-shrink: 0
}

body.page-institucional .staff-photo-img {
    width: 100px;
    aspect-ratio: 1 / 1;
    border-radius: 50%;
    overflow: hidden;
    background: #e5e5e5;
    flex-shrink: 0
}

body.page-institucional .staff-photo-placeholder {
    display: grid;
    place-items: center;
    color: #777;
    font-size: 20px;
    font-weight: 700;
    letter-spacing: 0.04em
}

body.page-institucional .staff-photo-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center top;
    display: block
}

body.page-institucional .staff-text {
    display: flex;
    flex-direction: column;
    min-width: 0
}

body.page-institucional .staff-role {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    color: var(--metro-red);
    margin-bottom: 2px;
    font-weight: 600
}

body.page-institucional .staff-name {
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 2px
}

body.page-institucional .staff-note {
    font-size: 13px;
    color: var(--metro-muted)
}

body.page-institucional .category-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 24px
}

body.page-institucional .category-card {
    border-radius: 16px;
    border: 1px solid #e0e0e0;
    padding: 10px 12px;
    background: #fafafa
}

body.page-institucional .category-label {
    font-size: 13px;
    font-weight: 600;
    margin-bottom: 2px
}

body.page-institucional .category-age {
    font-size: 13px;
    color: var(--metro-muted)
}

body.page-institucional .supporters-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
    gap: 16px;
    margin-top: 14px
}

body.page-institucional .supporter-card {
    border-radius: 18px;
    border: 1px solid #e0e0e0;
    padding: 14px;
    background: #fafafa;
    text-align: left
}

body.page-institucional .supporter-tag {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.14em;
    color: var(--metro-red);
    margin-bottom: 4px;
    font-weight: 600
}

body.page-institucional .supporter-name {
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 3px
}

body.page-institucional .supporter-note {
    font-size: 13px;
    color: var(--metro-muted)
}

body.page-institucional .supporter-card {
    text-align: center;
    display: flex;
    flex-direction: column;
    align-items: center
}

body.page-institucional .supporter-card .staff-photo {
    margin: 12px auto 0;
    width: 80px;
    height: 80px
}

body.page-institucional .supporter-card .staff-photo img {
    width: 100%;
    height: 100%;
    object-fit: contain
}

body.page-institucional .section-card {
    scroll-margin-top: 160px
}

body.page-institucional .next-matches-card {
    background: #fff;
    border-radius: 24px;
    padding: 24px;
    box-shadow: var(--shadow-soft);
    border: 1px solid rgba(0, 0, 0, 0.08);
    margin-top: 28px;
    text-align: center
}

body.page-institucional .next-title {
    font-size: 16px;
    font-weight: 700;
    margin-bottom: 18px;
    text-transform: uppercase;
    letter-spacing: .12em;
    color: var(--metro-red)
}

body.page-institucional .next-match {
    margin-bottom: 20px;
    padding-bottom: 18px;
    border-bottom: 1px solid #eee
}

body.page-institucional .next-match:last-child {
    border-bottom: none;
    margin-bottom: 0;
    padding-bottom: 0
}

body.page-institucional .match-category {
    font-size: 13px;
    font-weight: 600;
    color: var(--metro-red);
    margin-bottom: 6px
}

body.page-institucional .match-date {
    font-size: 14px;
    font-weight: 600;
    color: #111;
    margin-bottom: 4px
}

body.page-institucional .match-info {
    font-size: 15px;
    font-weight: 700;
    color: #111;
    margin-bottom: 4px
}

body.page-institucional .match-location {
    font-size: 13px;
    color: var(--metro-muted)
}

body.page-institucional .no-games {
    text-align: center;
    padding: 24px 10px;
    opacity: 0.7
}

body.page-institucional .no-games-text {
    font-size: 15px;
    line-height: 1.5
}

body.page-institucional .footer {
    text-align: center;
    margin-top: 8px
}

body.page-institucional .footer-main {
    font-size: 14px;
    color: #666;
    margin: 0
}

body.page-institucional .footer-sub {
    font-size: 11px;
    color: #999;
    margin-top: 4px;
    line-height: 1.4
}

body.page-institucional .section-nav a.active {
    background: var(--metro-red);
    color: white;
    border-color: var(--metro-red)
}

body.page-institucional .section-card.active-section {
    border: 2px solid var(--metro-red) !important;
    box-shadow: 0 0 0 4px rgba(224, 32, 32, 0.12);
    transition: border 0.25s ease-out, box-shadow 0.25s ease-out
}

body.page-institucional .section-nav a.active {
    background: var(--metro-red);
    color: #fff;
    border-color: var(--metro-red)
}

body.page-institucional .photo-img {
    display: flex;
    justify-content: center;
    align-items: center;
    background: transparent;
    overflow: visible;
    border-radius: 0
}

body.page-institucional .photo-img img {
    width: 35mm;
    height: auto;
    object-fit: contain;
    border-radius: 0;
    display: block
}

@media (max-width:850px) {
    body.page-institucional {
        padding-top: 20px
    }

    body.page-institucional .page {
        grid-template-columns: 1fr;
        align-items: start
    }

    body.page-institucional .profile-card {
        position: static
    }

    body.page-institucional .section-nav {
        position: static;
        margin-top: -10px
    }

    body.page-institucional .top-header {
        flex-direction: column;
        align-items: flex-start;
        gap: 16px
    }

    body.page-institucional .badges {
        justify-content: flex-start
    }
}

body.page-links {
    --metro-red: #e02020;
    --metro-card: #ffffff;
    --metro-text: #111111;
    --metro-muted: #777777;
    --metro-line: rgba(0, 0, 0, 0.08);
    --metro-soft: #fafafa;
    --shadow-soft: 0 18px 45px rgba(0, 0, 0, 0.10)
}

body.page-links * {
    margin: 0;
    padding: 0;
    box-sizing: border-box
}

body.page-links {
    scroll-behavior: smooth
}

body.page-links {
    font-family: "Space Grotesk", sans-serif;
    background: #ffffff;
    color: var(--metro-text);
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    padding: 32px 16px 24px
}

body.page-links .page {
    flex: 1;
    max-width: 1120px;
    width: 100%;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 420px 1fr;
    gap: 40px;
    align-items: flex-start
}

body.page-links #profile-card-container {
    min-width: 420px
}

body.page-links .profile-fallback {
    padding: 24px;
    border-radius: 24px;
    border: 1px dashed #dddddd;
    color: #aaaaaa
}

body.page-links .content-column {
    display: flex;
    flex-direction: column;
    gap: 24px;
    min-width: 0
}

body.page-links .section-card {
    background: #ffffff;
    border-radius: 28px;
    padding: 24px 24px 26px;
    box-shadow: 0 14px 35px rgba(0, 0, 0, 0.06);
    border: 1px solid var(--metro-line)
}

body.page-links .section-eyebrow {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.16em;
    color: var(--metro-red);
    font-weight: 700;
    margin-bottom: 6px
}

body.page-links .section-title {
    font-size: 22px;
    font-weight: 700;
    margin-bottom: 10px
}

body.page-links .hero-title {
    font-size: 34px;
    line-height: 1.05;
    font-weight: 700;
    text-transform: uppercase;
    margin-bottom: 12px
}

body.page-links .section-subtitle {
    font-size: 14px;
    color: var(--metro-muted);
    line-height: 1.65
}

body.page-links .section-nav {
    background: #ffffff;
    border-radius: 24px;
    box-shadow: 0 14px 35px rgba(0, 0, 0, 0.06);
    border: 1px solid var(--metro-line);
    padding: 16px 20px;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    position: sticky;
    top: 24px;
    z-index: 5;
    backdrop-filter: blur(10px)
}

body.page-links .section-nav a {
    font-size: 12px;
    text-transform: uppercase;
    padding: 8px 14px;
    border-radius: 999px;
    border: 1px solid #d5d5d5;
    background: #ffffff;
    color: #555555;
    letter-spacing: 0.08em;
    font-weight: 500;
    text-decoration: none;
    transition: 0.18s ease-out
}

body.page-links .section-nav a:hover,
body.page-links .section-nav a.active {
    border-color: var(--metro-red);
    color: #ffffff;
    background: var(--metro-red)
}

body.page-links .links-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px
}

body.page-links .link-card {
    min-height: 126px;
    background: var(--metro-soft);
    border-radius: 18px;
    border: 1px solid #e0e0e0;
    padding: 16px;
    color: var(--metro-text);
    text-decoration: none;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 14px;
    transition: 0.20s ease-out
}

body.page-links .link-card:hover {
    transform: translateY(-3px);
    border-color: rgba(224, 32, 32, 0.45);
    box-shadow: 0 14px 35px rgba(224, 32, 32, 0.10);
    background: #ffffff
}

body.page-links .link-row {
    display: flex;
    align-items: flex-start;
    gap: 12px
}

body.page-links .link-icon {
    width: 34px;
    height: 34px;
    border-radius: 999px;
    background: rgba(224, 32, 32, 0.08);
    color: var(--metro-red);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 16px;
    flex: 0 0 auto
}

body.page-links .link-label {
    font-size: 15px;
    font-weight: 700;
    line-height: 1.25
}

body.page-links .link-sub {
    font-size: 12px;
    color: var(--metro-muted);
    line-height: 1.45;
    margin-top: 5px
}

body.page-links .link-url {
    font-size: 11px;
    color: #999999;
    word-break: break-word
}

body.page-links .link-cta {
    color: var(--metro-red);
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    font-weight: 700
}

body.page-links .pill-row {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 16px
}

body.page-links .tag {
    padding: 8px 18px;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    border: 1px solid rgba(224, 32, 32, 0.28);
    background: rgba(224, 32, 32, 0.06);
    color: #555555;
    white-space: nowrap
}

body.page-links .footer {
    text-align: center;
    margin-top: 8px
}

body.page-links .footer-main {
    font-size: 14px;
    color: #666666;
    margin: 0
}

body.page-links .footer-sub {
    font-size: 11px;
    color: #999999;
    margin-top: 4px;
    line-height: 1.4
}

body.page-links .whatsapp-float {
    position: fixed;
    bottom: 20px;
    right: 20px;
    width: 52px;
    height: 52px;
    background: #25D366;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.2);
    z-index: 9999;
    transition: 0.2s
}

body.page-links .whatsapp-float:hover {
    transform: scale(1.1)
}

body.page-links .profile-card {
    position: sticky;
    top: 24px;
    align-self: flex-start
}

@media (max-width:850px) {
    body.page-links {
        padding-top: 20px
    }

    body.page-links .page {
        grid-template-columns: 1fr;
        align-items: start
    }

    body.page-links #profile-card-container {
        min-width: 0
    }

    body.page-links .profile-card {
        position: static
    }

    body.page-links .section-nav {
        position: static;
        margin-top: -10px
    }

    body.page-links .links-grid {
        grid-template-columns: 1fr
    }
}

body.page-loja {
    --metro-red: #e02020;
    --metro-text: #111;
    --metro-muted: #777;
    --shadow-soft: 0 18px 45px rgba(0, 0, 0, 0.1)
}

body.page-loja * {
    margin: 0;
    padding: 0;
    box-sizing: border-box
}

body.page-loja {
    font-family: "Space Grotesk", sans-serif;
    background: #fff;
    color: var(--metro-text);
    min-height: 100vh;
    padding: 32px 16px
}

body.page-loja .page {
    max-width: 1120px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 420px 1fr;
    gap: 40px
}

body.page-loja #profile-card-container {
    min-width: 420px
}

body.page-loja .content-column {
    display: flex;
    flex-direction: column;
    gap: 24px
}

body.page-loja .page-title {
    font-size: 26px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase
}

body.page-loja .section-nav {
    background: #fff;
    border-radius: 24px;
    box-shadow: var(--shadow-soft);
    border: 1px solid rgba(0, 0, 0, .08);
    padding: 16px 20px;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    position: sticky;
    top: 24px;
    z-index: 5
}

body.page-loja .section-nav a {
    font-size: 12px;
    text-transform: uppercase;
    padding: 8px 14px;
    border-radius: 999px;
    border: 1px solid #d5d5d5;
    background: #fff;
    color: #555;
    letter-spacing: .08em;
    font-weight: 500;
    text-decoration: none;
    transition: .2s
}

body.page-loja .section-nav a:hover,
body.page-loja .section-nav a.active {
    background: var(--metro-red);
    color: #fff;
    border-color: var(--metro-red)
}

body.page-loja .section-card {
    background: #fff;
    border-radius: 28px;
    padding: 24px;
    box-shadow: 0 14px 35px rgba(0, 0, 0, .06);
    border: 1px solid rgba(0, 0, 0, .08)
}

body.page-loja .section-title {
    font-size: 20px;
    font-weight: 700;
    margin-bottom: 20px
}

body.page-loja .produtos-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px
}

body.page-loja .produto-card {
    border-radius: 22px;
    border: 1px solid #e5e5e5;
    padding: 18px;
    background: #fafafa;
    transition: .25s ease;
    overflow: hidden
}

body.page-loja .produto-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 15px 30px rgba(0, 0, 0, .1)
}

body.page-loja .produto-img {
    width: 100%;
    height: 190px;
    display: flex;
    justify-content: center;
    align-items: center
}

body.page-loja .produto-img img {
    width: auto;
    height: 170px;
    object-fit: contain
}

body.page-loja .produto-nome {
    font-size: 14px;
    font-weight: 400;
    margin-bottom: 6px
}

body.page-loja .produto-preco {
    font-size: 15px;
    font-weight: 700;
    margin-bottom: 14px
}

body.page-loja .produto-card button {
    width: 100%;
    padding: 12px;
    border-radius: 18px;
    border: none;
    background: var(--metro-red);
    color: #fff;
    font-weight: 700;
    font-size: 14px;
    cursor: pointer;
    transition: .2s
}

body.page-loja .produto-card button:hover {
    opacity: 0.85
}

body.page-loja .linha-descricao {
    font-size: 14px;
    color: #666;
    margin-bottom: 24px;
    line-height: 1.5;
    max-width: 720px
}

body.page-loja .modal {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, .6);
    backdrop-filter: blur(4px);
    justify-content: center;
    align-items: center;
    z-index: 999
}

body.page-loja .modal-content {
    background: #fff;
    width: 500px;
    max-width: 120%;
    border-radius: 24px;
    padding: 24px;
    position: relative;
    animation: page-loja-fadeIn .2s ease
}

@keyframes page-loja-fadeIn {
    from {
        transform: scale(.95);
        opacity: 0
    }

    to {
        transform: scale(1);
        opacity: 1
    }
}

body.page-loja .modal-close {
    position: absolute;
    top: 16px;
    right: 18px;
    font-size: 22px;
    cursor: pointer;
    font-weight: bold
}

body.page-loja .modal-img {
    display: flex;
    justify-content: center;
    margin-bottom: 16px
}

body.page-loja .modal-img img {
    max-height: 350px;
    object-fit: contain
}

body.page-loja .modal-descricao {
    font-size: 14px;
    color: #666;
    line-height: 1.5;
    margin: 12px 0
}

body.page-loja .modal-preco {
    font-size: 16px;
    font-weight: 700;
    margin-bottom: 16px
}

body.page-loja .modal-btn {
    width: 100%;
    padding: 12px;
    border-radius: 18px;
    border: none;
    background: var(--metro-red);
    color: #fff;
    font-weight: 700;
    cursor: pointer
}

body.page-loja .tamanhos-opcoes {
    display: flex;
    gap: 12px;
    margin-bottom: 16px
}

body.page-loja .tamanhos-opcoes button {
    padding: 6px 14px;
    font-size: 14px;
    font-weight: 600;
    border-radius: 10px;
    border: 1px solid #ccc;
    background: #fff;
    cursor: pointer;
    min-width: 55px;
    transition: all .2s ease
}

body.page-loja .tamanhos-opcoes button:hover {
    border-color: var(--metro-red)
}

body.page-loja .tamanhos-opcoes button.ativo {
    background: var(--metro-red);
    color: #fff;
    border-color: var(--metro-red)
}

body.page-loja .footer {
    text-align: center;
    margin-top: 8px
}

body.page-loja .footer-main {
    font-size: 14px;
    color: #666;
    margin: 0
}

body.page-loja .footer-sub {
    font-size: 11px;
    color: #999;
    margin-top: 4px;
    line-height: 1.4
}

@media(max-width:1000px) {
    body.page-loja .produtos-grid {
        grid-template-columns: 1fr
    }
}

@media(max-width:850px) {
    body.page-loja .page {
        grid-template-columns: 1fr
    }
}

body.page-midia {
    --metro-red: #e02020;
    --metro-text: #111;
    --metro-muted: #777;
    --shadow-soft: 0 18px 45px rgba(0, 0, 0, .08)
}

body.page-midia * {
    margin: 0;
    padding: 0;
    box-sizing: border-box
}

body.page-midia {
    scroll-behavior: smooth
}

body.page-midia {
    font-family: "Space Grotesk", sans-serif;
    background: #fff;
    color: var(--metro-text);
    padding: 32px 16px 24px
}

body.page-midia .page {
    max-width: 1120px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 420px 1fr;
    gap: 40px;
    align-items: flex-start
}

body.page-midia .profile-card {
    position: sticky;
    top: 24px
}

body.page-midia .content-column {
    display: flex;
    flex-direction: column;
    gap: 24px
}

body.page-midia .section-nav {
    background: #fff;
    border-radius: 24px;
    box-shadow: 0 14px 35px rgba(0, 0, 0, .06);
    border: 1px solid rgba(0, 0, 0, .08);
    padding: 16px 20px;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    position: sticky;
    top: 24px;
    z-index: 5
}

body.page-midia .section-nav a {
    font-size: 12px;
    text-transform: uppercase;
    padding: 8px 14px;
    border-radius: 999px;
    border: 1px solid #d5d5d5;
    background: #fff;
    color: #555;
    letter-spacing: .08em;
    font-weight: 500;
    text-decoration: none;
    transition: .18s ease-out
}

body.page-midia .section-nav a.active,
body.page-midia .section-nav a:hover {
    background: var(--metro-red);
    color: #fff;
    border-color: var(--metro-red)
}

body.page-midia .section-card {
    background: #fff;
    border-radius: 28px;
    padding: 24px;
    box-shadow: var(--shadow-soft);
    border: 1px solid rgba(0, 0, 0, .08);
    scroll-margin-top: 160px
}

body.page-midia .section-eyebrow {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: .16em;
    color: var(--metro-red);
    font-weight: 700;
    margin-bottom: 6px
}

body.page-midia .section-title {
    font-size: 22px;
    font-weight: 700;
    margin-bottom: 10px
}

body.page-midia .section-subtitle {
    font-size: 14px;
    color: var(--metro-muted);
    line-height: 1.55;
    margin-bottom: 18px
}

body.page-midia .hero-media {
    min-height: 300px;
    border-radius: 24px;
    padding: 28px;
    color: #fff;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    background: linear-gradient(135deg, rgba(17, 17, 17, .88), rgba(224, 32, 32, .74)), url("../asset/institucional/capa.png") center / cover;
    overflow: hidden
}

body.page-midia .hero-media .section-eyebrow {
    color: #fff;
    margin-bottom: 10px
}

body.page-midia .hero-media h1 {
    max-width: 620px;
    font-size: 34px;
    line-height: 1.08;
    letter-spacing: 0;
    margin-bottom: 12px
}

body.page-midia .hero-media p {
    max-width: 560px;
    font-size: 15px;
    line-height: 1.6;
    color: rgba(255, 255, 255, .86)
}

body.page-midia .stats-grid,
body.page-midia .featured-grid,
body.page-midia .albums-grid,
body.page-midia .videos-grid,
body.page-midia .downloads-grid {
    display: grid;
    gap: 14px
}

body.page-midia .stats-grid {
    grid-template-columns: repeat(4, 1fr)
}

body.page-midia .featured-grid,
body.page-midia .videos-grid {
    grid-template-columns: repeat(3, 1fr)
}

body.page-midia .albums-grid {
    grid-template-columns: repeat(2, 1fr)
}

body.page-midia .downloads-grid {
    grid-template-columns: repeat(4, 1fr)
}

body.page-midia .stat-card,
body.page-midia .media-card,
body.page-midia .download-card {
    background: #fafafa;
    border: 1px solid #e0e0e0;
    border-radius: 18px
}

body.page-midia .stat-card {
    padding: 18px 14px;
    text-align: center
}

body.page-midia .stat-card strong {
    display: block;
    font-size: 24px;
    color: var(--metro-red);
    margin-bottom: 3px
}

body.page-midia .stat-card span {
    font-size: 12px;
    color: var(--metro-muted);
    text-transform: uppercase;
    letter-spacing: .1em;
    font-weight: 700
}

body.page-midia .filter-row {
    display: flex;
    flex-wrap: wrap;
    gap: 10px
}

body.page-midia .filter-row button {
    appearance: none;
    border: 1px solid #d5d5d5;
    border-radius: 999px;
    background: #fff;
    color: #555;
    cursor: pointer;
    font-family: inherit;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: .08em;
    padding: 9px 14px;
    text-transform: uppercase;
    transition: .18s ease-out
}

body.page-midia .filter-row button.active,
body.page-midia .filter-row button:hover {
    background: var(--metro-red);
    border-color: var(--metro-red);
    color: #fff
}

body.page-midia .media-card {
    overflow: hidden;
    text-decoration: none;
    color: inherit;
    display: flex;
    flex-direction: column;
    min-height: 100%
}

body.page-midia .media-thumb {
    min-height: 130px;
    background: linear-gradient(135deg, rgba(17, 17, 17, .82), rgba(224, 32, 32, .72)), url("../asset/institucional/capa.png") center / cover;
    position: relative
}

body.page-midia .media-thumb::after {
    content: attr(data-label);
    position: absolute;
    left: 14px;
    bottom: 12px;
    padding: 6px 10px;
    border-radius: 999px;
    background: rgba(255, 255, 255, .92);
    color: var(--metro-red);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase
}

body.page-midia .media-content {
    padding: 16px
}

body.page-midia .media-content h3 {
    font-size: 16px;
    line-height: 1.25;
    margin-bottom: 6px
}

body.page-midia .media-content p {
    color: var(--metro-muted);
    font-size: 13px;
    line-height: 1.45
}

body.page-midia .video-card .media-thumb {
    display: flex;
    align-items: center;
    justify-content: center
}

body.page-midia .play-mark {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: rgba(255, 255, 255, .94);
    display: grid;
    place-items: center;
    box-shadow: 0 12px 24px rgba(0, 0, 0, .18)
}

body.page-midia .play-mark::before {
    content: "";
    width: 0;
    height: 0;
    border-top: 9px solid transparent;
    border-bottom: 9px solid transparent;
    border-left: 14px solid var(--metro-red);
    margin-left: 4px
}

body.page-midia .download-card {
    min-height: 112px;
    padding: 16px;
    color: inherit;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    text-decoration: none;
    transition: .18s ease-out
}

body.page-midia .download-card:hover {
    border-color: rgba(224, 32, 32, .4);
    box-shadow: 0 10px 24px rgba(224, 32, 32, .08);
    transform: translateY(-2px)
}

body.page-midia .download-card span {
    color: var(--metro-red);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase
}

body.page-midia .download-card strong {
    font-size: 15px;
    line-height: 1.25
}

body.page-midia .cta-row {
    background: #111;
    border-radius: 22px;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    padding: 22px
}

body.page-midia .cta-row h3 {
    font-size: 19px;
    margin-bottom: 4px
}

body.page-midia .cta-row p {
    color: rgba(255, 255, 255, .72);
    font-size: 13px;
    line-height: 1.45
}

body.page-midia .btn-primary {
    border-radius: 999px;
    background: var(--metro-red);
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .1em;
    padding: 11px 16px;
    text-decoration: none;
    text-transform: uppercase;
    white-space: nowrap
}

body.page-midia .footer {
    text-align: center;
    margin-top: 8px
}

body.page-midia .footer-main {
    font-size: 14px;
    color: #666;
    margin: 0
}

body.page-midia .footer-sub {
    font-size: 11px;
    color: #999;
    margin-top: 4px;
    line-height: 1.4
}

@media (max-width:900px) {
    body.page-midia {
        padding-top: 20px
    }

    body.page-midia .page {
        grid-template-columns: 1fr
    }

    body.page-midia .profile-card,
    body.page-midia .section-nav {
        position: static
    }

    body.page-midia .section-nav {
        margin-top: -10px
    }

    body.page-midia .stats-grid,
    body.page-midia .featured-grid,
    body.page-midia .videos-grid,
    body.page-midia .downloads-grid {
        grid-template-columns: repeat(2, 1fr)
    }
}

@media (max-width:560px) {
    body.page-midia .hero-media {
        min-height: 280px;
        padding: 22px
    }

    body.page-midia .hero-media h1 {
        font-size: 28px
    }

    body.page-midia .stats-grid,
    body.page-midia .featured-grid,
    body.page-midia .albums-grid,
    body.page-midia .videos-grid,
    body.page-midia .downloads-grid {
        grid-template-columns: 1fr
    }

    body.page-midia .cta-row {
        align-items: flex-start;
        flex-direction: column
    }
}

body.page-patrocinadores {
    --metro-red: #e02020;
    --metro-text: #111;
    --metro-muted: #777
}

body.page-patrocinadores * {
    margin: 0;
    padding: 0;
    box-sizing: border-box
}

body.page-patrocinadores {
    font-family: "Space Grotesk", sans-serif;
    background: #fff;
    color: var(--metro-text);
    min-height: 100vh;
    padding: 32px 16px
}

body.page-patrocinadores .page {
    max-width: 1120px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 420px 1fr;
    gap: 40px
}

body.page-patrocinadores #profile-card-container {
    min-width: 420px
}

body.page-patrocinadores .content-column {
    display: flex;
    flex-direction: column;
    gap: 24px
}

body.page-patrocinadores .section-card {
    background: #fff;
    border-radius: 28px;
    padding: 28px;
    box-shadow: 0 14px 35px rgba(0, 0, 0, .06);
    border: 1px solid rgba(0, 0, 0, .08)
}

body.page-patrocinadores .page-title {
    font-size: 24px;
    font-weight: 700;
    text-transform: uppercase;
    margin-bottom: 12px
}

body.page-patrocinadores .page-subtitle {
    font-size: 14px;
    color: #666;
    margin-bottom: 32px;
    max-width: 720px;
    line-height: 1.6
}

body.page-patrocinadores .parceiros-grid {
    display: flex;
    flex-direction: column;
    gap: 30px
}

body.page-patrocinadores .parceiro-card {
    border-radius: 22px;
    border: 1px solid #e5e5e5;
    padding: 20px;
    background: #fafafa;
    transition: .25s ease;
    text-align: center
}

body.page-patrocinadores .parceiro-card:hover {
    transform: translateY(-6px);
    box-shadow: 0 15px 30px rgba(0, 0, 0, .1)
}

body.page-patrocinadores .parceiro-img {
    height: 100px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 12px
}

body.page-patrocinadores .parceiro-img img {
    max-height: 100%;
    object-fit: contain
}

body.page-patrocinadores .parceiro-nome {
    font-size: 16px;
    font-weight: 700;
    margin-bottom: 6px
}

body.page-patrocinadores .parceiro-categoria {
    font-size: 13px;
    color: var(--metro-muted);
    margin-bottom: 10px
}

body.page-patrocinadores .parceiro-desc {
    font-size: 14px;
    color: #555;
    line-height: 1.5;
    margin-bottom: 14px
}

body.page-patrocinadores .parceiro-btn {
    display: inline-block;
    padding: 8px 16px;
    background: var(--metro-red);
    color: #fff;
    border-radius: 12px;
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
    transition: .2s
}

body.page-patrocinadores .parceiro-btn:hover {
    opacity: .85
}

body.page-patrocinadores .cta-section {
    margin-top: 40px;
    padding: 24px;
    border-radius: 20px;
    background: #fafafa;
    border: 1px solid #e5e5e5;
    text-align: center
}

body.page-patrocinadores .cta-section h3 {
    font-size: 18px;
    margin-bottom: 10px
}

body.page-patrocinadores .cta-section p {
    font-size: 14px;
    color: #666;
    margin-bottom: 16px
}

body.page-patrocinadores .cta-section a {
    display: inline-block;
    padding: 10px 20px;
    background: var(--metro-red);
    color: #fff;
    border-radius: 14px;
    font-weight: 600;
    text-decoration: none;
    transition: .2s
}

body.page-patrocinadores .cta-section a:hover {
    opacity: .9
}

body.page-patrocinadores .footer {
    text-align: center;
    margin-top: 8px
}

body.page-patrocinadores .footer-main {
    font-size: 14px;
    color: #666;
    margin: 0
}

body.page-patrocinadores .footer-sub {
    font-size: 11px;
    color: #999;
    margin-top: 4px;
    line-height: 1.4
}

@media(max-width:850px) {
    body.page-patrocinadores .page {
        grid-template-columns: 1fr
    }
}

body.page-pos-treino {
    --metro-red: #E02020;
    --metro-text: #111;
    --metro-muted: #777
}

body.page-pos-treino * {
    box-sizing: border-box;
    margin: 0;
    padding: 0
}

body.page-pos-treino {
    font-family: "Space Grotesk", sans-serif;
    background: #fff;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    padding: 32px 16px 24px
}

body.page-pos-treino .page {
    flex: 1;
    width: 100%;
    max-width: 1120px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 420px 1fr;
    gap: 40px;
    align-items: flex-start
}

body.page-pos-treino #profile-card-container {
    min-width: 420px
}

body.page-pos-treino .form-wrapper {
    display: flex
}

body.page-pos-treino .form-card {
    background: #fff;
    border-radius: 28px;
    padding: 24px;
    box-shadow: 0 14px 35px rgba(0, 0, 0, 0.06);
    border: 1px solid rgba(0, 0, 0, 0.08);
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 18px
}

body.page-pos-treino .form-title {
    font-size: 22px;
    font-weight: 700
}

body.page-pos-treino .form-subtitle {
    font-size: 13px;
    color: var(--metro-muted);
    margin-bottom: 8px
}

body.page-pos-treino .section-label {
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    color: var(--metro-muted);
    margin-top: 8px;
    font-weight: 700
}

body.page-pos-treino .field-group {
    display: flex;
    flex-direction: column;
    gap: 6px;
    width: 100%
}

body.page-pos-treino .field-label {
    font-size: 13px;
    font-weight: 500
}

body.page-pos-treino select,
body.page-pos-treino input[type="date"] {
    width: 100%;
    border-radius: 999px;
    border: 1px solid #d5d5d5;
    padding: 10px 14px;
    font-size: 14px;
    outline: none;
    background: #fff;
    color: var(--metro-text)
}

body.page-pos-treino select:focus,
body.page-pos-treino input[type="date"]:focus {
    border-color: var(--metro-red);
    box-shadow: 0 0 0 1px rgba(224, 32, 32, 0.08)
}

body.page-pos-treino .required {
    color: var(--metro-red)
}

body.page-pos-treino .terms-wrapper {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-top: 4px
}

body.page-pos-treino .term-item {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-size: 14px;
    line-height: 1.5
}

body.page-pos-treino .term-item input[type="radio"] {
    margin-top: 3px;
    accent-color: var(--metro-red)
}

body.page-pos-treino .form-footer {
    display: flex;
    justify-content: flex-end
}

body.page-pos-treino .btn-submit {
    padding: 11px 26px;
    border-radius: 999px;
    border: none;
    background: var(--metro-red);
    color: #fff;
    font-weight: 600;
    cursor: pointer;
    transition: 0.15s
}

body.page-pos-treino .btn-submit:hover {
    transform: translateY(-1px);
    box-shadow: 0 10px 25px rgba(224, 32, 32, 0.35);
    background: #c01818
}

body.page-pos-treino .label-extremo {
    font-size: 12px;
    font-weight: 700
}

body.page-pos-treino .question-image {
    width: 100%;
    max-width: 420px;
    margin: 10px auto 15px;
    display: block;
    border-radius: 12px
}

body.page-pos-treino .scale-row {
    display: flex;
    justify-content: space-between;
    gap: 8px;
    margin-top: 8px;
    flex-wrap: wrap
}

body.page-pos-treino .scale-row label {
    display: flex;
    flex-direction: column;
    align-items: center;
    font-size: 12px
}

body.page-pos-treino .dor-grid {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 8px;
    margin-top: 10px
}

body.page-pos-treino .dor-grid input {
    display: none
}

body.page-pos-treino .dor-grid label {
    border: 1px solid #ccc;
    border-radius: 10px;
    padding: 8px;
    text-align: center;
    cursor: pointer;
    font-size: 13px;
    transition: 0.2s
}

body.page-pos-treino .dor-grid label:hover {
    border-color: #E02020
}

body.page-pos-treino .dor-grid input:checked+span {
    color: #fff;
    background: #E02020;
    padding: 4px 8px;
    border-radius: 6px
}

body.page-pos-treino .input-textarea {
    width: 100%;
    height: 36px;
    border-radius: 999px;
    border: 1px solid #d5d5d5;
    padding: 6px 16px;
    font-size: 14px;
    outline: none;
    resize: none;
    font-family: "Space Grotesk", sans-serif;
    overflow: hidden;
    line-height: 1.2
}

body.page-pos-treino .input-textarea:focus {
    border-color: #E02020;
    box-shadow: 0 0 0 2px rgba(224, 32, 32, 0.08)
}

body.page-pos-treino .modal-backdrop {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.4);
    display: none;
    align-items: center;
    justify-content: center;
    z-index: 999
}

body.page-pos-treino .modal {
    background: #fff;
    border-radius: 20px;
    padding: 24px;
    max-width: 360px;
    width: 90%;
    text-align: center
}

body.page-pos-treino .modal-title {
    font-weight: 700;
    font-size: 18px;
    margin-bottom: 10px
}

body.page-pos-treino .modal-text {
    font-size: 14px;
    color: #555;
    margin-bottom: 20px
}

body.page-pos-treino .btn-modal {
    background: #E02020;
    color: #fff;
    border: none;
    padding: 10px 20px;
    border-radius: 999px;
    cursor: pointer
}

body.page-pos-treino .section-divider-strong {
    height: 1px;
    width: 100%;
    border: none;
    background-color: #E02020;
    margin: 24px 0 12px
}

body.page-pos-treino .footer {
    text-align: center;
    margin-top: 8px
}

body.page-pos-treino .footer-main {
    font-size: 14px;
    color: #666;
    margin: 0
}

body.page-pos-treino .footer-sub {
    font-size: 11px;
    color: #999;
    margin-top: 4px;
    line-height: 1.4
}

@media (max-width:900px) {
    body.page-pos-treino .page {
        grid-template-columns: 1fr
    }

    body.page-pos-treino #profile-card-container {
        min-width: auto
    }
}

body.page-pre-sumula {
    --metro-red: #e02020;
    --metro-muted: #777
}

body.page-pre-sumula * {
    box-sizing: border-box;
    margin: 0;
    padding: 0
}

body.page-pre-sumula {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    padding: 0 16px 24px;
    background: #fff;
    font-family: "Space Grotesk", sans-serif
}

body.page-pre-sumula .page {
    flex: 1;
    width: 100%;
    max-width: 1120px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 420px 1fr;
    gap: 40px;
    align-items: flex-start
}

body.page-pre-sumula .form-card {
    width: 100%;
    max-width: 720px;
    display: flex;
    flex-direction: column;
    gap: 18px;
    align-self: start
}

body.page-pre-sumula .pre-sumula-intro {
    padding: 0
}

body.page-pre-sumula .pre-sumula-panel {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 18px;
    padding: 32px;
    border: 1px solid rgba(0, 0, 0, 0.08);
    border-radius: 24px;
    background: #fff;
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.055)
}

body.page-pre-sumula .pre-sumula-panel>.section-label:first-child {
    margin-top: 0
}

/* Fluxo progressivo: enquanto bloqueado, o card fica com [hidden] no HTML.
   Precisa de !important porque ".pre-sumula-panel" (e suas variantes em
   media queries) fixam "display: flex", o que por cascata (autor sempre
   vence a folha de estilos do navegador) anularia o [hidden] padrão. */
body.page-pre-sumula .pre-sumula-panel[hidden] {
    display: none !important
}

body.page-pre-sumula .pre-sumula-panel--revelando {
    opacity: 0;
    transform: translateY(10px)
}

body.page-pre-sumula .pre-sumula-panel--revelado {
    opacity: 1;
    transform: translateY(0);
    transition: opacity .4s ease, transform .4s ease
}

body.page-pre-sumula .scout-header-section.pre-sumula-panel>.section-label {
    margin: 0;
    color: var(--metro-muted);
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .12em;
    line-height: 1.2;
    text-transform: uppercase
}

body.page-pre-sumula .pre-sumula-subsection-label {
    color: var(--metro-muted);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase
}

body.page-pre-sumula .pre-sumula-stats-panel .form-actions {
    margin-top: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 12px
}

body.page-pre-sumula .pre-sumula-action-row {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 12px;
    width: 100%;
    margin: 0 auto;
}

body.page-pre-sumula .pre-sumula-action-row button {
    min-width: 180px;
}

/* Botões de PDF: sempre três por linha, com destaque vermelho no hover. */
body.page-pre-sumula .pre-sumula-action-row--pdf {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
}

body.page-pre-sumula .pre-sumula-action-row--pdf button {
    min-width: 0;
}

body.page-pre-sumula .pre-sumula-action-btn {
    padding: 14px 16px;
    border: 1px solid #d9dcda;
    border-radius: 999px;
    background: #f7f8f7;
    color: #303431;
    font: 700 13px "Space Grotesk", sans-serif;
    letter-spacing: .02em;
    text-transform: uppercase;
    cursor: pointer;
    transition: border-color .2s ease, background .2s ease, color .2s ease
}

body.page-pre-sumula .pre-sumula-action-btn:hover {
    border-color: var(--metro-red);
    background: var(--metro-red);
    color: #fff
}

/* Botão de teste (PDF v2): contorno tracejado para deixar claro que é
   experimental, ainda ao lado do fluxo definitivo. */
body.page-pre-sumula .pre-sumula-action-btn--teste {
    border-style: dashed;
    border-color: #b9bcb9;
    background: #fff
}

body.page-pre-sumula .pre-sumula-action-btn--teste:hover {
    border-style: dashed
}

@media (max-width:620px) {
    body.page-pre-sumula .pre-sumula-action-row--pdf {
        grid-template-columns: 1fr
    }

    body.page-pre-sumula .technical-grid {
        grid-template-columns: 1fr
    }
}

/* Scout: mantém camisa, nome e posição alinhados na primeira coluna. */
body.page-scout .scout-table th.player-col,
body.page-scout .scout-table td:first-child {
    width: 240px;
    min-width: 240px;
}

body.page-scout .scout-table td:first-child .athlete {
    width: 100%;
    min-width: 0;
    justify-content: flex-start;
    text-align: left;
}

body.page-scout .scout-table td:first-child .athlete>div {
    flex: 1 1 auto;
    width: auto;
    min-width: 0;
    text-align: left;
}

body.page-scout .scout-table td:first-child .athlete-name,
body.page-scout .scout-table td:first-child .athlete-role {
    width: 100%;
    max-width: 100%;
    text-align: left;
    white-space: nowrap;
}

body.page-scout .scout-title {
    font-size: 22px;
    letter-spacing: normal;
    text-transform: none
}

body.page-scout .scout-subtitle {
    font-size: 13px
}

body.page-pre-sumula .pre-sumula-panel {
    padding: 22px
}

body.page-pre-sumula .field-group>input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]),
body.page-pre-sumula .field-group>select {
    font-size: 12px
}

body.page-pre-sumula .programacao-grid .field-label {
    color: var(--metro-text, #111);
    font-size: 13px;
    font-weight: 500;
    letter-spacing: 0;
    text-transform: uppercase
}

body.page-pre-sumula .section-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin: 28px 0 10px
}

body.page-pre-sumula .scout-panel-heading {
    margin-top: 0
}

body.page-pre-sumula .section-count {
    color: var(--metro-red);
    font-size: 12px;
    font-weight: 700
}

body.page-pre-sumula .include-row {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 10px
}

body.page-pre-sumula .include-row select {
    flex: 1;
    min-width: 0
}

body.page-pre-sumula .include-button {
    flex: 0 0 auto;
    height: 38px;
    padding: 0 15px;
    border: 0;
    border-radius: 999px;
    background: var(--metro-red);
    color: #fff;
    font: 700 11px "Space Grotesk", sans-serif;
    cursor: pointer
}

body.page-pre-sumula .pre-sumula-member-row .include-button {
    flex: 0 0 120px;
    width: 120px;
    padding-inline: 10px
}

body.page-pre-sumula .include-button:disabled {
    background: #ccc;
    cursor: not-allowed
}

body.page-pre-sumula .pre-sumula-table-wrap {
    overflow-x: auto;
    border: 1px solid #e4e4e4;
    border-radius: 18px
}

body.page-pre-sumula .pre-sumula-lineup-table {
    width: 100%;
    min-width: 520px;
    border-collapse: collapse;
    font-size: 11px
}

body.page-pre-sumula .pre-sumula-lineup-table th {
    padding: 7px 2px;
    background: #f4f4f4;
    color: #606060;
    font-size: 11px;
    letter-spacing: .01em;
    line-height: 1.15;
    text-align: center;
    text-transform: uppercase;
    white-space: nowrap
}

body.page-pre-sumula .pre-sumula-lineup-table th.player-col {
    min-width: 190px;
    width: 190px;
    text-align: center
}

body.page-pre-sumula .pre-sumula-lineup-table .player {
    display: table-row;
    width: auto;
    min-height: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: #fff
}

body.page-pre-sumula .pre-sumula-lineup-table td {
    padding: 7px 2px;
    border-top: 1px solid #ececec;
    text-align: center
}

body.page-pre-sumula .pre-sumula-lineup-table td:first-child {
    min-width: 190px;
    text-align: left
}

body.page-pre-sumula .pre-athlete-name {
    display: block;
    color: #111 !important;
    font-size: 12px;
    font-weight: 700
}

body.page-pre-sumula .pre-sumula-lineup-table tr.player.titular,
body.page-pre-sumula .pre-sumula-lineup-table tr.player.suplente {
    border: 0 !important;
    background: #fff !important
}

body.page-pre-sumula .pre-sumula-lineup-table small {
    display: block;
    margin-top: 2px;
    color: #777;
    font-size: 10px
}

body.page-pre-sumula .pre-sumula-lineup-table .pre-shirt-input {
    flex: 0 0 36px;
    width: 36px;
    height: 29px;
    padding: 3px;
    border: 1px solid var(--metro-red);
    border-radius: 8px;
    background: var(--metro-red);
    color: #fff !important;
    -webkit-text-fill-color: #fff;
    font: 700 11px "Space Grotesk", sans-serif;
    text-align: center;
    outline: none
}

body.page-pre-sumula .pre-sumula-lineup-table .pre-shirt-input::placeholder {
    color: rgba(255, 255, 255, .85)
}

body.page-pre-sumula .pre-sumula-lineup-table .pre-shirt-input:focus {
    box-shadow: 0 0 0 3px rgba(224, 32, 32, .12)
}

body.page-pre-sumula .pre-sumula-lineup-table label {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase
}

body.page-pre-sumula .pre-sumula-lineup-table input[type="checkbox"] {
    width: 16px;
    height: 16px;
    min-height: 0;
    padding: 0;
    accent-color: var(--metro-red)
}

body.page-pre-sumula .athlete-remove {
    padding: 5px 8px;
    border: 0;
    border-radius: 7px;
    background: var(--metro-red);
    color: #fff;
    font: 700 9px "Space Grotesk", sans-serif;
    cursor: pointer
}

/* Duas colunas por linha — reduz a altura total das listas de materiais e
   de comissão técnica sem perder a inclusão/remoção de cada item. */
body.page-pre-sumula .technical-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 8px
}

body.page-pre-sumula .technical-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    min-width: 0;
    padding: 9px 12px;
    border: 1px solid #ddd;
    border-radius: 14px;
    background: #fafafa
}

/* Cargo e nome (ou "Material" e o item) na mesma linha, como no resumo da
   pré-visualização. Especificidade reforçada com ".technical-card" na
   frente para vencer as regras legadas ".comissao-info"/".btn-remover"
   (mesmas classes que os cards de material/comissão também carregam). */
body.page-pre-sumula .technical-card .technical-info {
    display: flex;
    flex-direction: row;
    align-items: baseline;
    flex-wrap: wrap;
    min-width: 0
}

/* Mesmo tamanho/peso/cor do nome e da posição na escalação de atletas
   (.athlete-name / .athlete-role). */
body.page-pre-sumula .technical-card .technical-info .role {
    color: #777;
    font-size: 11px;
    font-weight: 600;
    white-space: nowrap
}

body.page-pre-sumula .technical-card .technical-info .role::after {
    content: " – ";
    color: #999;
    font-weight: 400
}

body.page-pre-sumula .technical-card .technical-info .name {
    min-width: 0;
    overflow: hidden;
    color: #171717;
    font-size: 10px;
    font-weight: 600;
    text-overflow: ellipsis;
    white-space: nowrap
}

/* Mesmo formato do botão "Remover" da escalação de atletas
   (.athlete-remove / .pre-athlete-remove). */
body.page-pre-sumula .technical-card .technical-remove {
    flex: 0 0 auto;
    padding: 5px 8px;
    border: 0;
    border-radius: 7px;
    background: var(--metro-red);
    color: #fff;
    font: 700 9px "Space Grotesk", sans-serif;
    cursor: pointer
}

/* Esquema Tático: seletor de formação + campo com os titulares da pré-súmula. */
body.page-pre-sumula .esquema-tatico-corpo {
    display: flex;
    flex-direction: column;
    gap: 16px
}

body.page-pre-sumula .esquema-tatico-opcoes {
    display: flex;
    flex-wrap: wrap;
    gap: 10px
}

body.page-pre-sumula .esquema-tatico-opcao {
    padding: 10px 18px;
    border: 1px solid #d9dcda;
    border-radius: 999px;
    background: #f7f8f7;
    color: #303431;
    font: 700 12px "Space Grotesk", sans-serif;
    letter-spacing: .02em;
    cursor: pointer;
    transition: border-color .2s ease, background .2s ease, color .2s ease
}

body.page-pre-sumula .esquema-tatico-opcao:hover {
    border-color: #abb1ad
}

body.page-pre-sumula .esquema-tatico-opcao.is-ativo {
    border-color: var(--metro-red);
    background: var(--metro-red);
    color: #fff
}

/* Três itens flex: suplentes (esquerda) / campo / espaço fantasma (direita)
   do mesmo tamanho da coluna dos suplentes. Como os dois têm flex-grow
   igual e base zero, absorvem igualmente o espaço sobrando e o campo (com
   base fixa de 375px) fica sempre centralizado no card; os suplentes ficam
   centralizados dentro do seu próprio espaço. */
body.page-pre-sumula .esquema-tatico-campo-wrap {
    display: flex;
    flex: 1;
    align-items: center;
    gap: 12px
}

/* Suplentes, à esquerda do campo, em duas colunas — mesma foto/fonte dos
   titulares em campo. */
body.page-pre-sumula .esquema-tatico-suplentes {
    display: grid;
    grid-template-columns: repeat(2, 58px);
    justify-content: center;
    flex: 1 1 0;
    gap: 12px 10px
}

body.page-pre-sumula .esquema-tatico-campo-espaco {
    flex: 1 1 0
}

body.page-pre-sumula .esquema-tatico-suplente-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
    width: 58px
}

body.page-pre-sumula .esquema-tatico-suplente-item .esquema-tatico-nome-label {
    color: #303431;
    text-shadow: none
}

body.page-pre-sumula .esquema-tatico-campo {
    position: relative;
    flex: 1 1 375px;
    width: 100%;
    max-width: 375px;
    aspect-ratio: 0.68 / 1;
    border-radius: 14px;
    overflow: hidden;
    background: repeating-linear-gradient(0deg, #147f38 0, #147f38 11%, #198b3e 11%, #198b3e 22%);
    border: 2px solid #fff;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .42), 0 6px 16px rgba(11, 82, 37, .14)
}

/* Linha de meio-campo e círculo central. */
body.page-pre-sumula .esquema-tatico-linha-meio {
    position: absolute;
    top: 50%;
    left: 0;
    width: 100%;
    height: 0;
    border-top: 1.5px solid rgba(255, 255, 255, .85)
}

body.page-pre-sumula .esquema-tatico-circulo {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 22%;
    aspect-ratio: 1 / 1;
    border: 1.5px solid rgba(255, 255, 255, .85);
    border-radius: 50%;
    transform: translate(-50%, -50%)
}

/* Grande área e pequena área, espelhadas nos dois fundos do campo. */
body.page-pre-sumula .esquema-tatico-area-grande {
    position: absolute;
    left: 50%;
    width: 64%;
    height: 18%;
    border: 1.5px solid rgba(255, 255, 255, .85);
    transform: translateX(-50%)
}

body.page-pre-sumula .esquema-tatico-area-grande--topo {
    top: 0;
    border-top: 0
}

body.page-pre-sumula .esquema-tatico-area-grande--base {
    bottom: 0;
    border-bottom: 0
}

body.page-pre-sumula .esquema-tatico-area-pequena {
    position: absolute;
    left: 50%;
    width: 32%;
    height: 7%;
    border: 1.5px solid rgba(255, 255, 255, .85);
    transform: translateX(-50%)
}

body.page-pre-sumula .esquema-tatico-area-pequena--topo {
    top: 0;
    border-top: 0
}

body.page-pre-sumula .esquema-tatico-area-pequena--base {
    bottom: 0;
    border-bottom: 0
}

/* Camada dos jogadores: sobrepõe as marcações e é a única recriada a cada
   troca de esquema (id="esquemaTaticoCampo", alvo do JS). */
body.page-pre-sumula .esquema-tatico-jogadores {
    position: absolute;
    inset: 0
}

body.page-pre-sumula .esquema-tatico-jogador {
    position: absolute;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
    width: 58px;
    transform: translate(-50%, -50%);
    z-index: 2
}

/* Jogadores reais podem ser arrastados dentro do campo para ajuste manual. */
body.page-pre-sumula .esquema-tatico-arrastavel {
    cursor: grab;
    touch-action: none;
    user-select: none
}

body.page-pre-sumula .esquema-tatico-arrastavel.is-arrastando {
    cursor: grabbing;
    z-index: 5
}

body.page-pre-sumula .esquema-tatico-arrastavel .esquema-tatico-foto img {
    pointer-events: none
}

body.page-pre-sumula .esquema-tatico-foto {
    position: relative;
    width: 45px;
    height: 45px;
    flex: 0 0 auto
}

body.page-pre-sumula .esquema-tatico-foto img {
    display: block;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    object-fit: cover;
    object-position: center top;
    background: #e6e6e6;
    border: 1.5px solid #fff;
    box-shadow: 0 3px 8px rgba(0, 0, 0, .28)
}

body.page-pre-sumula .esquema-tatico-jogador--vago .esquema-tatico-foto {
    border-radius: 50%;
    border: 1.5px dashed rgba(255, 255, 255, .7);
    background: rgba(255, 255, 255, .12)
}

body.page-pre-sumula .esquema-tatico-numero {
    position: absolute;
    right: -4px;
    bottom: -4px;
    display: flex;
    align-items: center;
    justify-content: center;
    min-width: 15px;
    height: 15px;
    padding: 0 2px;
    border: 1.5px solid #fff;
    border-radius: 999px;
    background: var(--metro-red);
    color: #fff;
    font: 700 8px "Space Grotesk", sans-serif;
    line-height: 1
}

body.page-pre-sumula .esquema-tatico-nome-label {
    max-width: 100%;
    overflow: hidden;
    color: #fff;
    font: 700 7px "Space Grotesk", sans-serif;
    letter-spacing: .01em;
    text-align: center;
    text-shadow: 0 1px 2px rgba(0, 0, 0, .55);
    text-overflow: ellipsis;
    text-transform: uppercase;
    white-space: nowrap;
    line-height: 1.2
}

body.page-pre-sumula .esquema-tatico-jogador--vago .esquema-tatico-nome-label {
    opacity: .75;
    font-style: italic
}

/* Foto do treinador, fixa no canto inferior direito do campo. */
body.page-pre-sumula .esquema-tatico-treinador {
    position: absolute;
    right: 6px;
    bottom: 6px;
    width: 54px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
    z-index: 3
}

body.page-pre-sumula .esquema-tatico-treinador img {
    display: block;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    object-fit: cover;
    object-position: top center;
    border: 2px solid #fff;
    box-shadow: 0 3px 10px rgba(0, 0, 0, .35)
}

/* Programação Bola Parada: mini-campos decorativos + seleção de atletas por função. */
body.page-pre-sumula .bp-grupo {
    margin-top: 18px
}

body.page-pre-sumula .bp-grupo:first-of-type {
    margin-top: 0
}

body.page-pre-sumula .bp-grupo-titulo {
    margin: 0 0 12px;
    color: var(--metro-text, #111);
    font-size: 14px;
    font-weight: 700;
    letter-spacing: .02em;
    text-transform: uppercase
}

body.page-pre-sumula .bp-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(253px, 1fr));
    justify-content: stretch;
    gap: 20px;
    overflow: visible;
    padding: 4px 3px 14px
}

body.page-pre-sumula .bp-grupo + .bp-grupo .bp-grid {
    grid-template-columns: repeat(2, minmax(253px, 1fr))
}

body.page-pre-sumula .bp-situacao {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 22px;
    min-width: 0;
    padding: 8px;
    border: 1px solid transparent;
    border-radius: 18px;
    background: transparent;
    transition: border-color .2s ease, box-shadow .2s ease, transform .2s ease
}

body.page-pre-sumula .bp-situacao.is-open {
    grid-column: 1 / -1;
    justify-content: flex-start;
    align-items: flex-start;
    padding: 18px;
    border-color: rgba(201, 20, 35, .35);
    background: #fff;
    box-shadow: 0 12px 30px rgba(21, 31, 26, .08)
}

body.page-pre-sumula .bp-situacao.is-open .bp-field-summary {
    flex: 0 0 239px;
    width: 239px
}

body.page-pre-sumula .bp-situacao-body {
    display: none;
    flex: 1;
    min-width: 0;
    flex-direction: column;
    gap: 8px
}

body.page-pre-sumula .bp-situacao.is-open .bp-situacao-body {
    display: flex
}

body.page-pre-sumula .bp-field-summary {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    width: 100%;
    min-width: 0;
    cursor: pointer
}

body.page-pre-sumula .bp-field-summary:focus-visible {
    outline: 2px solid var(--metro-red);
    outline-offset: 3px;
    border-radius: 12px
}

body.page-pre-sumula .bp-field-caption {
    color: #252826;
    font-size: 10.5px;
    font-weight: 700;
    line-height: 1.25;
    text-align: center;
    text-transform: uppercase;
    white-space: nowrap
}

body.page-pre-sumula .bp-situacao.is-open .bp-field-caption {
    display: none
}

body.page-pre-sumula .bp-situacao-titulo {
    margin: 0;
    color: #111;
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase
}

body.page-pre-sumula .bp-role {
    display: flex;
    flex-direction: column;
    gap: 7px
}

body.page-pre-sumula .bp-role label {
    color: #666;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase
}

body.page-pre-sumula .bp-role select {
    width: 100%
}

body.page-pre-sumula .bp-native-select {
    display: none
}

body.page-pre-sumula .bp-inline-options {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
    gap: 7px;
    width: 100%;
    max-height: 220px;
    overflow-y: auto;
    padding: 2px
}

body.page-pre-sumula .bp-inline-player {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    min-height: 38px;
    padding: 8px 10px;
    border: 1px solid #e0e3e1;
    border-radius: 10px;
    background: #f8f9f8;
    color: #303431;
    font: 700 10px "Space Grotesk", sans-serif;
    text-align: left;
    text-transform: uppercase;
    cursor: pointer
}

body.page-pre-sumula .bp-inline-player:hover {
    border-color: #abb1ad;
    background: #fff
}

body.page-pre-sumula .bp-inline-player.is-selected {
    border-color: #17833d;
    background: #edf8f0;
    color: #155d2c
}

body.page-pre-sumula .bp-inline-check {
    color: transparent;
    font-size: 14px
}

body.page-pre-sumula .bp-inline-player.is-selected .bp-inline-check {
    color: #17833d
}

body.page-pre-sumula .bp-inline-empty {
    grid-column: 1 / -1;
    padding: 14px;
    border-radius: 10px;
    background: #f5f6f5;
    color: #747975;
    font-size: 11px;
    text-align: center
}

body.page-pre-sumula .bp-picker-trigger {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    width: 100%;
    min-width: 0;
    min-height: 44px;
    padding: 10px 12px 10px 14px;
    border: 1px solid #d9dcda;
    border-radius: 12px;
    background: #f7f8f7;
    color: #747875;
    font: 600 12px "Space Grotesk", sans-serif;
    text-align: left;
    cursor: pointer;
    transition: border-color .2s ease, background .2s ease, color .2s ease
}

body.page-pre-sumula .bp-picker-trigger:hover,
body.page-pre-sumula .bp-picker-trigger:focus-visible {
    outline: none;
    border-color: var(--metro-red);
    background: #fff;
    color: #161817
}

body.page-pre-sumula .bp-picker-trigger.is-filled {
    border-color: rgba(18, 132, 59, .3);
    background: #f2faf4;
    color: #155d2c
}

body.page-pre-sumula .bp-picker-value {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

body.page-pre-sumula .bp-picker-chevron {
    flex: 0 0 auto;
    color: var(--metro-red);
    font-size: 22px;
    line-height: 1
}

body.page-pre-sumula .bp-role--multi .bp-role-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px
}

body.page-pre-sumula .bp-role--multi .include-row {
    display: block;
    margin-bottom: 8px
}

body.page-pre-sumula .bp-role--multi .technical-grid {
    display: none;
    flex-wrap: wrap;
    gap: 5px
}

body.page-pre-sumula .bp-role--multi .technical-card {
    gap: 6px;
    padding: 5px 8px;
    border: 0;
    border-radius: 999px;
    background: #eef5f0
}

body.page-pre-sumula .bp-role--multi .technical-info .name {
    margin: 0;
    color: #235c34;
    font-size: 9px
}

body.page-pre-sumula .bp-role--multi .technical-remove {
    padding: 0;
    background: transparent;
    color: var(--metro-red);
    font-size: 0
}

body.page-pre-sumula .bp-role--multi .technical-remove::after {
    content: "×";
    font-size: 14px
}

/* Mini-campo: mesma linguagem visual do gramado listrado usado no
   planejador de treinos, só que fixo (sem drag) e recortado por cena. */
body.page-pre-sumula .bp-field {
    position: relative;
    align-self: center;
    flex: 0 0 auto;
    width: 225px;
    aspect-ratio: 1.5 / 1;
    border-radius: 12px;
    overflow: hidden;
    background: repeating-linear-gradient(0deg, #147f38 0, #147f38 12.5%, #198b3e 12.5%, #198b3e 25%);
    border: 2px solid #fff;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .42), 0 6px 16px rgba(11, 82, 37, .14);
    cursor: pointer;
    transition: transform .2s ease, box-shadow .2s ease
}

body.page-pre-sumula .bp-field::before,
body.page-pre-sumula .bp-field::after {
    content: "";
    position: absolute;
    z-index: 1;
    top: 0;
    width: 13%;
    height: 19%;
    border: 1.5px solid #fff;
    border-top: 0;
    pointer-events: none
}

body.page-pre-sumula .bp-field::before {
    left: 0;
    border-left: 0;
    border-radius: 0 0 100% 0
}

body.page-pre-sumula .bp-field::after {
    right: 0;
    border-right: 0;
    border-radius: 0 0 0 100%
}

body.page-pre-sumula .bp-field--corner>.bp-arc {
    display: none
}

body.page-pre-sumula .bp-field:hover,
body.page-pre-sumula .bp-field-summary:focus-visible .bp-field {
    outline: none;
    transform: translateY(-3px);
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .5), 0 10px 22px rgba(11, 82, 37, .24)
}

body.page-pre-sumula .bp-situacao.is-open .bp-field {
    transform: none;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .5), 0 5px 14px rgba(11, 82, 37, .16)
}

body.bp-picker-open {
    overflow: hidden
}

body.page-pre-sumula .bp-picker-backdrop {
    position: fixed;
    inset: 0;
    z-index: 1200;
    display: grid;
    place-items: center;
    padding: 20px;
    background: rgba(12, 18, 15, .56);
    backdrop-filter: blur(4px)
}

body.page-pre-sumula .bp-picker-backdrop[hidden] {
    display: none
}

body.page-pre-sumula .bp-picker-dialog {
    width: min(100%, 480px);
    max-height: min(680px, calc(100vh - 40px));
    display: flex;
    flex-direction: column;
    padding: 22px;
    border-radius: 22px;
    background: #fff;
    box-shadow: 0 28px 80px rgba(0, 0, 0, .25)
}

body.page-pre-sumula .bp-picker-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 18px
}

body.page-pre-sumula .bp-picker-title {
    margin: 0;
    color: #151716;
    font-size: 20px
}

body.page-pre-sumula .bp-picker-support {
    margin: 5px 0 0;
    color: #727773;
    font-size: 12px
}

body.page-pre-sumula .bp-picker-close {
    width: 36px;
    height: 36px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: #f0f1f0;
    color: #252826;
    font-size: 25px;
    line-height: 1;
    cursor: pointer
}

body.page-pre-sumula .bp-picker-list {
    min-height: 90px;
    overflow-y: auto;
    display: grid;
    gap: 8px;
    padding-right: 3px
}

body.page-pre-sumula .bp-player-option {
    display: grid;
    grid-template-columns: 38px 1fr 24px;
    align-items: center;
    gap: 11px;
    width: 100%;
    min-height: 54px;
    padding: 8px 12px;
    border: 1px solid #e2e4e3;
    border-radius: 14px;
    background: #fff;
    color: #252826;
    font: 700 13px "Space Grotesk", sans-serif;
    text-align: left;
    cursor: pointer
}

body.page-pre-sumula .bp-player-option:hover {
    border-color: #b7bcb9;
    background: #fafbfa
}

body.page-pre-sumula .bp-player-option.is-selected {
    border-color: #17833d;
    background: #f0faf3;
    color: #145c2c
}

body.page-pre-sumula .bp-player-initial {
    display: grid;
    place-items: center;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: #edf0ee;
    color: #353936
}

body.page-pre-sumula .bp-player-option.is-selected .bp-player-initial {
    background: #17833d;
    color: #fff
}

body.page-pre-sumula .bp-player-check {
    color: transparent;
    font-size: 17px;
    text-align: center
}

body.page-pre-sumula .bp-player-option.is-selected .bp-player-check {
    color: #17833d
}

body.page-pre-sumula .bp-picker-empty {
    margin: 0;
    padding: 22px;
    border-radius: 14px;
    background: #f6f7f6;
    color: #686d69;
    font-size: 13px;
    line-height: 1.5;
    text-align: center
}

body.page-pre-sumula .bp-picker-done {
    min-height: 44px;
    margin-top: 16px;
    border: 0;
    border-radius: 999px;
    background: var(--metro-red);
    color: #fff;
    font: 700 12px "Space Grotesk", sans-serif;
    cursor: pointer
}

body.page-pre-sumula .bp-field .bp-goal {
    position: absolute;
    top: 0;
    border: 1.5px solid #fff;
    border-top: 0
}

body.page-pre-sumula .bp-field--corner .bp-goal {
    left: 41%;
    width: 18%;
    height: 9%
}

body.page-pre-sumula .bp-field--falta .bp-goal,
body.page-pre-sumula .bp-field--penalty .bp-goal {
    left: 41%;
    width: 18%;
    height: 9%
}

body.page-pre-sumula .bp-field--corner .bp-box,
body.page-pre-sumula .bp-field--falta .bp-box,
body.page-pre-sumula .bp-field--penalty .bp-box {
    position: absolute;
    top: 0;
    left: 24%;
    width: 52%;
    height: 30%;
    border: 1.5px solid #fff;
    border-top: 0
}

body.page-pre-sumula .bp-field--corner .bp-arc {
    position: absolute;
    top: 0;
    width: 13%;
    height: 19%;
    border: 1.5px solid #fff;
    border-top: 0
}

body.page-pre-sumula .bp-field--corner.bp-field--right .bp-arc {
    right: 0;
    border-right: 0;
    border-radius: 0 0 0 100%
}

body.page-pre-sumula .bp-field--corner.bp-field--left .bp-arc {
    left: 0;
    border-left: 0;
    border-radius: 0 0 100% 0
}

body.page-pre-sumula .bp-field--corner .bp-ball {
    position: absolute;
    top: 3%;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 0 0 1px #333
}

body.page-pre-sumula .bp-field--corner.bp-field--right .bp-ball {
    right: 3%
}

body.page-pre-sumula .bp-field--corner.bp-field--left .bp-ball {
    left: 3%
}

body.page-pre-sumula .bp-field--falta .bp-wall {
    position: absolute;
    top: 43%;
    display: flex;
    gap: 3px
}

body.page-pre-sumula .bp-field--falta.bp-field--right .bp-wall {
    left: 57%
}

body.page-pre-sumula .bp-field--falta.bp-field--left .bp-wall {
    left: 22%
}

body.page-pre-sumula .bp-field--falta .bp-wall span {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: #fff
}

body.page-pre-sumula .bp-field--falta .bp-ball {
    position: absolute;
    top: 72%;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 0 0 1px #333
}

body.page-pre-sumula .bp-field--falta.bp-field--right .bp-ball {
    right: 8%
}

body.page-pre-sumula .bp-field--falta.bp-field--left .bp-ball {
    left: 8%
}

body.page-pre-sumula .bp-field--penalty .bp-spot {
    position: absolute;
    top: 26%;
    left: calc(50% - 3.5px);
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 0 0 1px #333
}

body.page-pre-sumula .bp-field--penalty .bp-arc {
    position: absolute;
    top: 26%;
    left: 40%;
    width: 20%;
    height: 16%;
    border: 1.5px solid #fff;
    border-top: 0;
    border-radius: 0 0 50% 50% / 0 0 100% 100%
}

@media (max-width: 460px) {
    body.page-pre-sumula .bp-situacao {
        flex-direction: column;
        align-items: flex-start
    }

    body.page-pre-sumula .bp-situacao.is-open {
        flex-direction: column
    }

    body.page-pre-sumula .bp-situacao.is-open .bp-field-summary {
        flex-basis: auto;
        width: 100%
    }
}

@media (max-width: 760px) {
    body.page-pre-sumula .bp-grid {
        grid-template-columns: repeat(2, 253px);
        min-width: max-content;
        overflow-x: auto
    }

    body.page-pre-sumula .bp-grupo + .bp-grupo .bp-grid {
        grid-template-columns: repeat(2, 253px)
    }
}

body.page-scout .form-title {
    font-size: 22px;
    font-weight: 700
}

body.page-scout .form-subtitle {
    margin-bottom: 8px;
    color: var(--metro-muted);
    font-size: 13px
}

body.page-scout .form-subtitle p {
    margin: 0
}

body.page-scout .form-actions {
    margin-top: 18px
}

/* Recuo interno compartilhado entre o perfil e os cards operacionais. */
body.page-scout .scout-panel,
body.page-pre-sumula .pre-sumula-panel {
    padding: 32px;
}

@media (max-width: 460px) {

    body.page-scout .scout-panel,
    body.page-pre-sumula .pre-sumula-panel {
        padding: 24px;
    }
}

body.page-pre-sumula .form-title {
    font-size: 22px;
    font-weight: 700
}

body.page-pre-sumula .form-subtitle {
    margin-bottom: 8px;
    color: var(--metro-muted);
    font-size: 13px
}

body.page-pre-sumula .section-label {
    margin-top: 8px;
    color: var(--metro-muted);
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase
}

body.page-pre-sumula .field-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px
}

body.page-pre-sumula .field-group {
    flex: 1;
    display: flex;
    flex-direction: column
}

body.page-pre-sumula .field-group select {
    height: 40px;
    box-sizing: border-box
}

body.page-pre-sumula select,
body.page-pre-sumula input {
    height: 40px;
    padding: 6px 12px;
    border: 1px solid #d5d5d5;
    border-radius: 999px;
    font-size: 12px
}

body.page-pre-sumula select.campo-invalido,
body.page-pre-sumula input.campo-invalido {
    border-color: #e02020 !important;
    background: #fff1f1
}

body.page-pre-sumula #competicao,
body.page-pre-sumula #rodada,
body.page-pre-sumula #comissaoSelect {
    width: 100%
}

body.page-pre-sumula #comissaoSelect {
    width: 100%;
    height: 40px;
    padding: 6px 12px;
    font-size: 12px
}

body.page-pre-sumula .players-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 8px;
    width: 100%
}

body.page-pre-sumula .player {
    width: 100%;
    min-width: 0;
    min-height: 48px;
    display: grid;
    grid-template-columns: 72px minmax(120px, 1fr) 82px 82px 108px;
    align-items: center;
    gap: 8px;
    padding: 7px 10px;
    border: 1px solid #ddd;
    border-radius: 14px;
    background: #fff;
    font-size: 12px
}

body.page-pre-sumula .player span {
    min-width: 0;
    overflow: hidden;
    font-weight: 600;
    text-overflow: ellipsis;
    white-space: nowrap
}

body.page-pre-sumula .player label {
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
    color: #555;
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    white-space: nowrap
}

body.page-pre-sumula .player input[type="checkbox"] {
    flex: 0 0 auto;
    width: 16px;
    height: 16px;
    min-height: 0;
    margin: 0;
    padding: 0;
    accent-color: var(--metro-red)
}

body.page-pre-sumula .player input[type="text"] {
    width: 100%;
    height: 32px;
    padding: 4px 8px;
    border: 1px solid #d5d5d5;
    border-radius: 9px;
    font-size: 11px;
    font-weight: 600;
    text-align: center
}

body.page-pre-sumula .player select {
    width: 100%;
    height: 32px;
    padding: 4px 28px 4px 8px;
    border: 1px solid #d5d5d5;
    border-radius: 9px;
    font-size: 11px;
    text-align: center;
    text-align-last: center
}

body.page-pre-sumula .player.titular {
    border: 2px solid #e02020;
    background: rgba(224, 32, 32, 0.05)
}

body.page-pre-sumula .player.titular input[type="text"],
body.page-pre-sumula .player.titular select {
    color: #e02020;
    font-weight: 700
}

body.page-pre-sumula .player.suplente {
    border: 2px solid #999;
    background: #f7f7f7
}

body.page-pre-sumula .player.suplente input[type="text"],
body.page-pre-sumula .player.suplente select {
    color: #000;
    font-weight: 700
}

body.page-pre-sumula .counter {
    color: #777;
    font-size: 13px
}

body.page-pre-sumula .btn-submit {
    width: 240px;
    align-self: center;
    padding: 11px 26px;
    border: none;
    border-radius: 999px;
    background: var(--metro-red);
    color: #fff;
    font-weight: 600;
    cursor: pointer
}

body.page-pre-sumula .sumula-box {
    margin-top: 10px;
    padding: 18px;
    border: 1px solid #eee;
    border-radius: 20px;
    background: #fafafa;
    font-family: "Space Grotesk", sans-serif;
    font-size: 15px;
    line-height: 1.6
}

/* Pré-Súmula: um único ritmo vertical controla todos os cards. */
body.page-pre-sumula .pre-sumula-panel {
    gap: 18px;
}

body.page-pre-sumula .pre-sumula-intro {
    display: flex;
    flex-direction: column;
    gap: 18px;
}

body.page-pre-sumula .pre-sumula-intro>div:last-child {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

body.page-pre-sumula .section-label,
body.page-pre-sumula .section-heading,
body.page-pre-sumula .include-row,
body.page-pre-sumula .sumula-box,
body.page-pre-sumula .form-actions {
    margin: 0;
}

body.page-pre-sumula #players {
    display: flex;
    min-width: 0;
    flex-direction: column;
    gap: 18px;
}

body.page-pre-sumula .section-heading {
    min-height: 18px;
}

body.page-pre-sumula .technical-grid {
    margin: 0;
}

body.page-pre-sumula .sumula-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px
}

body.page-pre-sumula .sumula-col {
    padding: 18px 20px;
    border: 1px solid #e6e6e6;
    border-radius: 18px;
    background: #fff;
    font-family: "Space Grotesk", sans-serif;
    font-size: 13px;
    line-height: 1.6
}

/* Comissão técnica: sub-card único, com a largura dos cards de titulares e
   suplentes somados, e o mesmo espaçamento vertical (um nome embaixo do
   outro) usado na coluna de titulares. */
body.page-pre-sumula .sumula-col--comissao {
    grid-column: 1 / -1
}

body.page-pre-sumula .sumula-col h4 {
    margin-bottom: 10px;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 0.3px
}

body.page-pre-sumula .sumula-col div {
    font-size: 16px;
    font-weight: 500
}

body.page-pre-sumula .comissao-card {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 6px;
    padding: 12px 14px;
    border: 1px solid #ddd;
    border-radius: 14px;
    background: #fafafa;
    font-size: 14px
}

body.page-pre-sumula .comissao-card span {
    font-weight: 500
}

body.page-pre-sumula .btn-remover {
    padding: 6px 10px;
    border: none;
    border-radius: 8px;
    background: var(--metro-red);
    color: #fff;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer
}

body.page-pre-sumula .btn-remover:hover {
    background: #e02020;
    color: white
}

body.page-pre-sumula .comissao-info {
    display: flex;
    flex-direction: column;
    line-height: 1.2
}

body.page-pre-sumula .comissao-info .cargo {
    color: #666;
    font-size: 13px;
    font-weight: 500
}

body.page-pre-sumula .comissao-info .nome {
    font-size: 13px;
    font-weight: 700
}

body.page-pre-sumula .toast-erro {
    position: fixed;
    top: 20px;
    right: 20px;
    z-index: 9999;
    padding: 14px 18px;
    border-radius: 10px;
    background: #e02020;
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15);
    opacity: 0;
    transform: translateY(-10px);
    transition: all 0.3s ease
}

body.page-pre-sumula .toast-erro.show {
    opacity: 1;
    transform: translateY(0)
}

body.page-pre-sumula .sumula-icone {
    margin-left: 4px;
    color: #e02020;
    font-weight: 700
}

body.page-pre-sumula .form-wrapper {
    display: flex
}

body.page-pre-sumula .field-label {
    font-size: 13px;
    font-weight: 500
}

body.page-pre-sumula .contador-atual {
    color: #e02020;
    font-weight: 700
}

body.page-pre-sumula .contador-max {
    color: #000;
    font-weight: 700
}

body.page-pre-sumula .campos-dinamicos {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px
}

body.page-pre-sumula .campos-dinamicos .field-group {
    width: 100%
}

body.page-pre-sumula .linha-dupla {
    display: flex;
    align-items: stretch;
    gap: 10px
}

body.page-pre-sumula .linha-dupla select {
    width: 100%
}

body.page-pre-sumula .programacao-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px
}

body.page-pre-sumula .programacao-grid .field-group {
    display: flex;
    flex-direction: column;
    width: 100%
}

body.page-pre-sumula .programacao-grid .field-group.full {
    grid-column: 1 / -1
}

body.page-pre-sumula .programacao-grid label {
    margin-bottom: 6px;
    font-size: 13px;
    font-weight: 500;
    font-family: "Space Grotesk", sans-serif;
    color: #000
}

body.page-pre-sumula .programacao-grid input {
    width: 100%;
    height: 40px;
    padding: 6px 12px;
    border: 1px solid #d5d5d5;
    border-radius: 999px;
    font-size: 12px;
    font-family: "Space Grotesk", sans-serif
}

body.page-pre-sumula .footer {
    margin-top: 8px;
    text-align: center
}

body.page-pre-sumula .footer-main {
    margin: 0;
    color: #666;
    font-size: 14px
}

body.page-pre-sumula .footer-sub {
    margin-top: 4px;
    color: #999;
    font-size: 11px;
    line-height: 1.4
}

body.page-pre-sumula #mensagemErro {
    display: none;
    margin-top: 6px;
    padding: 10px 14px;
    border: 1px solid #ffb3b3;
    border-radius: 10px;
    background: #ffe9e9;
    color: #b30000;
    font-size: 13px
}

@media (max-width:900px) {
    body.page-pre-sumula .page {
        grid-template-columns: 1fr
    }
}

@media (max-width:850px) {
    body.page-pre-sumula #profile-card-container {
        min-width: auto
    }
}

@media (max-width:620px) {
    body.page-pre-sumula {
        padding-inline: 8px
    }

    body.page-pre-sumula .form-card {
        gap: 14px
    }

    body.page-pre-sumula .pre-sumula-panel {
        padding: 32px;
        border-radius: 20px
    }

    body.page-pre-sumula .field-row,
    body.page-pre-sumula .programacao-grid {
        grid-template-columns: 1fr
    }

    body.page-pre-sumula .programacao-grid .field-group.full {
        grid-column: auto
    }

    body.page-pre-sumula .linha-dupla {
        flex-direction: column
    }

    body.page-pre-sumula .player {
        min-height: 72px;
        grid-template-columns: 72px minmax(0, 1fr) 104px;
        grid-template-areas: "camisa nome funcao" "capitao goleiro goleiro";
        row-gap: 8px
    }

    body.page-pre-sumula .player>input[type="text"] {
        grid-area: camisa
    }

    body.page-pre-sumula .player>span {
        grid-area: nome
    }

    body.page-pre-sumula .player>label:first-of-type {
        grid-area: capitao;
        justify-content: flex-start
    }

    body.page-pre-sumula .player>label:last-of-type {
        grid-area: goleiro;
        justify-content: flex-start
    }

    body.page-pre-sumula .player>select {
        grid-area: funcao
    }

    body.page-pre-sumula .sumula-grid {
        grid-template-columns: 1fr
    }

    body.page-pre-sumula .form-actions {
        flex-wrap: wrap
    }
}

body.page-pre-treino {
    --metro-red: #E02020;
    --metro-text: #111;
    --metro-muted: #777
}

body.page-pre-treino * {
    box-sizing: border-box;
    margin: 0;
    padding: 0
}

body.page-pre-treino {
    font-family: "Space Grotesk", sans-serif;
    background: #fff;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    padding: 32px 16px 24px
}

body.page-pre-treino .page {
    flex: 1;
    width: 100%;
    max-width: 1120px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 420px 1fr;
    gap: 40px;
    align-items: flex-start
}

body.page-pre-treino #profile-card-container {
    min-width: 420px
}

body.page-pre-treino .form-wrapper {
    display: flex
}

body.page-pre-treino .form-card {
    background: #fff;
    border-radius: 28px;
    padding: 24px;
    box-shadow: 0 14px 35px rgba(0, 0, 0, 0.06);
    border: 1px solid rgba(0, 0, 0, 0.08);
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 18px
}

body.page-pre-treino .form-title {
    font-size: 22px;
    font-weight: 700
}

body.page-pre-treino .form-subtitle {
    font-size: 13px;
    color: var(--metro-muted);
    margin-bottom: 8px
}

body.page-pre-treino .section-label {
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    color: var(--metro-muted);
    margin-top: 8px;
    font-weight: 700
}

body.page-pre-treino .field-group {
    display: flex;
    flex-direction: column;
    gap: 6px;
    width: 100%
}

body.page-pre-treino .field-label {
    font-size: 13px;
    font-weight: 500
}

body.page-pre-treino select,
body.page-pre-treino input[type="date"] {
    width: 100%;
    border-radius: 999px;
    border: 1px solid #d5d5d5;
    padding: 10px 14px;
    font-size: 14px;
    outline: none;
    background: #fff;
    color: var(--metro-text)
}

body.page-pre-treino select:focus,
body.page-pre-treino input[type="date"]:focus {
    border-color: var(--metro-red);
    box-shadow: 0 0 0 1px rgba(224, 32, 32, 0.08)
}

body.page-pre-treino .required {
    color: var(--metro-red)
}

body.page-pre-treino .terms-wrapper {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-top: 4px
}

body.page-pre-treino .term-item {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-size: 14px;
    line-height: 1.5
}

body.page-pre-treino .term-item input[type="radio"] {
    margin-top: 3px;
    accent-color: var(--metro-red)
}

body.page-pre-treino .form-footer {
    display: flex;
    justify-content: flex-end
}

body.page-pre-treino .btn-submit {
    padding: 11px 26px;
    border-radius: 999px;
    border: none;
    background: var(--metro-red);
    color: #fff;
    font-weight: 600;
    cursor: pointer;
    transition: 0.15s
}

body.page-pre-treino .btn-submit:hover {
    transform: translateY(-1px);
    box-shadow: 0 10px 25px rgba(224, 32, 32, 0.35);
    background: #c01818
}

body.page-pre-treino .label-extremo {
    font-size: 12px;
    font-weight: 700
}

body.page-pre-treino .question-image {
    width: 100%;
    max-width: 420px;
    margin: 10px auto 15px;
    display: block;
    border-radius: 12px
}

body.page-pre-treino .scale-row {
    display: flex;
    justify-content: space-between;
    gap: 8px;
    margin-top: 8px;
    flex-wrap: wrap
}

body.page-pre-treino .scale-row label {
    display: flex;
    flex-direction: column;
    align-items: center;
    font-size: 12px
}

body.page-pre-treino .dor-grid {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 8px;
    margin-top: 10px
}

body.page-pre-treino .dor-grid input {
    display: none
}

body.page-pre-treino .dor-grid label {
    border: 1px solid #ccc;
    border-radius: 10px;
    padding: 8px;
    text-align: center;
    cursor: pointer;
    font-size: 13px;
    transition: 0.2s
}

body.page-pre-treino .dor-grid label:hover {
    border-color: #E02020
}

body.page-pre-treino .dor-grid input:checked+span {
    color: #fff;
    background: #E02020;
    padding: 4px 8px;
    border-radius: 6px
}

body.page-pre-treino .input-textarea {
    width: 100%;
    height: 36px;
    border-radius: 999px;
    border: 1px solid #d5d5d5;
    padding: 6px 16px;
    font-size: 14px;
    outline: none;
    resize: none;
    font-family: "Space Grotesk", sans-serif;
    overflow: hidden;
    line-height: 1.2
}

body.page-pre-treino .input-textarea:focus {
    border-color: #E02020;
    box-shadow: 0 0 0 2px rgba(224, 32, 32, 0.08)
}

body.page-pre-treino .modal-backdrop {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.4);
    display: none;
    align-items: center;
    justify-content: center;
    z-index: 999
}

body.page-pre-treino .modal {
    background: #fff;
    border-radius: 20px;
    padding: 24px;
    max-width: 360px;
    width: 90%;
    text-align: center
}

body.page-pre-treino .modal-title {
    font-weight: 700;
    font-size: 18px;
    margin-bottom: 10px
}

body.page-pre-treino .modal-text {
    font-size: 14px;
    color: #555;
    margin-bottom: 20px
}

body.page-pre-treino .btn-modal {
    background: #E02020;
    color: #fff;
    border: none;
    padding: 10px 20px;
    border-radius: 999px;
    cursor: pointer
}

body.page-pre-treino .section-divider-strong {
    height: 1px;
    width: 100%;
    border: none;
    background-color: #E02020;
    margin: 24px 0 12px
}

body.page-pre-treino .footer {
    text-align: center;
    margin-top: 8px
}

body.page-pre-treino .footer-main {
    font-size: 14px;
    color: #666;
    margin: 0
}

body.page-pre-treino .footer-sub {
    font-size: 11px;
    color: #999;
    margin-top: 4px;
    line-height: 1.4
}

body.page-frequencia .frequencia-status {
    min-height: 18px;
    margin: 4px 0 14px;
    color: var(--metro-muted);
    font-size: 12px
}

body.page-frequencia .frequencia-status.is-erro {
    color: var(--metro-red)
}

body.page-frequencia .frequencia-lista-wrapper[hidden] {
    display: none
}

body.page-frequencia .frequencia-lista-cabecalho {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 10px;
    color: var(--metro-muted);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .03em;
    text-transform: uppercase
}

body.page-frequencia .frequencia-botao-rapido {
    padding: 6px 12px;
    border: 1px solid var(--metro-border);
    border-radius: 999px;
    background: #fff;
    color: var(--metro-text);
    font: 700 11px "Space Grotesk", sans-serif;
    text-transform: none;
    letter-spacing: normal;
    cursor: pointer
}

body.page-frequencia .frequencia-botao-rapido:hover {
    border-color: var(--metro-red);
    color: var(--metro-red)
}

body.page-frequencia .frequencia-lista {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-bottom: 22px
}

body.page-frequencia .frequencia-atleta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 10px;
    padding: 10px 14px;
    border: 1px solid var(--metro-border);
    border-radius: 14px;
    background: #fff
}

body.page-frequencia .frequencia-atleta-nome {
    font-size: 13px;
    font-weight: 700
}

body.page-frequencia .frequencia-atleta-opcoes {
    display: flex;
    flex-wrap: wrap;
    gap: 8px
}

body.page-frequencia .frequencia-motivo {
    display: flex;
    flex: 1 0 100%;
    flex-direction: column;
    gap: 5px
}

body.page-frequencia .frequencia-motivo[hidden] {
    display: none
}

body.page-frequencia .frequencia-motivo span {
    color: var(--metro-muted);
    font-size: 11px;
    font-weight: 700
}

body.page-frequencia .frequencia-motivo input {
    width: 100%;
    padding: 9px 11px;
    border: 1px solid var(--metro-border);
    border-radius: 10px;
    font: 500 12px "Space Grotesk", sans-serif
}

body.page-frequencia .frequencia-motivo input:focus {
    border-color: var(--metro-red);
    outline: none
}

body.page-frequencia .frequencia-opcao {
    position: relative
}

body.page-frequencia .frequencia-opcao input {
    position: absolute;
    opacity: 0;
    pointer-events: none
}

body.page-frequencia .frequencia-opcao span {
    display: inline-flex;
    padding: 6px 12px;
    border: 1px solid var(--metro-border);
    border-radius: 999px;
    color: #666;
    font-size: 11px;
    font-weight: 700;
    cursor: pointer;
    white-space: nowrap
}

body.page-frequencia .frequencia-opcao-presente input:checked+span {
    border-color: #237a3b;
    background: #e8f5ec;
    color: #237a3b
}

body.page-frequencia .frequencia-opcao-atrasado input:checked+span {
    border-color: #8a6511;
    background: #fff5d9;
    color: #8a6511
}

body.page-frequencia .frequencia-opcao-ausente input:checked+span {
    border-color: #b42318;
    background: #fdeaea;
    color: #b42318
}

body.page-frequencia .form-footer {
    justify-content: center
}

@media (max-width:900px) {
    body.page-pre-treino .page {
        grid-template-columns: 1fr
    }

    body.page-pre-treino #profile-card-container {
        min-width: auto
    }
}

body.page-notificacoes .form-wrapper {
    flex-direction: column;
    gap: 24px
}

body.page-notificacoes select:disabled {
    background: #f2f2f4;
    color: #999;
    cursor: not-allowed
}

body.page-notificacoes .dash-aviso-editor-toolbar {
    position: relative;
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-bottom: 8px
}

body.page-notificacoes .dash-aviso-editor-toolbar>button,
body.page-notificacoes .dash-aviso-emoji-opcoes button {
    border: 1px solid var(--metro-border);
    border-radius: 9px;
    padding: 7px 10px;
    background: #fff;
    color: var(--metro-text);
    font: inherit;
    font-size: 12px;
    cursor: pointer
}

body.page-notificacoes .dash-aviso-editor-toolbar>button:hover,
body.page-notificacoes .dash-aviso-emoji-opcoes button:hover {
    border-color: var(--metro-red);
    background: #fff5f5
}

body.page-notificacoes .dash-aviso-emoji-opcoes {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    width: 100%;
    padding: 8px;
    border: 1px solid var(--metro-border);
    border-radius: 10px;
    background: #fafafa
}

body.page-notificacoes .dash-aviso-emoji-opcoes[hidden] {
    display: none
}

body.page-notificacoes .dash-aviso-emoji-opcoes button {
    padding: 6px 9px;
    font-size: 18px;
    line-height: 1
}

body.page-notificacoes .dash-aviso-editor-ajuda {
    display: block;
    margin-top: 6px;
    color: var(--metro-muted);
    font-size: 11.5px
}

body.page-notificacoes .dash-aviso-status {
    margin: 10px 0 0;
    font-size: 13px;
    color: var(--metro-muted)
}

body.page-notificacoes .dash-aviso-status.is-erro {
    color: #b42318
}

body.page-notificacoes .dash-aviso-status.is-sucesso {
    color: #177245
}

body.page-notificacoes .dash-aviso-historico-cabecalho {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 14px
}

body.page-notificacoes .dash-aviso-atualizar {
    border: 0;
    background: transparent;
    color: var(--metro-red);
    font: inherit;
    font-weight: 700;
    font-size: 12.5px;
    text-decoration: underline;
    cursor: pointer
}

body.page-notificacoes .dash-aviso-historico {
    display: flex;
    flex-direction: column;
    gap: 10px;
    max-height: 360px;
    overflow-y: auto
}

body.page-notificacoes .dash-aviso-vazio {
    padding: 14px;
    color: var(--metro-muted);
    font-size: 12.5px;
    text-align: center
}

body.page-notificacoes .dash-aviso-item {
    border: 1px solid var(--metro-border);
    border-radius: 14px;
    padding: 12px 14px
}

body.page-notificacoes .dash-aviso-item-topo {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    font-size: 13px;
    margin-bottom: 6px
}

body.page-notificacoes .dash-aviso-item-topo span {
    flex: 0 0 auto;
    color: var(--metro-muted);
    white-space: nowrap
}

body.page-notificacoes .dash-aviso-item p {
    font-size: 13px;
    line-height: 1.5;
    color: var(--metro-text);
    margin-bottom: 8px;
    overflow-wrap: anywhere
}

body.page-notificacoes .dash-aviso-item-destinatarios {
    display: inline-block;
    background: #ececef;
    color: #606065;
    border-radius: 999px;
    padding: 3px 9px;
    font-size: 11px;
    font-weight: 600
}

body.page-notificacoes .dash-aviso-confirmacao-acoes {
    display: flex;
    gap: 12px;
    justify-content: center;
    margin-top: 18px
}

body.page-prontuario {
    --metro-red: #E02020;
    --metro-text: #111;
    --metro-muted: #777
}

body.page-prontuario * {
    box-sizing: border-box;
    margin: 0;
    padding: 0
}

body.page-prontuario {
    font-family: "Space Grotesk", sans-serif;
    background: #fff;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    padding: 32px 16px 24px;
    opacity: 1 !important
}

body.page-prontuario *::before,
body.page-prontuario *::after {
    background: none !important
}

body.page-prontuario .page {
    flex: 1;
    width: 100%;
    max-width: 1120px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 420px 1fr;
    gap: 40px;
    align-items: flex-start
}

body.page-prontuario #profile-card-container {
    min-width: 420px
}

body.page-prontuario .form-wrapper {
    display: flex
}

body.page-prontuario .form-card {
    background: #fff;
    border-radius: 28px;
    padding: 24px;
    box-shadow: 0 14px 35px rgba(0, 0, 0, 0.06);
    border: 1px solid rgba(0, 0, 0, 0.08);
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 18px
}

body.page-prontuario .form-title {
    font-size: 22px;
    font-weight: 700
}

body.page-prontuario .form-subtitle {
    font-size: 13px;
    color: var(--metro-muted);
    margin-bottom: 8px
}

body.page-prontuario .section-label {
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    color: var(--metro-muted);
    margin-top: 8px;
    font-weight: 700
}

body.page-prontuario .field-group {
    display: flex;
    flex-direction: column;
    gap: 6px;
    width: 100%
}

/* O atributo "hidden" perde para qualquer "display" definido por seletor de
   classe (regra de autor sempre vence a regra padrão do navegador para
   [hidden]) — sem isso, campos escondidos via JS (ex.: receituario.js
   alternando grupo-jogo-lesao/grupo-data-treino-lesao) continuam visíveis. */
body.page-prontuario .field-group[hidden] {
    display: none
}

body.page-prontuario .field-label {
    font-size: 13px;
    font-weight: 500
}

body.page-prontuario select,
body.page-prontuario input[type="date"] {
    width: 100%;
    border-radius: 999px;
    border: 1px solid #d5d5d5;
    padding: 10px 14px;
    font-size: 14px;
    outline: none;
    background: #fff;
    color: var(--metro-text)
}

body.page-prontuario select:focus,
body.page-prontuario input[type="date"]:focus {
    border-color: var(--metro-red);
    box-shadow: 0 0 0 1px rgba(224, 32, 32, 0.08)
}

body.page-prontuario .required {
    color: var(--metro-red)
}

body.page-prontuario .terms-wrapper {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-top: 4px
}

body.page-prontuario .term-item {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    font-size: 14px;
    line-height: 1.5
}

body.page-prontuario .term-item input[type="radio"] {
    margin-top: 3px;
    accent-color: var(--metro-red)
}

body.page-prontuario .form-footer {
    display: flex;
    justify-content: flex-end
}

body.page-prontuario .btn-submit {
    padding: 11px 26px;
    border-radius: 999px;
    border: none;
    background: var(--metro-red);
    color: #fff;
    font-weight: 600;
    cursor: pointer;
    transition: 0.15s
}

body.page-prontuario .btn-submit:hover {
    transform: translateY(-1px);
    box-shadow: 0 10px 25px rgba(224, 32, 32, 0.35);
    background: #c01818
}

body.page-prontuario .label-extremo {
    font-size: 12px;
    font-weight: 700
}

body.page-prontuario .question-image {
    width: 100%;
    max-width: 420px;
    margin: 10px auto 15px;
    display: block;
    border-radius: 12px
}

body.page-prontuario .scale-row {
    display: flex;
    justify-content: space-between;
    gap: 8px;
    margin-top: 8px;
    flex-wrap: wrap
}

body.page-prontuario .scale-row label {
    display: flex;
    flex-direction: column;
    align-items: center;
    font-size: 12px
}

body.page-prontuario .dor-grid {
    display: grid;
    grid-template-columns: repeat(6, 1fr);
    gap: 8px;
    margin-top: 10px
}

body.page-prontuario .dor-grid input {
    display: none
}

body.page-prontuario .dor-grid label {
    border: 1px solid #ccc;
    border-radius: 10px;
    padding: 8px;
    text-align: center;
    cursor: pointer;
    font-size: 13px;
    transition: 0.2s
}

body.page-prontuario .dor-grid label:hover {
    border-color: #E02020
}

body.page-prontuario .dor-grid input:checked+span {
    color: #fff;
    background: #E02020;
    padding: 4px 8px;
    border-radius: 6px
}

body.page-prontuario .input-textarea {
    width: 100%;
    height: 36px;
    border-radius: 999px;
    border: 1px solid #d5d5d5;
    padding: 6px 16px;
    font-size: 14px;
    outline: none;
    resize: none;
    font-family: "Space Grotesk", sans-serif;
    overflow: hidden;
    line-height: 1.2
}

body.page-prontuario .input-textarea:focus {
    border-color: #E02020;
    box-shadow: 0 0 0 2px rgba(224, 32, 32, 0.08)
}

body.page-prontuario .modal-buttons {
    display: flex;
    justify-content: center;
    gap: 12px;
    margin-top: 20px
}

body.page-prontuario .section-divider-strong {
    height: 1px;
    width: 100%;
    border: none;
    background-color: #E02020;
    margin: 24px 0 12px
}

body.page-prontuario .custom-file-upload {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: fit-content;
    max-width: 160px;
    padding: 6px 12px;
    cursor: pointer;
    background-color: #d32f2f;
    color: #fff;
    border-radius: 8px;
    font-weight: 500;
    font-size: 12px;
    transition: 0.3s;
    white-space: nowrap
}

body.page-prontuario .custom-file-upload:hover {
    background-color: #b71c1c
}

body.page-prontuario .custom-file-upload input {
    display: none
}

body.page-prontuario #file-name {
    display: inline-block;
    margin-left: 10px;
    font-size: 13px;
    color: #555
}

body.page-prontuario .btn-gravar {
    background-color: #d32f2f;
    color: #fff;
    border: none;
    padding: 10px 18px;
    border-radius: 10px;
    font-weight: 600;
    cursor: pointer
}

body.page-prontuario .btn-gravar:hover {
    background-color: #b71c1c
}

body.page-prontuario .modal-backdrop {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.35);
    display: none;
    align-items: center;
    justify-content: center;
    z-index: 999
}

body.page-prontuario .modal {
    background: #ffffff;
    border-radius: 24px;
    padding: 24px 28px;
    max-width: 550px;
    width: 90%;
    box-shadow: 0 18px 45px rgba(0, 0, 0, 0.18);
    text-align: center
}

body.page-prontuario .modal-title {
    font-size: 20px;
    font-weight: 700;
    margin-bottom: 10px
}

body.page-prontuario .modal-text {
    font-size: 14px;
    color: var(--metro-muted);
    margin-bottom: 20px
}

body.page-prontuario .btn-modal {
    padding: 10px 24px;
    border-radius: 999px;
    border: none;
    background: var(--metro-red);
    color: #fff;
    font-weight: 600;
    cursor: pointer;
    transition: 0.15s
}

body.page-prontuario .modal-overlay {
    position: fixed;
    inset: 0;
    display: none;
    align-items: center;
    justify-content: center;
    background: transparent;
    z-index: 9999
}

body.page-prontuario .modal-backdrop {
    position: fixed;
    inset: 0;
    display: none;
    align-items: center;
    justify-content: center;
    background: transparent;
    z-index: 9999
}

body.page-prontuario .modal-buttons {
    display: flex;
    gap: 12px;
    margin-top: 20px
}

body.page-prontuario .btn-cancelar {
    margin-left: 10px;
    padding: 8px 14px;
    border-radius: 8px;
    border: none;
    cursor: pointer
}

body.page-prontuario #grupo-profissional .field-label {
    margin-bottom: 5px
}

body.page-prontuario #grupo-profissional select {
    border-top: none
}

body.page-prontuario .label-profissional {
    display: block;
    margin-bottom: 12px;
    font-size: 13px;
    font-weight: 500
}

body.page-prontuario .field-group-profissional {
    display: flex;
    flex-direction: column;
    gap: 0
}

body.page-prontuario .field-group-profissional .field-label {
    margin-bottom: 10px
}

body.page-prontuario select {
    color: #aaa;
    transition: color 0.2s ease
}

body.page-prontuario select.select-filled {
    color: #111
}

body.page-prontuario .contador-wrapper {
    margin-top: 6px
}

body.page-prontuario .contador-text {
    font-size: 12px;
    color: #777;
    display: block;
    margin-bottom: 4px
}

body.page-prontuario .contador-barra {
    width: 100%;
    height: 6px;
    background: #eee;
    border-radius: 999px;
    overflow: hidden
}

body.page-prontuario .contador-progresso {
    height: 100%;
    width: 0%;
    background: #4CAF50;
    transition: width 0.2s ease, background 0.2s ease
}

body.page-prontuario .select-wrapper {
    position: relative
}

body.page-prontuario .select-wrapper select {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    width: 100%;
    border-radius: 999px;
    border: 1px solid #d5d5d5;
    padding: 10px 44px 10px 14px;
    font-size: 14px;
    background: #fff;
    cursor: pointer
}

body.page-prontuario .select-wrapper::after {
    content: "";
    width: 14px;
    height: 14px;
    background-image: url("data:image/svg+xml;utf8,<svg fill='%23111' viewBox='0 0 20 20'><path d='M5 7l5 5 5-5'/></svg>");
    background-repeat: no-repeat;
    background-position: center;
    position: absolute;
    right: 16px;
    top: 50%;
    transform: translateY(-50%);
    pointer-events: none
}

body.page-prontuario .select-wrapper:focus-within::after {
    transform: translateY(-50%) rotate(180deg)
}

body.page-prontuario .footer {
    text-align: center;
    margin-top: 8px
}

body.page-prontuario .footer-main {
    font-size: 14px;
    color: #666;
    margin: 0
}

body.page-prontuario .footer-sub {
    font-size: 11px;
    color: #999;
    margin-top: 4px;
    line-height: 1.4
}

@media (max-width:900px) {
    body.page-prontuario .page {
        grid-template-columns: 1fr
    }

    body.page-prontuario #profile-card-container {
        min-width: auto
    }
}

body.page-redes {
    --metro-text: #111;
    --metro-muted: #777
}

body.page-redes * {
    box-sizing: border-box;
    margin: 0;
    padding: 0
}

body.page-redes {
    font-family: "Space Grotesk", sans-serif;
    background: #fff;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    padding: 32px 16px 24px
}

body.page-redes .page {
    flex: 1;
    width: 100%;
    max-width: 1120px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 420px 1fr;
    gap: 40px;
    align-items: flex-start
}

body.page-redes #profile-card-container {
    min-width: 420px
}

body.page-redes .social-content-card {
    min-width: 0;
    padding: 24px;
    border: 1px solid rgba(0, 0, 0, .08);
    border-radius: 28px;
    background: #fff;
    box-shadow: 0 14px 35px rgba(0, 0, 0, .06)
}

body.page-redes .links-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px
}

body.page-redes .link-card {
    background: #fff;
    border-radius: 28px;
    padding: 20px;
    text-decoration: none;
    color: var(--metro-text);
    display: flex;
    flex-direction: column;
    gap: 12px;
    border: 1px solid rgba(0, 0, 0, .08);
    box-shadow: 0 14px 35px rgba(0, 0, 0, .06);
    transition: .2s ease
}

body.page-redes .link-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 20px 50px rgba(0, 0, 0, .12)
}

body.page-redes .link-row {
    display: flex;
    align-items: center;
    gap: 12px
}

body.page-redes .icon {
    width: 32px;
    height: 32px;
    flex-shrink: 0
}

body.page-redes .label {
    font-size: 16px;
    font-weight: 600
}

body.page-redes .sub {
    font-size: 13px;
    color: var(--metro-muted)
}

body.page-redes .cta {
    font-size: 14px;
    font-weight: 600
}

body.page-redes .footer {
    text-align: center;
    margin-top: 8px
}

body.page-redes .footer-main {
    font-size: 14px;
    color: #666;
    margin: 0
}

body.page-redes .footer-sub {
    font-size: 11px;
    color: #999;
    margin-top: 4px;
    line-height: 1.4
}

@media (max-width:900px) {
    body.page-redes .page {
        grid-template-columns: 1fr
    }

    body.page-redes #profile-card-container {
        min-width: auto
    }

    body.page-redes .links-grid {
        grid-template-columns: 1fr
    }
}

body.page-registrar-jogos {
    --metro-red: #e02020;
    --metro-muted: #777;
    --metro-border: rgba(0, 0, 0, 0.08)
}

body.page-registrar-jogos * {
    box-sizing: border-box;
    margin: 0;
    padding: 0
}

body.page-registrar-jogos {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    padding: 32px 16px 24px;
    background: #fff;
    font-family: "Space Grotesk", sans-serif
}

body.page-registrar-jogos .form-wrapper {
    display: flex;
    flex-direction: column;
    gap: 24px;
    min-width: 0
}

body.page-registrar-jogos .page {
    flex: 1;
    width: 100%;
    max-width: 1120px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 420px 1fr;
    gap: 40px;
    align-items: flex-start
}

body.page-registrar-jogos .form-card {
    width: 100%;
    max-width: 720px;
    display: flex;
    flex-direction: column;
    gap: 18px;
    align-self: start;
    padding: 24px;
    border: 1px solid var(--metro-border);
    border-radius: 28px;
    background: #fff;
    box-shadow: 0 14px 35px rgba(0, 0, 0, 0.06)
}

body.page-registrar-jogos .form-title {
    font-size: 22px;
    font-weight: 700
}

body.page-registrar-jogos .form-subtitle {
    margin-bottom: 8px;
    color: var(--metro-muted);
    font-size: 13px;
    line-height: 1.5
}

body.page-registrar-jogos .section-label {
    margin-top: 8px;
    color: var(--metro-muted);
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase
}

body.page-registrar-jogos .field-row {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px
}

body.page-registrar-jogos .field-group {
    display: flex;
    flex-direction: column;
    gap: 6px
}

body.page-registrar-jogos .field-group.full {
    grid-column: 1 / -1
}

body.page-registrar-jogos .field-label {
    font-size: 13px;
    font-weight: 500
}

body.page-registrar-jogos select,
body.page-registrar-jogos input,
body.page-registrar-jogos textarea {
    width: 100%;
    min-height: 40px;
    padding: 6px 12px;
    border: 1px solid #d5d5d5;
    border-radius: 999px;
    background: #fff;
    font-family: "Space Grotesk", sans-serif;
    font-size: 12px
}

body.page-registrar-jogos textarea {
    min-height: 86px;
    padding: 12px 14px;
    border-radius: 18px;
    resize: vertical
}

body.page-registrar-jogos select.campo-invalido,
body.page-registrar-jogos input.campo-invalido,
body.page-registrar-jogos textarea.campo-invalido {
    border-color: var(--metro-red) !important;
    background: #fff1f1
}

body.page-registrar-jogos .team-mode {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px
}

body.page-registrar-jogos .mode-option {
    display: flex;
    align-items: center;
    gap: 8px;
    min-height: 40px;
    padding: 8px 12px;
    border: 1px solid #d5d5d5;
    border-radius: 999px;
    font-size: 12px;
    cursor: pointer
}

body.page-registrar-jogos .mode-option input {
    width: 14px;
    min-height: 14px;
    accent-color: var(--metro-red)
}

body.page-registrar-jogos .btn-submit {
    width: 240px;
    align-self: center;
    padding: 11px 26px;
    border: none;
    border-radius: 999px;
    background: var(--metro-red);
    color: #fff;
    font-weight: 600;
    cursor: pointer
}

body.page-registrar-jogos .btn-submit:disabled {
    cursor: not-allowed;
    opacity: 0.65
}

body.page-registrar-jogos .btn-secondary {
    width: 180px;
    align-self: center;
    padding: 10px 20px;
    border: 1px solid #d5d5d5;
    border-radius: 999px;
    background: #fff;
    color: #111;
    font-weight: 600;
    cursor: pointer
}

body.page-registrar-jogos .actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px
}

body.page-registrar-jogos .status-box {
    display: none;
    padding: 12px 14px;
    border-radius: 14px;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.4
}

body.page-registrar-jogos .status-box.show {
    display: block
}

body.page-registrar-jogos .status-box.success {
    border: 1px solid #bce8c6;
    background: #effaf1;
    color: #146c2e
}

body.page-registrar-jogos .status-box.error {
    border: 1px solid #ffb3b3;
    background: #ffe9e9;
    color: #b30000
}

body.page-registrar-jogos .games-list {
    display: grid;
    gap: 8px
}

body.page-registrar-jogos .game-card {
    display: grid;
    grid-template-columns: 140px minmax(0, 1fr) auto;
    align-items: center;
    gap: 18px;
    padding: 14px;
    border: 1px solid #e6e6e6;
    border-radius: 18px;
    background: #fafafa;
    font-size: 13px;
    line-height: 1.45
}

body.page-registrar-jogos .game-card-content {
    min-width: 0
}

body.page-registrar-jogos .game-card-actions {
    display: flex;
    align-items: center;
    gap: 8px
}

body.page-registrar-jogos .game-card-select {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    font-size: 12px;
    color: var(--metro-muted);
    cursor: pointer
}

body.page-registrar-jogos .game-card-select input {
    flex: none;
    width: 16px;
    height: 16px;
    margin-top: 1px;
    accent-color: var(--metro-red);
    cursor: pointer
}

body.page-registrar-jogos .game-card-select-off {
    display: block;
    font-size: 11px;
    color: var(--metro-muted)
}

body.page-registrar-jogos .office-actions {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 12px;
    margin-bottom: 12px;
    text-align: center
}

body.page-registrar-jogos .office-actions-count {
    font-size: 12px;
    color: var(--metro-muted)
}

body.page-registrar-jogos .office-actions-buttons {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 12px;
    flex-wrap: wrap
}

body.page-registrar-jogos .game-action {
    min-height: 36px;
    padding: 8px 15px;
    border-radius: 999px;
    background: #fff;
    font: 700 12px/1 "Space Grotesk", sans-serif;
    cursor: pointer
}

body.page-registrar-jogos .game-action-edit {
    border: 1px solid #d3d3d3;
    color: #222
}

body.page-registrar-jogos .game-action-remove {
    border: 1px solid #f1bcbc;
    background: #fff7f7;
    color: #b21f24
}

body.page-registrar-jogos .game-action:disabled {
    cursor: wait;
    opacity: .65
}

body.page-registrar-jogos .game-card strong {
    display: block;
    margin-bottom: 4px;
    font-size: 14px
}

body.page-registrar-jogos .game-team-metro {
    color: var(--metro-red)
}

body.page-registrar-jogos .game-meta {
    color: var(--metro-muted);
    font-size: 12px
}

body.page-registrar-jogos .footer {
    margin-top: 8px;
    text-align: center
}

body.page-registrar-jogos .footer-main {
    margin: 0;
    color: #666;
    font-size: 14px
}

body.page-registrar-jogos .footer-sub {
    margin-top: 4px;
    color: #999;
    font-size: 11px;
    line-height: 1.4
}

@media (max-width:900px) {
    body.page-registrar-jogos .page {
        grid-template-columns: 1fr
    }
}

@media (max-width:640px) {
    body.page-registrar-jogos {
        padding: 20px 12px
    }

    body.page-registrar-jogos .form-card {
        padding: 20px;
        border-radius: 22px
    }

    body.page-registrar-jogos .field-row,
    body.page-registrar-jogos .team-mode {
        grid-template-columns: 1fr
    }

    body.page-registrar-jogos .btn-submit,
    body.page-registrar-jogos .btn-secondary {
        width: 100%
    }

    body.page-registrar-jogos .game-card {
        grid-template-columns: 1fr
    }

    body.page-registrar-jogos .game-card-actions {
        justify-content: flex-end
    }
}

body.page-cadastros {
    --metro-red: #e02020;
    --metro-red-dark: #b21f24;
    --metro-text: #171717;
    --metro-muted: #747474;
    --metro-border: rgba(0, 0, 0, .08)
}

body.page-cadastros * {
    box-sizing: border-box
}

body.page-cadastros {
    min-height: 100vh;
    margin: 0;
    padding: 32px 16px 24px;
    background: #fff;
    color: var(--metro-text);
    font-family: "Space Grotesk", sans-serif
}

body.page-cadastros.modal-open {
    overflow: hidden
}

body.page-cadastros .page {
    width: 100%;
    max-width: 1120px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 420px minmax(0, 1fr);
    gap: 40px;
    align-items: start
}

body.page-cadastros #profile-card-container {
    width: 100%;
    min-width: 420px
}

body.page-cadastros .cadastros-content {
    width: 100%;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 24px
}

body.page-cadastros .cadastros-card {
    width: 100%;
    min-width: 0;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    gap: 20px;
    padding: 24px;
    border: 1px solid var(--metro-border);
    border-radius: 28px;
    background: #fff;
    box-shadow: 0 14px 35px rgba(0, 0, 0, .06)
}

body.page-cadastros .cadastros-controls-card {
    padding-top: 16px
}

body.page-cadastros .cadastros-results-card {
    gap: 0
}

body.page-cadastros .cadastros-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px
}

body.page-cadastros .cadastros-header-actions {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    gap: 10px
}

body.page-cadastros .form-title {
    font-size: 24px;
    font-weight: 700
}

body.page-cadastros .form-subtitle {
    max-width: 620px;
    margin: 7px 0 0;
    color: var(--metro-muted);
    font-size: 13px;
    line-height: 1.55
}

body.page-cadastros .btn-refresh {
    flex: 0 0 auto;
    min-height: 40px;
    padding: 9px 17px;
    border: 1px solid #d5d5d5;
    border-radius: 999px;
    background: #fff;
    color: #292929;
    font: 600 12px/1 "Space Grotesk", sans-serif;
    cursor: pointer
}

body.page-cadastros .btn-incluir-cadastro {
    flex: 0 0 auto;
    min-height: 40px;
    padding: 9px 18px;
    border: 1px solid var(--metro-red);
    border-radius: 999px;
    background: var(--metro-red);
    color: #fff;
    font: 700 12px/1 "Space Grotesk", sans-serif;
    cursor: pointer
}

body.page-cadastros .btn-incluir-cadastro:hover {
    border-color: var(--metro-red-dark);
    background: var(--metro-red-dark)
}

body.page-gestao-avaliacoes .cadastros-header-actions {
    flex-wrap: nowrap
}

body.page-gestao-avaliacoes .cadastros-header-actions>button {
    box-sizing: border-box;
    flex: 0 0 150px;
    width: 150px;
    min-height: 42px;
}

body.page-gestao-avaliacoes #novoAtletaForm .cadastro-modal-actions {
    margin-top: 16px
}

body.page-cadastros .cadastros-classificacoes {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
    padding-bottom: 16px;
    border-bottom: 1px solid #ececef
}

body.page-cadastros .cadastro-classificacao {
    min-height: 42px;
    padding: 10px 20px;
    border: 0;
    border-radius: 999px;
    background: #f0f0f2;
    color: #444;
    font: 700 12px/1 "Space Grotesk", sans-serif;
    letter-spacing: .04em;
    text-transform: uppercase;
    cursor: pointer;
    transition: .18s ease
}

body.page-cadastros .cadastro-classificacao.is-active,
body.page-cadastros .cadastro-classificacao:hover {
    background: var(--metro-red);
    color: #fff
}

body.page-cadastros .cadastro-classificacao:focus-visible {
    outline: 0;
    box-shadow: 0 0 0 3px rgba(224, 32, 32, .24)
}

body.page-cadastros .cadastros-tabs {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
    padding: 0;
    background: transparent
}

body.page-cadastros .cadastro-tab[hidden] {
    display: none
}

body.page-cadastros .cadastro-tab {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    min-height: 42px;
    padding: 9px 18px;
    border: 1px solid #d3d3d3;
    border-radius: 999px;
    background: #fff;
    color: #59595d;
    font: 700 12px/1.15 "Space Grotesk", sans-serif;
    cursor: pointer;
    transition: .18s ease
}

body.page-cadastros .cadastro-tab:focus {
    outline: none;
    box-shadow: none
}

body.page-cadastros .cadastro-tab:focus-visible {
    outline: 2px solid var(--metro-red);
    outline-offset: 2px
}

body.page-cadastros .cadastro-tab.is-active {
    border-color: var(--metro-red);
    background: var(--metro-red);
    color: #fff;
    box-shadow: none
}

body.page-cadastros .cadastro-tab:not(.is-active):hover {
    border-color: #aaa;
    background: #fafafa
}

body.page-gestao-avaliacoes .cadastros-tabs {
    flex-wrap: nowrap;
    gap: 8px
}

body.page-gestao-avaliacoes .cadastro-tab {
    box-sizing: border-box;
    flex: 1 1 0;
    width: 0;
    min-width: 0;
    padding-inline: 14px;
    text-align: center;
    white-space: nowrap
}

@media (max-width:680px) {
    body.page-gestao-avaliacoes .cadastros-tabs {
        flex-wrap: nowrap;
        overflow-x: auto
    }

    body.page-gestao-avaliacoes .cadastro-tab {
        flex: 0 0 126px;
        width: 126px
    }
}

body.page-cadastros .cadastros-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px
}

body.page-cadastros .cadastros-search {
    flex: 1;
    min-width: 0
}

body.page-cadastros .cadastros-search input {
    width: 100%;
    min-height: 42px;
    padding: 9px 15px;
    border: 1px solid #d7d7d7;
    border-radius: 999px;
    background: #fff;
    font: 400 12px/1 "Space Grotesk", sans-serif
}

body.page-cadastros .cadastros-summary {
    flex: 0 0 auto;
    display: flex;
    align-items: baseline;
    gap: 6px;
    color: #777;
    font-size: 12px
}

body.page-cadastros .cadastros-summary strong {
    color: var(--metro-red);
    font-size: 18px
}

body.page-cadastros .status-box {
    display: none;
    padding: 12px 14px;
    border-radius: 14px;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.4
}

body.page-cadastros .status-box.show {
    display: block
}

body.page-cadastros .status-box.success {
    border: 1px solid #bce8c6;
    background: #effaf1;
    color: #146c2e
}

body.page-cadastros .status-box.error {
    border: 1px solid #ffb3b3;
    background: #ffe9e9;
    color: #b30000
}

body.page-cadastros .cadastros-list {
    display: grid;
    gap: 10px
}

body.page-cadastros .cadastro-item {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    min-width: 0;
    min-height: 72px;
    padding: 12px 15px;
    border: 1px solid #e7e7e7;
    border-radius: 18px;
    background: #fafafa
}

body.page-cadastros .cadastro-item-copy {
    flex: 1 1 260px;
    min-width: 0
}

body.page-cadastros .cadastro-item-title {
    display: flex;
    align-items: center;
    gap: 5px;
    min-width: 0
}

body.page-cadastros .cadastro-item-nascimento {
    flex: 0 0 auto;
    padding: 4px 8px;
    border-radius: 999px;
    background: #f2c94c;
    color: #fff;
    font-size: 10px;
    font-weight: 600;
    white-space: nowrap
}

body.page-cadastros .cadastro-item-title>strong {
    flex: 0 1 auto;
    display: block;
    overflow: hidden;
    min-width: 0;
    color: #1b1b1b;
    font-size: 14px;
    text-overflow: ellipsis;
    white-space: nowrap
}

body.page-cadastros .cadastro-item-copy>p {
    margin: 5px 0 0;
    color: #777;
    font-size: 11px;
    line-height: 1.35
}

body.page-cadastros .cadastro-item-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
    margin-top: 5px
}

body.page-cadastros .cadastro-item-meta span {
    padding: 4px 8px;
    border-radius: 999px;
    background: #ececef;
    color: #606065;
    font-size: 10px;
    font-weight: 600
}

body.page-cadastros .cadastro-item-meta span.is-active {
    background: #e6f4ea;
    color: #137333
}

body.page-cadastros .cadastro-item-meta span.is-inactive {
    background: #fce8e6;
    color: #c5221f
}

body.page-cadastros .cadastro-item-meta span.is-pending {
    background: #ececef;
    color: #5f5f66
}

body.page-cadastros .cadastro-item-meta span.is-scheduled {
    background: #e3edff;
    color: #1a56db
}

body.page-cadastros .cadastro-item-meta span.is-noshow {
    background: #f1e9fb;
    color: #6b3fa0
}

body.page-cadastros .cadastro-item-actions {
    flex: 0 1 auto;
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    justify-content: flex-end
}

body.page-cadastros .btn-editar-cadastro,
body.page-cadastros .btn-remover-cadastro {
    min-height: 34px;
    padding: 7px 12px;
    border-radius: 999px;
    font: 600 11px/1 "Space Grotesk", sans-serif;
    cursor: pointer
}

body.page-cadastros .btn-editar-cadastro {
    border: 1px solid #d3d3d3;
    background: #fff;
    color: #222
}

body.page-cadastros .btn-remover-cadastro {
    border: 1px solid #f1bcbc;
    background: #fff4f4;
    color: #b21f24
}

/* Gestão de Avaliações (paginas/gestao-avaliacoes.html) — reaproveita toda a
   mecânica visual de body.page-cadastros; só os botões de ação (Aprovar /
   Reprovar / Agendar / Remover), a camada de filtros, os modais de
   agendamento/remoção e o badge de status precisam de estilo próprio. */
body.page-cadastros .cadastros-filtros {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px 16px;
    padding: 2px 0 4px
}

body.page-cadastros .cadastros-filtro-campo {
    display: flex;
    flex-direction: column;
    gap: 4px
}

body.page-cadastros .cadastros-filtro-campo span {
    color: #777;
    font: 700 10px/1 "Space Grotesk", sans-serif;
    letter-spacing: .03em;
    text-transform: uppercase
}

body.page-cadastros .cadastros-filtro-campo select {
    min-height: 40px;
    padding: 8px 12px;
    border: 1px solid #d7d7d7;
    border-radius: 999px;
    background: #fff;
    color: #333;
    font: 400 12px/1 "Space Grotesk", sans-serif
}

body.page-cadastros .btn-aprovar-avaliacao,
body.page-cadastros .btn-reprovar-avaliacao,
body.page-cadastros .btn-naocompareceu-avaliacao,
body.page-cadastros .btn-agendar-avaliacao,
body.page-cadastros .btn-remover-avaliacao {
    min-height: 34px;
    padding: 7px 12px;
    border-radius: 999px;
    font: 600 11px/1 "Space Grotesk", sans-serif;
    cursor: pointer
}

body.page-cadastros .btn-aprovar-avaliacao {
    border: 1px solid #b7e1c2;
    background: #e6f4ea;
    color: #137333
}

body.page-cadastros .btn-reprovar-avaliacao {
    border: 1px solid #f1bcbc;
    background: #fff4f4;
    color: #b21f24
}

body.page-cadastros .btn-naocompareceu-avaliacao {
    border: 1px solid #ddc7f5;
    background: #f5eeff;
    color: #6b3fa0
}

body.page-cadastros .btn-agendar-avaliacao {
    border: 1px solid #b9d3ff;
    background: #eef4ff;
    color: #1a56db
}

body.page-cadastros .btn-remover-avaliacao {
    border: 1px solid #f1bcbc;
    background: #fff4f4;
    color: #b21f24
}

body.page-cadastros .btn-aprovar-avaliacao:disabled,
body.page-cadastros .btn-reprovar-avaliacao:disabled,
body.page-cadastros .btn-naocompareceu-avaliacao:disabled,
body.page-cadastros .btn-agendar-avaliacao:disabled,
body.page-cadastros .btn-remover-avaliacao:disabled {
    opacity: 0.45;
    cursor: default
}

body.page-cadastros .cadastros-empty {
    padding: 36px 20px;
    border: 1px dashed #d4d4d4;
    border-radius: 18px;
    color: #777;
    font-size: 13px;
    text-align: center
}

body.page-cadastros .cadastro-modal {
    position: fixed;
    inset: 0;
    z-index: 1000;
    display: grid;
    place-items: center;
    padding: 20px;
    background: rgba(10, 10, 10, .48);
    backdrop-filter: blur(7px)
}

body.page-cadastros .cadastro-modal[hidden] {
    display: none
}

body.page-cadastros .cadastro-modal-panel {
    position: relative;
    width: min(100%, 700px);
    max-height: calc(100vh - 40px);
    overflow: auto;
    padding: 22px;
    border-radius: 26px;
    background: #fff;
    box-shadow: 0 30px 80px rgba(0, 0, 0, .24)
}

body.page-cadastros .cadastro-confirm-panel {
    width: min(100%, 460px);
    padding: 28px 24px 24px;
    text-align: center
}

body.page-cadastros .cadastro-confirm-panel .cadastro-modal-eyebrow {
    padding: 0 44px
}

body.page-cadastros .cadastro-modal-panel.cadastro-confirm-panel h2 {
    margin: 0 44px 10px;
    text-align: center
}

body.page-cadastros .cadastro-modal-close {
    position: absolute;
    top: 16px;
    right: 18px;
    width: 34px;
    height: 34px;
    border: 1px solid #dedede;
    border-radius: 50%;
    background: #fff;
    color: #555;
    font: 400 23px/1 sans-serif;
    cursor: pointer
}

body.page-cadastros .cadastro-modal-eyebrow {
    margin-bottom: 5px;
    color: var(--metro-red);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase
}

body.page-cadastros .cadastro-modal-panel h2 {
    margin: 0 44px 8px 0;
    font-size: 21px
}

body.page-cadastros .cadastro-confirm-panel p {
    margin: 0 auto 24px;
    color: #666;
    font-size: 13px;
    line-height: 1.5;
    text-align: center
}

body.page-cadastros .cadastro-confirm-panel .cadastro-modal-actions {
    justify-content: center
}

body.page-cadastros .cadastro-form {
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 14px;
    row-gap: 2px
}

body.page-cadastros .cadastro-form-field {
    display: flex;
    flex-direction: column;
    gap: 4px
}

body.page-cadastros .cadastro-form-field.is-full,
body.page-cadastros .cadastro-modal-actions.is-full {
    grid-column: 1 / -1
}

body.page-cadastros .cadastro-form-field>span {
    color: #555;
    font-size: 11px;
    font-weight: 600
}

body.page-cadastros .cadastro-form input,
body.page-cadastros .cadastro-form select,
body.page-cadastros .cadastro-form textarea {
    width: 100%;
    min-height: 40px;
    padding: 9px 12px;
    border: 1px solid #d6d6d6;
    border-radius: 13px;
    background: #fff;
    font: 400 12px/1.3 "Space Grotesk", sans-serif
}

body.page-cadastros .cadastro-form input[readonly] {
    background: #f3f3f4;
    color: #777
}

body.page-cadastros .cadastro-form textarea {
    min-height: 64px;
    resize: vertical
}

body.page-cadastros .cadastro-modal-actions {
    display: flex;
    justify-content: flex-end;
    gap: 9px;
    margin-top: 0
}

body.page-cadastros .btn-cancelar,
body.page-cadastros .btn-salvar-cadastro,
body.page-cadastros .btn-remover-confirmar {
    min-height: 40px;
    padding: 10px 18px;
    border-radius: 999px;
    font: 600 12px/1 "Space Grotesk", sans-serif;
    cursor: pointer
}

body.page-cadastros .btn-cancelar {
    border: 1px solid #d5d5d5;
    background: #fff;
    color: #333
}

body.page-cadastros .btn-salvar-cadastro {
    border: 0;
    background: var(--metro-red);
    color: #fff
}

body.page-cadastros .btn-remover-confirmar {
    border: 0;
    background: var(--metro-red);
    color: #fff
}

body.page-cadastros .btn-cancelar:focus-visible,
body.page-cadastros .btn-remover-confirmar:focus-visible {
    outline: 3px solid rgba(224, 32, 32, .22);
    outline-offset: 3px
}

body.page-cadastros .btn-remover-confirmar:hover {
    background: #b21f24
}

body.page-cadastros button:disabled {
    cursor: wait;
    opacity: .65
}

body.page-cadastros .operation-modal-backdrop {
    position: fixed;
    inset: 0;
    z-index: 1200;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    background: rgba(0, 0, 0, .35)
}

body.page-cadastros .operation-modal-backdrop[hidden] {
    display: none
}

body.page-cadastros .operation-modal {
    width: min(90%, 550px);
    padding: 24px 28px;
    border-radius: 24px;
    background: #fff;
    box-shadow: 0 18px 45px rgba(0, 0, 0, .18);
    text-align: center
}

body.page-cadastros .operation-modal-title {
    margin-bottom: 10px;
    color: var(--metro-text);
    font-size: 20px;
    font-weight: 700
}

body.page-cadastros .operation-modal-text {
    margin-bottom: 20px;
    color: var(--metro-muted);
    font-size: 14px;
    line-height: 1.5
}

body.page-cadastros .operation-modal-button {
    padding: 10px 24px;
    border: 0;
    border-radius: 999px;
    background: var(--metro-red);
    color: #fff;
    font: 600 12px/1 "Space Grotesk", sans-serif;
    cursor: pointer;
    transition: .15s
}

body.page-cadastros .operation-modal-button:hover {
    background: #c01818;
    box-shadow: 0 10px 25px rgba(224, 32, 32, .35);
    transform: translateY(-1px)
}

body.page-scout .operation-modal-backdrop {
    position: fixed;
    inset: 0;
    z-index: 1200;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    background: rgba(0, 0, 0, .35)
}

body.page-scout .operation-modal-backdrop[hidden] {
    display: none
}

body.page-scout .operation-modal {
    width: min(90%, 550px);
    padding: 24px 28px;
    border-radius: 24px;
    background: #fff;
    box-shadow: 0 18px 45px rgba(0, 0, 0, .18);
    text-align: center
}

body.page-scout .operation-modal-title {
    margin-bottom: 10px;
    color: #161616;
    font-size: 20px;
    font-weight: 700
}

body.page-scout .operation-modal-text {
    margin-bottom: 20px;
    color: #777;
    font-size: 14px;
    line-height: 1.5
}

body.page-scout .operation-modal-button {
    padding: 10px 24px;
    border: 0;
    border-radius: 999px;
    background: #e02020;
    color: #fff;
    font: 600 12px/1 "Space Grotesk", sans-serif;
    cursor: pointer;
    transition: .15s
}

body.page-scout .operation-modal-button:hover {
    background: #c01818;
    box-shadow: 0 10px 25px rgba(224, 32, 32, .35);
    transform: translateY(-1px)
}

body.page-pre-sumula .operation-modal-backdrop {
    position: fixed;
    inset: 0;
    z-index: 1200;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    background: rgba(0, 0, 0, .35)
}

body.page-pre-sumula .operation-modal-backdrop[hidden] {
    display: none
}

body.page-pre-sumula .operation-modal {
    width: min(90%, 550px);
    padding: 24px 28px;
    border-radius: 24px;
    background: #fff;
    box-shadow: 0 18px 45px rgba(0, 0, 0, .18);
    text-align: center
}

body.page-pre-sumula .operation-modal-title {
    margin-bottom: 10px;
    color: #161616;
    font-size: 20px;
    font-weight: 700
}

body.page-pre-sumula .operation-modal-text {
    margin-bottom: 20px;
    color: #777;
    font-size: 14px;
    line-height: 1.5
}

body.page-pre-sumula .operation-modal-button {
    padding: 10px 24px;
    border: 0;
    border-radius: 999px;
    background: #e02020;
    color: #fff;
    font: 600 12px/1 "Space Grotesk", sans-serif;
    cursor: pointer
}

body.page-pre-sumula .operation-modal-actions {
    display: flex;
    gap: 12px;
    justify-content: center;
    flex-wrap: wrap
}

body.page-pre-sumula .operation-modal-button-secundario {
    padding: 10px 24px;
    border: 1px solid #d9d9df;
    border-radius: 999px;
    background: #fff;
    color: #161616;
    font: 600 12px/1 "Space Grotesk", sans-serif;
    cursor: pointer
}

@media (max-width:980px) {
    body.page-cadastros .page {
        grid-template-columns: 1fr
    }

    body.page-cadastros #profile-card-container {
        min-width: 0
    }
}

@media (max-width:680px) {
    body.page-cadastros {
        padding: 20px 12px
    }

    body.page-cadastros .cadastros-card {
        padding: 20px;
        border-radius: 22px
    }

    body.page-cadastros .cadastros-header,
    body.page-cadastros .cadastros-toolbar,
    body.page-cadastros .cadastro-item {
        align-items: stretch;
        flex-direction: column
    }

    body.page-cadastros .cadastro-item {
        flex-wrap: nowrap
    }

    body.page-cadastros .cadastro-item-copy {
        flex-basis: auto
    }

    body.page-cadastros .cadastros-header-actions {
        flex-wrap: wrap
    }

    body.page-gestao-avaliacoes .cadastros-header-actions {
        flex-wrap: nowrap;
        width: 100%
    }

    body.page-cadastros .cadastros-header-actions button {
        flex: 1 1 auto
    }

    body.page-cadastros .cadastros-tabs {
        gap: 8px
    }

    body.page-cadastros .cadastro-tab {
        flex: 1 1 calc(50% - 4px);
        padding-inline: 12px
    }

    body.page-gestao-avaliacoes .cadastro-tab {
        flex: 0 0 126px;
        width: 126px;
    }

    body.page-cadastros .cadastros-filtros {
        grid-template-columns: 1fr
    }

    body.page-cadastros .cadastro-item-actions,
    body.page-cadastros .btn-editar-cadastro,
    body.page-cadastros .btn-remover-cadastro,
    body.page-cadastros .btn-aprovar-avaliacao,
    body.page-cadastros .btn-reprovar-avaliacao,
    body.page-cadastros .btn-naocompareceu-avaliacao,
    body.page-cadastros .btn-agendar-avaliacao,
    body.page-cadastros .btn-remover-avaliacao {
        width: 100%
    }

    body.page-cadastros .cadastro-form {
        grid-template-columns: 1fr
    }

    body.page-cadastros .cadastro-form-field.is-full,
    body.page-cadastros .cadastro-modal-actions.is-full {
        grid-column: auto
    }

    body.page-gestao-avaliacoes .cadastro-item {
        justify-content: flex-start;
        gap: 10px;
        min-height: 0
    }

    body.page-gestao-avaliacoes .cadastro-item-actions {
        display: flex;
        flex-flow: row nowrap;
        gap: 5px;
        width: 100%;
        margin-top: 0
    }

    body.page-gestao-avaliacoes .cadastro-item-actions>button {
        flex: 1 1 0;
        width: auto;
        min-width: 0;
        padding-inline: 5px;
        font-size: 10px;
        white-space: nowrap
    }
}

body.page-solicitacao {
    --metro-red: #e02020;
    --metro-text: #111;
    --metro-muted: #777
}

body.page-solicitacao * {
    box-sizing: border-box;
    margin: 0;
    padding: 0
}

body.page-solicitacao {
    font-family: "Space Grotesk", sans-serif;
    background: #fff;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    padding: 32px 16px 24px
}

body.page-solicitacao .page {
    flex: 1;
    width: 100%;
    max-width: 1120px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 420px 1fr;
    gap: 40px;
    align-items: flex-start
}

body.page-solicitacao #profile-card-container {
    min-width: 420px
}

body.page-solicitacao .form-wrapper {
    display: flex
}

body.page-solicitacao .form-card {
    background: #fff;
    border-radius: 28px;
    padding: 28px;
    box-shadow: 0 14px 35px rgba(0, 0, 0, 0.06);
    border: 1px solid rgba(0, 0, 0, 0.08);
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 20px
}

body.page-solicitacao .form-title {
    font-size: 22px;
    font-weight: 700
}

body.page-solicitacao .form-subtitle {
    font-size: 13px;
    color: var(--metro-muted)
}

body.page-solicitacao .section-label {
    font-size: 13px;
    text-transform: uppercase;
    letter-spacing: 0.12em;
    color: var(--metro-muted);
    font-weight: 700;
    margin-top: 8px
}

body.page-solicitacao .field-group {
    display: flex;
    flex-direction: column;
    gap: 6px
}

body.page-solicitacao .field-label {
    font-size: 13px;
    font-weight: 500
}

body.page-solicitacao input[type="text"],
body.page-solicitacao input[type="date"] {
    width: 100%;
    border-radius: 999px;
    border: 1px solid #d5d5d5;
    padding: 10px 14px;
    font-size: 14px;
    outline: none;
    transition: 0.15s
}

body.page-solicitacao input:focus {
    border-color: var(--metro-red);
    box-shadow: 0 0 0 1px rgba(224, 32, 32, 0.08)
}

body.page-solicitacao .checkbox-group {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-top: 4px
}

body.page-solicitacao .checkbox-item {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 14px
}

body.page-solicitacao .checkbox-item input {
    width: 18px;
    height: 18px
}

body.page-solicitacao .form-footer {
    display: flex;
    justify-content: flex-end;
    margin-top: 10px
}

body.page-solicitacao .btn-submit {
    padding: 11px 26px;
    border-radius: 999px;
    border: none;
    background: var(--metro-red);
    color: #fff;
    font-weight: 600;
    cursor: pointer;
    transition: 0.15s
}

body.page-solicitacao .btn-submit:hover {
    transform: translateY(-1px);
    box-shadow: 0 10px 25px rgba(224, 32, 32, 0.35);
    background: #c01818
}

body.page-solicitacao .modal-backdrop {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.45);
    display: none;
    align-items: center;
    justify-content: center;
    z-index: 9999
}

body.page-solicitacao .modal-backdrop.active {
    display: flex
}

body.page-solicitacao .modal {
    background: #fff;
    padding: 32px;
    border-radius: 24px;
    max-width: 420px;
    width: 90%;
    text-align: center;
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.15)
}

body.page-solicitacao .modal-title {
    font-size: 18px;
    font-weight: 700;
    margin-bottom: 12px
}

body.page-solicitacao .modal-text {
    font-size: 14px;
    color: #555;
    line-height: 1.5
}

body.page-solicitacao .btn-modal {
    margin-top: 20px;
    padding: 10px 24px;
    border-radius: 999px;
    border: none;
    background: var(--metro-red);
    color: #fff;
    font-weight: 600;
    cursor: pointer
}

body.page-solicitacao .footer {
    text-align: center;
    margin-top: 8px
}

body.page-solicitacao .footer-main {
    font-size: 14px;
    color: #666;
    margin: 0
}

body.page-solicitacao .footer-sub {
    font-size: 11px;
    color: #999;
    margin-top: 4px;
    line-height: 1.4
}

@media (max-width:850px) {
    body.page-solicitacao .page {
        grid-template-columns: 1fr
    }

    body.page-solicitacao #profile-card-container {
        min-width: auto
    }
}

body.page-analise-atleta .modal-backdrop {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 20px;
    background: rgba(0, 0, 0, 0.35)
}

body.page-analise-atleta .modal-backdrop.is-visible {
    display: flex
}

body.page-analise-atleta .message-modal {
    width: min(90vw, 550px);
    padding: 24px 28px;
    border-radius: 24px;
    background: #fff;
    box-shadow: 0 18px 45px rgba(0, 0, 0, 0.18);
    text-align: center
}

body.page-analise-atleta .message-modal .modal-title {
    margin-bottom: 10px;
    font-size: 20px;
    font-weight: 700
}

body.page-analise-atleta .message-modal .modal-text {
    margin-bottom: 20px;
    color: var(--metro-muted);
    font-size: 14px;
    line-height: 1.5
}

body.page-analise-atleta .message-modal .btn-modal {
    padding: 10px 24px;
    border: 0;
    border-radius: 999px;
    background: var(--metro-red);
    color: #fff;
    font-weight: 600;
    cursor: pointer
}

body.page-competicoes {
    min-height: 100vh;
    margin: 0;
    padding: 32px 16px 24px;
    background: #fff;
    color: var(--metro-text);
    font-family: "Space Grotesk", sans-serif
}

body.page-competicoes button,
body.page-competicoes input,
body.page-competicoes select,
body.page-competicoes textarea {
    font: inherit
}

body.page-competicoes .page {
    width: min(1120px, 100%);
    min-width: 0
}

body.page-competicoes #profile-card-container,
body.page-competicoes .content-column,
body.page-competicoes .section-card {
    min-width: 0
}

body.page-competicoes .section-title,
body.page-competicoes .competition-content,
body.page-competicoes .section-nav {
    font-family: "Space Grotesk", sans-serif
}

body.page-competicoes .competition-content p {
    margin: 0;
    color: var(--metro-muted);
    font-size: 15px;
    line-height: 1.5
}

body.page-competicoes .section-header img {
    flex: 0 0 48px;
    max-width: 48px;
    max-height: 48px
}

body.page-competicoes .toggle-btn {
    flex: 0 0 34px;
    width: 34px;
    height: 34px
}

@media (max-width:850px) {
    body.page-competicoes .page {
        width: 100%
    }
}

body.page-links .content-column>.section-card {
    padding: 22px;
    border: 1px solid rgba(0, 0, 0, .06);
    border-radius: 24px;
    box-shadow: 0 10px 25px rgba(0, 0, 0, .05)
}

body.page-links .content-column>.section-card>.section-eyebrow,
body.page-links .content-column>.section-card>.section-subtitle {
    display: none
}

body.page-links .content-column>.section-card>.section-title {
    margin: 0 0 16px;
    color: #999;
    font-size: 12px;
    font-weight: 700;
    line-height: 1.3;
    letter-spacing: .12em;
    text-transform: uppercase
}

body.page-links .links-grid {
    gap: 16px
}

body.page-links .link-card {
    min-height: 168px;
    padding: 20px;
    gap: 12px;
    border: 1px solid rgba(0, 0, 0, .08);
    border-radius: 28px;
    background: #fff;
    box-shadow: 0 14px 35px rgba(0, 0, 0, .06);
    transition: all .25s ease
}

body.page-links .link-card:hover {
    transform: translateY(-4px);
    border-color: rgba(0, 0, 0, .08);
    background: #fff;
    box-shadow: 0 16px 40px rgba(0, 0, 0, .08)
}

body.page-links .link-row {
    align-items: center;
    gap: 12px
}

body.page-links .link-icon {
    width: 32px;
    height: 32px;
    flex: 0 0 32px;
    border-radius: 0;
    background-color: transparent;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23E10600' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71'/%3E%3Cpath d='M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71'/%3E%3C/svg%3E");
    background-position: center;
    background-repeat: no-repeat;
    background-size: 32px 32px;
    color: transparent;
    font-size: 0
}

body.page-links .link-label {
    color: var(--metro-text);
    font-size: 16px;
    font-weight: 600;
    line-height: 1.25
}

body.page-links .link-sub {
    margin-top: 2px;
    color: var(--metro-muted);
    font-size: 13px;
    line-height: 1.45
}

body.page-links .link-url {
    display: none
}

body.page-links .link-cta {
    margin-top: 10px;
    margin-bottom: 10px;
    color: var(--metro-text);
    font-size: 13px;
    font-weight: 600;
    letter-spacing: 0;
    text-transform: none
}

body.page-links .link-card:hover .link-cta {
    color: var(--metro-red)
}

@scope (body.page-matricula) {
    :scope {
        --red: #e02020;
        --red-dark: #b61119;
        --ink: #000000;
        --muted: rgba(0, 0, 0, .62);
        --soft: rgba(0, 0, 0, .035);
        --line: rgba(0, 0, 0, .14);
        --white: #ffffff;
        --radius: 28px;
        --shadow: 0 22px 60px rgba(16, 16, 20, .1)
    }

    * {
        box-sizing: border-box
    }

    :scope {
        scroll-behavior: smooth
    }

    :scope {
        margin: 0;
        background: var(--white);
        color: var(--ink);
        font-family: "Space Grotesk", sans-serif;
        line-height: 1.55
    }

    img {
        max-width: 100%;
        display: block
    }

    a {
        color: inherit
    }

    button,
    a {
        -webkit-tap-highlight-color: transparent
    }

    .container {
        width: min(1180px, calc(100% - 40px));
        margin: 0 auto
    }

    .site-header {
        position: sticky;
        top: 0;
        z-index: 50;
        background: rgba(255, 255, 255, .94);
        border-bottom: 1px solid rgba(0, 0, 0, .08);
        backdrop-filter: blur(16px)
    }

    .header-inner {
        min-height: 74px;
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 20px
    }

    .brand {
        display: flex;
        align-items: center;
        gap: 12px;
        text-decoration: none
    }

    .brand img {
        width: 48px;
        height: 48px;
        object-fit: contain
    }

    .brand strong,
    .brand span {
        display: block
    }

    .brand strong {
        font-size: 14px;
        text-transform: uppercase;
        letter-spacing: .08em
    }

    .brand span {
        color: var(--muted);
        font-size: 11px
    }

    .header-nav {
        display: flex;
        align-items: center;
        gap: 22px
    }

    .header-nav>a:not(.btn) {
        color: var(--ink);
        font-size: 12px;
        font-weight: 600;
        text-decoration: none
    }

    .btn {
        min-height: 48px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 9px;
        padding: 12px 20px;
        border: 0;
        border-radius: 999px;
        background: var(--red);
        color: var(--white);
        font: inherit;
        font-size: 13px;
        font-weight: 700;
        text-decoration: none;
        cursor: pointer;
        transition: .2s ease
    }

    .btn:hover {
        transform: translateY(-2px);
        box-shadow: 0 14px 28px rgba(224, 32, 32, .22)
    }

    .btn-primary {
        background: var(--red)
    }

    .btn-primary:hover {
        background: var(--red-dark);
        box-shadow: 0 14px 28px rgba(224, 32, 32, .24)
    }

    .btn-light {
        background: var(--white);
        color: var(--ink)
    }

    .btn-outline {
        border: 1px solid var(--line);
        background: var(--white);
        color: var(--ink)
    }

    .hero {
        position: relative;
        min-height: 720px;
        display: flex;
        align-items: center;
        overflow: hidden;
        background: var(--ink) url("../asset/escola/hero-escola-futebol.png") center/cover no-repeat;
        color: var(--white)
    }

    .hero::before {
        content: "";
        position: absolute;
        inset: 0;
        background: linear-gradient(90deg, rgba(8, 8, 10, .92) 0%, rgba(8, 8, 10, .74) 38%, rgba(8, 8, 10, .15) 72%, rgba(8, 8, 10, .04) 100%)
    }

    .hero-content {
        position: relative;
        z-index: 1;
        width: min(650px, 64%);
        padding: 92px 0
    }

    .eyebrow {
        display: inline-flex;
        align-items: center;
        gap: 9px;
        margin-bottom: 18px;
        color: var(--red);
        font-size: 12px;
        font-weight: 700;
        letter-spacing: .16em;
        text-transform: uppercase
    }

    .eyebrow::before {
        content: "";
        width: 28px;
        height: 3px;
        border-radius: 999px;
        background: currentColor
    }

    .hero .eyebrow {
        color: var(--red)
    }

    h1,
    h2,
    h3,
    p {
        margin-top: 0
    }

    h1 {
        max-width: 640px;
        margin-bottom: 22px;
        font-size: clamp(42px, 6vw, 72px);
        line-height: 1.02;
        letter-spacing: -.045em
    }

    .hero-lead {
        max-width: 590px;
        margin-bottom: 30px;
        color: rgba(255, 255, 255, .82);
        font-size: clamp(17px, 2vw, 21px)
    }

    .hero-actions {
        display: flex;
        flex-wrap: wrap;
        gap: 12px
    }

    .hero-note {
        margin-top: 18px;
        color: rgba(255, 255, 255, .67);
        font-size: 12px
    }

    .stats {
        position: relative;
        z-index: 2;
        margin-top: -48px
    }

    .stats-grid {
        display: grid;
        grid-template-columns: repeat(5, 1fr);
        background: var(--white);
        border: 1px solid var(--line);
        border-radius: 24px;
        box-shadow: var(--shadow);
        overflow: hidden
    }

    .stat {
        padding: 27px 18px;
        text-align: center
    }

    .stat+.stat {
        border-left: 1px solid var(--line)
    }

    .stat-icon {
        display: block;
        margin-bottom: 8px;
        font-size: 23px
    }

    .stat strong {
        display: block;
        font-size: 16px
    }

    .stat span:last-child {
        color: var(--muted);
        font-size: 12px
    }

    .section {
        padding: 92px 0;
        scroll-margin-top: 86px
    }

    .section-soft {
        background: var(--soft)
    }

    .section-dark {
        background: var(--ink);
        color: var(--white)
    }

    .section-heading {
        max-width: 760px;
        margin-bottom: 40px
    }

    .section-heading.centered {
        margin-right: auto;
        margin-left: auto;
        text-align: center
    }

    .section-heading.centered .eyebrow {
        justify-content: center
    }

    .section-heading h2 {
        margin-bottom: 14px;
        font-size: clamp(32px, 4.5vw, 52px);
        line-height: 1.08;
        letter-spacing: -.035em
    }

    .section-heading p {
        margin-bottom: 0;
        color: var(--muted);
        font-size: 17px
    }

    .section-dark .section-heading p {
        color: rgba(255, 255, 255, .68)
    }

    .cards {
        display: grid;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: 16px
    }

    .card {
        min-height: 100%;
        padding: 26px;
        border: 1px solid var(--line);
        border-radius: 22px;
        background: var(--white)
    }

    .card-icon {
        width: 46px;
        height: 46px;
        display: grid;
        place-items: center;
        margin-bottom: 18px;
        border-radius: 14px;
        background: rgba(224, 32, 32, .08);
        font-size: 22px
    }

    .card h3 {
        margin-bottom: 10px;
        font-size: 19px
    }

    .card p,
    .card li {
        color: var(--muted);
        font-size: 14px
    }

    .card ul {
        margin: 12px 0 0;
        padding-left: 18px
    }

    .pillar-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 14px
    }

    .pillar {
        display: flex;
        align-items: center;
        gap: 16px;
        padding: 22px;
        border: 1px solid rgba(255, 255, 255, .12);
        border-radius: 18px;
        background: rgba(255, 255, 255, .06)
    }

    .pillar span {
        font-size: 25px
    }

    .pillar strong {
        font-size: 16px
    }

    .media-card {
        position: relative;
        min-height: 460px;
        display: grid;
        place-items: center;
        overflow: hidden;
        border-radius: var(--radius);
        background: linear-gradient(rgba(10, 10, 12, .54), rgba(10, 10, 12, .72)), url("../asset/escola/hero-escola-futebol.png") center/cover;
        color: var(--white);
        text-align: center
    }

    .play {
        width: 86px;
        height: 86px;
        display: grid;
        place-items: center;
        margin: 0 auto 18px;
        border: 2px solid rgba(255, 255, 255, .7);
        border-radius: 50%;
        background: rgba(255, 255, 255, .14);
        font-size: 29px;
        backdrop-filter: blur(8px)
    }

    .media-card h3 {
        margin-bottom: 7px;
        font-size: 26px
    }

    .media-card p {
        margin: 0;
        color: rgba(255, 255, 255, .76)
    }

    .two-col {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 24px
    }

    .benefit-panel {
        padding: 34px;
        border-radius: var(--radius);
        background: var(--white);
        box-shadow: 0 12px 32px rgba(0, 0, 0, .06)
    }

    .benefit-panel h3 {
        margin-bottom: 20px;
        font-size: 25px
    }

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

    .check {
        display: flex;
        align-items: flex-start;
        gap: 9px;
        color: var(--ink);
        font-size: 14px
    }

    .check::before {
        content: "✓";
        color: var(--red);
        font-weight: 700
    }

    .people-grid {
        display: grid;
        grid-template-columns: 1fr 1fr 1fr;
        gap: 16px
    }

    .person-card {
        overflow: hidden;
        border: 1px solid var(--line);
        border-radius: 22px;
        background: var(--white)
    }

    .person-photo {
        aspect-ratio: 4/3;
        display: grid;
        place-items: center;
        background: rgba(0, 0, 0, .05);
        color: rgba(0, 0, 0, .48);
        font-size: 42px
    }

    .person-info {
        padding: 22px
    }

    .person-info h3 {
        margin-bottom: 5px
    }

    .person-info p {
        margin-bottom: 5px;
        color: var(--muted);
        font-size: 13px
    }

    .structure-grid {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 14px
    }

    .structure-item {
        min-height: 170px;
        display: flex;
        flex-direction: column;
        justify-content: flex-end;
        padding: 22px;
        border-radius: 20px;
        background: var(--ink);
        color: var(--white)
    }

    .structure-item span {
        color: var(--red);
        font-size: 11px;
        font-weight: 700;
        letter-spacing: .12em;
        text-transform: uppercase
    }

    .structure-item strong {
        font-size: 20px
    }

    .difference-grid {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 12px
    }

    .difference {
        padding: 19px;
        border-left: 4px solid var(--red);
        border-radius: 0 14px 14px 0;
        background: var(--white);
        font-size: 14px;
        font-weight: 600
    }

    .testimonial-note {
        max-width: 760px;
        margin: 0 auto;
        padding: 34px;
        border: 1px dashed var(--line);
        border-radius: 22px;
        background: var(--white);
        color: var(--muted);
        text-align: center
    }

    .faq {
        max-width: 900px;
        margin: 0 auto
    }

    .faq details {
        border-bottom: 1px solid var(--line)
    }

    .faq summary {
        position: relative;
        padding: 20px 42px 20px 0;
        list-style: none;
        font-weight: 600;
        cursor: pointer
    }

    .faq summary::-webkit-details-marker {
        display: none
    }

    .faq summary::after {
        content: "+";
        position: absolute;
        top: 16px;
        right: 4px;
        color: var(--red);
        font-size: 24px
    }

    .faq details[open] summary::after {
        content: "−"
    }

    .faq details p {
        max-width: 760px;
        padding: 0 0 20px;
        color: var(--muted)
    }

    .steps {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 16px;
        counter-reset: step
    }

    .step {
        position: relative;
        padding: 28px;
        border: 1px solid var(--line);
        border-radius: 20px;
        background: var(--white);
        counter-increment: step
    }

    .step::before {
        content: counter(step, decimal-leading-zero);
        display: block;
        margin-bottom: 24px;
        color: var(--red);
        font-size: 26px;
        font-weight: 700
    }

    .step h3 {
        margin-bottom: 7px
    }

    .step p {
        margin: 0;
        color: var(--muted);
        font-size: 14px
    }

    .location-grid {
        display: grid;
        grid-template-columns: .82fr 1.18fr;
        gap: 22px;
        align-items: stretch
    }

    .location-info {
        padding: 34px;
        border-radius: var(--radius);
        background: var(--ink);
        color: var(--white)
    }

    .location-logo {
        width: 90px;
        height: 90px;
        margin-bottom: 24px;
        border-radius: 16px;
        object-fit: contain;
        background: var(--white)
    }

    .location-info p {
        color: rgba(255, 255, 255, .7)
    }

    .map {
        min-height: 410px;
        overflow: hidden;
        border: 1px solid var(--line);
        border-radius: var(--radius)
    }

    .map iframe {
        width: 100%;
        height: 100%;
        min-height: 410px;
        border: 0
    }

    .final-cta {
        padding: 92px 0;
        background: linear-gradient(135deg, var(--red-dark), var(--red));
        color: var(--white);
        text-align: center
    }

    .final-cta h2 {
        margin-bottom: 15px;
        font-size: clamp(36px, 5vw, 58px);
        letter-spacing: -.04em
    }

    .final-cta p {
        max-width: 710px;
        margin: 0 auto 28px;
        color: rgba(255, 255, 255, .82);
        font-size: 18px
    }

    .footer {
        padding: 24px 0;
        background: var(--ink);
        color: rgba(255, 255, 255, .65);
        font-size: 12px
    }

    .footer-inner {
        display: flex;
        justify-content: space-between;
        gap: 20px
    }

    .whatsapp-float {
        position: fixed;
        right: 20px;
        bottom: 20px;
        z-index: 60;
        width: 58px;
        height: 58px;
        display: grid;
        place-items: center;
        border-radius: 50%;
        background: var(--red);
        color: var(--white);
        box-shadow: 0 16px 30px rgba(224, 32, 32, .28);
        font-size: 24px;
        text-decoration: none
    }

    :scope {
        min-height: 100vh;
        padding: 32px 16px 24px;
        background: var(--white)
    }

    :scope .site-header {
        display: none
    }

    :scope .page {
        width: 100%;
        max-width: 1120px;
        margin: 0 auto;
        display: grid;
        grid-template-columns: 420px minmax(0, 1fr);
        gap: 40px;
        align-items: start
    }

    :scope #profile-card-container {
        min-width: 420px;
        position: sticky;
        top: 24px
    }

    :scope .content-column {
        min-width: 0;
        display: flex;
        flex-direction: column;
        gap: 24px
    }

    :scope .section-nav {
        position: sticky;
        top: 24px;
        z-index: 20;
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 10px;
        padding: 16px 20px;
        border: 1px solid var(--line);
        border-radius: 24px;
        background: rgba(255, 255, 255, .96);
        box-shadow: 0 14px 35px rgba(0, 0, 0, .06);
        backdrop-filter: blur(10px)
    }

    :scope .section-nav a {
        padding: 8px 14px;
        border: 1px solid var(--line);
        border-radius: 999px;
        background: var(--white);
        color: var(--ink);
        font-size: 11px;
        font-weight: 600;
        letter-spacing: .08em;
        text-decoration: none;
        text-transform: uppercase;
        transition: .18s ease
    }

    :scope .section-nav a:hover,
    :scope .section-nav a.active {
        border-color: var(--red);
        background: var(--red);
        color: var(--white)
    }

    :scope .section-card {
        width: 100%;
        margin: 0;
        overflow: hidden;
        border: 1px solid var(--line);
        border-radius: 28px;
        background: var(--white);
        box-shadow: 0 14px 35px rgba(0, 0, 0, .06);
        scroll-margin-top: 150px
    }

    :scope .section-card.active-section {
        border-color: var(--red);
        box-shadow: 0 0 0 3px rgba(224, 32, 32, .10), 0 14px 35px rgba(0, 0, 0, .06)
    }

    :scope .section-card.hero {
        background: var(--ink) url("../asset/escola/hero-escola-futebol.png") center/cover no-repeat
    }

    :scope .section-card.section-dark {
        background: var(--ink)
    }

    :scope .section-card.final-cta {
        background: linear-gradient(135deg, var(--red-dark), var(--red))
    }

    :scope .section-card:not(.hero):not(.final-cta) {
        background: var(--white);
        color: var(--ink);
        text-align: center
    }

    :scope .section-heading {
        max-width: 720px;
        margin-right: auto;
        margin-left: auto;
        text-align: center
    }

    :scope .section-heading .eyebrow,
    :scope .location-info .eyebrow {
        justify-content: center
    }

    :scope .section-heading h2 {
        font-size: 22px;
        font-weight: 700;
        letter-spacing: -.02em
    }

    :scope .section-heading p,
    :scope .section-dark .section-heading p {
        color: var(--muted);
        font-size: 14px
    }

    :scope .eyebrow {
        font-size: 11px
    }

    :scope .card,
    :scope .benefit-panel,
    :scope .person-card,
    :scope .pillar,
    :scope .structure-item,
    :scope .difference,
    :scope .step,
    :scope .testimonial-note {
        border: 1px solid var(--line);
        border-radius: 20px;
        background: var(--white);
        color: var(--ink);
        box-shadow: none;
        text-align: center
    }

    :scope .card,
    :scope .benefit-panel,
    :scope .person-info,
    :scope .step {
        padding: 22px
    }

    :scope .card h3,
    :scope .choice-card .card h3,
    :scope .benefit-panel h3,
    :scope .person-info h3,
    :scope .step h3,
    :scope .structure-item strong {
        font-size: 18px;
        font-weight: 500
    }

    :scope .card p,
    :scope .card li,
    :scope .person-info p,
    :scope .step p,
    :scope .check,
    :scope .testimonial-note {
        color: var(--muted);
        font-size: 13px
    }

    :scope .card ul {
        padding: 0;
        list-style: none
    }

    :scope .card-icon,
    :scope .person-photo {
        width: 48px;
        height: 48px;
        margin: 0 auto 16px;
        aspect-ratio: auto;
        border-radius: 50%;
        background: rgba(224, 32, 32, .06);
        color: var(--red)
    }

    :scope .person-photo {
        margin-top: 22px
    }

    :scope .line-icon {
        width: 24px;
        height: 24px;
        display: inline-block;
        color: var(--red);
        fill: none;
        stroke: currentColor;
        stroke-width: 1.8;
        stroke-linecap: round;
        stroke-linejoin: round
    }

    :scope .card-icon .line-icon,
    :scope .person-photo .line-icon {
        width: 23px;
        height: 23px
    }

    :scope .stat-icon {
        height: 28px;
        display: grid;
        place-items: center;
        color: var(--red)
    }

    :scope .stat strong {
        font-size: 15px;
        font-weight: 600
    }

    :scope .stat span:last-child {
        font-size: 12px
    }

    :scope .pillar {
        min-height: 112px;
        flex-direction: column;
        justify-content: center;
        gap: 10px;
        padding: 20px
    }

    :scope .pillar span {
        display: grid;
        place-items: center
    }

    :scope .pillar strong {
        font-size: 14px;
        font-weight: 500
    }

    :scope .structure-item {
        min-height: 140px;
        justify-content: center;
        align-items: center;
        padding: 20px
    }

    :scope .difference {
        border-left: 1px solid var(--line);
        padding: 18px;
        font-size: 13px;
        font-weight: 500
    }

    :scope .location-info {
        border: 1px solid var(--line);
        background: var(--white);
        color: var(--ink);
        text-align: center
    }

    :scope .location-logo {
        margin-right: auto;
        margin-left: auto
    }

    :scope .location-info p {
        color: var(--muted);
        font-size: 13px
    }

    :scope .location-info .btn-light {
        border: 1px solid var(--red);
        background: var(--red);
        color: var(--white)
    }

    :scope .check-grid {
        justify-items: center
    }

    :scope .check {
        align-items: center;
        text-align: left
    }

    :scope .hero-content {
        margin: 0 auto;
        text-align: center
    }

    :scope .hero .eyebrow,
    :scope .hero-actions {
        justify-content: center
    }

    :scope .hero h1,
    :scope .hero-lead,
    :scope .hero-note {
        margin-right: auto;
        margin-left: auto;
        text-align: center
    }

    :scope .hero h1 {
        font-size: clamp(34px, 4.4vw, 50px)
    }

    :scope .play {
        color: var(--red)
    }

    :scope .section-card>.container,
    :scope .stats-grid {
        width: 100%;
        max-width: none
    }

    :scope .section {
        padding: 48px 38px
    }

    :scope .hero {
        min-height: 620px
    }

    :scope .hero-content {
        width: 88%;
        padding: 64px 0
    }

    :scope h1 {
        font-size: clamp(38px, 5vw, 58px)
    }

    :scope .stats {
        margin-top: 0
    }

    :scope .stats-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        border: 0;
        border-radius: 0;
        box-shadow: none
    }

    :scope .stat:nth-child(odd) {
        border-left: 0
    }

    :scope .stat:nth-child(n+3) {
        border-top: 1px solid var(--line)
    }

    :scope .stat:last-child {
        grid-column: 1 / -1
    }

    :scope .cards,
    :scope .difference-grid,
    :scope .steps {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }

    :scope .pillar-grid,
    :scope .structure-grid,
    :scope .people-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }

    :scope .two-col,
    :scope .location-grid {
        grid-template-columns: 1fr
    }

    :scope .final-cta {
        padding: 64px 38px
    }

    :scope .footer {
        max-width: 1120px;
        margin: 24px auto 0;
        border-radius: 24px
    }

    @media (max-width:960px) {
        :scope {
            padding: 20px 14px
        }

        :scope .page {
            grid-template-columns: 1fr;
            gap: 24px
        }

        :scope #profile-card-container {
            min-width: 0;
            position: static
        }

        :scope .section-nav {
            top: 10px
        }

        .header-nav>a:not(.btn) {
            display: none
        }

        .hero {
            min-height: 680px;
            background-position: 62% center
        }

        .hero-content {
            width: min(680px, 78%)
        }

        .stats-grid {
            grid-template-columns: repeat(3, 1fr)
        }

        .stat:nth-child(4),
        .stat:nth-child(5) {
            border-top: 1px solid var(--line)
        }

        .cards,
        .difference-grid {
            grid-template-columns: repeat(2, 1fr)
        }

        .structure-grid,
        .people-grid {
            grid-template-columns: repeat(2, 1fr)
        }

        .steps {
            grid-template-columns: repeat(2, 1fr)
        }
    }

    @media (max-width:680px) {
        .container {
            width: min(100% - 28px, 1180px)
        }

        .header-inner {
            min-height: 66px
        }

        .brand span,
        .header-nav .btn {
            display: none
        }

        .hero {
            min-height: 690px;
            align-items: flex-end;
            background-position: 66% center
        }

        .hero::before {
            background: linear-gradient(0deg, rgba(8, 8, 10, .96) 0%, rgba(8, 8, 10, .76) 60%, rgba(8, 8, 10, .18) 100%)
        }

        .hero-content {
            width: 100%;
            padding: 180px 0 68px
        }

        h1 {
            font-size: 43px
        }

        .hero-actions .btn {
            width: 100%
        }

        .stats {
            margin-top: 0;
            padding-top: 14px
        }

        .stats-grid {
            grid-template-columns: 1fr 1fr
        }

        .stat+.stat {
            border-left: 0
        }

        .stat:nth-child(even) {
            border-left: 1px solid var(--line)
        }

        .stat:nth-child(n+3) {
            border-top: 1px solid var(--line)
        }

        .stat:last-child {
            grid-column: 1/-1
        }

        .section {
            padding: 68px 0
        }

        .cards,
        .pillar-grid,
        .two-col,
        .people-grid,
        .structure-grid,
        .difference-grid,
        .steps,
        .location-grid {
            grid-template-columns: 1fr
        }

        .check-grid {
            grid-template-columns: 1fr
        }

        .media-card {
            min-height: 360px
        }

        .footer-inner {
            flex-direction: column
        }
    }

    @media (max-width:620px) {
        :scope .section {
            padding: 38px 22px
        }

        :scope .hero-content {
            width: 100%;
            padding: 48px 0
        }

        :scope .cards,
        :scope .difference-grid,
        :scope .steps,
        :scope .pillar-grid,
        :scope .structure-grid,
        :scope .people-grid,
        :scope .stats-grid {
            grid-template-columns: 1fr
        }

        :scope .stat,
        :scope .stat+.stat {
            grid-column: auto;
            border-left: 0;
            border-top: 1px solid var(--line)
        }

        :scope .stat:first-child {
            border-top: 0
        }
    }

    :scope .section-card {
        padding: 24px 24px 26px;
        overflow: visible;
        border: 1px solid rgba(0, 0, 0, .08);
        border-radius: 28px;
        background: var(--white);
        color: var(--ink);
        box-shadow: 0 14px 35px rgba(0, 0, 0, .06);
        text-align: center
    }

    :scope .section-card.active-section {
        border: 2px solid var(--red);
        box-shadow: 0 0 0 4px rgba(224, 32, 32, .12)
    }

    :scope .section-card>.container {
        width: 100%;
        padding: 0
    }

    :scope .section-heading {
        margin-bottom: 22px
    }

    :scope .section-heading .eyebrow,
    :scope .hero .eyebrow {
        margin-bottom: 6px;
        font-size: 11px;
        letter-spacing: .16em
    }

    :scope .section-heading h2,
    :scope .hero h1,
    :scope .final-cta h2 {
        margin-bottom: 10px;
        color: var(--ink);
        font-size: 22px;
        font-weight: 700;
        line-height: 1.2;
        letter-spacing: 0
    }

    :scope .section-heading p,
    :scope .hero-lead,
    :scope .final-cta p {
        margin-bottom: 18px;
        color: var(--muted);
        font-size: 14px;
        line-height: 1.6
    }

    :scope .section-card.hero {
        min-height: 0;
        background: var(--white)
    }

    :scope .hero::before {
        display: none
    }

    :scope .hero-media {
        width: 100%;
        aspect-ratio: 16 / 9;
        margin-bottom: 22px;
        overflow: hidden;
        border-radius: 20px
    }

    :scope .hero-media img {
        width: 100%;
        height: 100%;
        object-fit: cover
    }

    :scope .hero-content {
        width: 100%;
        padding: 0
    }

    :scope .hero-note {
        margin: 14px 0 0;
        color: var(--muted);
        font-size: 11px
    }

    :scope .hero-actions {
        gap: 10px
    }

    :scope .btn {
        min-height: 40px;
        padding: 9px 16px;
        font-size: 12px
    }

    :scope .btn-light,
    :scope .btn-outline {
        border: 1px solid var(--line);
        background: var(--white);
        color: var(--ink)
    }

    :scope .stats {
        padding: 24px 24px 26px
    }

    :scope .stats-heading {
        margin-bottom: 18px
    }

    :scope .stats-heading .eyebrow {
        margin-bottom: 6px
    }

    :scope .stats-heading h2 {
        margin: 0;
        font-size: 22px
    }

    :scope .stats-grid {
        overflow: hidden;
        border: 1px solid var(--line);
        border-radius: 20px
    }

    :scope .stat {
        padding: 22px 16px
    }

    :scope .card,
    :scope .benefit-panel,
    :scope .person-card,
    :scope .pillar,
    :scope .structure-item,
    :scope .difference,
    :scope .step,
    :scope .testimonial-note,
    :scope .location-info {
        border: 1px solid rgba(0, 0, 0, .13);
        border-radius: 20px;
        background: rgba(0, 0, 0, .02)
    }

    :scope .media-card,
    :scope .map {
        border-radius: 20px
    }

    :scope .section-card.final-cta {
        padding: 32px 24px;
        background: var(--white);
        color: var(--ink)
    }

    :scope .section-card.final-cta .container {
        width: 100%
    }

    @media (max-width:620px) {

        :scope .section-card,
        :scope .section,
        :scope .stats,
        :scope .final-cta {
            padding: 22px 18px
        }
    }

    :scope .section-card,
    :scope .section-card:not(.hero):not(.final-cta) {
        text-align: left
    }

    :scope .section-heading,
    :scope .section-heading.centered {
        max-width: none;
        margin: 0 0 24px;
        text-align: left
    }

    :scope .section-heading .eyebrow,
    :scope .section-heading.centered .eyebrow,
    :scope .hero .eyebrow,
    :scope .location-info .eyebrow {
        justify-content: flex-start
    }

    :scope .section-heading .eyebrow::before,
    :scope .hero .eyebrow::before,
    :scope .location-info .eyebrow::before {
        display: none
    }

    :scope .section-heading h2,
    :scope .hero h1,
    :scope .final-cta h2,
    :scope .stats-heading h2 {
        font-size: 22px;
        text-align: left
    }

    :scope .section-heading p,
    :scope .hero-lead,
    :scope .final-cta p {
        max-width: none;
        text-align: left
    }

    :scope .hero-content {
        margin: 0;
        text-align: left
    }

    :scope .hero h1,
    :scope .hero-lead,
    :scope .hero-note {
        margin-left: 0;
        text-align: left
    }

    :scope .hero-actions {
        justify-content: flex-start
    }

    :scope .hero-media {
        width: min(420px, 100%);
        aspect-ratio: 16 / 10;
        margin: 28px 0 0
    }

    :scope .institutional-tags {
        display: flex;
        flex-wrap: wrap;
        gap: 10px;
        margin-top: 24px
    }

    :scope .institutional-tag {
        min-width: 112px;
        padding: 9px 18px;
        border: 1px solid rgba(224, 32, 32, .34);
        border-radius: 999px;
        background: rgba(224, 32, 32, .04);
        color: rgba(0, 0, 0, .66);
        font-size: 10px;
        font-weight: 600;
        letter-spacing: .12em;
        text-align: center;
        text-transform: uppercase
    }

    :scope .stats-heading {
        margin-bottom: 20px;
        text-align: left
    }

    :scope .stats-heading .eyebrow {
        justify-content: flex-start
    }

    :scope .stats-heading .eyebrow::before {
        display: none
    }

    :scope .card,
    :scope .benefit-panel,
    :scope .person-card,
    :scope .pillar,
    :scope .structure-item,
    :scope .step,
    :scope .location-info {
        text-align: left
    }

    :scope .card-icon,
    :scope .person-photo {
        margin-right: 0;
        margin-left: 0
    }

    :scope .pillar,
    :scope .structure-item {
        align-items: flex-start;
        text-align: left
    }

    :scope .check-grid {
        justify-items: start
    }

    :scope .testimonial-note {
        text-align: left
    }

    :scope .location-logo {
        margin-right: 0;
        margin-left: 0
    }

    :scope .section-card.final-cta,
    :scope .section-card.final-cta .container {
        text-align: left
    }

    :scope .school-units {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 14px;
        margin-top: 24px
    }

    :scope .school-unit-card {
        min-width: 0;
        min-height: 210px;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 7px;
        padding: 20px 14px;
        border: 1px solid rgba(0, 0, 0, .13);
        border-radius: 20px;
        background: rgba(0, 0, 0, .02);
        color: var(--ink);
        text-align: center;
        transition: .18s ease
    }

    :scope .school-unit-card:hover {
        border-color: rgba(224, 32, 32, .34);
        background: rgba(224, 32, 32, .06);
        transform: translateY(-2px);
        box-shadow: 0 12px 24px rgba(0, 0, 0, .08)
    }

    :scope .school-unit-label {
        color: var(--red);
        font-size: 10px;
        font-weight: 700;
        letter-spacing: .12em;
        text-transform: uppercase
    }

    :scope .school-unit-card h3 {
        margin: 0;
        font-size: 20px;
        font-weight: 500
    }

    :scope .school-unit-card p {
        margin: 0;
        color: var(--muted);
        font-size: 12px;
        line-height: 1.5
    }

    :scope .school-unit-card .unit-status {
        margin-top: 6px;
        color: var(--ink);
        font-size: 10px;
        font-weight: 600;
        letter-spacing: .1em;
        text-transform: uppercase
    }

    :scope #footer-container {
        width: 100%;
        max-width: 1120px;
        margin: 24px auto 0
    }

    @media (max-width:720px) {
        :scope .school-units {
            grid-template-columns: 1fr
        }
    }

    :scope .content-column {
        gap: 14px
    }

    :scope .section-card,
    :scope .section-card:not(.hero):not(.final-cta),
    :scope .section-card.final-cta,
    :scope .section-card.final-cta .container {
        padding: 20px;
        text-align: center
    }

    :scope .section-heading,
    :scope .section-heading.centered,
    :scope .stats-heading {
        margin: 0 auto 16px;
        text-align: center
    }

    :scope .section-heading .eyebrow,
    :scope .section-heading.centered .eyebrow,
    :scope .hero .eyebrow,
    :scope .stats-heading .eyebrow,
    :scope .location-info .eyebrow {
        justify-content: center
    }

    :scope .section-heading h2,
    :scope .hero h1,
    :scope .final-cta h2,
    :scope .stats-heading h2,
    :scope .section-heading p,
    :scope .hero-lead,
    :scope .final-cta p {
        text-align: center
    }

    :scope .section-heading p,
    :scope .hero-lead,
    :scope .final-cta p {
        margin-bottom: 12px
    }

    :scope .hero-content {
        margin: 0 auto;
        text-align: center
    }

    :scope .hero h1,
    :scope .hero-lead,
    :scope .hero-note {
        margin-right: auto;
        margin-left: auto;
        text-align: center
    }

    :scope .hero-actions,
    :scope .institutional-tags {
        justify-content: center
    }

    :scope .institutional-tags {
        margin-top: 16px
    }

    :scope .hero-media {
        width: min(380px, 100%);
        margin: 18px auto 0
    }

    :scope .stats,
    :scope .section,
    :scope .final-cta {
        padding: 20px
    }

    :scope .stats-grid,
    :scope .cards,
    :scope .pillar-grid,
    :scope .two-col,
    :scope .people-grid,
    :scope .structure-grid,
    :scope .difference-grid,
    :scope .steps,
    :scope .school-units {
        gap: 10px
    }

    :scope .stat {
        padding: 16px 12px
    }

    :scope .card,
    :scope .benefit-panel,
    :scope .person-card,
    :scope .pillar,
    :scope .structure-item,
    :scope .step,
    :scope .location-info,
    :scope .testimonial-note {
        text-align: center
    }

    :scope .card,
    :scope .benefit-panel,
    :scope .person-info,
    :scope .step {
        padding: 16px
    }

    :scope .card-icon,
    :scope .person-photo,
    :scope .location-logo {
        margin-right: auto;
        margin-left: auto
    }

    :scope .pillar,
    :scope .structure-item {
        min-height: 92px;
        align-items: center;
        padding: 14px;
        text-align: center
    }

    :scope .check-grid {
        gap: 8px;
        justify-items: center
    }

    :scope .check {
        justify-content: center;
        text-align: center
    }

    :scope .media-card {
        min-height: 320px
    }

    :scope .school-units {
        margin-top: 16px
    }

    :scope .school-unit-card {
        min-height: 160px;
        gap: 4px;
        padding: 14px 10px
    }

    :scope .school-unit-card h3 {
        font-size: 18px
    }

    :scope .school-unit-card .unit-status {
        margin-top: 3px
    }

    :scope #footer-container {
        margin-top: 14px
    }

    @media (max-width:620px) {

        :scope .section-card,
        :scope .section,
        :scope .stats,
        :scope .final-cta {
            padding: 18px 14px
        }
    }

    :scope .stats.section-card,
    :scope .choice-card {
        padding: 14px
    }

    :scope .stats-heading,
    :scope .choice-card .section-heading {
        margin-bottom: 10px
    }

    :scope .stats-heading .eyebrow,
    :scope .choice-card .eyebrow {
        margin-bottom: 3px
    }

    :scope .stats-heading h2,
    :scope .choice-card .section-heading h2 {
        margin-bottom: 5px;
        font-size: 20px
    }

    :scope .choice-card .section-heading p {
        margin-bottom: 0;
        font-size: 12px;
        line-height: 1.4
    }

    :scope .stats-grid,
    :scope .choice-card .cards {
        gap: 8px
    }

    :scope .stat {
        padding: 9px 8px
    }

    :scope .stat-icon {
        height: 22px;
        margin-bottom: 3px
    }

    :scope .stat-icon .line-icon {
        width: 19px;
        height: 19px
    }

    :scope .stat strong {
        font-size: 13px;
        line-height: 1.25
    }

    :scope .stat span:last-child {
        font-size: 10px;
        line-height: 1.25
    }

    :scope .choice-card .card {
        padding: 10px
    }

    :scope .choice-card .card-icon {
        width: 36px;
        height: 36px;
        margin-bottom: 7px
    }

    :scope .choice-card .card-icon .line-icon {
        width: 19px;
        height: 19px
    }

    :scope .choice-card .card h3 {
        margin-bottom: 5px;
        font-size: 15px
    }

    :scope .choice-card .card p,
    :scope .choice-card .card li {
        font-size: 10px;
        line-height: 1.4
    }

    :scope .choice-card .card ul {
        margin-top: 6px
    }

    :scope .hero-lead,
    :scope .section-heading p,
    :scope .card p,
    :scope .card li,
    :scope .pillar p,
    :scope .benefit-panel,
    :scope .person-info p,
    :scope .step p,
    :scope .faq details p,
    :scope .testimonial-note,
    :scope .school-unit-card p,
    :scope .final-cta p {
        font-size: 14px;
        line-height: 1.6
    }

    :scope .pillar {
        min-height: 154px;
        justify-content: flex-start
    }

    :scope .pillar strong {
        margin-top: 2px;
        font-size: 15px
    }

    :scope .pillar p {
        margin: 8px 0 0;
        color: var(--muted);
        text-align: center
    }

    :scope .stat strong,
    :scope .stat span:last-child {
        font-size: 14px;
        line-height: 1.6
    }

    :scope .stat strong {
        font-weight: 600
    }

    :scope .eyebrow,
    :scope .school-unit-label {
        color: var(--red);
        font-size: 11px;
        font-weight: 700;
        line-height: 1.3;
        letter-spacing: .16em;
        text-transform: uppercase
    }

    :scope .section-heading h2,
    :scope .hero h1,
    :scope .stats-heading h2,
    :scope .final-cta h2 {
        color: var(--ink);
        font-size: 22px;
        font-weight: 700;
        line-height: 1.2
    }

    :scope .card h3,
    :scope .choice-card .card h3,
    :scope .benefit-panel h3,
    :scope .person-info h3,
    :scope .structure-item strong,
    :scope .step h3,
    :scope .school-unit-card h3,
    :scope .pillar strong,
    :scope .faq summary {
        color: var(--ink);
        font-size: 16px;
        font-weight: 700;
        line-height: 1.35
    }

    :scope .hero-lead,
    :scope .hero-note,
    :scope .section-heading p,
    :scope .choice-card .section-heading p,
    :scope .card p,
    :scope .card li,
    :scope .choice-card .card p,
    :scope .choice-card .card li,
    :scope .pillar p,
    :scope .benefit-panel,
    :scope .check,
    :scope .person-info p,
    :scope .step p,
    :scope .faq details p,
    :scope .testimonial-note,
    :scope .school-unit-card p,
    :scope .final-cta p,
    :scope .stat span:last-child {
        color: var(--muted);
        font-size: 14px;
        font-weight: 400;
        line-height: 1.6
    }

    :scope .stat span:last-child,
    :scope .pillar p {
        min-height: 44.8px;
        display: -webkit-box;
        overflow: hidden;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
        line-clamp: 2;
        text-align: center
    }

    :scope .stat span:last-child {
        max-width: 24ch;
        margin: 0 auto
    }

    :scope .pillar p {
        max-width: 40ch;
        margin: 8px auto 0
    }

    :scope .heading-description {
        min-height: 44.8px;
        margin: 8px auto 0;
        color: var(--muted);
        font-size: 14px;
        font-weight: 400;
        line-height: 1.6;
        text-align: center
    }

    @media (max-width:620px) {
        :scope .heading-description {
            height: 39px;
            display: -webkit-box;
            overflow: hidden;
            -webkit-box-orient: vertical;
            -webkit-line-clamp: 2;
            line-clamp: 2;
            font-size: 13px;
            line-height: 1.5
        }

        :scope .heading-description br {
            display: none
        }
    }

    :scope .choice-card .card,
    :scope .pillar {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: flex-start;
        gap: 8px
    }

    :scope .choice-card .card-icon,
    :scope .pillar>span {
        flex: 0 0 36px;
        margin: 0
    }

    :scope .choice-card .card h3,
    :scope .pillar strong {
        margin: 0;
        line-height: 1.25
    }

    :scope .choice-card .card p,
    :scope .pillar p {
        margin: 0;
        line-height: 1.35
    }

    :scope .pillar p {
        min-height: 0;
        max-width: none;
        display: block;
        overflow: visible;
        -webkit-line-clamp: unset;
        line-clamp: unset
    }

    :scope .person-card {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: flex-start;
        gap: 8px;
        padding: 20px
    }

    :scope .person-photo {
        flex: 0 0 48px;
        margin: 0
    }

    :scope .person-info {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 8px;
        padding: 0
    }

    :scope .person-info h3,
    :scope .person-info p {
        margin: 0
    }

    :scope .person-info h3 {
        line-height: 1.25
    }

    :scope .person-info p {
        line-height: 1.35
    }

    :scope #footer-container {
        max-width: 1120px;
        margin: 24px auto 0
    }

    :scope #footer-container .footer {
        margin: 0;
        padding: 28px 16px;
        border-radius: 0;
        background: transparent;
        color: #666;
        text-align: center
    }

    :scope #footer-container .footer-main {
        margin: 0;
        color: #666;
        font-size: 14px
    }

    :scope #footer-container .footer-sub {
        margin: 4px 0 0;
        color: #999;
        font-size: 11px;
        line-height: 1.4
    }
}

@scope (body.page-form.page-training-planner) {
    :scope {
        --metro-red: #e30613;
        --metro-dark: #0d0d0f;
        --metro-black: #151515;
        --metro-white: #ffffff;
        --metro-gray: #f4f4f5;
        --metro-line: rgba(255, 255, 255, .72);
        --shadow: 0 18px 45px rgba(0, 0, 0, .18);
        --radius: 22px
    }

    * {
        box-sizing: border-box
    }

    :scope {
        margin: 0;
        font-family: Inter, Arial, Helvetica, sans-serif;
        background: linear-gradient(135deg, #070707 0%, #141414 45%, #2b0003 100%);
        color: #171717;
        min-height: 100vh
    }

    .app-shell {
        max-width: 1440px;
        margin: 0 auto;
        padding: 22px
    }

    .topbar {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 18px;
        background: rgba(255, 255, 255, .08);
        border: 1px solid rgba(255, 255, 255, .14);
        color: #fff;
        border-radius: var(--radius);
        padding: 18px 22px;
        box-shadow: var(--shadow);
        backdrop-filter: blur(8px)
    }

    .brand {
        display: flex;
        align-items: center;
        gap: 14px
    }

    .brand-mark {
        width: 54px;
        height: 54px;
        border-radius: 16px;
        background: #fff;
        color: var(--metro-red);
        display: grid;
        place-items: center;
        font-weight: 900;
        font-size: 30px;
        letter-spacing: -2px
    }

    .brand small {
        display: block;
        color: #ddd;
        margin-top: 4px;
        font-weight: 600
    }

    h1 {
        font-size: 24px;
        margin: 0;
        line-height: 1.1;
        text-transform: uppercase;
        letter-spacing: .5px
    }

    .actions {
        display: flex;
        gap: 10px;
        flex-wrap: wrap;
        justify-content: flex-end
    }

    button,
    .btn {
        border: 0;
        border-radius: 999px;
        padding: 11px 15px;
        font-weight: 800;
        cursor: pointer;
        background: #fff;
        color: #151515;
        transition: .2s;
        text-decoration: none;
        font-size: 13px
    }

    button:hover,
    .btn:hover {
        transform: translateY(-1px);
        box-shadow: 0 10px 20px rgba(0, 0, 0, .2)
    }

    .primary {
        background: var(--metro-red);
        color: #fff
    }

    .dark {
        background: #111;
        color: #fff
    }

    .ghost {
        background: rgba(255, 255, 255, .12);
        color: #fff;
        border: 1px solid rgba(255, 255, 255, .2)
    }

    .layout {
        display: grid;
        grid-template-columns: 340px 1fr 320px;
        gap: 18px;
        margin-top: 18px;
        align-items: start
    }

    .panel {
        background: #fff;
        border-radius: var(--radius);
        box-shadow: var(--shadow);
        overflow: hidden;
        border: 1px solid rgba(0, 0, 0, .06)
    }

    .panel-header {
        padding: 16px 18px;
        background: #111;
        color: #fff;
        display: flex;
        justify-content: space-between;
        align-items: center;
        gap: 12px
    }

    .panel-header h2 {
        font-size: 15px;
        margin: 0;
        text-transform: uppercase;
        letter-spacing: .6px
    }

    .panel-:scope {
        padding: 16px
    }

    label {
        font-size: 12px;
        font-weight: 900;
        text-transform: uppercase;
        color: #444;
        display: block;
        margin: 10px 0 6px
    }

    input,
    select,
    textarea {
        width: 100%;
        border: 1px solid #ddd;
        border-radius: 14px;
        padding: 11px 12px;
        font: inherit;
        background: #fafafa;
        outline: none
    }

    textarea {
        min-height: 98px;
        resize: vertical
    }

    .row {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 10px
    }

    .activity-card {
        border: 1px solid #eee;
        border-radius: 18px;
        padding: 13px;
        margin-bottom: 10px;
        cursor: pointer;
        background: #fafafa;
        transition: .2s
    }

    .activity-card.active {
        border-color: var(--metro-red);
        background: #fff5f5;
        box-shadow: 0 8px 24px rgba(227, 6, 19, .12)
    }

    .activity-card strong {
        display: block;
        font-size: 14px
    }

    .activity-card span {
        font-size: 12px;
        color: #555;
        font-weight: 700
    }

    .field-wrap {
        padding: 14px;
        background: #f7f7f8
    }

    .field-toolbar {
        display: flex;
        gap: 8px;
        flex-wrap: wrap;
        margin-bottom: 12px
    }

    .board-switcher {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        flex-wrap: wrap;
        margin-bottom: 12px
    }

    .board-switcher button {
        border: 1px solid #dedee2;
        background: #fff;
        padding: 8px 12px
    }

    :scope .planner-card .board-switcher button.is-active {
        background: var(--metro-red);
        border-color: var(--metro-red);
        color: #fff
    }

    .board-switcher .add-board {
        margin-left: auto
    }

    .board-switcher button:disabled {
        cursor: not-allowed;
        opacity: .45;
        transform: none;
        box-shadow: none
    }

    .preview-actions {
        display: flex;
        justify-content: center;
        gap: 10px;
        flex-wrap: wrap;
        margin-top: 16px
    }

    .field {
        position: relative;
        width: 100%;
        aspect-ratio: 105/68;
        border-radius: 20px;
        overflow: hidden;
        background: linear-gradient(90deg, #16843b 0%, #16843b 10%, #1b9343 10%, #1b9343 20%, #16843b 20%, #16843b 30%, #1b9343 30%, #1b9343 40%, #16843b 40%, #16843b 50%, #1b9343 50%, #1b9343 60%, #16843b 60%, #16843b 70%, #1b9343 70%, #1b9343 80%, #16843b 80%, #16843b 90%, #1b9343 90%, #1b9343 100%);
        border: 5px solid #fff;
        box-shadow: inset 0 0 0 2px rgba(255, 255, 255, .55), 0 22px 40px rgba(0, 0, 0, .18);
        user-select: none
    }

    .field:before {
        content: "";
        position: absolute;
        inset: 5.5%;
        border: 2px solid var(--metro-line);
        border-radius: 8px
    }

    .half {
        position: absolute;
        top: 5.5%;
        bottom: 5.5%;
        left: 50%;
        border-left: 2px solid var(--metro-line)
    }

    .circle {
        position: absolute;
        width: 16%;
        aspect-ratio: 1;
        left: 42%;
        top: 38%;
        border: 2px solid var(--metro-line);
        border-radius: 50%
    }

    .spot {
        position: absolute;
        width: 7px;
        height: 7px;
        border-radius: 50%;
        background: #fff;
        left: calc(50% - 3.5px);
        top: calc(50% - 3.5px)
    }

    .box {
        position: absolute;
        top: 28%;
        width: 13%;
        height: 44%;
        border: 2px solid var(--metro-line)
    }

    .box.left {
        left: 5.5%;
        border-left: 0
    }

    .box.right {
        right: 5.5%;
        border-right: 0
    }

    .smallbox {
        position: absolute;
        top: 39%;
        width: 5.5%;
        height: 22%;
        border: 2px solid var(--metro-line)
    }

    .smallbox.left {
        left: 5.5%;
        border-left: 0
    }

    .smallbox.right {
        right: 5.5%;
        border-right: 0
    }

    .palette {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 9px
    }

    .tool {
        min-height: 74px;
        border: 1px solid #eee;
        border-radius: 16px;
        background: #fafafa;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 6px;
        font-size: 12px;
        font-weight: 800;
        cursor: pointer;
        text-align: center
    }

    .tool:hover {
        border-color: var(--metro-red);
        background: #fff5f5
    }

    .ico {
        font-size: 24px
    }

    .hint {
        font-size: 12px;
        color: #666;
        line-height: 1.45;
        background: #f7f7f7;
        border-radius: 14px;
        padding: 10px;
        margin-top: 10px
    }

    .obj {
        position: absolute;
        left: 20%;
        top: 20%;
        display: grid;
        place-items: center;
        cursor: move;
        touch-action: none;
        font-weight: 900;
        z-index: 5
    }

    .obj.selected {
        outline: 3px solid #fff;
        filter: drop-shadow(0 0 6px var(--metro-red))
    }

    .player {
        width: 30px;
        height: 30px;
        border-radius: 50%;
        background: #111;
        color: #fff;
        border: 3px solid #fff;
        font-size: 13px
    }

    .player.red {
        background: var(--metro-red)
    }

    .player.white {
        background: #fff;
        color: #111;
        border-color: #111
    }

    .player.blue {
        background: #165dff
    }

    .cone {
        width: 0;
        height: 0;
        border-left: 13px solid transparent;
        border-right: 13px solid transparent;
        border-bottom: 28px solid #ff8a00;
        filter: drop-shadow(0 2px 2px rgba(0, 0, 0, .25))
    }

    .ball {
        width: 22px;
        height: 22px;
        border-radius: 50%;
        background: #fff;
        border: 3px solid #111
    }

    .goal {
        width: 52px;
        height: 24px;
        border: 4px solid #fff;
        background: rgba(0, 0, 0, .12);
        border-radius: 4px
    }

    .zone {
        width: 92px;
        height: 60px;
        border: 3px dashed #fff;
        background: rgba(227, 6, 19, .18);
        border-radius: 8px
    }

    .arrow {
        width: 90px;
        height: 4px;
        background: #fff;
        transform-origin: left center
    }

    .arrow:after {
        content: "";
        position: absolute;
        right: -2px;
        top: -7px;
        border-left: 16px solid #fff;
        border-top: 9px solid transparent;
        border-bottom: 9px solid transparent
    }

    .txt {
        min-width: 60px;
        min-height: 24px;
        color: #fff;
        text-shadow: 0 2px 4px rgba(0, 0, 0, .5);
        font-size: 16px;
        letter-spacing: .4px
    }

    .properties small {
        font-size: 12px;
        color: #666;
        display: block;
        margin-top: 8px
    }

    .danger {
        background: #e30613;
        color: #fff;
        width: 100%;
        margin-top: 10px
    }

    .list-mini {
        padding-left: 18px;
        line-height: 1.5;
        font-size: 13px;
        color: #333
    }

    .footer-note {
        color: #ddd;
        text-align: center;
        font-size: 12px;
        margin: 16px 0 4px
    }

    @media(max-width:1100px) {
        .layout {
            grid-template-columns: 1fr
        }

        .topbar {
            align-items: flex-start;
            flex-direction: column
        }

        .actions {
            justify-content: flex-start
        }

        .field {
            min-height: 420px
        }
    }

    :scope {
        background: #f5f5f5;
        color: #171717;
        font-family: "Space Grotesk", sans-serif
    }

    :scope .page {
        max-width: 1600px;
        grid-template-columns: 420px minmax(0, 1fr);
        align-items: start
    }

    :scope .form-wrapper {
        min-width: 0;
        display: block
    }

    :scope .planner-card {
        padding: 0;
        overflow: hidden;
        border-top: 5px solid var(--metro-red)
    }

    :scope .app-shell {
        max-width: none;
        padding: 0
    }

    :scope .topbar {
        align-items: flex-start;
        border: 0;
        border-radius: 0;
        background: #fff;
        box-shadow: none;
        padding: 28px 30px 24px;
        border-bottom: 1px solid #ececef
    }

    :scope .planner-heading {
        max-width: 560px
    }

    :scope .section-eyebrow {
        display: block;
        margin-bottom: 7px;
        color: var(--metro-red);
        font-size: 10px;
        font-weight: 700;
        letter-spacing: .16em;
        text-transform: uppercase
    }

    :scope .planner-heading h1 {
        margin: 0;
        color: #151518;
        font-size: 27px;
        font-weight: 700;
        line-height: 1.15;
        letter-spacing: -.02em;
        text-transform: none
    }

    :scope .planner-heading p {
        margin-top: 8px;
        color: #707075;
        font-size: 13px;
        line-height: 1.5
    }

    :scope .planner-card .actions {
        display: flex;
        justify-content: flex-end;
        gap: 9px;
        flex-wrap: wrap
    }

    :scope .planner-card button,
    :scope .planner-card .btn {
        width: auto;
        min-height: 38px;
        padding: 10px 14px;
        border: 1px solid #d9d9de;
        border-radius: 999px;
        background: #f5f5f6;
        color: #35353a;
        font-size: 12px;
        font-weight: 700;
        line-height: 1;
        white-space: nowrap
    }

    :scope .planner-card .actions .ghost {
        background: #fff
    }

    :scope .planner-card .actions .primary,
    :scope .planner-card .panel-header .primary,
    :scope .planner-card .danger {
        border-color: var(--metro-red);
        background: var(--metro-red);
        color: #fff
    }

    :scope .planner-card label {
        display: block;
        margin: 12px 0 6px;
        color: #57575c;
        font-size: 11px;
        font-weight: 700;
        letter-spacing: .05em
    }

    :scope .planner-card input:not([type="range"]):not([type="file"]),
    :scope .planner-card select,
    :scope .planner-card textarea {
        width: 100%;
        min-height: 42px;
        margin: 0;
        padding: 10px 12px;
        border: 1px solid #dcdce0;
        border-radius: 12px;
        background: #fff;
        color: #202024;
        font: 500 13px/1.35 "Space Grotesk", sans-serif
    }

    :scope .planner-card textarea {
        min-height: 94px;
        resize: vertical
    }

    :scope .planner-card input:focus,
    :scope .planner-card select:focus,
    :scope .planner-card textarea:focus {
        border-color: var(--metro-red);
        outline: 3px solid rgba(227, 6, 19, .1)
    }

    :scope .planner-card .row {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 12px
    }

    :scope .layout {
        grid-template-columns: 250px minmax(0, 1fr);
        gap: 0;
        margin: 0
    }

    :scope .panel {
        border: 0;
        border-right: 1px solid #e6e6e8;
        border-radius: 0;
        box-shadow: none
    }

    :scope .panel-header {
        min-height: 58px;
        padding: 15px 18px;
        background: #f4f4f5;
        color: #171717;
        border-bottom: 1px solid #e6e6e8
    }

    :scope .panel-header h2 {
        margin: 0;
        color: #171717;
        font-size: 13px;
        line-height: 1.35
    }

    :scope .panel-:scope {
        padding: 18px
    }

    :scope .activity-card {
        margin-bottom: 10px;
        padding: 12px;
        border-radius: 14px
    }

    :scope .activity-card strong {
        margin-bottom: 4px
    }

    :scope .object-workbench {
        padding: 20px 18px;
        border-top: 1px solid #ececef;
        background: #fafafa
    }

    :scope .workbench-heading {
        display: flex;
        align-items: end;
        justify-content: space-between;
        gap: 20px;
        margin-bottom: 14px
    }

    :scope .workbench-heading h3,
    :scope .settings-heading h3 {
        margin: 0;
        color: #242428;
        font-size: 16px
    }

    :scope .workbench-heading p {
        color: #74747a;
        font-size: 12px
    }

    :scope .palette {
        display: grid;
        grid-template-columns: repeat(7, minmax(76px, 1fr));
        gap: 9px
    }

    :scope .planner-card .tool {
        width: 100%;
        min-height: 76px;
        padding: 9px 6px;
        border: 1px solid #e0e0e4;
        border-radius: 14px;
        background: #fff;
        color: #2d2d31;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 5px;
        white-space: normal
    }

    :scope .planner-card .tool:hover {
        border-color: var(--metro-red);
        background: #fff6f6;
        color: var(--metro-red);
        transform: translateY(-1px)
    }

    :scope .planner-card .tool .ico {
        font-size: 22px;
        line-height: 1
    }

    :scope .field-wrap {
        padding: 18px;
        background: #f4f4f5
    }

    :scope .field-toolbar {
        display: flex;
        align-items: center;
        gap: 8px;
        margin-bottom: 12px
    }

    :scope .toolbar-label {
        margin-right: auto;
        color: #66666c;
        font-size: 11px;
        font-weight: 700;
        letter-spacing: .05em;
        text-transform: uppercase
    }

    :scope .field-toolbar button {
        min-height: 34px;
        padding: 8px 12px;
        border: 1px solid #dedee2;
        background: #fff
    }

    :scope .field-toolbar .dark {
        border-color: #171717;
        background: #171717;
        color: #fff
    }

    :scope .object-settings {
        display: grid;
        grid-template-columns: 180px 1fr;
        gap: 22px;
        padding: 20px 18px;
        border-top: 1px solid #ececef;
        background: #fff
    }

    :scope .properties {
        display: grid;
        grid-template-columns: minmax(150px, 1.2fr) minmax(130px, 1fr) minmax(120px, .8fr) minmax(120px, .8fr) auto;
        align-items: end;
        gap: 12px
    }

    :scope .properties label {
        margin-top: 0
    }

    :scope .properties input[type="range"] {
        width: 100%;
        min-height: 42px;
        accent-color: var(--metro-red)
    }

    :scope .properties .danger {
        min-height: 42px;
        margin: 0
    }

    :scope .materials-panel {
        margin: 0;
        padding: 0 18px 20px;
        background: #fff
    }

    :scope .materials-panel summary {
        padding: 12px 14px;
        border: 1px solid #e2e2e5;
        border-radius: 12px;
        color: #48484d;
        font-size: 12px;
        font-weight: 700;
        cursor: pointer
    }

    :scope .materials-panel .list-mini {
        display: flex;
        flex-wrap: wrap;
        gap: 8px 22px;
        margin: 12px 0 0;
        padding: 0 18px
    }

    :scope .footer-note {
        margin: 0;
        padding: 15px 24px;
        color: #6f6f73;
        background: #fafafa;
        border-top: 1px solid #ececee
    }

    :scope>#footer-container {
        width: min(1600px, calc(100% - 32px));
        margin: 0 auto 28px
    }

    @media(max-width:1450px) {
        :scope .properties {
            grid-template-columns: repeat(2, minmax(160px, 1fr))
        }

        :scope .properties .danger {
            grid-column: 1/-1
        }
    }

    @media(max-width:980px) {
        :scope .layout {
            grid-template-columns: 1fr
        }

        :scope .panel {
            border-right: 0;
            border-bottom: 1px solid #e6e6e8
        }

        :scope .topbar,
        :scope .planner-card .actions {
            align-items: flex-start;
            justify-content: flex-start
        }

        :scope .palette {
            grid-template-columns: repeat(4, minmax(76px, 1fr))
        }

        :scope .object-settings {
            grid-template-columns: 1fr
        }
    }

    @media(max-width:620px) {

        :scope .planner-card .actions,
        :scope .field-toolbar,
        :scope .workbench-heading {
            flex-direction: column;
            align-items: stretch
        }

        :scope .planner-card .actions button,
        :scope .planner-card .actions .btn,
        :scope .field-toolbar button {
            width: 100%
        }

        :scope .palette,
        :scope .properties {
            grid-template-columns: repeat(2, minmax(0, 1fr))
        }
    }

    :scope .page {
        max-width: 1120px;
        grid-template-columns: 420px minmax(0, 1fr);
        gap: 40px
    }

    :scope .planner-column {
        display: flex;
        flex-direction: column;
        gap: 24px;
        width: 100%;
        min-width: 0
    }

    :scope .planner-header-card,
    :scope .planner-card {
        width: 100%;
        min-width: 0;
        max-width: 100%;
        border: 1px solid rgba(0, 0, 0, .08);
        border-radius: 28px;
        background: #fff;
        box-shadow: 0 14px 35px rgba(0, 0, 0, .06)
    }

    :scope .planner-header-card {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 20px;
        padding: 24px
    }

    :scope .planner-heading {
        max-width: none
    }

    :scope .planner-heading h1 {
        font-size: 24px
    }

    :scope .planner-header-card .actions {
        display: flex;
        flex-wrap: wrap;
        gap: 10px;
        width: 100%
    }

    :scope .planner-header-card button,
    :scope .planner-header-card .btn {
        width: auto;
        min-height: 38px;
        padding: 10px 14px;
        border: 1px solid #d8d8dc;
        border-radius: 999px;
        background: #fff;
        color: #505055;
        font: 700 11px/1 "Space Grotesk", sans-serif;
        text-transform: uppercase;
        white-space: nowrap;
        cursor: pointer
    }

    :scope .planner-header-card .primary {
        border-color: var(--metro-red);
        background: var(--metro-red);
        color: #fff
    }

    :scope .planner-card {
        border-top: 1px solid rgba(0, 0, 0, .08);
        overflow: hidden
    }

    :scope .app-shell,
    :scope .layout,
    :scope .panel,
    :scope .panel-:scope,
    :scope .object-workbench,
    :scope .field-wrap,
    :scope .object-settings {
        min-width: 0;
        max-width: 100%
    }

    :scope .layout {
        grid-template-columns: 1fr
    }

    :scope .left-panel {
        border-right: 0;
        border-bottom: 1px solid #e6e6e8
    }

    :scope .panel-header {
        padding: 14px
    }

    :scope .panel-:scope,
    :scope .object-workbench,
    :scope .field-wrap,
    :scope .object-settings {
        padding: 16px
    }

    :scope .planner-card .row {
        grid-template-columns: 1fr
    }

    :scope .palette {
        grid-template-columns: repeat(auto-fit, minmax(72px, 1fr))
    }

    :scope .workbench-heading {
        align-items: flex-start;
        flex-direction: column;
        gap: 5px
    }

    :scope .field-toolbar {
        align-items: stretch;
        flex-wrap: wrap
    }

    :scope .toolbar-label {
        flex-basis: 100%;
        margin: 0 0 2px
    }

    :scope .field {
        width: 100%;
        max-width: 100%
    }

    :scope .object-settings {
        grid-template-columns: 1fr;
        gap: 14px
    }

    :scope .properties {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }

    :scope .properties .danger {
        grid-column: 1/-1;
        width: 100%
    }

    :scope>#footer-container {
        width: min(1120px, calc(100% - 32px))
    }

    @media(max-width:900px) {
        :scope .page {
            grid-template-columns: 1fr
        }

        :scope #profile-card-container {
            min-width: 0
        }
    }

    @media(max-width:680px) {

        :scope .layout,
        :scope .properties {
            grid-template-columns: 1fr
        }

        :scope .planner-header-card .actions button,
        :scope .planner-header-card .actions .btn {
            width: 100%;
            text-align: center
        }
    }

    :scope .planner-header-card .actions {
        justify-content: center
    }

    :scope .duration-summary {
        display: grid;
        grid-template-columns: 1fr;
        gap: 8px;
        margin: 16px 0 4px
    }

    :scope .duration-summary>div {
        padding: 10px;
        border: 1px solid #f0c5c7;
        border-radius: 12px;
        background: #fff7f7;
        text-align: center
    }

    :scope .duration-summary span,
    :scope .duration-summary strong {
        display: block
    }

    :scope .duration-summary span {
        margin-bottom: 3px;
        color: #77777c;
        font-size: 9px;
        font-weight: 700;
        letter-spacing: .06em;
        text-transform: uppercase
    }

    :scope .duration-summary strong {
        color: var(--metro-red);
        font-size: 14px
    }

    :scope .activity-card-head {
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        gap: 8px
    }

    :scope .activity-card .activity-duration {
        display: inline-flex;
        margin-top: 8px;
        padding: 4px 8px;
        border-radius: 999px;
        background: #ededf0;
        color: #505055;
        font-size: 10px;
        font-weight: 700
    }

    :scope .planner-card .delete-activity {
        width: 28px;
        min-width: 28px;
        min-height: 28px;
        padding: 0;
        border: 1px solid #efb5b8;
        border-radius: 50%;
        background: #fff;
        color: var(--metro-red);
        font-size: 17px;
        line-height: 1
    }

    :scope .planner-card .delete-activity:hover {
        border-color: var(--metro-red);
        background: var(--metro-red);
        color: #fff
    }

    :scope .left-panel+.panel>.panel-header {
        align-items: flex-start;
        flex-direction: column;
        gap: 5px
    }

    :scope #currentTitle {
        display: block;
        width: 100%;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        text-align: center
    }

    :scope #currentMeta {
        display: block;
        width: 100%;
        color: #55555a;
        font-size: 12px;
        font-weight: 600;
        text-align: center
    }

    :scope .obj.isokinetic,
    :scope .obj.traction,
    :scope .obj.jumpbox {
        min-width: 48px;
        min-height: 34px;
        padding: 5px 8px;
        border: 3px solid #fff;
        border-radius: 8px;
        color: #fff;
        font-size: 10px;
        line-height: 1.1;
        text-align: center;
        box-shadow: 0 3px 8px rgba(0, 0, 0, .28)
    }

    :scope .obj.isokinetic {
        background: #555b66
    }

    :scope .obj.traction {
        min-width: 70px;
        border-radius: 999px;
        background: #e30613
    }

    :scope .obj.jumpbox {
        min-width: 58px;
        min-height: 42px;
        border-radius: 4px;
        background: #9c5b2e
    }

    :scope .left-panel>.panel-header {
        justify-content: center
    }

    :scope .left-panel>.panel-header .primary {
        margin: 0 auto
    }

    :scope.pdf-exporting .planner-header-card .actions,
    :scope.pdf-exporting .delete-activity {
        display: none !important
    }

    :scope.modal-open {
        overflow: hidden
    }

    :scope .tactical-preview {
        padding: 18px 16px 20px;
        border-top: 1px solid #ececef;
        background: #fafafa
    }

    :scope .preview-heading {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 16px;
        margin-bottom: 14px
    }

    :scope .preview-heading h3 {
        margin: 0;
        color: #242428;
        font-size: 16px
    }

    :scope .preview-field-wrap {
        padding: 0;
        border-radius: 18px;
        background: transparent
    }

    :scope .field-preview {
        pointer-events: none;
        box-shadow: inset 0 0 0 2px rgba(255, 255, 255, .55)
    }

    :scope .field-preview .obj {
        cursor: default
    }

    :scope .tactical-modal {
        display: none;
        position: fixed;
        inset: 0;
        z-index: 1000;
        padding: 20px;
        overflow: auto;
        background: rgba(10, 10, 12, .78);
        backdrop-filter: blur(6px)
    }

    :scope .tactical-modal.is-open {
        display: block
    }

    :scope .tactical-modal-dialog {
        width: min(1180px, 100%);
        margin: 0 auto;
        overflow: hidden;
        border-radius: 26px;
        background: #fff;
        box-shadow: 0 28px 90px rgba(0, 0, 0, .38)
    }

    :scope .tactical-modal-header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 20px;
        padding: 20px 24px;
        border-bottom: 1px solid #e7e7ea;
        background: #fff
    }

    :scope .tactical-modal-header h2 {
        margin: 0;
        color: #18181b;
        font-size: 24px
    }

    :scope .planner-card .modal-close {
        width: 42px;
        min-width: 42px;
        min-height: 42px;
        padding: 0;
        border: 1px solid #dedee2;
        border-radius: 50%;
        background: #f5f5f6;
        color: #242428;
        font-size: 25px
    }

    :scope .tactical-modal .object-workbench,
    :scope .tactical-modal .field-wrap,
    :scope .tactical-modal .object-settings {
        padding: 22px 24px
    }

    :scope .tactical-modal .field {
        max-width: 920px;
        margin: 0 auto
    }

    :scope .tactical-modal .properties {
        grid-template-columns: minmax(160px, 1.2fr) minmax(140px, 1fr) minmax(130px, .8fr) minmax(130px, .8fr) auto
    }

    :scope .tactical-modal .properties .danger {
        grid-column: auto;
        width: auto
    }

    @media(max-width:760px) {
        :scope .preview-heading {
            align-items: stretch;
            flex-direction: column
        }

        :scope .preview-heading button {
            width: 100%
        }

        :scope .tactical-modal {
            padding: 8px
        }

        :scope .tactical-modal .properties {
            grid-template-columns: 1fr
        }

        :scope .tactical-modal .properties .danger {
            width: 100%
        }
    }

    :scope .tactical-modal {
        padding: 12px
    }

    :scope .tactical-modal-dialog {
        width: min(980px, 100%);
        max-height: calc(100vh - 24px);
        overflow: auto;
        border-radius: 20px
    }

    :scope .tactical-modal-header {
        padding: 12px 18px
    }

    :scope .tactical-modal-header .section-eyebrow {
        margin-bottom: 3px;
        font-size: 9px
    }

    :scope .tactical-modal-header h2 {
        font-size: 20px
    }

    :scope .planner-card .modal-close {
        width: 36px;
        min-width: 36px;
        min-height: 36px;
        font-size: 21px
    }

    :scope .tactical-modal .workbench-heading {
        display: none
    }

    :scope .tactical-modal .object-workbench {
        padding: 12px 18px
    }

    :scope .tactical-modal .palette {
        gap: 7px
    }

    :scope .tactical-modal .planner-card .tool,
    :scope .tactical-modal .tool {
        min-height: 58px;
        padding: 6px 4px;
        border-radius: 11px;
        font-size: 10px
    }

    :scope .tactical-modal .tool .ico {
        font-size: 18px
    }

    :scope .tactical-modal .field-wrap {
        padding: 10px 18px 14px
    }

    :scope .tactical-modal .field-toolbar {
        gap: 6px;
        margin-bottom: 8px
    }

    :scope .tactical-modal .toolbar-label {
        font-size: 9px
    }

    :scope .tactical-modal .field-toolbar button {
        min-height: 30px;
        padding: 6px 10px;
        font-size: 10px
    }

    :scope .tactical-modal .field {
        max-width: 720px
    }

    :scope .tactical-modal .object-settings {
        gap: 12px;
        padding: 12px 18px 16px
    }

    :scope .tactical-modal .settings-heading h3 {
        font-size: 15px
    }

    :scope .tactical-modal .properties {
        gap: 8px
    }

    :scope .planner-confirm-modal {
        display: none;
        position: fixed;
        inset: 0;
        z-index: 1200;
        place-items: center;
        padding: 20px;
        background: rgba(15, 15, 18, .58);
        backdrop-filter: blur(4px)
    }

    :scope .planner-confirm-modal.is-open {
        display: grid
    }

    :scope .planner-confirm-dialog {
        width: min(430px, 100%);
        padding: 26px;
        border: 1px solid rgba(0, 0, 0, .08);
        border-radius: 22px;
        background: #fff;
        box-shadow: 0 24px 70px rgba(0, 0, 0, .28);
        text-align: center
    }

    :scope .planner-confirm-dialog .modal-title {
        display: block;
        width: 100%;
        margin-bottom: 10px;
        color: #18181b;
        font-size: 20px;
        font-weight: 700;
        text-align: center
    }

    :scope .planner-confirm-dialog .modal-text {
        display: block;
        width: 100%;
        margin: 0 auto;
        color: #68686e;
        font-size: 14px;
        line-height: 1.55;
        text-align: center
    }

    :scope .planner-confirm-actions {
        display: flex;
        justify-content: center;
        gap: 10px;
        margin-top: 22px
    }

    :scope .planner-confirm-actions button {
        min-height: 40px;
        padding: 10px 18px;
        border: 1px solid #d9d9dd;
        border-radius: 999px;
        background: #fff;
        color: #45454a;
        font: 700 12px/1 "Space Grotesk", sans-serif;
        cursor: pointer
    }

    :scope .planner-confirm-actions .primary {
        border-color: var(--metro-red);
        background: var(--metro-red);
        color: #fff
    }

    :scope .planner-card,
    :scope .planner-card .panel,
    :scope .planner-card .panel-header,
    :scope .planner-card .panel-:scope,
    :scope .tactical-preview {
        background: #fff
    }

    :scope .left-panel .panel-body label,
    :scope .left-panel .activity-card {
        text-align: center
    }

    :scope .left-panel .activity-card-head {
        position: relative;
        justify-content: center;
        padding: 0 30px
    }

    :scope .left-panel .activity-card-head .delete-activity {
        position: absolute;
        top: 50%;
        right: 0;
        transform: translateY(-50%)
    }

    :scope .left-panel input,
    :scope .left-panel select {
        text-align: center;
        text-align-last: center
    }

    :scope .planner-card .session-meta-row {
        gap: 0 12px
    }

    :scope .athlete-selection {
        margin: 14px 0 4px;
        padding: 14px;
        border: 1px solid #e2e2e5;
        border-radius: 14px;
        background: #fafafa
    }

    :scope .athlete-selection>label {
        margin-top: 0
    }

    :scope .athlete-list {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 6px;
        max-height: 230px;
        overflow-x: hidden;
        overflow-y: auto
    }

    :scope .athlete-option {
        position: relative;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: flex-start;
        gap: 5px;
        width: 100%;
        max-width: 100%;
        min-width: 0;
        margin: 0;
        padding: 8px 5px;
        border: 1px solid #dddde1;
        border-radius: 10px;
        background: #fff;
        color: #35353a;
        font-size: 11px;
        font-weight: 600;
        cursor: pointer;
        text-transform: none
    }

    :scope .athlete-option:has(input:checked) {
        border-color: var(--metro-red);
        background: #fff5f5;
        color: #b9000c
    }

    :scope .athlete-option input {
        position: absolute;
        opacity: 0;
        pointer-events: none
    }

    :scope .athlete-photo {
        display: block;
        flex: 0 0 67px;
        width: 67px !important;
        min-width: 67px;
        max-width: 67px;
        height: 67px !important;
        min-height: 67px;
        max-height: 67px;
        margin-inline: auto;
        overflow: hidden;
        border: 1px solid #dddde1;
        border-radius: 50%;
        background: #f1f1f2
    }

    :scope .athlete-photo img {
        display: block;
        width: 67px !important;
        min-width: 67px;
        max-width: 67px;
        height: 67px !important;
        min-height: 67px;
        max-height: 67px;
        object-fit: cover;
        object-position: center top
    }

    :scope .athlete-info {
        display: block;
        width: 100%;
        min-width: 0;
        text-align: center
    }

    :scope .athlete-name {
        display: block;
        max-width: 100%;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: normal;
        color: #171717;
        font-size: 10px;
        text-align: center;
        line-height: 1.2
    }

    :scope .athlete-position {
        display: block;
        margin-top: 2px;
        color: #77777c;
        font-size: 9px;
        font-weight: 800;
        text-align: center;
        text-transform: uppercase
    }

    :scope .activity-materials {
        margin: 12px 0
    }

    :scope .material-options {
        display: flex;
        flex-direction: column;
        gap: 6px
    }

    :scope .material-option {
        display: grid;
        grid-template-columns: 18px minmax(0, 1fr) 76px;
        align-items: center;
        gap: 7px;
        min-width: 0;
        margin: 0;
        padding: 7px 10px;
        border: 1px solid #dddde1;
        border-radius: 10px;
        background: #fff;
        font-size: 10px;
        font-weight: 700;
        text-transform: none;
        cursor: pointer
    }

    :scope .material-option:has(input:checked) {
        border-color: var(--metro-red);
        background: #fff5f5;
        color: #b9000c
    }

    :scope .material-option input {
        width: 15px;
        min-height: 15px;
        margin: 0;
        accent-color: var(--metro-red)
    }

    :scope .material-option .material-quantity {
        width: 76px;
        min-height: 34px;
        padding: 6px 8px;
        border-radius: 8px;
        background: #fff;
        text-align: center
    }

    :scope .material-option:not(:has(input:checked)) .material-quantity {
        opacity: .45
    }

    :scope .planner-card .panel-body label {
        margin: 16px 0 6px
    }

    :scope .planner-card .panel-:scope .row {
        row-gap: 0
    }

    :scope .planner-card .panel-body input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):not(.material-quantity),
    :scope .planner-card .panel-body select,
    :scope .planner-card #actNotes {
        height: 48px;
        min-height: 48px
    }

    :scope .planner-card #actDescription {
        height: 192px;
        min-height: 192px
    }

    :scope .activity-materials {
        margin-top: 0
    }

    :scope .planner-card .panel,
    :scope .planner-card .left-panel {
        border-right: 0;
        border-bottom: 0
    }

    :scope .planner-card .panel-header {
        border-bottom: 0;
        min-height: 0;
        padding-bottom: 0
    }

    :scope .planner-card .panel-:scope {
        padding-top: 0
    }

    @media(max-width:760px) {
        :scope .session-meta-row {
            gap: 0
        }

        :scope .material-options {
            width: 100%
        }
    }

    :scope .athlete-status {
        margin: 10px 0 0;
        color: #77777c;
        font-size: 11px;
        text-align: center
    }

    @media(max-width:680px) {
        :scope .athlete-list {
            grid-template-columns: repeat(2, minmax(0, 1fr))
        }
    }
}

/* =========================================================
   CENTRAL DE LINKS — PADRONIZAÇÃO VISUAL DO PORTAL
   Mantém o card esquerdo intacto e ajusta apenas a coluna direita.
   ========================================================= */

body.page-links .portal-content {
    display: flex;
    flex-direction: column;
    gap: 24px;
    min-width: 0;
    font-family: "Space Grotesk", sans-serif;
    color: var(--metro-text);
}

/* Exibição focada ao selecionar uma categoria */
body.page-links .portal-content.category-view .portal-overview,
body.page-links .portal-content.category-view .portal-search-panel,
body.page-links .portal-content.category-view .quick-access {
    display: none;
}

/* Blocos principais */
body.page-links .portal-toolbar,
body.page-links .portal-overview,
body.page-links .portal-search-panel,
body.page-links .portal-section,
body.page-links .quick-access {
    background: #ffffff;
    border: 1px solid var(--metro-line);
    box-shadow: 0 14px 35px rgba(0, 0, 0, 0.06);
}

/* Navegação superior */
body.page-links .portal-toolbar {
    position: sticky;
    top: 24px;
    z-index: 8;
    padding: 16px 20px;
    border-radius: 24px;
}

body.page-links .portal-breadcrumb {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 14px;
    color: var(--metro-muted);
    font-size: 12px;
    line-height: 1.4;
}

body.page-links .portal-breadcrumb strong {
    color: var(--metro-text);
    font-weight: 700;
}

body.page-links .portal-nav {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

body.page-links .portal-nav button {
    border: 1px solid #d5d5d5;
    border-radius: 999px;
    padding: 8px 14px;
    background: #ffffff;
    color: #555555;
    font-family: "Space Grotesk", sans-serif;
    font-size: 12px;
    font-weight: 500;
    line-height: 1.2;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    cursor: pointer;
    transition: 0.18s ease-out;
}

body.page-links .portal-nav button:hover,
body.page-links .portal-nav button.active {
    border-color: var(--metro-red);
    background: var(--metro-red);
    color: #ffffff;
}

body.page-links .portal-nav button.active {
    box-shadow: 0 0 0 4px rgba(224, 32, 32, 0.18);
}

body.page-links .portal-nav button:focus-visible {
    outline: 0;
    box-shadow: 0 0 0 3px rgba(224, 32, 32, 0.22);
}

/* Resumo */
body.page-links .portal-overview {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
    padding: 18px;
    border-radius: 24px;
}

body.page-links .overview-card {
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 16px;
    border: 1px solid #e5e5e5;
    border-radius: 18px;
    background: #ffffff;
}

body.page-links .overview-icon {
    flex: 0 0 auto;
    color: var(--metro-red);
    font-size: 28px;
    line-height: 1;
}

body.page-links .overview-card>div {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

body.page-links .overview-card strong {
    color: var(--metro-text);
    font-size: 22px;
    font-weight: 700;
    line-height: 1;
}

body.page-links .overview-card span:last-child {
    margin-top: 6px;
    color: var(--metro-muted);
    font-size: 12px;
    line-height: 1.35;
}

/* Busca */
body.page-links .portal-search-panel {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 12px;
    padding: 14px;
    border-radius: 24px;
}

body.page-links .portal-search {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
    padding: 0 16px;
    border: 1px solid #d5d5d5;
    border-radius: 999px;
    background: #ffffff;
}

body.page-links .portal-search span {
    color: var(--metro-muted);
    font-size: 22px;
    line-height: 1;
}

body.page-links .portal-search input {
    width: 100%;
    min-width: 0;
    height: 44px;
    border: 0;
    outline: 0;
    background: transparent;
    color: var(--metro-text);
    font-family: "Space Grotesk", sans-serif;
    font-size: 13px;
    font-weight: 400;
}

body.page-links .portal-search input::placeholder {
    color: #999999;
}

body.page-links #clearFilters {
    min-height: 44px;
    padding: 0 18px;
    border: 1px solid #d5d5d5;
    border-radius: 999px;
    background: #ffffff;
    color: #555555;
    font-family: "Space Grotesk", sans-serif;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    transition: 0.18s ease-out;
}

body.page-links #clearFilters:hover {
    border-color: var(--metro-red);
    color: var(--metro-red);
}

/* Favoritos e últimos acessos */
body.page-links .quick-access {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
    padding: 18px;
    border-radius: 24px;
}

body.page-links .quick-access-block {
    min-width: 0;
    padding: 16px;
    border: 1px solid #e5e5e5;
    border-radius: 18px;
    background: #ffffff;
}

body.page-links .quick-access-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 14px;
    margin-bottom: 12px;
}

body.page-links .quick-access-heading h2 {
    color: var(--metro-text);
    font-size: 15px;
    font-weight: 700;
    line-height: 1.25;
}

body.page-links .quick-access-heading span {
    color: var(--metro-muted);
    font-size: 11px;
    line-height: 1.35;
    text-align: right;
}

body.page-links .quick-access-list {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

body.page-links .quick-access-list a {
    padding: 8px 12px;
    border: 1px solid #d5d5d5;
    border-radius: 999px;
    color: #555555;
    font-size: 12px;
    font-weight: 500;
    line-height: 1.2;
    text-decoration: none;
    transition: 0.18s ease-out;
}

body.page-links .quick-access-list a:hover {
    border-color: var(--metro-red);
    color: var(--metro-red);
}

/* Seções */
body.page-links .portal-section {
    margin-bottom: 24px;
    padding: 24px;
    border-radius: 28px;
    scroll-margin-top: 160px;
}

body.page-links .portal-section[hidden] {
    display: none;
}

body.page-links .portal-section-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 18px;
}

body.page-links .portal-section-title {
    display: flex;
    align-items: center;
    gap: 10px;
}

body.page-links .portal-section-icon {
    display: grid;
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
    place-items: center;
    border: 1px solid rgba(224, 32, 32, 0.24);
    border-radius: 12px;
    color: var(--metro-red);
    font-size: 16px;
}

body.page-links .portal-section-title h2 {
    color: var(--metro-text);
    font-size: 22px;
    font-weight: 700;
    line-height: 1.2;
}

body.page-links .portal-section-header p {
    margin: 8px 0 0 44px;
    color: var(--metro-muted);
    font-size: 14px;
    line-height: 1.55;
}

body.page-links .portal-section-count {
    flex: 0 0 auto;
    padding: 7px 12px;
    border: 1px solid #d5d5d5;
    border-radius: 999px;
    color: #555555;
    font-size: 11px;
    font-weight: 600;
    line-height: 1.2;
}

/* Cards */
body.page-links .portal-links-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px;
}

body.page-links .portal-link-card {
    min-width: 0;
    min-height: 168px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    overflow: hidden;
    border: 1px solid rgba(0, 0, 0, 0.08);
    border-radius: 28px;
    background: #ffffff;
    box-shadow: 0 14px 35px rgba(0, 0, 0, 0.06);
    transition: 0.20s ease-out;
}

body.page-links .portal-link-card:hover {
    transform: translateY(-4px);
    border-color: rgba(224, 32, 32, 0.32);
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.08);
}

body.page-links .portal-link-card[hidden] {
    display: none;
}

body.page-links .portal-card-head {
    display: grid;
    grid-template-columns: 34px minmax(0, 1fr) 30px;
    gap: 12px;
    align-items: flex-start;
    padding: 20px 20px 14px;
}

body.page-links .portal-link-icon {
    width: 34px;
    height: 34px;
    flex: 0 0 34px;
    border-radius: 0;
    background-color: transparent;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23E10600' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71'/%3E%3Cpath d='M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71'/%3E%3C/svg%3E");
    background-position: center;
    background-repeat: no-repeat;
    background-size: 32px 32px;
    color: transparent;
    font-size: 0;
}

body.page-links .portal-link-icon.portal-link-icon-svg {
    display: grid;
    place-items: center;
    background-image: none;
    color: var(--metro-red);
    font-size: 24px;
}

body.page-links .portal-card-copy {
    min-width: 0;
}

body.page-links .portal-card-title-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 7px;
}

body.page-links .portal-card-title-row h3 {
    margin: 0;
    color: var(--metro-text);
    font-size: 16px;
    font-weight: 600;
    line-height: 1.25;
}

body.page-links .portal-card-copy p {
    margin: 4px 0 0;
    min-height: 2.9em;
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    color: var(--metro-muted);
    font-size: 13px;
    line-height: 1.45;
}

body.page-links .portal-badge {
    padding: 4px 8px;
    border: 1px solid rgba(224, 32, 32, 0.34);
    border-radius: 999px;
    color: var(--metro-red);
    background: rgba(224, 32, 32, 0.04);
    font-size: 9px;
    font-weight: 700;
    line-height: 1.1;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

body.page-links .favorite-button {
    width: 30px;
    height: 30px;
    border: 0;
    border-radius: 50%;
    background: transparent;
    color: #999999;
    font-family: "Space Grotesk", sans-serif;
    font-size: 22px;
    line-height: 1;
    cursor: pointer;
    transition: 0.18s ease-out;
}

body.page-links .favorite-button:hover,
body.page-links .favorite-button.active {
    color: var(--metro-red);
}

body.page-links .portal-card-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 12px 20px 18px;
}

body.page-links .portal-card-footer>span {
    display: none;
}

body.page-links .portal-card-footer a {
    color: var(--metro-text);
    font-size: 13px;
    font-weight: 600;
    line-height: 1.2;
    text-decoration: none;
    transition: 0.18s ease-out;
}

body.page-links .portal-card-footer a:hover {
    color: var(--metro-red);
}

/* Estado vazio */
body.page-links .portal-empty {
    padding: 42px 24px;
    border: 1px dashed #d5d5d5;
    border-radius: 24px;
    text-align: center;
}

body.page-links .portal-empty strong {
    display: block;
    color: var(--metro-text);
    font-size: 16px;
    font-weight: 700;
}

body.page-links .portal-empty span {
    display: block;
    margin-top: 8px;
    color: var(--metro-muted);
    font-size: 13px;
    line-height: 1.45;
}

/* Responsividade */
@media (max-width: 1000px) {
    body.page-links .portal-overview {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 850px) {
    body.page-links .portal-toolbar {
        position: static;
    }
}

@media (max-width: 640px) {
    body.page-links .portal-content {
        gap: 18px;
    }

    body.page-links .portal-overview,
    body.page-links .quick-access,
    body.page-links .portal-links-grid {
        grid-template-columns: 1fr;
    }

    body.page-links .portal-search-panel {
        grid-template-columns: 1fr;
    }

    body.page-links #clearFilters {
        height: 44px;
    }

    body.page-links .portal-nav {
        flex-wrap: nowrap;
        overflow-x: auto;
        padding-bottom: 4px;
        scrollbar-width: thin;
    }

    body.page-links .portal-nav button {
        flex: 0 0 auto;
    }

    body.page-links .portal-section {
        padding: 20px;
        border-radius: 24px;
    }

    body.page-links .portal-section-header {
        flex-direction: column;
        gap: 12px;
    }

    body.page-links .portal-section-header p {
        margin-left: 0;
        font-size: 13px;
    }

    body.page-links .portal-section-title h2 {
        font-size: 20px;
    }

    body.page-links .portal-link-card {
        min-height: 156px;
        border-radius: 24px;
    }

    body.page-links .portal-card-head {
        padding: 18px 18px 12px;
    }

    body.page-links .portal-card-footer {
        padding: 10px 18px 16px;
    }
}

/* AVALIAÇÕES — ETAPAS DO FORMULÁRIO — CSS MIGRADO DO HTML */
@scope (body.page-form:not(.page-training-planner)) {
    .form-step {
        display: none;
    }

    .form-step.active {
        display: flex;
        flex-direction: column;
        gap: 14px;
    }

    /* Mantém o espaçamento vertical original entre campos e linhas */
    .form-step .field-group {
        margin: 0;
    }

    .form-step .field-row {
        margin: 0;
    }

    .step-navigation {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 10px;
        margin-top: 22px;
    }

    .step-navigation button {
        min-width: 120px;
        min-height: 42px;
        border-radius: 999px;
        padding: 10px 20px;
        font-size: 13px;
        font-weight: 600;
        letter-spacing: -.2px;
        line-height: 1;
    }

    .step-navigation button:hover {
        transform: translateY(-1px);
    }

    .btn-step-back {
        border: 1px solid #d5d5d5;
        background: #fff;
        color: #333;
    }

    .btn-step-next,
    .btn-step-submit {
        border: 1px solid #e02020;
        background: #e02020;
        color: #fff;
        margin-left: auto;
    }

    .btn-step-back[hidden],
    .btn-step-next[hidden],
    .btn-step-submit[hidden] {
        display: none;
    }

    .step-progress-wrapper {
        margin-top: 14px;
    }

    .step-progress-info {
        display: flex;
        justify-content: space-between;
        align-items: center;
        gap: 10px;
        margin-bottom: 7px;
        color: #666;
        font-size: 11px;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.04em;
    }

    .step-progress-track {
        width: 100%;
        height: 7px;
        overflow: hidden;
        border-radius: 999px;
        background: #ededed;
    }

    .step-progress-fill {
        width: 25%;
        height: 100%;
        border-radius: inherit;
        background: #e02020;
        transition: width 0.3s ease;
    }

    .step-error-message {
        display: none;
        margin-top: 10px;
        color: #e02020;
        font-size: 12px;
        font-weight: 500;
        text-align: right;
    }

    @media (max-width: 520px) {
        .step-navigation {
            gap: 8px;
        }

        .step-navigation button {
            min-width: 105px;
            padding-inline: 14px;
        }
    }
}

/* PLANEJADOR DE TREINOS — CSS MIGRADO DO HTML */
@scope (:scope) {
    :scope {
        --metro-red: #e30613;
        --metro-dark: #0d0d0f;
        --metro-black: #151515;
        --metro-white: #ffffff;
        --metro-gray: #f4f4f5;
        --metro-line: rgba(255, 255, 255, .72);
        --shadow: 0 18px 45px rgba(0, 0, 0, .18);
        --radius: 22px;
    }

    * {
        box-sizing: border-box
    }

    :scope {
        margin: 0;
        font-family: Inter, Arial, Helvetica, sans-serif;
        background: linear-gradient(135deg, #070707 0%, #141414 45%, #2b0003 100%);
        color: #171717;
        min-height: 100vh;
    }

    .app-shell {
        max-width: 1440px;
        margin: 0 auto;
        padding: 22px
    }

    .topbar {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 18px;
        background: rgba(255, 255, 255, .08);
        border: 1px solid rgba(255, 255, 255, .14);
        color: #fff;
        border-radius: var(--radius);
        padding: 18px 22px;
        box-shadow: var(--shadow);
        backdrop-filter: blur(8px)
    }

    .brand {
        display: flex;
        align-items: center;
        gap: 14px
    }

    .brand-mark {
        width: 54px;
        height: 54px;
        border-radius: 16px;
        background: #fff;
        color: var(--metro-red);
        display: grid;
        place-items: center;
        font-weight: 900;
        font-size: 30px;
        letter-spacing: -2px
    }

    .brand small {
        display: block;
        color: #ddd;
        margin-top: 4px;
        font-weight: 600
    }

    h1 {
        font-size: 24px;
        margin: 0;
        line-height: 1.1;
        text-transform: uppercase;
        letter-spacing: .5px
    }

    .actions {
        display: flex;
        gap: 10px;
        flex-wrap: wrap;
        justify-content: flex-end
    }

    button,
    .btn {
        border: 0;
        border-radius: 999px;
        padding: 11px 15px;
        font-weight: 800;
        cursor: pointer;
        background: #fff;
        color: #151515;
        transition: .2s;
        text-decoration: none;
        font-size: 13px
    }

    button:hover,
    .btn:hover {
        transform: translateY(-1px);
        box-shadow: 0 10px 20px rgba(0, 0, 0, .2)
    }

    .primary {
        background: var(--metro-red);
        color: #fff
    }

    .dark {
        background: #111;
        color: #fff
    }

    .ghost {
        background: rgba(255, 255, 255, .12);
        color: #fff;
        border: 1px solid rgba(255, 255, 255, .2)
    }

    .layout {
        display: grid;
        grid-template-columns: 340px 1fr 320px;
        gap: 18px;
        margin-top: 18px;
        align-items: start
    }

    .panel {
        background: #fff;
        border-radius: var(--radius);
        box-shadow: var(--shadow);
        overflow: hidden;
        border: 1px solid rgba(0, 0, 0, .06)
    }

    .panel-header {
        padding: 16px 18px;
        background: #111;
        color: #fff;
        display: flex;
        justify-content: space-between;
        align-items: center;
        gap: 12px
    }

    .panel-header h2 {
        font-size: 15px;
        margin: 0;
        text-transform: uppercase;
        letter-spacing: .6px
    }

    .panel-:scope {
        padding: 16px
    }

    label {
        font-size: 12px;
        font-weight: 900;
        text-transform: uppercase;
        color: #444;
        display: block;
        margin: 10px 0 6px
    }

    input,
    select,
    textarea {
        width: 100%;
        border: 1px solid #ddd;
        border-radius: 14px;
        padding: 11px 12px;
        font: inherit;
        background: #fafafa;
        outline: none
    }

    .selection-card {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        margin-top: 7px;
        padding: 11px 13px;
        border: 1px solid #ddd;
        border-radius: 14px;
        background: #fafafa
    }

    .selection-card strong {
        font-size: 13px
    }

    .selection-card button {
        padding: 7px 11px;
        border-radius: 9px;
        background: var(--metro-red);
        color: #fff;
        font-size: 11px
    }

    :scope .selection-card {
        margin-top: 6px;
        padding: 12px 14px;
        border: 1px solid #ddd;
        border-radius: 14px;
        background: #fafafa
    }

    :scope .selection-card .selection-info {
        display: flex;
        flex-direction: column;
        line-height: 1.2
    }

    :scope .selection-card .selection-role {
        color: #666;
        font-size: 12px;
        font-weight: 600;
        text-transform: uppercase
    }

    :scope .selection-card .selection-name {
        font-size: 13px;
        font-weight: 800
    }

    :scope .selection-card .btn-remover,
    :scope .physical-valence-remove {
        width: auto;
        min-width: 0;
        min-height: 0;
        padding: 6px 10px;
        border: none;
        border-radius: 8px;
        background: var(--metro-red) !important;
        color: #fff !important;
        font-size: 12px;
        font-weight: 600;
        cursor: pointer
    }

    input[type="number"]::-webkit-inner-spin-button,
    input[type="number"]::-webkit-outer-spin-button {
        margin: 0;
        appearance: none
    }

    input[type="number"] {
        appearance: textfield;
        -moz-appearance: textfield
    }

    textarea {
        min-height: 98px;
        resize: vertical
    }

    .row {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 10px
    }

    .activity-card {
        border: 1px solid #eee;
        border-radius: 18px;
        padding: 13px;
        margin-bottom: 10px;
        cursor: pointer;
        background: #fafafa;
        transition: .2s
    }

    .activity-card.active {
        border-color: var(--metro-red);
        background: #fff5f5;
        box-shadow: 0 8px 24px rgba(227, 6, 19, .12)
    }

    .activity-card strong {
        display: block;
        font-size: 14px
    }

    .activity-card span {
        font-size: 12px;
        color: #555;
        font-weight: 700
    }

    .field-wrap {
        padding: 14px;
        background: #f7f7f8
    }

    .field-toolbar {
        display: flex;
        gap: 8px;
        flex-wrap: wrap;
        margin-bottom: 12px
    }

    .board-switcher {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 8px;
        flex-wrap: wrap;
        margin-bottom: 12px;
    }

    .board-switcher button {
        border: 1px solid #dedee2;
        background: #fff;
        padding: 8px 12px;
    }

    :scope .planner-card .board-switcher button.is-active {
        background: var(--metro-red);
        border-color: var(--metro-red);
        color: #fff;
    }

    .board-switcher .add-board {
        margin-left: auto;
    }

    .board-switcher button:disabled {
        cursor: not-allowed;
        opacity: .45;
        transform: none;
        box-shadow: none;
    }

    .preview-actions {
        display: flex;
        justify-content: center;
        gap: 10px;
        flex-wrap: wrap;
        margin-top: 16px;
    }

    .field {
        position: relative;
        width: 100%;
        aspect-ratio: 105/68;
        border-radius: 20px;
        overflow: hidden;
        background: linear-gradient(90deg, #16843b 0%, #16843b 10%, #1b9343 10%, #1b9343 20%, #16843b 20%, #16843b 30%, #1b9343 30%, #1b9343 40%, #16843b 40%, #16843b 50%, #1b9343 50%, #1b9343 60%, #16843b 60%, #16843b 70%, #1b9343 70%, #1b9343 80%, #16843b 80%, #16843b 90%, #1b9343 90%, #1b9343 100%);
        border: 5px solid #fff;
        box-shadow: inset 0 0 0 2px rgba(255, 255, 255, .55), 0 22px 40px rgba(0, 0, 0, .18);
        user-select: none
    }

    .field:before {
        content: "";
        position: absolute;
        inset: 5.5%;
        border: 2px solid var(--metro-line);
        border-radius: 8px
    }

    .half {
        position: absolute;
        top: 5.5%;
        bottom: 5.5%;
        left: 50%;
        border-left: 2px solid var(--metro-line)
    }

    .circle {
        position: absolute;
        width: 16%;
        aspect-ratio: 1;
        left: 42%;
        top: 38%;
        border: 2px solid var(--metro-line);
        border-radius: 50%
    }

    .spot {
        position: absolute;
        width: 7px;
        height: 7px;
        border-radius: 50%;
        background: #fff;
        left: calc(50% - 3.5px);
        top: calc(50% - 3.5px)
    }

    .box {
        position: absolute;
        top: 28%;
        width: 13%;
        height: 44%;
        border: 2px solid var(--metro-line)
    }

    .box.left {
        left: 5.5%;
        border-left: 0
    }

    .box.right {
        right: 5.5%;
        border-right: 0
    }

    .smallbox {
        position: absolute;
        top: 39%;
        width: 5.5%;
        height: 22%;
        border: 2px solid var(--metro-line)
    }

    .smallbox.left {
        left: 5.5%;
        border-left: 0
    }

    .smallbox.right {
        right: 5.5%;
        border-right: 0
    }

    .palette {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 9px
    }

    .tool {
        min-height: 74px;
        border: 1px solid #eee;
        border-radius: 16px;
        background: #fafafa;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 6px;
        font-size: 12px;
        font-weight: 800;
        cursor: pointer;
        text-align: center
    }

    .tool:hover {
        border-color: var(--metro-red);
        background: #fff5f5
    }

    .ico {
        font-size: 24px
    }

    .ico.cone-icon {
        position: relative;
        display: block;
        width: 28px;
        height: 29px;
        color: #ff8a00
    }

    .ico.cone-icon::before {
        content: "";
        position: absolute;
        left: 6px;
        bottom: 5px;
        border-right: 8px solid transparent;
        border-bottom: 23px solid currentColor;
        border-left: 8px solid transparent
    }

    .ico.cone-icon::after {
        content: "";
        position: absolute;
        right: 1px;
        bottom: 0;
        left: 1px;
        height: 6px;
        border-radius: 1px;
        background: currentColor
    }

    .ico.barrier-icon {
        position: relative;
        display: block;
        width: 34px;
        height: 20px;
        color: #f2c200;
        border: 3px solid currentColor;
        border-bottom: 0;
        border-radius: 3px 3px 0 0
    }

    .ico.barrier-icon::before,
    .ico.barrier-icon::after {
        content: "";
        position: absolute;
        bottom: -4px;
        width: 11px;
        height: 4px;
        border-radius: 1px;
        background: currentColor
    }

    .ico.barrier-icon::before {
        left: -6px
    }

    .ico.barrier-icon::after {
        right: -6px
    }

    .tactical-menus {
        display: grid;
        grid-template-columns: repeat(7, minmax(105px, 1fr));
        gap: 8px;
        overflow: visible
    }

    .tactical-menu {
        position: relative;
        min-width: 0
    }

    .tactical-menu summary {
        min-height: 54px;
        padding: 9px 8px;
        border: 1px solid #e0e0e4;
        border-radius: 13px;
        background: #fff;
        color: #2d2d31;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 6px;
        font-size: 11px;
        font-weight: 800;
        line-height: 1.15;
        text-align: center;
        cursor: pointer;
        list-style: none
    }

    .tactical-menu summary::-webkit-details-marker {
        display: none
    }

    .tactical-menu summary::after {
        content: "⌄";
        color: #777;
        font-size: 12px
    }

    .tactical-menu[open] summary {
        border-color: var(--metro-red);
        background: #fff5f5;
        color: var(--metro-red)
    }

    .tactical-menu-panel {
        position: absolute;
        top: calc(100% + 7px);
        left: 0;
        z-index: 80;
        width: 320px;
        max-height: 330px;
        padding: 7px;
        overflow-y: auto;
        border: 1px solid #dedee2;
        border-radius: 14px;
        background: #fff;
        box-shadow: 0 16px 38px rgba(0, 0, 0, .18)
    }

    .tactical-menu:nth-last-child(-n+2) .tactical-menu-panel {
        right: 0;
        left: auto
    }

    .planner-card .tactical-menu-option {
        width: 100%;
        min-height: 38px;
        padding: 8px 10px;
        border: 0;
        border-radius: 9px;
        background: transparent;
        color: #29292d;
        display: flex;
        align-items: center;
        gap: 9px;
        font-size: 11px;
        font-weight: 700;
        text-align: left;
        white-space: nowrap
    }

    .planner-card .tactical-menu-option:hover {
        background: #f2f2f4;
        color: var(--metro-red);
        transform: none
    }

    .tactical-menu-option .menu-option-icon {
        flex: 0 0 28px;
        font-size: 20px;
        text-align: center
    }

    .tactical-menu-option .menu-option-icon.arrow-icon-straight,
    .tactical-menu-option .menu-option-icon.arrow-icon-curved {
        position: relative;
        width: 28px;
        height: 20px;
        font-size: 0;
    }

    .tactical-menu-option .menu-option-icon.arrow-icon-straight::before {
        content: "";
        position: absolute;
        left: 1px;
        right: 4px;
        top: 9px;
        height: 2px;
        background: currentColor;
    }

    .tactical-menu-option .menu-option-icon.arrow-icon-straight::after {
        content: "";
        position: absolute;
        right: 1px;
        top: 5px;
        width: 8px;
        height: 8px;
        border-top: 2px solid currentColor;
        border-right: 2px solid currentColor;
        transform: rotate(45deg);
    }

    .tactical-menu-option .menu-option-icon.arrow-icon-curved::before {
        content: "";
        position: absolute;
        left: 2px;
        top: 5px;
        width: 21px;
        height: 14px;
        border-top: 2px dashed currentColor;
        border-radius: 50% 50% 0 0;
        transform: rotate(-12deg);
    }

    .tactical-menu-option .menu-option-icon.arrow-icon-curved::after {
        content: "";
        position: absolute;
        right: 1px;
        top: 2px;
        width: 7px;
        height: 7px;
        border-top: 2px solid currentColor;
        border-right: 2px solid currentColor;
        transform: rotate(53deg);
    }

    .tactical-menu-option .menu-option-icon.cone-menu-icon {
        width: 24px;
        height: 28px;
        background: currentColor;
        clip-path: polygon(45% 0, 55% 0, 82% 75%, 100% 82%, 100% 100%, 0 100%, 0 82%, 18% 75%);
        font-size: 0;
    }

    .tactical-menu-option .menu-option-icon.disc-menu-icon {
        width: 28px;
        height: 12px;
        border: 3px solid currentColor;
        border-radius: 50%;
        font-size: 0;
    }

    :scope .field.is-drawing {
        cursor: crosshair;
        box-shadow: inset 0 0 0 4px rgba(227, 6, 19, .75);
    }

    .obj.menu-item {
        min-width: 78px;
        min-height: 32px;
        padding: 6px 9px;
        border: 2px solid #fff;
        border-radius: 9px;
        background: rgba(17, 17, 17, .82);
        color: #fff;
        font-size: 12px;
        line-height: 1.15;
        text-align: center;
        white-space: nowrap;
        box-shadow: 0 3px 9px rgba(0, 0, 0, .25)
    }

    @media (max-width: 820px) {
        .tactical-menus {
            grid-template-columns: repeat(2, minmax(0, 1fr))
        }

        .tactical-menu-panel,
        .tactical-menu:nth-last-child(-n+2) .tactical-menu-panel {
            right: auto;
            left: 0;
            width: min(240px, calc(100vw - 56px))
        }
    }

    .hint {
        font-size: 12px;
        color: #666;
        line-height: 1.45;
        background: #f7f7f7;
        border-radius: 14px;
        padding: 10px;
        margin-top: 10px
    }

    .obj {
        position: absolute;
        left: 20%;
        top: 20%;
        display: grid;
        place-items: center;
        cursor: move;
        touch-action: none;
        font-weight: 900;
        z-index: 5
    }

    .obj.selected {
        outline: 0;
        box-shadow: none
    }

    .player {
        width: 30px;
        height: 30px;
        border-radius: 50%;
        background: var(--object-color, #111);
        color: #fff;
        border: 3px solid #fff;
        font-size: 13px
    }

    .player.red {
        background: var(--metro-red)
    }

    .player.white {
        background: #fff;
        color: #111;
        border-color: #111
    }

    .player.blue {
        background: #165dff
    }

    .cone {
        width: 28px;
        height: 32px;
        color: var(--object-color, #ff8a00);
        filter: drop-shadow(0 2px 2px rgba(0, 0, 0, .25))
    }

    .cone::before {
        content: "";
        position: absolute;
        left: 5px;
        bottom: 5px;
        width: 18px;
        height: 27px;
        background: currentColor;
        clip-path: polygon(50% 0, 100% 100%, 0 100%)
    }

    .cone::after {
        content: "";
        position: absolute;
        left: 1px;
        right: 1px;
        bottom: 0;
        height: 6px;
        border-radius: 1px;
        background: currentColor
    }

    .ball {
        width: 32px;
        height: 32px;
        border: 2px solid #111;
        border-radius: 50%;
        background-color: #fff;
        background-image: radial-gradient(circle at 50% 50%, #111 0 5px, transparent 5.5px),
            radial-gradient(circle at 50% 4%, #111 0 4px, transparent 4.5px),
            radial-gradient(circle at 96% 42%, #111 0 4px, transparent 4.5px),
            radial-gradient(circle at 78% 93%, #111 0 4px, transparent 4.5px),
            radial-gradient(circle at 20% 89%, #111 0 4px, transparent 4.5px),
            radial-gradient(circle at 3% 38%, #111 0 4px, transparent 4.5px);
        filter: drop-shadow(0 2px 2px rgba(0, 0, 0, .2))
    }

    .barrier {
        width: 46px;
        height: 23px;
        color: var(--object-color, #f6a300);
        border: 4px solid currentColor;
        border-bottom: 0;
        border-radius: 3px 3px 0 0;
        filter: drop-shadow(0 2px 2px rgba(0, 0, 0, .22))
    }

    .barrier::before,
    .barrier::after {
        content: "";
        position: absolute;
        bottom: -5px;
        width: 14px;
        height: 5px;
        border-radius: 2px;
        background: currentColor
    }

    .barrier::before {
        left: -7px
    }

    .barrier::after {
        right: -7px
    }

    .mobileBarrier {
        width: 32px;
        height: 62px;
        color: var(--object-color, #f2c200);
        filter: drop-shadow(0 2px 2px rgba(0, 0, 0, .25));
    }

    .mobileBarrier::before {
        content: "";
        position: absolute;
        left: 8px;
        top: 8px;
        width: 16px;
        height: 36px;
        border: 3px solid #222;
        border-radius: 8px 8px 5px 5px;
        background: linear-gradient(to bottom, currentColor 0 42%, #fff 42% 100%);
        clip-path: polygon(28% 0, 72% 0, 100% 18%, 86% 100%, 14% 100%, 0 18%);
    }

    .mobileBarrier::after {
        content: "";
        position: absolute;
        left: 4px;
        right: 4px;
        bottom: 2px;
        height: 15px;
        border-bottom: 4px solid #222;
        background: linear-gradient(75deg, transparent 45%, #222 46% 54%, transparent 55%),
            linear-gradient(-75deg, transparent 45%, #222 46% 54%, transparent 55%);
    }

    .goal {
        width: 52px;
        height: 24px;
        border: 4px solid #fff;
        background: rgba(0, 0, 0, .12);
        border-radius: 4px
    }

    .zone {
        width: 92px;
        height: 60px;
        border: 3px dashed #fff;
        background: rgba(227, 6, 19, .18);
        border-radius: 8px
    }

    .arrow {
        width: 90px;
        height: 4px;
        background: #fff;
        transform-origin: left center
    }

    .arrow:after {
        content: "";
        position: absolute;
        right: -2px;
        top: -7px;
        border-left: 16px solid #fff;
        border-top: 9px solid transparent;
        border-bottom: 9px solid transparent
    }

    .txt {
        min-width: 60px;
        min-height: 24px;
        color: #fff;
        text-shadow: 0 2px 4px rgba(0, 0, 0, .5);
        font-size: 16px;
        letter-spacing: .4px
    }

    .properties small {
        font-size: 12px;
        color: #666;
        display: block;
        margin-top: 8px
    }

    .danger {
        background: #e30613;
        color: #fff;
        width: 100%;
        margin-top: 10px
    }

    .list-mini {
        padding-left: 18px;
        line-height: 1.5;
        font-size: 13px;
        color: #333
    }

    .footer-note {
        color: #ddd;
        text-align: center;
        font-size: 12px;
        margin: 16px 0 4px
    }

    @media(max-width:1100px) {
        .layout {
            grid-template-columns: 1fr
        }

        .topbar {
            align-items: flex-start;
            flex-direction: column
        }

        .actions {
            justify-content: flex-start
        }

        .field {
            min-height: 420px
        }
    }

    /* Identidade e isolamento do planejador em relação aos formulários globais */
    :scope {
        background: #f5f5f5;
        color: #171717;
        font-family: "Space Grotesk", sans-serif
    }

    :scope .page {
        max-width: 1600px;
        grid-template-columns: 420px minmax(0, 1fr);
        align-items: start
    }

    :scope .form-wrapper {
        min-width: 0;
        display: block
    }

    :scope .planner-card {
        padding: 0;
        overflow: hidden;
        border-top: 5px solid var(--metro-red)
    }

    :scope .app-shell {
        max-width: none;
        padding: 0
    }

    :scope .topbar {
        align-items: flex-start;
        border: 0;
        border-radius: 0;
        background: #fff;
        box-shadow: none;
        padding: 28px 30px 24px;
        border-bottom: 1px solid #ececef
    }

    :scope .planner-heading {
        max-width: 560px
    }

    :scope .section-eyebrow {
        display: block;
        margin-bottom: 7px;
        color: var(--metro-red);
        font-size: 10px;
        font-weight: 700;
        letter-spacing: .16em;
        text-transform: uppercase
    }

    :scope .planner-heading h1 {
        margin: 0;
        color: #151518;
        font-size: 27px;
        font-weight: 700;
        line-height: 1.15;
        letter-spacing: -.02em;
        text-transform: none
    }

    :scope .planner-heading p {
        margin-top: 8px;
        color: #707075;
        font-size: 13px;
        line-height: 1.5
    }

    :scope .planner-card .actions {
        display: flex;
        justify-content: flex-end;
        gap: 9px;
        flex-wrap: wrap
    }

    :scope .planner-card button,
    :scope .planner-card .btn {
        width: auto;
        min-height: 38px;
        padding: 10px 14px;
        border: 1px solid #d9d9de;
        border-radius: 999px;
        background: #f5f5f6;
        color: #35353a;
        font-size: 12px;
        font-weight: 700;
        line-height: 1;
        white-space: nowrap
    }

    :scope .planner-card .actions .ghost {
        background: #fff
    }

    :scope .planner-card .actions .primary,
    :scope .planner-card .panel-header .primary,
    :scope .planner-card .danger {
        border-color: var(--metro-red);
        background: var(--metro-red);
        color: #fff
    }

    :scope .planner-card label {
        display: block;
        margin: 12px 0 6px;
        color: #57575c;
        font-size: 11px;
        font-weight: 700;
        letter-spacing: .05em
    }

    :scope .planner-card input:not([type="range"]):not([type="file"]),
    :scope .planner-card select,
    :scope .planner-card textarea {
        width: 100%;
        min-height: 42px;
        margin: 0;
        padding: 10px 12px;
        border: 1px solid #dcdce0;
        border-radius: 12px;
        background: #fff;
        color: #202024;
        font: 500 13px/1.35 "Space Grotesk", sans-serif
    }

    :scope .planner-card textarea {
        min-height: 94px;
        resize: vertical
    }

    :scope .planner-card input:focus,
    :scope .planner-card select:focus,
    :scope .planner-card textarea:focus {
        border-color: var(--metro-red);
        outline: 3px solid rgba(227, 6, 19, .1)
    }

    :scope .planner-card .row {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 12px
    }

    :scope .layout {
        grid-template-columns: 250px minmax(0, 1fr);
        gap: 0;
        margin: 0
    }

    :scope .panel {
        border: 0;
        border-right: 1px solid #e6e6e8;
        border-radius: 0;
        box-shadow: none
    }

    :scope .panel-header {
        min-height: 58px;
        padding: 15px 18px;
        background: #f4f4f5;
        color: #171717;
        border-bottom: 1px solid #e6e6e8
    }

    :scope .panel-header h2 {
        margin: 0;
        color: #171717;
        font-size: 13px;
        line-height: 1.35
    }

    :scope .panel-:scope {
        padding: 18px
    }

    :scope .activity-card {
        margin-bottom: 10px;
        padding: 12px;
        border-radius: 14px
    }

    :scope .activity-card strong {
        margin-bottom: 4px
    }

    :scope .object-workbench {
        padding: 20px 18px;
        border-top: 1px solid #ececef;
        background: #fafafa
    }

    :scope .workbench-heading {
        display: flex;
        align-items: end;
        justify-content: space-between;
        gap: 20px;
        margin-bottom: 14px
    }

    :scope .workbench-heading h3,
    :scope .settings-heading h3 {
        margin: 0;
        color: #242428;
        font-size: 16px
    }

    :scope .workbench-heading p {
        color: #74747a;
        font-size: 12px
    }

    :scope .palette {
        display: grid;
        grid-template-columns: repeat(7, minmax(76px, 1fr));
        gap: 9px
    }

    :scope .planner-card .tool {
        width: 100%;
        min-height: 76px;
        padding: 9px 6px;
        border: 1px solid #e0e0e4;
        border-radius: 14px;
        background: #fff;
        color: #2d2d31;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 5px;
        white-space: normal
    }

    :scope .planner-card .tool:hover {
        border-color: var(--metro-red);
        background: #fff6f6;
        color: var(--metro-red);
        transform: translateY(-1px)
    }

    :scope .planner-card .tool .ico {
        font-size: 22px;
        line-height: 1
    }

    :scope .field-wrap {
        padding: 18px;
        background: #f4f4f5
    }

    :scope .field-toolbar {
        display: flex;
        align-items: center;
        gap: 8px;
        margin-bottom: 12px
    }

    :scope .toolbar-label {
        margin-right: auto;
        color: #66666c;
        font-size: 11px;
        font-weight: 700;
        letter-spacing: .05em;
        text-transform: uppercase
    }

    :scope .field-toolbar button {
        min-height: 34px;
        padding: 8px 12px;
        border: 1px solid #dedee2;
        background: #fff
    }

    :scope .field-toolbar .dark {
        border-color: #171717;
        background: #171717;
        color: #fff
    }

    :scope .object-settings {
        display: grid;
        grid-template-columns: 180px 1fr;
        gap: 22px;
        padding: 20px 18px;
        border-top: 1px solid #ececef;
        background: #fff
    }

    :scope .properties {
        display: grid;
        grid-template-columns: minmax(150px, 1.2fr) minmax(130px, 1fr) minmax(120px, .8fr) minmax(120px, .8fr) auto;
        align-items: end;
        gap: 12px
    }

    :scope .properties label {
        margin-top: 0
    }

    :scope .properties input[type="range"] {
        width: 100%;
        min-height: 42px;
        accent-color: var(--metro-red)
    }

    :scope .properties .danger {
        min-height: 42px;
        margin: 0
    }

    :scope .materials-panel {
        margin: 0;
        padding: 0 18px 20px;
        background: #fff
    }

    :scope .materials-panel summary {
        padding: 12px 14px;
        border: 1px solid #e2e2e5;
        border-radius: 12px;
        color: #48484d;
        font-size: 12px;
        font-weight: 700;
        cursor: pointer
    }

    :scope .materials-panel .list-mini {
        display: flex;
        flex-wrap: wrap;
        gap: 8px 22px;
        margin: 12px 0 0;
        padding: 0 18px
    }

    :scope .footer-note {
        margin: 0;
        padding: 15px 24px;
        color: #6f6f73;
        background: #fafafa;
        border-top: 1px solid #ececee
    }

    :scope>#footer-container {
        width: min(1600px, calc(100% - 32px));
        margin: 0 auto 28px
    }

    @media(max-width:1450px) {
        :scope .properties {
            grid-template-columns: repeat(2, minmax(160px, 1fr))
        }

        :scope .properties .danger {
            grid-column: 1/-1
        }
    }

    @media(max-width:980px) {
        :scope .layout {
            grid-template-columns: 1fr
        }

        :scope .panel {
            border-right: 0;
            border-bottom: 1px solid #e6e6e8
        }

        :scope .topbar,
        :scope .planner-card .actions {
            align-items: flex-start;
            justify-content: flex-start
        }

        :scope .palette {
            grid-template-columns: repeat(4, minmax(76px, 1fr))
        }

        :scope .object-settings {
            grid-template-columns: 1fr
        }
    }

    @media(max-width:620px) {

        :scope .planner-card .actions,
        :scope .field-toolbar,
        :scope .workbench-heading {
            flex-direction: column;
            align-items: stretch
        }

        :scope .planner-card .actions button,
        :scope .planner-card .actions .btn,
        :scope .field-toolbar button {
            width: 100%
        }

        :scope .palette,
        :scope .properties {
            grid-template-columns: repeat(2, minmax(0, 1fr))
        }
    }

    /* Limites e proporções equivalentes às páginas Institucional e Atletas */
    :scope .page {
        max-width: 1120px;
        grid-template-columns: 420px minmax(0, 1fr);
        gap: 40px
    }

    :scope .planner-column {
        display: flex;
        flex-direction: column;
        gap: 24px;
        width: 100%;
        min-width: 0
    }

    :scope .planner-header-card,
    :scope .planner-card {
        width: 100%;
        min-width: 0;
        max-width: 100%;
        border: 1px solid rgba(0, 0, 0, .08);
        border-radius: 28px;
        background: #fff;
        box-shadow: 0 14px 35px rgba(0, 0, 0, .06)
    }

    :scope .planner-header-card {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 20px;
        padding: 24px
    }

    :scope .planner-heading {
        max-width: none
    }

    :scope .planner-heading h1 {
        font-size: 24px
    }

    :scope .planner-header-card .actions {
        display: flex;
        flex-wrap: wrap;
        gap: 10px;
        width: 100%
    }

    :scope .planner-header-card button,
    :scope .planner-header-card .btn {
        width: auto;
        min-height: 38px;
        padding: 10px 14px;
        border: 1px solid #d8d8dc;
        border-radius: 999px;
        background: #fff;
        color: #505055;
        font: 700 11px/1 "Space Grotesk", sans-serif;
        text-transform: uppercase;
        white-space: nowrap;
        cursor: pointer
    }

    :scope .planner-header-card .primary {
        border-color: var(--metro-red);
        background: var(--metro-red);
        color: #fff
    }

    :scope .planner-card {
        border-top: 1px solid rgba(0, 0, 0, .08);
        overflow: hidden
    }

    :scope .app-shell,
    :scope .layout,
    :scope .panel,
    :scope .panel-:scope,
    :scope .object-workbench,
    :scope .field-wrap,
    :scope .object-settings {
        min-width: 0;
        max-width: 100%
    }

    :scope .layout {
        grid-template-columns: 190px minmax(0, 1fr)
    }

    :scope .panel-header {
        padding: 14px
    }

    :scope .panel-:scope,
    :scope .object-workbench,
    :scope .field-wrap,
    :scope .object-settings {
        padding: 16px
    }

    :scope .planner-card .row {
        grid-template-columns: 1fr
    }

    :scope .palette {
        grid-template-columns: repeat(auto-fit, minmax(72px, 1fr))
    }

    :scope .workbench-heading {
        align-items: flex-start;
        flex-direction: column;
        gap: 5px
    }

    :scope .field-toolbar {
        align-items: stretch;
        flex-wrap: wrap
    }

    :scope .toolbar-label {
        flex-basis: 100%;
        margin: 0 0 2px
    }

    :scope .field {
        width: 100%;
        max-width: 100%
    }

    :scope .object-settings {
        grid-template-columns: 1fr;
        gap: 14px
    }

    :scope .properties {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }

    :scope .properties .danger {
        grid-column: 1/-1;
        width: 100%
    }

    :scope>#footer-container {
        width: min(1120px, calc(100% - 32px))
    }

    @media(max-width:900px) {
        :scope .page {
            grid-template-columns: 1fr
        }

        :scope #profile-card-container {
            min-width: 0
        }
    }

    @media(max-width:680px) {

        :scope .layout,
        :scope .properties {
            grid-template-columns: 1fr
        }

        :scope .planner-header-card .actions button,
        :scope .planner-header-card .actions .btn {
            width: 100%;
            text-align: center
        }
    }

    :scope .planner-header-card .actions {
        justify-content: center;
    }

    :scope .duration-summary {
        display: grid;
        grid-template-columns: 1fr;
        gap: 8px;
        margin: 16px 0 4px;
    }

    :scope .duration-summary>div {
        padding: 10px;
        border: 1px solid #f0c5c7;
        border-radius: 12px;
        background: #fff7f7;
        text-align: center;
    }

    :scope .duration-summary span,
    :scope .duration-summary strong {
        display: block;
    }

    :scope .duration-summary span {
        margin-bottom: 3px;
        color: #77777c;
        font-size: 9px;
        font-weight: 700;
        letter-spacing: .06em;
        text-transform: uppercase;
    }

    :scope .duration-summary strong {
        color: var(--metro-red);
        font-size: 14px;
    }

    :scope .activity-card-head {
        display: flex;
        align-items: flex-start;
        justify-content: space-between;
        gap: 8px;
    }

    :scope .activity-card .activity-duration {
        display: inline-flex;
        margin-top: 8px;
        padding: 4px 8px;
        border-radius: 999px;
        background: #ededf0;
        color: #505055;
        font-size: 10px;
        font-weight: 700;
    }

    :scope .planner-card .delete-activity {
        width: 28px;
        min-width: 28px;
        min-height: 28px;
        padding: 0;
        border: 1px solid #efb5b8;
        border-radius: 50%;
        background: #fff;
        color: var(--metro-red);
        font-size: 17px;
        line-height: 1;
    }

    :scope .planner-card .delete-activity:hover {
        border-color: var(--metro-red);
        background: var(--metro-red);
        color: #fff;
    }

    :scope .left-panel+.panel>.panel-header {
        align-items: flex-start;
        flex-direction: column;
        gap: 5px;
    }

    :scope #currentTitle {
        display: block;
        width: 100%;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        text-align: center;
    }

    :scope #currentTitle .activity-title-index {
        color: var(--metro-red);
    }

    :scope #currentMeta {
        display: block;
        width: 100%;
        color: #55555a;
        font-size: 12px;
        font-weight: 600;
        text-align: center;
    }

    :scope .obj.isokinetic,
    :scope .obj.traction,
    :scope .obj.jumpbox {
        min-width: 48px;
        min-height: 34px;
        padding: 5px 8px;
        border: 3px solid #fff;
        border-radius: 8px;
        color: #fff;
        font-size: 10px;
        line-height: 1.1;
        text-align: center;
        box-shadow: 0 3px 8px rgba(0, 0, 0, .28);
    }

    :scope .obj.isokinetic {
        background: #555b66;
    }

    :scope .obj.traction {
        min-width: 70px;
        border-radius: 999px;
        background: #e30613;
    }

    :scope .obj.jumpbox {
        min-width: 58px;
        min-height: 42px;
        border-radius: 4px;
        background: #9c5b2e;
    }

    :scope .left-panel>.panel-header {
        justify-content: center;
    }

    :scope .left-panel>.panel-header .primary {
        margin: 0 auto;
    }

    /* Resumo da sessão em card horizontal, abaixo do cabeçalho do planejador. */
    :scope .layout {
        grid-template-columns: minmax(0, 1fr);
    }

    :scope .left-panel {
        margin: 16px;
        width: auto;
        border: 0 !important;
        border-radius: 0;
        background: transparent;
        overflow: visible;
    }

    :scope .left-panel>.panel-:scope {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        gap: 12px;
        align-items: start;
        padding: 0;
        background: transparent;
    }

    :scope .session-summary-card,
    :scope .session-activities {
        padding: 14px;
        border: 1px solid #e1e1e5;
        border-radius: 20px;
        background: #fff;
    }

    :scope .session-card-title {
        margin: 0 0 14px;
        color: #55555a;
        font-size: 10px;
        font-weight: 800;
        letter-spacing: .12em;
        text-align: center;
        text-transform: uppercase;
    }

    :scope .session-summary-card>.session-card-title {
        display: none;
    }

    :scope .session-heading {
        margin-bottom: 12px;
        text-align: left;
    }

    :scope .session-heading .section-eyebrow {
        margin-bottom: 7px;
    }

    :scope .session-heading h2 {
        margin: 0;
        color: #242428;
        font-size: 16px;
        font-weight: 700;
        line-height: 1.2;
        letter-spacing: 0;
    }

    :scope .session-objective-card {
        margin-bottom: 10px;
        padding: 8px 10px;
        border: 1px solid #e1e1e5;
        border-radius: 16px;
        background: #fafafa;
        text-align: center;
    }

    :scope .session-objective-card label {
        margin-bottom: 6px;
        text-align: center;
    }

    :scope .session-objective-card #sessionObjective {
        height: 44px !important;
        min-height: 44px !important;
        padding: 10px 12px !important;
        text-align: center;
    }

    :scope .session-activities {
        border: 1px solid #e1e1e5;
    }

    :scope .activity-editor-card {
        margin: 12px 16px;
        border: 1px solid #e1e1e5;
        border-radius: 20px;
        background: #fff;
        overflow: hidden;
    }

    :scope .activity-editor-card>.panel-header {
        align-items: flex-start;
        flex-direction: column;
        gap: 5px;
        padding: 16px 18px 8px;
    }

    :scope .activity-editor-card>.panel-:scope {
        padding: 8px 18px 18px;
    }

    :scope .planner-card #actSpecificObjectives {
        height: 44px;
        min-height: 44px;
        resize: none;
    }

    :scope .session-meta-row {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 8px 14px !important;
    }

    :scope .session-meta-field {
        min-width: 0;
    }

    :scope .left-panel .panel-:scope label {
        margin: 0 0 8px;
        color: #57575c;
        font-size: 11px;
        font-weight: 700;
        letter-spacing: .05em;
        line-height: 1.2;
        text-transform: uppercase;
    }

    :scope .left-panel input,
    :scope .left-panel select {
        height: 44px !important;
        min-height: 44px !important;
        padding: 10px 12px !important;
        border-radius: 12px !important;
        font-size: 13px;
    }

    :scope .duration-summary {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 12px;
        width: min(100%, 430px);
        margin: 10px auto 0;
    }

    :scope .session-activities {
        min-width: 0;
    }

    :scope .session-activities-header {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 14px;
        margin-bottom: 10px;
    }

    :scope .session-activities-header .session-card-title {
        margin: 0;
    }

    :scope .session-activities-header .primary {
        min-height: 36px;
        padding: 9px 14px;
        border-color: var(--metro-red);
        background: var(--metro-red);
        color: #fff;
    }

    :scope .session-activities-header .primary.is-limit,
    :scope .session-activities-header .primary:disabled {
        border-color: #dcdce0;
        background: #f6f6f7;
        color: #77777c;
        cursor: not-allowed;
        opacity: 1;
    }

    :scope #activities {
        display: flex;
        flex-wrap: nowrap;
        justify-content: center;
        gap: 12px;
        padding: 2px 2px 10px;
        overflow: visible;
    }

    :scope .session-activities>label {
        display: block;
    }

    :scope .left-panel .activity-card {
        width: calc((100% - 36px) / 4);
        max-width: calc((100% - 36px) / 4);
        flex: 0 1 calc((100% - 36px) / 4);
        min-width: 0;
        min-height: 108px;
        margin: 0;
        padding: 12px 8px;
        display: flex;
        flex-direction: column;
        justify-content: center;
    }

    :scope .left-panel .activity-card-head {
        min-height: 24px;
        padding: 0 26px;
    }

    :scope .left-panel .activity-card strong {
        font-size: 12px;
        line-height: 1.15;
    }

    :scope .left-panel .activity-card span {
        font-size: 10px;
        line-height: 1.25;
    }

    :scope .left-panel .activity-card .activity-duration {
        width: 100%;
        margin-top: 7px;
        padding: 4px 7px;
        font-size: 9px;
    }

    :scope .left-panel .delete-activity {
        width: 24px;
        min-width: 24px;
        min-height: 24px;
        font-size: 14px;
    }

    :scope .activities-timeline {
        position: relative;
        display: flex;
        align-items: flex-start;
        justify-content: center;
        gap: 12px;
        min-width: 0;
        margin-top: 4px;
        padding: 14px 2px 2px;
    }

    :scope .activities-timeline::before {
        content: "";
        position: absolute;
        top: 20px;
        right: calc((100% - 36px) / 8);
        left: calc((100% - 36px) / 8);
        height: 2px;
        border-radius: 2px;
        background: #e1e1e5;
    }

    :scope .timeline-item {
        position: relative;
        z-index: 1;
        display: grid;
        justify-items: center;
        width: calc((100% - 36px) / 4);
        max-width: calc((100% - 36px) / 4);
        min-width: 0;
        flex: 0 1 calc((100% - 36px) / 4);
        color: #55555a;
        font-size: 10px;
        font-weight: 800;
        text-align: center;
    }

    :scope .timeline-dot {
        width: 14px;
        height: 14px;
        margin-bottom: 7px;
        border: 3px solid #fff;
        border-radius: 50%;
        background: var(--metro-red);
        box-shadow: 0 0 0 1px #dedee2;
    }

    :scope .physical-valence-row {
        margin-top: 10px;
    }

    :scope .physical-valence-row>div>label {
        margin-top: 0;
    }

    :scope .physical-valence-list {
        display: grid;
        gap: 8px;
        margin-top: 10px;
    }

    :scope .physical-valence-item {
        display: grid;
        grid-template-columns: minmax(130px, .8fr) minmax(180px, 1fr) 62px auto;
        gap: 10px;
        align-items: center;
        padding: 10px 12px;
        border: 1px solid #e2e2e5;
        border-radius: 12px;
        background: #fafafa;
    }

    :scope .physical-valence-name {
        color: #303035;
        font-size: 12px;
        font-weight: 800;
    }

    :scope .physical-valence-item input[type="range"] {
        width: 100%;
        height: 6px !important;
        min-height: 6px !important;
        padding: 0 !important;
        border: 0 !important;
        appearance: none;
        border-radius: 999px;
        outline: none !important;
        background: linear-gradient(90deg, #f2c94c 0%, #a8c943 30%, #24a85a 52%, #d75445 76%, #7a0012 100%);
        box-shadow: none !important;
    }

    :scope .physical-valence-item input[type="range"]::-webkit-slider-thumb {
        width: 18px;
        height: 18px;
        appearance: none;
        border: 2px solid #fff;
        border-radius: 50%;
        background: var(--intensity-color, #2fac66);
        box-shadow: 0 0 0 1px #c9c9cd;
        cursor: grab;
    }

    :scope .physical-valence-item input[type="range"]::-moz-range-thumb {
        width: 16px;
        height: 16px;
        border: 2px solid #fff;
        border-radius: 50%;
        background: var(--intensity-color, #2fac66);
        box-shadow: 0 0 0 1px #c9c9cd;
        cursor: grab;
    }

    :scope .physical-valence-level {
        color: var(--metro-red);
        font-size: 10px;
        font-weight: 800;
        text-align: right;
    }

    :scope .physical-valence-remove {
        width: auto;
        min-width: 0;
        min-height: 0;
        padding: 6px 10px;
        border: none;
        border-radius: 8px;
        background: var(--metro-red);
        color: #fff;
        font-size: 12px;
        font-weight: 600;
        cursor: pointer;
    }

    :scope .physical-valence-remove:hover {
        background: #e02020;
        color: #fff;
    }

    :scope .estimated-load-card {
        margin-top: 10px;
        padding: 11px 12px;
        border: 1px solid #e2e2e5;
        border-radius: 12px;
        background: #fafafa;
    }

    :scope .estimated-load-head,
    :scope .estimated-load-control {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
    }

    :scope .estimated-load-head label {
        margin: 0;
    }

    :scope .estimated-load-badge {
        padding: 4px 9px;
        border-radius: 999px;
        background: #e5f6ea;
        color: #258044;
        font-size: 10px;
        font-weight: 800;
    }

    :scope .estimated-load-control {
        margin-top: 9px;
    }

    :scope #activityEstimatedLoad {
        width: 100%;
        height: 7px !important;
        min-height: 7px !important;
        padding: 0 !important;
        border: 0 !important;
        appearance: none;
        border-radius: 999px;
        outline: none !important;
        background:
            repeating-linear-gradient(90deg, transparent 0 calc(12.5% - 3px), #fafafa calc(12.5% - 3px) 12.5%),
            linear-gradient(90deg, #25a94f 0 var(--load-progress, 65%), #e7e7e9 var(--load-progress, 65%) 100%);
        box-shadow: none !important;
    }

    :scope #activityEstimatedLoad::-webkit-slider-thumb {
        width: 17px;
        height: 17px;
        appearance: none;
        border: 2px solid #fff;
        border-radius: 50%;
        background: #25a94f;
        box-shadow: 0 0 0 1px #c9c9cd;
        cursor: grab;
    }

    :scope #activityEstimatedLoad::-moz-range-thumb {
        width: 15px;
        height: 15px;
        border: 2px solid #fff;
        border-radius: 50%;
        background: #25a94f;
        box-shadow: 0 0 0 1px #c9c9cd;
        cursor: grab;
    }

    :scope .estimated-load-value {
        min-width: 42px;
        color: #2e2e33;
        font-size: 12px;
        font-weight: 800;
        text-align: right;
    }

    :scope .left-panel+.panel {
        border-top: 0;
    }

    @media(max-width: 680px) {
        :scope .left-panel {
            margin: 10px;
        }

        :scope .left-panel>.panel-:scope,
        :scope .session-meta-row {
            grid-template-columns: 1fr !important;
        }

        :scope .duration-summary {
            grid-template-columns: 1fr;
        }

        :scope .left-panel .activity-card {
            width: 100%;
            max-width: none;
            flex-basis: 100%;
        }

        :scope #activities {
            flex-wrap: wrap;
        }

        :scope .physical-valence-row {
            grid-template-columns: 1fr;
        }

        :scope .physical-valence-item {
            grid-template-columns: minmax(0, 1fr) 50px auto;
        }

        :scope .physical-valence-name {
            grid-column: 1 / -1;
        }

        :scope .session-activities {
            grid-column: auto;
        }
    }

    :scope.pdf-exporting .planner-header-card .actions,
    :scope.pdf-exporting .delete-activity {
        display: none !important;
    }

    :scope.modal-open {
        overflow: hidden;
    }

    :scope .tactical-preview {
        margin: 12px 16px;
        padding: 18px 16px 20px;
        border: 1px solid #e1e1e5;
        border-radius: 20px;
        background: #fff;
        overflow: hidden;
    }

    :scope .preview-heading {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 16px;
        margin-bottom: 14px;
    }

    :scope .preview-heading h3 {
        margin: 0;
        color: #242428;
        font-size: 16px;
    }

    :scope .preview-field-wrap {
        padding: 0;
        border-radius: 18px;
        background: transparent;
    }

    :scope .field-preview {
        pointer-events: none;
        box-shadow: inset 0 0 0 2px rgba(255, 255, 255, .55);
    }

    :scope .field-preview .obj {
        cursor: default;
    }

    :scope .tactical-modal {
        display: none;
        position: fixed;
        inset: 0;
        z-index: 1000;
        padding: 20px;
        overflow: auto;
        background: rgba(10, 10, 12, .78);
        backdrop-filter: blur(6px);
    }

    :scope .tactical-modal.is-open {
        display: block;
    }

    :scope .tactical-modal-dialog {
        width: min(1180px, 100%);
        margin: 0 auto;
        overflow: hidden;
        border-radius: 26px;
        background: #fff;
        box-shadow: 0 28px 90px rgba(0, 0, 0, .38);
    }

    :scope .tactical-modal-header {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 20px;
        padding: 20px 24px;
        border-bottom: 1px solid #e7e7ea;
        background: #fff;
    }

    :scope .tactical-modal-header h2 {
        margin: 0;
        color: #18181b;
        font-size: 24px;
    }

    :scope .planner-card .modal-close {
        width: 42px;
        min-width: 42px;
        min-height: 42px;
        padding: 0;
        border: 1px solid #dedee2;
        border-radius: 50%;
        background: #f5f5f6;
        color: #242428;
        font-size: 25px;
    }

    :scope .tactical-modal .object-workbench,
    :scope .tactical-modal .field-wrap,
    :scope .tactical-modal .object-settings {
        padding: 22px 24px;
    }

    :scope .tactical-modal .field {
        max-width: 920px;
        margin: 0 auto;
    }

    :scope .tactical-modal .properties {
        grid-template-columns: minmax(160px, 1.2fr) minmax(140px, 1fr) minmax(130px, .8fr) minmax(130px, .8fr) auto;
    }

    :scope .tactical-modal .properties .danger {
        grid-column: auto;
        width: auto;
    }

    @media(max-width: 760px) {
        :scope .preview-heading {
            align-items: stretch;
            flex-direction: column;
        }

        :scope .preview-heading button {
            width: 100%;
        }

        :scope .tactical-modal {
            padding: 8px;
        }

        :scope .tactical-modal .properties {
            grid-template-columns: 1fr;
        }

        :scope .tactical-modal .properties .danger {
            width: 100%;
        }
    }

    /* Editor ampliado compacto, com melhor aproveitamento da tela */
    :scope .tactical-modal {
        padding: 12px;
    }

    :scope .tactical-modal-dialog {
        width: min(980px, 100%);
        max-height: calc(100vh - 24px);
        overflow: auto;
        border-radius: 20px;
    }

    :scope .tactical-modal-header {
        padding: 12px 18px;
    }

    :scope .tactical-modal-header .section-eyebrow {
        margin-bottom: 3px;
        font-size: 9px;
    }

    :scope .tactical-modal-header h2 {
        font-size: 20px;
    }

    :scope .planner-card .modal-close {
        width: 36px;
        min-width: 36px;
        min-height: 36px;
        font-size: 21px;
    }

    :scope .tactical-modal .workbench-heading {
        display: none;
    }

    :scope .tactical-modal .object-workbench {
        padding: 12px 18px;
    }

    :scope .tactical-modal .palette {
        gap: 7px;
    }

    :scope .tactical-modal .planner-card .tool,
    :scope .tactical-modal .tool {
        min-height: 58px;
        padding: 6px 4px;
        border-radius: 11px;
        font-size: 10px;
    }

    :scope .tactical-modal .tool .ico {
        font-size: 18px;
    }

    :scope .tactical-modal .field-wrap {
        padding: 10px 18px 14px;
    }

    :scope .tactical-modal .field-toolbar {
        gap: 6px;
        margin-bottom: 8px;
    }

    :scope .tactical-modal .toolbar-label {
        font-size: 9px;
    }

    :scope .tactical-modal .field-toolbar button {
        min-height: 30px;
        padding: 6px 10px;
        font-size: 10px;
    }

    :scope .tactical-modal .field {
        max-width: 720px;
    }

    :scope .tactical-modal .object-settings {
        gap: 12px;
        padding: 12px 18px 16px;
    }

    :scope .tactical-modal .settings-heading h3 {
        font-size: 15px;
    }

    :scope .tactical-modal .properties {
        gap: 8px;
    }

    :scope .planner-confirm-modal {
        display: none;
        position: fixed;
        inset: 0;
        z-index: 1200;
        place-items: center;
        padding: 20px;
        background: rgba(15, 15, 18, .58);
        backdrop-filter: blur(4px);
    }

    :scope .planner-confirm-modal.is-open {
        display: grid;
    }

    :scope .planner-confirm-dialog {
        width: min(430px, 100%);
        padding: 26px;
        border: 1px solid rgba(0, 0, 0, .08);
        border-radius: 22px;
        background: #fff;
        box-shadow: 0 24px 70px rgba(0, 0, 0, .28);
        text-align: center;
    }

    :scope .planner-confirm-dialog .modal-title {
        display: block;
        width: 100%;
        margin-bottom: 10px;
        color: #18181b;
        font-size: 20px;
        font-weight: 700;
        text-align: center;
    }

    :scope .planner-confirm-dialog .modal-text {
        display: block;
        width: 100%;
        margin: 0 auto;
        color: #68686e;
        font-size: 14px;
        line-height: 1.55;
        max-height: 46vh;
        overflow: auto;
        text-align: center;
    }

    :scope .planner-confirm-actions {
        display: flex;
        justify-content: center;
        gap: 10px;
        margin-top: 22px;
    }

    :scope .planner-confirm-actions button {
        min-height: 40px;
        padding: 10px 18px;
        border: 1px solid #d9d9dd;
        border-radius: 999px;
        background: #fff;
        color: #45454a;
        font: 700 12px/1 "Space Grotesk", sans-serif;
        cursor: pointer;
    }

    :scope .planner-confirm-actions .primary {
        border-color: var(--metro-red);
        background: var(--metro-red);
        color: #fff;
    }

    :scope .planner-card,
    :scope .planner-card .panel,
    :scope .planner-card .panel-header,
    :scope .planner-card .panel-:scope,
    :scope .tactical-preview {
        background: #fff;
    }

    :scope .left-panel .panel-:scope label,
    :scope .left-panel .activity-card {
        text-align: center;
    }

    :scope .left-panel .activity-card-head {
        position: relative;
        justify-content: center;
        padding: 0 30px;
    }

    :scope .left-panel .activity-card-head .delete-activity {
        position: absolute;
        top: 50%;
        right: 0;
        transform: translateY(-50%);
    }

    :scope .left-panel input,
    :scope .left-panel select {
        text-align: center;
        text-align-last: center;
    }

    :scope .planner-card .session-meta-row {
        gap: 0 12px;
    }

    :scope .athlete-selection {
        margin: 14px 0 4px;
        padding: 14px;
        border: 1px solid #e2e2e5;
        border-radius: 14px;
        background: #fafafa;
    }

    :scope .athlete-selection>label {
        margin-top: 0;
    }

    :scope .athlete-list {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 6px;
        max-height: 230px;
        overflow-x: hidden;
        overflow-y: auto;
    }

    :scope .athlete-option {
        position: relative;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: flex-start;
        gap: 5px;
        width: 100%;
        max-width: 100%;
        min-width: 0;
        margin: 0;
        padding: 8px 5px;
        border: 1px solid #dddde1;
        border-radius: 10px;
        background: #fff;
        color: #35353a;
        font-size: 11px;
        font-weight: 600;
        cursor: pointer;
        text-transform: none;
    }

    :scope .athlete-option:has(input:checked) {
        border-color: var(--metro-red);
        background: #fff5f5;
        color: #b9000c;
    }

    :scope .athlete-option input {
        position: absolute;
        opacity: 0;
        pointer-events: none;
    }

    :scope .athlete-photo {
        display: block;
        flex: 0 0 67px;
        width: 67px !important;
        min-width: 67px;
        max-width: 67px;
        height: 67px !important;
        min-height: 67px;
        max-height: 67px;
        margin-inline: auto;
        overflow: hidden;
        border: 1px solid #dddde1;
        border-radius: 50%;
        background: #f1f1f2;
    }

    :scope .athlete-photo img {
        display: block;
        width: 67px !important;
        min-width: 67px;
        max-width: 67px;
        height: 67px !important;
        min-height: 67px;
        max-height: 67px;
        object-fit: cover;
        object-position: center top;
    }

    :scope .athlete-info {
        display: block;
        width: 100%;
        min-width: 0;
        text-align: center;
    }

    :scope .athlete-name {
        display: block;
        max-width: 100%;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: normal;
        color: #171717;
        font-size: 10px;
        text-align: center;
        line-height: 1.2;
    }

    :scope .athlete-position {
        display: block;
        margin-top: 2px;
        color: #77777c;
        font-size: 9px;
        font-weight: 800;
        text-align: center;
        text-transform: uppercase;
    }

    :scope .activity-materials {
        margin: 12px 0;
    }

    :scope .material-options {
        display: flex;
        flex-direction: column;
        gap: 6px;
    }

    :scope .material-field-group {
        overflow: hidden;
        border: 1px solid #dddde1;
        border-radius: 12px;
        background: #fff;
    }

    :scope .material-field-title {
        padding: 8px 11px;
        background: #f5f5f6;
        color: #55555b;
        font-size: 10px;
        font-weight: 900;
        letter-spacing: .08em;
        text-transform: uppercase;
    }

    :scope .material-field-list {
        display: grid;
        gap: 1px;
        background: #ededf0;
    }

    :scope .material-field-item {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        padding: 9px 11px;
        background: #fff;
        color: #29292d;
        font-size: 11px;
        font-weight: 800;
    }

    :scope .material-field-quantity {
        min-width: 30px;
        padding: 4px 8px;
        border-radius: 999px;
        background: #fff1f2;
        color: var(--metro-red);
        text-align: center;
    }

    :scope .material-field-empty {
        margin: 0;
        padding: 10px 11px;
        color: #77777c;
        font-size: 10px;
        font-weight: 700;
    }

    :scope .material-option {
        display: grid;
        grid-template-columns: 18px minmax(0, 1fr) 76px;
        align-items: center;
        gap: 7px;
        min-width: 0;
        margin: 0;
        padding: 7px 10px;
        border: 1px solid #dddde1;
        border-radius: 10px;
        background: #fff;
        font-size: 10px;
        font-weight: 700;
        text-transform: none;
        cursor: pointer;
    }

    :scope .material-option:has(input:checked) {
        border-color: var(--metro-red);
        background: #fff5f5;
        color: #b9000c;
    }

    :scope .material-option input {
        width: 15px;
        min-height: 15px;
        margin: 0;
        accent-color: var(--metro-red);
    }

    :scope .material-option .material-quantity {
        width: 76px;
        min-height: 34px;
        padding: 6px 8px;
        border-radius: 8px;
        background: #fff;
        text-align: center;
    }

    :scope .material-option:not(:has(input:checked)) .material-quantity {
        opacity: .45;
    }

    /* Ritmo vertical e dimensões padronizadas dos campos do formulário. */
    :scope .planner-card .panel-:scope label {
        margin: 16px 0 6px;
    }

    :scope .planner-card .panel-:scope .row {
        row-gap: 0;
    }

    :scope .planner-card .panel-:scope input:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="file"]):not(.material-quantity),
    :scope .planner-card .panel-:scope select,
    :scope .planner-card #actNotes {
        height: 44px;
        min-height: 44px;
    }

    :scope .planner-card #actDescription {
        height: 192px;
        min-height: 192px;
    }

    :scope .activity-materials {
        margin-top: 0;
    }

    /* Card contínuo, sem divisórias internas entre cabeçalho e colunas. */
    :scope .planner-card .panel,
    :scope .planner-card .left-panel {
        border-right: 0;
        border-bottom: 0;
    }

    :scope .planner-card .panel-header {
        border-bottom: 0;
        min-height: 0;
        padding-bottom: 0;
    }

    :scope .planner-card .panel-:scope {
        padding-top: 0;
    }

    @media(max-width: 760px) {
        :scope .session-meta-row {
            gap: 0;
        }

        :scope .material-options {
            width: 100%;
        }
    }

    :scope .athlete-status {
        margin: 10px 0 0;
        color: #77777c;
        font-size: 11px;
        text-align: center;
    }

    @media(max-width: 680px) {
        :scope .athlete-list {
            grid-template-columns: repeat(2, minmax(0, 1fr));
        }
    }

    /* Controles do editor alinhados ao padrão visual de Novo campo. */
    :scope .tactical-modal .board-switcher {
        justify-content: center;
    }

    :scope .tactical-modal .board-switcher .add-board {
        margin-left: 0;
    }

    :scope .tactical-modal .field-toolbar {
        justify-content: center;
        align-items: center;
        gap: 9px;
    }

    :scope .tactical-modal .field-toolbar button,
    :scope .tactical-modal .field-toolbar .dark {
        width: auto;
        min-height: 38px;
        padding: 10px 14px;
        border: 1px solid #d9d9de;
        border-radius: 999px;
        background: #fff;
        color: #35353a;
        font-size: 11px;
        font-weight: 700;
        box-shadow: none;
    }

    :scope .tactical-modal .field-toolbar button:hover {
        border-color: var(--metro-red);
        background: #fff5f5;
        color: var(--metro-red);
    }

    :scope .tactical-menu summary {
        justify-content: center;
        min-height: 54px;
        padding: 10px 12px;
        border: 1px solid #d9d9de;
        border-radius: 14px;
        background: #fff;
        color: #2d2d31;
        font-size: 12px;
        font-weight: 700;
    }

    :scope .tactical-menu summary::after {
        display: none;
        content: none;
    }

    :scope .tactical-menu[open] summary {
        border-color: var(--metro-red);
        background: #fff;
        color: var(--metro-red);
        box-shadow: 0 0 0 2px rgba(227, 6, 19, .08);
    }

    :scope .tactical-modal .board-switcher {
        margin-bottom: 18px;
    }

    :scope .tactical-modal .board-switcher .add-board:disabled {
        border-color: var(--metro-red);
        background: var(--metro-red);
        color: #fff;
        opacity: 1;
    }

    :scope .planner-card .tactical-menu-option {
        justify-content: center;
        border: 0;
        border-radius: 0;
        background: transparent;
        text-align: center;
        box-shadow: none;
    }

    :scope .planner-card .tactical-menu-option:hover {
        border: 0;
        background: #f2f2f4;
    }

    :scope .tactical-menu-option .menu-option-icon {
        flex-basis: auto;
    }

    :scope .obj.menu-item {
        min-width: 34px;
        min-height: 34px;
        padding: 0;
        border: 0;
        border-radius: 0;
        background: transparent;
        color: #fff;
        font-size: 30px;
        line-height: 1;
        text-shadow: 0 2px 4px rgba(0, 0, 0, .45);
        box-shadow: none;
    }

    :scope .tactical-modal-header {
        position: relative;
        justify-content: center;
        text-align: center;
    }

    :scope .tactical-modal-header>div {
        width: 100%;
        text-align: center;
    }

    :scope .tactical-modal-header .modal-close {
        position: absolute;
        top: 50%;
        right: 18px;
        transform: translateY(-50%);
    }

    :scope .tactical-modal-dialog {
        width: min(1225px, 100%);
    }

    :scope .tactical-modal .field {
        max-width: 900px;
    }

    :scope .tactical-modal .ball {
        border: 2px solid #111;
        border-radius: 50%;
        background-color: #fff;
        background-image: radial-gradient(circle at 50% 50%, #111 0 5px, transparent 5.5px),
            radial-gradient(circle at 50% 4%, #111 0 4px, transparent 4.5px),
            radial-gradient(circle at 96% 42%, #111 0 4px, transparent 4.5px),
            radial-gradient(circle at 78% 93%, #111 0 4px, transparent 4.5px),
            radial-gradient(circle at 20% 89%, #111 0 4px, transparent 4.5px),
            radial-gradient(circle at 3% 38%, #111 0 4px, transparent 4.5px);
        box-shadow: none;
    }

    :scope .tactical-modal .goal {
        width: 38px;
        height: 38px;
        border: 0;
        border-radius: 0;
        background: transparent;
        font-size: 32px;
        line-height: 1;
        box-shadow: none;
        filter: drop-shadow(0 2px 2px rgba(0, 0, 0, .2));
    }

    :scope .tactical-modal .largeGoal {
        width: 62px;
        height: 82px;
        border: 0;
        border-radius: 0;
        background: transparent;
        font-size: 54px;
        line-height: 1;
        box-shadow: none;
        filter: drop-shadow(0 2px 2px rgba(0, 0, 0, .2));
    }

    :scope .tactical-modal .goal-symbol {
        display: block;
        width: 100%;
        height: 100%;
        border: 3px solid #fff;
        background-color: rgba(255, 255, 255, .12);
        background-image: linear-gradient(45deg, transparent 45%, rgba(255, 255, 255, .8) 46% 54%, transparent 55%),
            linear-gradient(-45deg, transparent 45%, rgba(255, 255, 255, .8) 46% 54%, transparent 55%);
        background-size: 10px 10px;
        box-shadow: inset 0 0 0 1px rgba(17, 17, 17, .35);
        box-sizing: border-box;
        line-height: 1;
        pointer-events: none;
    }

    :scope .tactical-modal .goal-resize-handle {
        position: absolute;
        top: 50%;
        right: -9px;
        width: 13px;
        height: 32px;
        border: 2px solid #fff;
        border-radius: 8px;
        background: var(--metro-red);
        transform: translateY(-50%);
        cursor: ew-resize;
        opacity: 0;
        pointer-events: auto;
    }

    :scope .tactical-modal .obj.selected .goal-resize-handle {
        opacity: 1;
    }

    :scope .field-preview .goal-resize-handle {
        display: none;
    }

    :scope .tactical-modal .dashedArrow {
        width: 90px;
        height: 0;
        border-top: 2px dashed #fff;
        transform-origin: left center;
    }

    :scope .tactical-modal .dashedArrow::after,
    :scope .tactical-modal .curvedArrow::after,
    :scope .tactical-modal .curvedDashedArrow::after {
        content: "";
        position: absolute;
        right: -3px;
        top: -7px;
        border-left: 12px solid #fff;
        border-top: 6px solid transparent;
        border-bottom: 6px solid transparent;
    }

    :scope .tactical-modal .curvedArrow,
    :scope .tactical-modal .curvedDashedArrow {
        width: 90px;
        height: 42px;
        border-top: 2px solid #fff;
        border-radius: 50% 50% 0 0;
        transform-origin: center center;
    }

    :scope .tactical-modal .curvedDashedArrow {
        border-top-style: dashed;
    }

    :scope .tactical-modal .curvedArrow::after,
    :scope .tactical-modal .curvedDashedArrow::after {
        right: -8px;
        top: 1px;
        transform: rotate(42deg);
        transform-origin: left center;
    }

    :scope .tactical-modal .arrow {
        height: 2px;
    }

    :scope .tactical-modal .arrow::after {
        top: -5px;
        border-left-width: 12px;
        border-top-width: 6px;
        border-bottom-width: 6px;
    }

    :scope .tactical-modal .bib {
        width: 38px;
        height: 36px;
        border: 0;
        background: var(--object-color, #e30613);
        clip-path: polygon(22% 0, 39% 8%, 61% 8%, 78% 0, 100% 22%, 82% 42%, 76% 31%, 76% 100%, 24% 100%, 24% 31%, 18% 42%, 0 22%);
        filter: drop-shadow(0 2px 2px rgba(0, 0, 0, .28));
    }

    :scope .field .largeGoal {
        width: 62px;
        height: 82px;
        border: 0;
        background: transparent;
        font-size: 54px;
        line-height: 1;
    }

    :scope .field .goal-symbol {
        display: block;
        width: 100%;
        height: 100%;
        border: 3px solid #fff;
        background-color: rgba(255, 255, 255, .12);
        background-image: linear-gradient(45deg, transparent 45%, rgba(255, 255, 255, .8) 46% 54%, transparent 55%),
            linear-gradient(-45deg, transparent 45%, rgba(255, 255, 255, .8) 46% 54%, transparent 55%);
        background-size: 10px 10px;
        box-shadow: inset 0 0 0 1px rgba(17, 17, 17, .35);
        box-sizing: border-box;
        line-height: 1;
        pointer-events: none;
    }

    :scope .field .obj.selected {
        outline: 0 !important;
        filter: none !important;
        box-shadow: none !important;
    }

    :scope .field .dashedArrow {
        width: 90px;
        height: 0;
        border-top: 2px dashed #fff;
        transform-origin: left center;
    }

    :scope .field .curvedArrow,
    :scope .field .curvedDashedArrow {
        width: 90px;
        height: 42px;
        border-top: 2px solid #fff;
        border-radius: 50% 50% 0 0;
        transform-origin: center center;
    }

    :scope .field .curvedDashedArrow {
        border-top-style: dashed;
    }

    :scope .field .dashedArrow::after,
    :scope .field .curvedArrow::after,
    :scope .field .curvedDashedArrow::after {
        content: "";
        position: absolute;
        right: -3px;
        top: -7px;
        border-left: 12px solid #fff;
        border-top: 6px solid transparent;
        border-bottom: 6px solid transparent;
    }

    :scope .field .arrow::after,
    :scope .field .dashedArrow::after,
    :scope .field .curvedArrow::after,
    :scope .field .curvedDashedArrow::after {
        width: 10px;
        height: 10px;
        border: 0;
        border-top: 2px solid #fff;
        border-right: 2px solid #fff;
        background: transparent;
        transform: rotate(45deg);
    }

    :scope .field .arrow::after,
    :scope .field .dashedArrow::after {
        right: 0;
        top: -5px;
    }

    :scope .field .curvedArrow::after,
    :scope .field .curvedDashedArrow::after {
        right: -8px;
        top: 1px;
        transform: rotate(68deg);
        transform-origin: left center;
    }

    :scope .field .bib {
        width: 38px;
        height: 36px;
        border: 0;
        background: var(--object-color, #e30613);
        clip-path: polygon(22% 0, 39% 8%, 61% 8%, 78% 0, 100% 22%, 82% 42%, 76% 31%, 76% 100%, 24% 100%, 24% 31%, 18% 42%, 0 22%);
    }

    :scope .obj-label {
        position: absolute;
        top: calc(100% + 5px);
        left: 50%;
        min-width: max-content;
        padding: 3px 6px;
        border: 1px solid rgba(255, 255, 255, .85);
        border-radius: 6px;
        background: rgba(17, 17, 17, .84);
        color: #fff;
        font-size: 10px;
        font-weight: 800;
        line-height: 1.1;
        text-align: center;
        text-shadow: none;
        transform: translateX(-50%);
        pointer-events: none;
    }

    /* Campo ao centro, navegação à esquerda e ações à direita. */
    :scope .tactical-modal-dialog {
        width: min(1320px, 100%);
    }

    :scope .tactical-modal .field-wrap {
        display: grid;
        grid-template-columns: minmax(160px, 180px) minmax(0, 900px) minmax(155px, 170px);
        grid-template-areas: "boards field actions";
        align-items: start;
        justify-content: center;
        gap: 12px;
    }

    :scope .tactical-modal #editorBoardSwitcher {
        grid-area: boards;
        align-self: center;
        flex-direction: column;
        align-items: stretch;
        justify-content: flex-start;
        gap: 9px;
        margin: 0;
    }

    :scope .tactical-modal #editorBoardSwitcher button {
        width: 100%;
        margin: 0;
        white-space: normal;
    }

    :scope .tactical-modal .field-toolbar {
        grid-area: actions;
        align-self: center;
        flex-direction: column;
        align-items: stretch;
        justify-content: flex-start;
        flex-wrap: nowrap;
        gap: 9px;
        margin: 0;
    }

    :scope .tactical-modal .field-toolbar button,
    :scope .tactical-modal .field-toolbar .dark {
        width: 100%;
        margin: 0;
        white-space: normal;
    }

    :scope .tactical-modal #field {
        grid-area: field;
        width: 100%;
        margin: 0 auto;
    }

    @media(max-width: 1100px) {
        :scope .tactical-modal .field-wrap {
            grid-template-columns: minmax(0, 1fr);
            grid-template-areas:
                "boards"
                "field"
                "actions";
        }

        :scope .tactical-modal #editorBoardSwitcher,
        :scope .tactical-modal .field-toolbar {
            flex-direction: row;
            align-items: center;
            justify-content: center;
            flex-wrap: wrap;
        }

        :scope .tactical-modal #editorBoardSwitcher button,
        :scope .tactical-modal .field-toolbar button,
        :scope .tactical-modal .field-toolbar .dark {
            width: auto;
        }
    }

    /* Ações à esquerda e propriedades empilhadas à direita. */
    :scope .tactical-modal-dialog {
        width: min(1450px, 100%);
    }

    :scope .tactical-modal .field-wrap {
        grid-template-columns: minmax(160px, 180px) minmax(0, 900px) minmax(230px, 260px);
        grid-template-areas: "left field settings";
    }

    :scope .tactical-modal .field-left-controls {
        grid-area: left;
        align-self: center;
        display: flex;
        flex-direction: column;
        gap: 18px;
        min-width: 0;
    }

    :scope .tactical-modal .field-left-controls #editorBoardSwitcher,
    :scope .tactical-modal .field-left-controls .field-toolbar {
        align-self: stretch;
        width: 100%;
    }

    :scope .tactical-modal .object-settings {
        grid-area: settings;
        align-self: center;
        display: flex;
        flex-direction: column;
        gap: 14px;
        min-width: 0;
        padding: 16px;
        border: 1px solid #e1e1e4;
        border-radius: 18px;
        background: #fff;
    }

    :scope .tactical-modal .settings-heading {
        text-align: center;
    }

    :scope .tactical-modal .properties {
        display: flex;
        flex-direction: column;
        align-items: stretch;
        gap: 10px;
    }

    :scope .tactical-modal .properties>div,
    :scope .tactical-modal .properties input,
    :scope .tactical-modal .properties select,
    :scope .tactical-modal .properties .danger {
        width: 100%;
        min-width: 0;
    }

    :scope .tactical-modal .properties .danger {
        margin: 4px 0 0;
    }

    @media(max-width: 1100px) {
        :scope .tactical-modal .field-wrap {
            grid-template-columns: minmax(0, 1fr);
            grid-template-areas:
                "left"
                "field"
                "settings";
        }

        :scope .tactical-modal .field-left-controls {
            gap: 10px;
        }

        :scope .tactical-modal .object-settings {
            width: 100%;
        }
    }

    /* Versão simplificada: sem seletor de campos e gramado 75% maior. */
    :scope .tactical-modal-dialog {
        width: min(2040px, 100%);
    }

    :scope .tactical-modal #editorBoardSwitcher {
        display: none;
    }

    :scope .tactical-modal .field-wrap {
        grid-template-columns: 150px minmax(0, 1575px) 230px;
    }

    :scope .tactical-modal .field {
        max-width: 1575px;
    }

    /* Materiais redesenhados como um único objeto, sem ícones sobrepostos. */
    :scope .field .cone {
        width: 34px;
        height: 38px;
        color: var(--object-color, #ff8a00);
        background: transparent;
    }

    :scope .field .cone::before {
        left: 6px;
        bottom: 5px;
        width: 22px;
        height: 33px;
        background: currentColor;
        clip-path: polygon(44% 0, 56% 0, 88% 76%, 100% 82%, 100% 100%, 0 100%, 0 82%, 12% 76%);
    }

    :scope .field .cone::after {
        left: 8px;
        right: 8px;
        bottom: 16px;
        height: 3px;
        border-radius: 0;
        background: rgba(255, 255, 255, .9);
        box-shadow: 0 7px 0 rgba(255, 255, 255, .9);
    }

    :scope .field .disc {
        width: 38px;
        height: 16px;
        color: var(--object-color, #f2c200);
        border: 4px solid currentColor;
        border-radius: 50%;
        background: color-mix(in srgb, currentColor 24%, transparent);
        box-shadow: inset 0 -3px 0 currentColor, 0 2px 2px rgba(0, 0, 0, .22);
    }

    :scope .field .disc::after {
        content: "";
        width: 11px;
        height: 5px;
        border: 3px solid currentColor;
        border-radius: 50%;
        background: transparent;
    }

    :scope .field .mobileBarrier {
        width: 34px;
        height: 68px;
        color: var(--object-color, #20a447);
        background: transparent;
        filter: drop-shadow(0 2px 2px rgba(0, 0, 0, .22));
    }

    :scope .field .mobileBarrier::before {
        left: 6px;
        top: 2px;
        width: 22px;
        height: 46px;
        border: 5px solid #171717;
        border-radius: 10px 10px 4px 4px;
        background: linear-gradient(to bottom, currentColor 0 48%, #fff 48% 100%);
        clip-path: polygon(25% 0, 75% 0, 100% 15%, 84% 100%, 16% 100%, 0 15%);
        box-sizing: border-box;
    }

    :scope .field .mobileBarrier::after {
        left: 1px;
        right: 1px;
        bottom: 1px;
        height: 18px;
        border: 0;
        border-bottom: 6px solid #171717;
        background: linear-gradient(72deg, transparent 42%, #171717 43% 57%, transparent 58%),
            linear-gradient(-72deg, transparent 42%, #171717 43% 57%, transparent 58%);
    }

    :scope .field .ladder {
        width: 48px;
        height: 66px;
        border-right: 4px solid var(--object-color, #fff);
        border-left: 4px solid var(--object-color, #fff);
        background: repeating-linear-gradient(to bottom, transparent 0 10px,
                var(--object-color, #fff) 10px 14px);
        transform-origin: center;
        filter: drop-shadow(0 2px 2px rgba(0, 0, 0, .22));
    }

    :scope .field .stake {
        width: 14px;
        height: 58px;
        color: var(--object-color, #fff);
        border: 4px solid currentColor;
        border-radius: 8px 8px 2px 2px;
        background: transparent;
        box-sizing: border-box;
    }

    :scope .field .stake::after {
        content: "";
        position: absolute;
        left: 50%;
        bottom: -10px;
        width: 28px;
        height: 9px;
        border: 4px solid currentColor;
        border-radius: 50%;
        transform: translateX(-50%);
    }

    :scope .field .tape {
        width: 34px;
        height: 34px;
        color: var(--object-color, #fff);
        border: 4px solid currentColor;
        border-radius: 50%;
        background: transparent;
        box-shadow: inset 0 0 0 6px rgba(255, 255, 255, .12);
    }

    :scope .field .tape::after {
        content: "";
        width: 8px;
        height: 8px;
        border: 3px solid currentColor;
        border-radius: 50%;
    }

    .tactical-menu-option .menu-option-icon.material-line-icon {
        position: relative;
        flex: 0 0 34px;
        width: 34px;
        height: 30px;
        color: #171717;
        font-size: 0;
        clip-path: none;
        background: transparent;
        box-sizing: border-box;
    }

    .material-line-icon.material-disc-icon {
        height: 14px !important;
        border: 3px solid currentColor;
        border-radius: 50%;
        box-shadow: inset 0 -3px 0 currentColor;
    }

    .material-line-icon.material-disc-icon::after {
        content: "";
        position: absolute;
        left: 50%;
        top: 1px;
        width: 9px;
        height: 4px;
        border: 2px solid currentColor;
        border-radius: 50%;
        transform: translateX(-50%);
    }

    .material-line-icon.material-cone-icon {
        background: currentColor;
        clip-path: polygon(44% 0, 56% 0, 82% 76%, 100% 84%, 100% 100%, 0 100%, 0 84%, 18% 76%);
    }

    .material-line-icon.material-cone-icon::after {
        content: "";
        position: absolute;
        left: 7px;
        right: 7px;
        bottom: 10px;
        height: 2px;
        background: #fff;
        box-shadow: 0 6px 0 #fff;
    }

    .material-line-icon.material-stake-icon {
        width: 13px;
        border: 3px solid currentColor;
        border-radius: 8px 8px 2px 2px;
    }

    .material-line-icon.material-stake-icon::after {
        content: "";
        position: absolute;
        left: 50%;
        bottom: -7px;
        width: 24px;
        height: 7px;
        border: 3px solid currentColor;
        border-radius: 50%;
        transform: translateX(-50%);
    }

    .material-line-icon.material-ladder-icon {
        width: 30px;
        border-right: 3px solid currentColor;
        border-left: 3px solid currentColor;
        background: repeating-linear-gradient(to bottom, transparent 0 5px, currentColor 5px 8px);
    }

    .material-line-icon.material-hurdle-icon {
        height: 22px;
        border: 3px solid currentColor;
        border-bottom: 0;
        border-radius: 5px 5px 0 0;
    }

    .material-line-icon.material-hurdle-icon::before,
    .material-line-icon.material-hurdle-icon::after {
        content: "";
        position: absolute;
        bottom: -6px;
        width: 13px;
        border-bottom: 4px solid currentColor;
    }

    .material-line-icon.material-hurdle-icon::before {
        left: -6px;
        transform: rotate(-25deg);
    }

    .material-line-icon.material-hurdle-icon::after {
        right: -6px;
        transform: rotate(25deg);
    }

    .material-line-icon.material-ball-icon {
        border: 3px solid currentColor;
        border-radius: 50%;
        background: radial-gradient(circle, currentColor 0 4px, transparent 4.5px),
            conic-gradient(from 15deg, transparent 0 12%, currentColor 13% 16%, transparent 17% 32%,
                currentColor 33% 36%, transparent 37% 52%, currentColor 53% 56%, transparent 57% 72%,
                currentColor 73% 76%, transparent 77%);
    }

    .material-line-icon.material-bib-icon {
        border: 3px solid currentColor;
        border-radius: 4px 4px 8px 8px;
        clip-path: polygon(18% 0, 35% 0, 40% 18%, 60% 18%, 65% 0, 82% 0, 100% 28%, 86% 42%, 82% 32%, 82% 100%, 18% 100%, 18% 32%, 14% 42%, 0 28%);
    }

    .material-line-icon.material-goal-icon {
        border: 3px solid currentColor;
        background-image: linear-gradient(45deg, transparent 45%, currentColor 46% 54%, transparent 55%),
            linear-gradient(-45deg, transparent 45%, currentColor 46% 54%, transparent 55%);
        background-size: 8px 8px;
    }

    .material-line-icon.material-tape-icon {
        border: 3px solid currentColor;
        border-radius: 50%;
        box-shadow: inset 0 0 0 5px #fff, inset 0 0 0 8px currentColor;
    }

    .material-line-icon.material-dummy-icon {
        width: 18px;
        border: 4px solid currentColor;
        border-radius: 8px 8px 3px 3px;
        clip-path: polygon(20% 0, 80% 0, 100% 15%, 84% 82%, 65% 82%, 70% 100%, 30% 100%, 35% 82%, 16% 82%, 0 15%);
    }

    /* Card de materiais: lista completa e ícones técnicos iguais aos objetos do campo. */
    :scope .tactical-menu:nth-child(6) .tactical-menu-panel {
        right: 0;
        left: auto;
        width: 300px;
        max-height: 330px;
        padding: 10px 8px;
        overscroll-behavior: contain;
    }

    :scope .tactical-menu:nth-child(6) .tactical-menu-option {
        justify-content: flex-start;
        min-height: 45px;
        padding: 4px 14px;
        gap: 14px;
        text-align: left;
    }

    :scope .tactical-menu:nth-child(6) .menu-option-icon.material-line-icon {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        flex: 0 0 44px;
        width: 44px;
        height: 36px !important;
        border: 0;
        border-radius: 0;
        clip-path: none;
        background: transparent;
        box-shadow: none;
    }

    :scope .tactical-menu:nth-child(6) .menu-option-icon.material-line-icon::before,
    :scope .tactical-menu:nth-child(6) .menu-option-icon.material-line-icon::after {
        content: none;
        display: none;
    }

    .material-icon-svg {
        display: block;
        width: 100%;
        height: 100%;
        overflow: visible;
        color: var(--object-color, currentColor);
    }

    :scope .field .obj.material-svg-object {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 54px;
        height: 58px;
        border: 0;
        background: transparent;
        box-shadow: none;
        color: var(--object-color, #111);
        clip-path: none;
        filter: none;
    }

    :scope .field .obj.material-svg-object::before,
    :scope .field .obj.material-svg-object::after {
        content: none;
        display: none;
    }

    :scope .field .obj.material-svg-object .goal-symbol {
        display: block;
        width: 100%;
        height: 100%;
        border: 0;
        background: transparent;
        box-shadow: none;
    }

    :scope .field .obj.material-svg-object .material-icon-svg {
        filter: drop-shadow(0 2px 2px rgba(0, 0, 0, .18));
    }

    :scope .field .obj.material-svg-object.goal,
    :scope .field .obj.material-svg-object.largeGoal {
        height: 62px;
    }

    :scope .field .obj.material-svg-object.ladder {
        width: 58px;
        height: 74px;
        border: 0;
        background: transparent;
    }

    :scope .field .obj.material-svg-object.disc {
        width: 58px;
        height: 34px;
        border: 0;
        background: transparent;
        box-shadow: none;
    }

    :scope .field .obj.material-svg-object.stake {
        width: 42px;
        height: 72px;
        border: 0;
        background: transparent;
    }

    :scope .field .obj.material-svg-object.tape {
        width: 50px;
        height: 50px;
        border: 0;
        background: transparent;
        box-shadow: none;
    }

    :scope .field .obj.material-svg-object.weights {
        width: 54px;
        height: 54px;
    }

    :scope .field .obj.material-svg-object.barbell {
        width: 86px;
        height: 48px;
    }

    :scope .field .arrow {
        color: var(--object-color, #fff);
        background: currentColor;
    }

    :scope .field .dashedArrow {
        color: var(--object-color, #fff);
        border-top-color: currentColor;
    }

    :scope .field .curvedArrow,
    :scope .field .curvedDashedArrow {
        color: var(--object-color, #fff);
        border-top-color: currentColor;
    }

    :scope .field .arrow::after,
    :scope .field .dashedArrow::after,
    :scope .field .curvedArrow::after,
    :scope .field .curvedDashedArrow::after {
        border-top-color: currentColor;
        border-right-color: currentColor;
    }

    :scope .field .obj.shapeTriangle {
        width: 48px;
        height: 46px;
        color: var(--object-color, #fff);
        background: currentColor;
        clip-path: polygon(50% 3%, 97% 95%, 3% 95%);
    }

    :scope .field .obj.shapeCircle {
        width: 48px;
        height: 48px;
        color: var(--object-color, #fff);
        border: 0;
        border-radius: 50%;
        background: currentColor;
        box-sizing: border-box;
    }

    :scope .field .obj.shapeSquare,
    :scope .field .obj.shapeDiamond {
        width: 52px;
        height: 52px;
        color: var(--object-color, #fff);
        background: currentColor;
        box-sizing: border-box;
    }

    :scope .field .obj.shapeDiamond {
        clip-path: polygon(50% 0, 100% 50%, 50% 100%, 0 50%);
    }

    :scope .field .shape-resize-handle {
        position: absolute;
        z-index: 3;
        display: none;
        background: transparent;
    }

    :scope .field .obj.selected .shape-resize-handle {
        display: block;
    }

    :scope .field .shape-resize-handle.is-top,
    :scope .field .shape-resize-handle.is-bottom {
        left: 5px;
        right: 5px;
        height: 10px;
        cursor: ns-resize;
    }

    :scope .field .shape-resize-handle.is-left,
    :scope .field .shape-resize-handle.is-right {
        top: 5px;
        bottom: 5px;
        width: 10px;
        cursor: ew-resize;
    }

    :scope .field .shape-resize-handle.is-top {
        top: -6px;
    }

    :scope .field .shape-resize-handle.is-bottom {
        bottom: -6px;
    }

    :scope .field .shape-resize-handle.is-left {
        left: -6px;
    }

    :scope .field .shape-resize-handle.is-right {
        right: -6px;
    }

    :scope .field-preview .shape-resize-handle {
        display: none !important;
    }

    :scope .field .material-svg-object.bib .material-icon-svg path:first-child {
        fill: currentColor;
    }

    :scope .field .obj.material-svg-object.bib {
        width: 70px;
    }

    :scope .field .bib-number {
        position: absolute;
        inset: 0;
        display: flex;
        align-items: center;
        justify-content: center;
        z-index: 2;
        color: #111;
        font-size: 22px;
        font-weight: 900;
        line-height: 1;
        text-align: center;
        pointer-events: none;
    }

    :scope .field .material-svg-object.bib:not([data-color="white"]) .bib-number {
        color: #fff;
        text-shadow: 0 1px 2px rgba(0, 0, 0, .45);
    }

    @media (max-width: 820px) {
        :scope .tactical-menu:nth-child(6) .tactical-menu-panel {
            right: auto;
            left: 0;
            width: min(300px, calc(100vw - 40px));
            max-height: min(330px, calc(100vh - 170px));
        }
    }
}

/* PRÉ-SÚMULA — AÇÕES DO FORMULÁRIO — CSS MIGRADO DO HTML */
@scope (:scope) {
    :scope .form-actions {
        display: flex;
        gap: 10px;
        justify-content: center;
        margin-top: 25px;
        flex-wrap: wrap;
        width: 100%;
    }

    :scope .form-actions button,
    :scope .form-actions .btn {
        width: auto;
        min-height: 38px;
        padding: 10px 20px;
        border: 1px solid #d8d8dc;
        border-radius: 999px;
        background: #fff;
        color: #505055;
        font: 700 11px/1 "Space Grotesk", sans-serif;
        text-transform: uppercase;
        letter-spacing: .5px;
        white-space: nowrap;
        cursor: pointer;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        box-sizing: border-box;
        transition: all 0.2s ease;
    }

    :scope .form-actions button:hover,
    :scope .form-actions .btn:hover {
        background: #f7f7f7;
        border-color: #c0c0c0;
        color: #111;
    }

    :scope .form-actions button.primary {
        border-color: var(--metro-red);
        background: var(--metro-red);
        color: #fff;
    }

    :scope .form-actions button.primary:hover {
        background: #e02020;
        border-color: #e02020;
        color: #fff;
    }
}

/* SCOUT DA PARTIDA — CSS MIGRADO DO HTML */
@scope (:scope) {
    :scope {
        --metro-red: #e02020;
        --metro-black: #171717;
        --metro-muted: #777;
        min-height: 100vh;
        display: flex;
        flex-direction: column;
        margin: 0;
        padding: 32px 16px 24px;
        background: #fff;
        color: var(--metro-black);
        font-family: "Space Grotesk", sans-serif;
    }

    :scope * {
        box-sizing: border-box;
    }

    :scope .page {
        flex: 1;
        width: 100%;
        max-width: 1120px;
        margin: 0 auto;
        display: grid;
        grid-template-columns: 420px minmax(0, 1fr);
        gap: 40px;
        align-items: start;
    }

    :scope .scout-card {
        width: 100%;
        max-width: 720px;
        min-width: 0;
        display: flex;
        flex-direction: column;
        gap: 18px;
    }

    :scope .scout-intro {
        padding: 0;
    }

    :scope .scout-panel {
        min-width: 0;
        padding: 32px;
        border: 1px solid rgba(0, 0, 0, 0.08);
        border-radius: 24px;
        background: #fff;
        box-shadow: 0 12px 30px rgba(0, 0, 0, 0.055);
    }

    :scope #profile-card-container {
        min-width: 420px;
    }

    :scope #profile-card-container .club-name,
    :scope #profile-card-container .club-description,
    :scope #profile-card-container .next-title {
        margin-top: 0;
    }

    .scout-title {
        margin: 0;
        font-size: 28px;
        line-height: 1.15;
    }

    .scout-subtitle {
        margin: 8px 0 0;
        color: var(--metro-muted);
        font-size: 14px;
        line-height: 1.5;
    }

    .match-grid {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 10px;
        margin-top: 24px;
    }

    .scout-match-info {
        min-width: 0;
        padding: 8px 16px;
        border: 1px solid #e7e7e7;
        border-radius: 16px;
        background: #fafafa;
        text-align: center;
    }

    .scout-match-info.wide {
        grid-column: span 2;
    }

    .scout-match-info span {
        display: block;
        color: var(--metro-muted);
        font-size: 12px;
        font-weight: 700;
        letter-spacing: .08em;
        text-transform: uppercase;
    }

    .scout-match-info strong {
        display: block;
        margin-top: 5px;
        overflow-wrap: anywhere;
        font-size: 12px;
        line-height: 1.3;
        white-space: normal;
    }

    .scout-header-section {
        margin-top: 0;
        display: flex;
        flex-direction: column;
        gap: 18px;
    }

    .scout-header-label {
        margin: 0 0 12px;
        color: var(--metro-muted);
        font-size: 13px;
        font-weight: 700;
        letter-spacing: .12em;
        text-transform: uppercase;
    }

    .scout-fields {
        display: grid;
        grid-template-columns: 1fr;
        gap: 10px;
    }

    .scout-field-row {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 10px;
    }

    .scout-field {
        display: flex;
        flex-direction: column;
        min-width: 0;
    }

    .scout-field label {
        margin-bottom: 6px;
        color: #000;
        font-size: 13px;
        font-weight: 500;
    }

    .scout-field select,
    .scout-field input {
        width: 100%;
        height: 40px;
        padding: 6px 12px;
        border: 1px solid #d5d5d5;
        border-radius: 999px;
        background: #fff;
        color: #111;
        font: 500 12px "Space Grotesk", sans-serif;
        outline: none;
    }

    .scout-field select:focus,
    .scout-field input:focus {
        border-color: var(--metro-red);
        box-shadow: 0 0 0 3px rgba(224, 32, 32, .08);
    }

    .section-heading {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        margin: 28px 0 10px;
    }

    .scout-panel-heading {
        margin-top: 0;
    }

    .section-label {
        margin: 0;
        color: var(--metro-muted);
        font-size: 13px;
        font-weight: 700;
        letter-spacing: .12em;
        text-transform: uppercase;
    }

    .section-count {
        color: var(--metro-red);
        font-size: 12px;
        font-weight: 700;
    }

    .scout-table-wrap {
        overflow-x: auto;
        border: 1px solid #e4e4e4;
        border-radius: 18px;
    }

    .scout-table {
        width: 100%;
        min-width: 900px;
        border-collapse: collapse;
        font-size: 11px;
    }

    .scout-table th {
        padding: 7px 2px;
        background: #f4f4f4;
        color: #606060;
        font-size: 11px;
        letter-spacing: .01em;
        line-height: 1.15;
        text-align: center;
        text-transform: uppercase;
        white-space: nowrap;
    }

    .scout-table th.player-col {
        min-width: 160px;
        width: 160px;
        text-align: center;
    }

    .scout-table th.group-header {
        padding-bottom: 3px;
        border-bottom: 0;
        color: var(--metro-black);
    }

    .scout-table td {
        padding: 7px 2px;
        border-top: 1px solid #ececec;
        font-size: 11px;
        text-align: center;
    }

    .scout-table tbody tr:hover {
        background: #fffafa;
    }

    .scout-table tbody tr:last-child td {
        padding-bottom: 14px;
    }

    .athlete {
        display: flex;
        align-items: center;
        gap: 7px;
        min-width: 0;
        text-align: left;
    }

    .shirt-input {
        flex: 0 0 36px;
        width: 36px;
        height: 29px;
        padding: 3px;
        border: 1px solid var(--metro-red);
        border-radius: 8px;
        background: var(--metro-red);
        color: #fff;
        font: 700 11px "Space Grotesk", sans-serif;
        text-align: center;
        appearance: textfield;
        outline: none;
    }

    .shirt-input::-webkit-inner-spin-button,
    .shirt-input::-webkit-outer-spin-button {
        margin: 0;
        appearance: none;
    }

    .shirt-input:focus {
        border-color: var(--metro-red);
        box-shadow: 0 0 0 3px rgba(224, 32, 32, .12);
    }

    .athlete>div {
        min-width: 0;
    }

    .athlete-name {
        display: block;
        overflow: hidden;
        font-size: 11px;
        font-weight: 700;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .athlete-captain {
        color: var(--metro-red);
        font-weight: 700;
    }

    .athlete-role {
        display: block;
        margin-top: 1px;
        overflow: hidden;
        color: var(--metro-muted);
        font-size: 11px;
        font-weight: 500;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .stat-input {
        width: 42px;
        height: 34px;
        padding: 4px 6px;
        border: 1px solid #d7d7d7;
        border-radius: 9px;
        background: #fff;
        font: 600 11px "Space Grotesk", sans-serif;
        text-align: center;
        outline: none;
    }

    .stat-input:focus {
        border-color: var(--metro-red);
        box-shadow: 0 0 0 3px rgba(224, 32, 32, .1);
    }

    .stat-input:disabled {
        background: #f2f2f2;
        color: #aaa;
        cursor: not-allowed;
    }

    .stat-input {
        appearance: textfield;
    }

    .stat-input::-webkit-inner-spin-button,
    .stat-input::-webkit-outer-spin-button {
        margin: 0;
        appearance: none;
    }

    .time-output {
        display: inline-block;
        min-width: 50px;
        padding: 7px 4px;
        border-radius: 8px;
        background: #f2f2f2;
        color: #333;
        font-size: 11px;
        font-weight: 700;
        white-space: nowrap;
    }

    .time-output.percentage {
        color: var(--metro-red);
    }

    .stepper {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 2px;
    }

    .stepper-button {
        display: grid;
        place-items: center;
        width: 21px;
        height: 21px;
        padding: 0;
        border: none;
        border-radius: 50%;
        background: var(--metro-black);
        color: #fff;
        font: 700 13px/1 "Space Grotesk", sans-serif;
        cursor: pointer;
        transition: .2s ease;
    }

    .stepper-button:hover:not(:disabled) {
        background: var(--metro-red);
        transform: translateY(-1px);
    }

    .stepper-button:disabled {
        background: #ddd;
        color: #999;
        cursor: not-allowed;
    }

    .stepper-value {
        display: block;
        width: 22px;
        min-width: 22px;
        height: 21px;
        padding: 0;
        border: 0;
        background: transparent;
        color: var(--metro-black);
        font: 700 11px "Space Grotesk", sans-serif;
        line-height: 21px;
        text-align: center;
        appearance: textfield;
        opacity: 1;
        pointer-events: none;
        -webkit-text-fill-color: var(--metro-black);
    }

    .stepper-value::-webkit-inner-spin-button,
    .stepper-value::-webkit-outer-spin-button {
        margin: 0;
        appearance: none;
    }

    .stepper.disabled {
        opacity: .45;
    }

    .stepper[data-kind="amarelo"] .stepper-value {
        color: #947500;
        -webkit-text-fill-color: #947500;
    }

    .stepper[data-kind="vermelho"] .stepper-value {
        color: var(--metro-red);
        -webkit-text-fill-color: var(--metro-red);
    }

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

    .technical-card {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 12px;
        padding: 12px 14px;
        border: 1px solid #ddd;
        border-radius: 14px;
        background: #fafafa;
    }

    .technical-info {
        min-width: 0;
        line-height: 1.2;
    }

    .technical-info .role {
        display: block;
        color: #666;
        font-size: 12px;
        font-weight: 500;
        text-transform: uppercase;
    }

    .technical-info .name {
        display: block;
        margin-top: 3px;
        font-size: 13px;
        font-weight: 700;
        text-transform: uppercase;
    }

    .technical-remove {
        flex: 0 0 auto;
        padding: 7px 11px;
        border: 0;
        border-radius: 9px;
        background: var(--metro-red);
        color: #fff;
        font: 700 11px "Space Grotesk", sans-serif;
        cursor: pointer;
    }

    .include-row {
        display: flex;
        align-items: center;
        gap: 8px;
        margin-bottom: 10px;
    }

    .include-row select {
        flex: 1;
        min-width: 0;
        height: 38px;
        padding: 6px 12px;
        border: 1px solid #d5d5d5;
        border-radius: 999px;
        background: #fff;
        font: 500 11px "Space Grotesk", sans-serif;
    }

    .include-button {
        flex: 0 0 auto;
        height: 38px;
        padding: 0 15px;
        border: 0;
        border-radius: 999px;
        background: var(--metro-red);
        color: #fff;
        font: 700 11px "Space Grotesk", sans-serif;
        cursor: pointer;
    }

    .include-button:disabled {
        background: #ccc;
        cursor: not-allowed;
    }

    :scope #incluirTitular,
    :scope #incluirSuplente,
    :scope #incluirComissao {
        flex: 0 0 120px;
        width: 120px;
        padding-inline: 10px;
    }

    .athlete-remove {
        padding: 5px 8px;
        border: 0;
        border-radius: 7px;
        background: var(--metro-red);
        color: #fff;
        font: 700 9px "Space Grotesk", sans-serif;
        cursor: pointer;
    }

    .summary-bar {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 8px;
        margin-top: 0;
        padding: 14px;
        border-radius: 18px;
        background: var(--metro-black);
        color: #fff;
    }

    .summary-item {
        text-align: center;
    }

    .summary-item span {
        display: block;
        color: #aaa;
        font-size: 9px;
        font-weight: 700;
        letter-spacing: .07em;
        text-transform: uppercase;
    }

    .summary-item strong {
        display: block;
        margin-top: 3px;
        font-size: 20px;
    }

    .scout-actions {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 10px;
        margin-top: 18px;
    }

    .btn-action {
        min-width: 135px;
        padding: 11px 18px;
        border: 1px solid #ddd;
        border-radius: 999px;
        background: #fff;
        font: 700 12px "Space Grotesk", sans-serif;
        cursor: pointer;
    }

    .btn-action.primary {
        border-color: var(--metro-red);
        background: var(--metro-red);
        color: #fff;
    }

    :scope #footer-container .footer {
        margin-top: 24px;
        text-align: center;
    }

    :scope .footer-main {
        margin: 0;
        color: #666;
        font-size: 14px;
    }

    :scope .footer-sub {
        margin-top: 4px;
        color: #999;
        font-size: 11px;
        line-height: 1.4;
    }

    @media (max-width: 900px) {
        :scope .page {
            grid-template-columns: 1fr;
        }
    }

    @media (max-width: 850px) {
        :scope #profile-card-container {
            min-width: auto;
        }
    }

    @media (max-width: 700px) {
        :scope {
            padding: 16px 10px;
        }

        :scope .scout-card {
            gap: 14px;
        }

        :scope .scout-panel {
            padding: 32px;
            border-radius: 20px;
        }

        .match-grid {
            grid-template-columns: repeat(2, minmax(0, 1fr));
        }

        .scout-field-row {
            grid-template-columns: 1fr;
        }

        .technical-grid {
            grid-template-columns: 1fr;
        }

        .summary-bar {
            grid-template-columns: repeat(2, 1fr);
        }

        .scout-actions {
            flex-direction: column;
        }

        .btn-action {
            width: 100%;
        }
    }
}

@media (max-width: 460px) {

    body.page-scout .scout-panel,
    body.page-pre-sumula .pre-sumula-panel {
        padding: 24px;
    }
}

/* =========================================================
   CARD DE PERFIL — REDESIGN 2026
   ========================================================= */

#profile-card-container .profile-card {
    height: auto;
    padding: 32px;
    overflow: hidden;
    border: 1px solid rgba(0, 0, 0, 0.04);
    border-radius: 32px;
    background: #ffffff;
    box-shadow: 0 22px 55px rgba(17, 17, 17, 0.10);
}

#profile-card-container .profile-card-content {
    width: 100%;
    min-width: 0;
}

#profile-card-container .top-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 28px;
}

#profile-card-container .logo-wrap {
    width: 112px;
    height: 112px;
    flex: 0 0 112px;
}

#profile-card-container .badges {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 12px;
}

#profile-card-container .badge-fpf {
    height: 36px;
}

#profile-card-container .badge-cbf {
    height: 44px;
}

#profile-card-container .badge-formador {
    height: 38px;
}

#profile-card-container .club-overview {
    min-width: 0;
}

#profile-card-container .club-name {
    margin: 0 0 10px;
    color: #111111;
    font-size: 26px;
    font-weight: 700;
    line-height: 1.15;
    letter-spacing: -0.02em;
    text-transform: uppercase;
}

#profile-card-container .club-handle {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 2px;
    color: #727277;
    font-size: 14px;
    line-height: 1.3;
}

#profile-card-container .club-colors {
    display: inline-flex;
    align-items: center;
    gap: 3px;
}

#profile-card-container .club-color {
    width: 17px;
    height: 17px;
    border: 1px solid rgba(0, 0, 0, 0.10);
    border-radius: 50%;
    box-shadow: inset 0 1px 2px rgba(255, 255, 255, 0.35);
}

#profile-card-container .club-color-red {
    background: #e02020;
}

#profile-card-container .club-color-black {
    background: #111111;
}

#profile-card-container .club-color-white {
    background: #eeeeef;
}

#profile-card-container .club-summary {
    display: grid;
    gap: 8px;
    margin-top: 22px;
}

#profile-card-container .club-summary p {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    margin: 0;
    color: #5f5f64;
    font-size: 14px;
    line-height: 1.55;
}

#profile-card-container .club-summary svg {
    width: 18px;
    height: 18px;
    flex: 0 0 18px;
    margin-top: 2px;
    fill: none;
    stroke: var(--metro-red);
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

#profile-card-container .club-location {
    display: flex;
    align-items: center;
    gap: 9px;
    margin-top: 18px;
    color: #707075;
    font-size: 14px;
    font-weight: 500;
}

#profile-card-container .club-location svg {
    width: 18px;
    height: 18px;
    fill: none;
    stroke: var(--metro-red);
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

#profile-card-container .profile-divider {
    height: 1px;
    margin: 24px 0;
    background: #eeeeef;
}

#profile-card-container .profile-features {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

#profile-card-container .profile-feature {
    display: grid;
    grid-template-columns: 30px minmax(0, 1fr);
    align-items: center;
    gap: 10px;
    min-height: 50px;
    padding: 8px 10px;
    border: 1px solid rgba(224, 32, 32, 0.36);
    border-radius: 16px;
    background: rgba(224, 32, 32, 0.025);
    color: #28282c;
}

#profile-card-container .profile-feature svg {
    width: 23px;
    height: 23px;
    fill: none;
    stroke: var(--metro-red);
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

#profile-card-container .profile-feature span {
    font-size: 11px;
    font-weight: 700;
    line-height: 1.35;
    letter-spacing: 0.07em;
    text-align: center;
    text-transform: uppercase;
}

#profile-card-container .next-matches-card {
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    text-align: left;
}

#profile-card-container .next-matches-header {
    display: grid;
    grid-template-columns: 24px auto minmax(28px, 1fr);
    align-items: center;
    gap: 10px;
    margin-bottom: 16px;
}

#profile-card-container .next-matches-header svg {
    width: 22px;
    height: 22px;
    fill: none;
    stroke: var(--metro-red);
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

#profile-card-container .next-matches-header>span {
    height: 1px;
    background: rgba(224, 32, 32, 0.45);
}

#profile-card-container .next-title {
    margin: 0;
    color: #17171a;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: 0;
    text-transform: uppercase;
}

#profile-card-container .next-match {
    margin: 0;
    padding: 0;
    border: 0;
}

#profile-card-container .next-matches-list {
    display: grid;
    gap: 8px;
}

#profile-card-container .matches-state {
    margin: 0;
    padding: 18px 14px;
    border: 1px solid #e4e4e7;
    border-radius: 16px;
    color: #6f6f74;
    font-size: 13px;
    font-weight: 600;
    text-align: center;
}

#profile-card-container .matches-state-error {
    border-color: rgba(224, 32, 32, 0.28);
    color: var(--metro-red);
}

#profile-card-container .next-match.next-match-featured {
    padding: 16px 18px 18px;
    border: 2px solid var(--metro-red);
    border-radius: 18px;
    background: rgba(224, 32, 32, 0.025);
}

#profile-card-container .match-competition {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: auto;
    margin: 0 0 7px;
    padding: 6px 10px;
    border-radius: 8px;
    font-size: 11px;
    font-weight: 700;
    line-height: 1;
    letter-spacing: 0.03em;
    text-align: center;
    text-transform: uppercase;
}

#profile-card-container .next-match-featured .match-competition {
    border-color: var(--metro-red);
    background: var(--metro-red);
    color: #ffffff;
    box-shadow: none;
}

#profile-card-container .match-category {
    margin-bottom: 6px;
    color: var(--metro-red);
    font-size: 13px;
    font-weight: 700;
    line-height: 1.3;
    text-transform: uppercase;
}

#profile-card-container .match-date {
    margin-bottom: 7px;
    color: #4f4f54;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.4;
}

#profile-card-container .match-info {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 10px;
    margin-bottom: 5px;
    color: #17171a;
    font-size: 15px;
    line-height: 1.35;
}

#profile-card-container .match-info strong {
    min-width: 0;
}

#profile-card-container .match-colors {
    flex: 0 0 auto;
    white-space: nowrap;
}

/* Cadastro completo de atletas dentro do prontuário. */
body.page-prontuario #grupo-profissional[hidden],
body.page-prontuario #grupo-categoria-atleta[hidden],
body.page-prontuario #grupo-nome-atleta[hidden],
body.page-prontuario #grupo-data-prontuario[hidden] {
    display: none !important;
}

body.page-prontuario .cadastro-atleta-intro {
    margin: -8px 0 18px;
    color: var(--metro-muted);
    font-size: 13px;
    line-height: 1.5;
}

body.page-prontuario .avaliacao-fisica-intro {
    margin: -4px 0 22px;
    color: var(--metro-muted);
    font-size: 13px;
    line-height: 1.5
}

body.page-prontuario .avaliacao-fisica-subtitulo {
    margin: 0 0 14px;
    padding-bottom: 9px;
    border-bottom: 1px solid #ececef;
    color: var(--metro-text);
    font-size: 13px;
    font-weight: 700
}

body.page-prontuario .avaliacao-fisica-subtitulo-estado {
    margin-top: 24px
}

body.page-prontuario .avaliacao-fisica-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px
}

body.page-prontuario .avaliacao-fisica-grid-secundaria {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    margin-top: 14px
}

body.page-prontuario .avaliacao-fisica-grid-estado {
    align-items: end
}

body.page-prontuario .avaliacao-fisica-medida {
    position: relative
}

body.page-prontuario .avaliacao-fisica-medida input {
    box-sizing: border-box;
    width: 100%;
    height: var(--metro-form-control-height);
    min-height: var(--metro-form-control-height);
    padding: 6px 58px 6px var(--metro-form-control-padding-x);
    border: 1px solid var(--metro-form-control-border);
    border-radius: var(--metro-form-control-radius);
    background: #fff;
    color: var(--metro-text);
    font: 400 var(--metro-form-control-font-size) "Space Grotesk", sans-serif;
    outline: none
}

body.page-prontuario .avaliacao-fisica-medida input:focus {
    border-color: var(--metro-red);
    box-shadow: 0 0 0 3px rgba(224, 32, 32, .08)
}

body.page-prontuario .avaliacao-fisica-medida>span {
    position: absolute;
    top: 50%;
    right: 18px;
    color: var(--metro-muted);
    font-size: 12px;
    font-weight: 700;
    pointer-events: none;
    transform: translateY(-50%)
}

body.page-prontuario .avaliacao-fisica-resultados {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin-top: 22px
}

body.page-prontuario .avaliacao-fisica-indicador {
    display: flex;
    min-height: 86px;
    flex-direction: column;
    justify-content: center;
    gap: 7px;
    padding: 16px 18px;
    border: 1px solid #e4e4e7;
    border-radius: 16px;
    background: #fafafa
}

body.page-prontuario .avaliacao-fisica-indicador span {
    color: var(--metro-muted);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase
}

body.page-prontuario .avaliacao-fisica-indicador strong {
    color: var(--metro-text);
    font-size: 14px;
    line-height: 1.35
}

body.page-prontuario .avaliacao-fisica-nota {
    max-width: 620px;
    margin: 0;
    color: var(--metro-muted);
    font-size: 11px;
    line-height: 1.45
}

body.page-prontuario .avaliacao-fisica-observacoes {
    margin-top: 16px
}

body.page-prontuario .avaliacao-fisica-observacoes textarea {
    box-sizing: border-box;
    width: 100%;
    min-height: 92px;
    padding: 12px 15px;
    border: 1px solid #d5d5d5;
    border-radius: 14px;
    background: #fff;
    color: var(--metro-text);
    font: 400 13px/1.5 "Space Grotesk", sans-serif;
    outline: none;
    resize: vertical
}

body.page-prontuario .avaliacao-fisica-observacoes textarea:focus {
    border-color: var(--metro-red);
    box-shadow: 0 0 0 3px rgba(224, 32, 32, .08)
}

body.page-prontuario .avaliacao-fisica-rodape {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    margin-top: 24px;
    padding-top: 20px;
    border-top: 1px solid #ececef
}

body.page-prontuario .avaliacao-fisica-rodape .btn-gravar {
    min-height: 0;
    flex: 0 0 auto;
    padding: 10px 18px;
    border-radius: 10px;
    white-space: nowrap
}

@media (max-width: 880px) {
    body.page-prontuario .avaliacao-fisica-grid,
    body.page-prontuario .avaliacao-fisica-grid-estado {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }

    body.page-prontuario .avaliacao-fisica-rodape {
        align-items: stretch;
        flex-direction: column
    }

    body.page-prontuario .avaliacao-fisica-rodape .btn-gravar {
        width: auto;
        align-self: flex-end;
        white-space: normal
    }
}

body.page-prontuario .cadastro-atleta-step {
    display: none;
}

body.page-prontuario .cadastro-atleta-step.active {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

body.page-prontuario .cadastro-atleta-step-title {
    padding-bottom: 10px;
    border-bottom: 1px solid #ececef;
    color: var(--metro-text);
    font-size: 16px;
    font-weight: 700;
}

body.page-prontuario .cadastro-atleta-step .field-group,
body.page-prontuario .cadastro-atleta-step .field-row {
    margin: 0;
}

body.page-prontuario .cadastro-atleta-step .field-group {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

body.page-prontuario .cadastro-atleta-step .field-row {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
}

body.page-prontuario .cadastro-atleta-step-description {
    margin: 0;
    color: var(--metro-muted);
    font-size: 13px;
    line-height: 1.5;
}

body.page-prontuario .cadastro-atleta-navigation {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-top: 22px;
}

body.page-prontuario .cadastro-atleta-navigation button {
    min-width: 120px;
    min-height: 42px;
    padding: 10px 20px;
    border-radius: 999px;
    font-family: "Space Grotesk", sans-serif;
    font-size: 13px;
    font-weight: 600;
    cursor: pointer;
}

body.page-prontuario .cadastro-atleta-navigation .btn-step-back {
    border: 1px solid #d5d5d5;
    background: #fff;
    color: #333;
}

body.page-prontuario .cadastro-atleta-navigation .btn-step-next,
body.page-prontuario .cadastro-atleta-navigation .btn-step-submit {
    margin-left: auto;
    border: 1px solid var(--metro-red);
    background: var(--metro-red);
    color: #fff;
}

body.page-prontuario .cadastro-atleta-navigation button[hidden] {
    display: none;
}

body.page-prontuario #cadastro-atleta-erro {
    display: none;
    margin-top: 10px;
    color: var(--metro-red);
    font-size: 12px;
    font-weight: 500;
    text-align: right;
}

body.page-prontuario #form-CADASTRO_ATLETAS .step-progress-wrapper {
    margin-top: 14px;
}

body.page-prontuario #form-CADASTRO_ATLETAS .step-progress-info {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 7px;
    color: #666;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
}

body.page-prontuario #form-CADASTRO_ATLETAS .step-progress-track {
    width: 100%;
    height: 7px;
    overflow: hidden;
    border-radius: 999px;
    background: #ededed;
}

body.page-prontuario #form-CADASTRO_ATLETAS .step-progress-fill {
    width: 13%;
    height: 100%;
    border-radius: inherit;
    background: var(--metro-red);
    transition: width .3s ease;
}

body.page-prontuario .cadastro-atleta-documentos {
    display: grid;
    gap: 16px;
}

body.page-prontuario .cadastro-atleta-documentos .field-group {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 16px;
    border: 1px solid #e2e2e5;
    border-radius: 18px;
    background: #fafafa;
}

body.page-prontuario .cadastro-atleta-documentos .field-label {
    width: 100%;
    text-align: center;
}

body.page-prontuario .cadastro-atleta-documentos .custom-file-upload {
    margin: 0;
}

body.page-prontuario .cadastro-documento-nome {
    width: 100%;
    color: var(--metro-muted);
    font-size: 12px;
    line-height: 1.4;
    overflow-wrap: anywhere;
    text-align: center;
}

body.page-prontuario .cadastro-atleta-pain-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

body.page-prontuario .cadastro-atleta-pain-grid label {
    display: flex;
    flex-direction: column;
    gap: var(--metro-form-field-gap);
    color: var(--metro-text);
    font-size: var(--metro-form-label-size);
    font-weight: 500;
}

body.page-prontuario .cadastro-atleta-pain-grid select {
    box-sizing: border-box;
    width: 100%;
    height: var(--metro-form-control-height);
    padding: 6px var(--metro-form-control-padding-x);
    border: 1px solid var(--metro-form-control-border);
    border-radius: var(--metro-form-control-radius);
    background: #fff;
    color: var(--metro-text);
    font: 400 var(--metro-form-control-font-size) "Space Grotesk", sans-serif;
}

@media (max-width: 620px) {
    body.page-prontuario .cadastro-atleta-step .field-row,
    body.page-prontuario .cadastro-atleta-pain-grid,
    body.page-prontuario .avaliacao-fisica-grid,
    body.page-prontuario .avaliacao-fisica-grid-secundaria,
    body.page-prontuario .avaliacao-fisica-grid-estado,
    body.page-prontuario .avaliacao-fisica-resultados {
        grid-template-columns: 1fr;
    }

    body.page-prontuario .cadastro-atleta-navigation button {
        min-width: 105px;
        padding-inline: 14px;
    }
}

#profile-card-container .match-location {
    color: #85858a;
    font-size: 12px;
    line-height: 1.4;
}

#profile-card-container .next-match-compact {
    display: grid;
    grid-template-columns: minmax(128px, 0.9fr) minmax(0, 1.35fr);
    gap: 12px;
    margin-top: 0;
    padding: 11px 12px;
    border: 1px solid #e4e4e7;
    border-radius: 16px;
    background: #ffffff;
    box-shadow: inset 0 -1px 0 #e4e4e7;
    box-sizing: border-box;
    min-height: 88px;
}

#profile-card-container .match-compact-label {
    padding-right: 11px;
    border-right: 1px solid #e5e5e7;
}

#profile-card-container .next-match-compact .match-competition {
    border-color: #8a8a8f;
    background: #8a8a8f;
    color: #ffffff;
    box-shadow: none;
}

#profile-card-container .next-match .competition-jogotreino {
    border-color: rgba(255, 193, 7, 0.35);
    background: linear-gradient(135deg,
            rgba(255, 193, 7, 0.15),
            rgba(255, 193, 7, 0.05));
    color: #b8860b;
    box-shadow: 0 4px 10px rgba(255, 193, 7, 0.12);
}

#profile-card-container .next-match .competition-uniaocup {
    display: flex;
    width: fit-content;
    margin-right: auto;
    margin-left: auto;
    border-color: rgba(40, 167, 69, 0.45);
    background: linear-gradient(135deg,
            rgba(40, 167, 69, 0.15),
            rgba(40, 167, 69, 0.05));
    color: #218838;
    box-shadow: 0 4px 10px rgba(40, 167, 69, 0.14);
}

#profile-card-container .next-match .competition-apf {
    margin-right: auto;
    margin-left: auto;
    border-color: rgba(113, 113, 122, 0.45);
    background: linear-gradient(135deg,
            rgba(113, 113, 122, 0.15),
            rgba(113, 113, 122, 0.05));
    color: #52525b;
    box-shadow: 0 4px 10px rgba(113, 113, 122, 0.14);
}

/* O card em destaque sempre usa o selo institucional à esquerda. */
#profile-card-container .next-match.next-match-featured .match-competition {
    display: flex;
    width: fit-content;
    margin-right: 0;
    margin-left: 0;
    border-color: var(--metro-red);
    background: var(--metro-red);
    color: #ffffff;
    box-shadow: none;
}

#profile-card-container .next-match-compact .match-category {
    margin: 0;
    font-size: 12px;
    line-height: 1.4;
}

#profile-card-container .next-match-compact .match-date {
    margin-bottom: 6px;
    font-size: 12px;
    line-height: 1.45;
}

#profile-card-container .next-match-compact .match-info {
    margin-bottom: 5px;
    font-size: 14px;
    line-height: 1.4;
}

#profile-card-container .next-match-compact .match-location {
    font-size: 11px;
    line-height: 1.45;
}

#profile-card-container .profile-update {
    justify-content: center;
    margin: 24px 0 0;
    padding: 16px 0 0;
    border: 0;
    border-top: 1px solid #eeeeef;
    border-radius: 0;
    background: transparent;
    text-align: center;
}

#profile-card-container .profile-update-icon {
    width: 26px;
    height: 26px;
    flex-basis: 26px;
    background: transparent;
    font-size: 16px;
}

#profile-card-container .profile-update-copy span {
    font-size: 9px;
}

#profile-card-container .profile-update-copy strong {
    font-size: 11px;
}

@media (max-width: 460px) {
    #profile-card-container .profile-card {
        padding: 24px;
        border-radius: 28px;
    }

    #profile-card-container .logo-wrap {
        width: 94px;
        height: 94px;
        flex-basis: 94px;
    }

    #profile-card-container .badges {
        gap: 8px;
    }

    #profile-card-container .badge-fpf {
        height: 30px;
    }

    #profile-card-container .badge-cbf {
        height: 37px;
    }

    #profile-card-container .badge-formador {
        height: 32px;
    }

    #profile-card-container .club-name {
        font-size: 22px;
    }

    #profile-card-container .profile-features {
        grid-template-columns: 1fr;
    }

    #profile-card-container .profile-feature {
        min-height: 60px;
    }

    #profile-card-container .next-match-compact {
        grid-template-columns: 1fr;
    }

    #profile-card-container .match-compact-label {
        padding: 0 0 10px;
        border-right: 0;
        border-bottom: 1px solid #e5e5e7;
    }
}

/* Atletas: cada categoria deve crescer para exibir a lista completa. */
body.page-atletas .section-card .athlete-list {
    max-height: none;
    overflow: visible;
}

body.page-atletas .athlete-card .athlete-photo {
    display: grid;
    width: 100% !important;
    max-width: 232px;
    height: auto !important;
    min-height: 0;
    max-height: none;
    flex: 0 0 auto;
    aspect-ratio: 4 / 5;
    place-items: center;
}

body.page-atletas .athlete-card .athlete-photo img {
    width: 100% !important;
    max-width: none;
    height: 100% !important;
    min-height: 0;
    max-height: none;
    object-fit: cover;
    object-position: center;
    transform: none;
}

/* Programação esportiva */
body.page-programacao {
    --metro-red: #e02020;
    --metro-muted: #77777c;
    min-height: 100vh;
    padding: 32px 16px 24px;
    background: #fff;
    color: #17171a;
    font-family: "Space Grotesk", sans-serif;
}

body.page-programacao * {
    box-sizing: border-box;
}

body.page-programacao .page {
    display: grid;
    grid-template-columns: 420px minmax(0, 1fr);
    align-items: start;
    gap: 40px;
    width: 100%;
    max-width: 1120px;
    margin: 0 auto;
}

body.page-programacao .programacao-card {
    min-width: 0;
    padding: 24px;
    border: 1px solid rgba(0, 0, 0, 0.08);
    border-radius: 28px;
    background: #fff;
    box-shadow: 0 14px 35px rgba(0, 0, 0, 0.06);
}

body.page-programacao .programacao-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
    margin: 22px 0;
}

body.page-programacao .programacao-heading h1 {
    margin: 0 0 5px;
    font-size: 26px;
    line-height: 1.15;
}

body.page-programacao .programacao-heading p {
    margin: 0;
    color: var(--metro-muted);
    font-size: 14px;
}

body.page-programacao .programacao-month-picker {
    display: grid;
    grid-template-columns: minmax(140px, 1fr) 96px;
    gap: 8px;
}

body.page-programacao .programacao-tabs {
    display: flex;
    gap: 10px;
    margin-bottom: 18px;
    padding-bottom: 18px;
    border-bottom: 1px solid #ececef;
}

body.page-programacao .programacao-tabs button {
    padding: 10px 22px;
    border: 1px solid #d9d9dd;
    border-radius: 999px;
    background: #fff;
    color: #55555a;
    font: 700 12px/1 "Space Grotesk", sans-serif;
    cursor: pointer;
    text-transform: uppercase;
}

body.page-programacao .programacao-tabs button.active {
    border-color: var(--metro-red);
    background: var(--metro-red);
    color: #fff;
}

body.page-programacao .programacao-workspace[hidden] {
    display: none;
}

body.page-programacao .programacao-toolbar {
    display: flex;
    justify-content: flex-end;
    margin-bottom: 14px;
}

body.page-programacao .programacao-semana-linha {
    display: flex;
    align-items: center;
    gap: 10px;
}

body.page-programacao .programacao-semana-numero {
    flex: 0 0 auto;
    padding: 8px 14px;
    border: 1px solid #d8d8dc;
    border-radius: 999px;
    background: #f7f7f8;
    color: var(--metro-red);
    font: 700 12px/1 "Space Grotesk", sans-serif;
    white-space: nowrap;
}

body.page-programacao label {
    display: grid;
    gap: 6px;
    min-width: 0;
}

body.page-programacao label>span,
body.page-programacao .programacao-selection>span {
    color: #68686d;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
}

body.page-programacao input,
body.page-programacao select,
body.page-programacao textarea {
    width: 100%;
    min-height: 42px;
    padding: 9px 12px;
    border: 1px solid #d8d8dc;
    border-radius: 12px;
    background: #fff;
    color: #222226;
    font: 500 13px/1.35 "Space Grotesk", sans-serif;
}

body.page-programacao textarea {
    min-height: 82px;
    resize: vertical;
}

body.page-programacao .programacao-calendar-weekdays,
body.page-programacao .programacao-calendar {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 7px;
}

body.page-programacao .programacao-calendar-weekdays {
    margin-bottom: 7px;
}

body.page-programacao .programacao-calendar-weekdays span {
    color: #77777c;
    font-size: 10px;
    font-weight: 700;
    text-align: center;
    text-transform: uppercase;
}

body.page-programacao .programacao-calendar button {
    display: flex;
    min-width: 0;
    min-height: 70px;
    padding: 8px;
    border: 1px solid #e1e1e4;
    border-radius: 12px;
    background: #fafafa;
    color: #222226;
    cursor: pointer;
    flex-direction: column;
    text-align: left;
}

body.page-programacao .programacao-calendar button strong {
    color: var(--metro-red);
    font-size: 13px;
}

body.page-programacao .programacao-calendar button span {
    margin-top: auto;
    color: #8a8a90;
    font-size: 9px;
}

body.page-programacao [data-program-date].has-activity {
    background: #ffecec;
    border-color: var(--metro-red);
}

body.page-programacao [data-program-date].has-activity span {
    color: var(--metro-red);
    font-weight: 600;
}

body.page-programacao .programacao-calendar button.today {
    position: relative;
    border: 2px solid #f2c94c;
    background: #fff9e6;
    box-shadow: 0 8px 22px rgba(242, 201, 76, .35);
}

body.page-programacao .programacao-calendar button.today strong {
    color: #d7a616;
}

body.page-programacao .programacao-calendar button.today::after {
    content: "HOJE";
    position: absolute;
    top: 6px;
    right: 6px;
    padding: 3px 5px;
    text-align: center;
    font-size: 7px;
    font-weight: 700;
    letter-spacing: .08em;
    color: #fff;
    background: #f2c94c;
    border-radius: 999px;
}

body.page-programacao .programacao-micro-row button.today {
    border: 2px solid #f2c94c;
    background: #fff9e6;
}

body.page-programacao [data-program-date].selected {
    border-color: var(--metro-red) !important;
    background: #fff2f2 !important;
    box-shadow: 0 0 0 2px rgba(224, 32, 32, 0.10);
}

body.page-programacao .programacao-semana-card {
    margin-top: 4px;
    padding: 16px;
    border: 1px solid #e1e1e4;
    border-radius: 18px;
    background: #fff;
}

body.page-programacao .programacao-semana-acoes {
    display: flex;
    justify-content: center;
    margin-top: 16px;
}

body.page-programacao .programacao-semana-acoes .programacao-save {
    margin: 0;
}

body.page-programacao .programacao-microciclo {
    display: grid;
    gap: 5px;
    overflow-x: auto;
}

body.page-programacao .programacao-micro-row {
    display: grid;
    grid-template-columns: 90px repeat(7, minmax(62px, 1fr));
    gap: 5px;
    min-width: 610px;
}

body.page-programacao .programacao-micro-row>strong {
    display: grid;
    min-height: 40px;
    padding: 7px;
    place-items: center;
    border-radius: 9px;
    background: #f1f1f3;
    font-size: 10px;
    text-align: center;
}

body.page-programacao .programacao-micro-row button {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 50px;
    padding: 4px;
    border: 1px solid #dfdfe3;
    border-radius: 9px;
    background: #fafafa;
    color: var(--metro-red);
    font-size: 20px;
    line-height: 1.2;
    text-align: center;
    overflow-wrap: break-word;
    cursor: pointer;
}

body.page-programacao .programacao-micro-row button.has-activity {
    font-size: 9px;
    font-weight: 700;
}

body.page-programacao .programacao-form {
    margin-top: 22px;
    padding: 18px;
    border: 1px solid #e1e1e4;
    border-radius: 20px;
    background: #fafafa;
}

body.page-programacao .programacao-selection {
    display: grid;
    gap: 4px;
    margin-bottom: 15px;
}

body.page-programacao .programacao-selection strong {
    font-size: 14px;
}

body.page-programacao .programacao-form-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    align-items: start;
    gap: 12px;
}

body.page-programacao .programacao-field-wide {
    grid-column: 1 / -1;
}

body.page-programacao .programacao-form-grid small {
    color: var(--metro-muted);
    font-size: 10px;
    line-height: 1.3;
}

body.page-programacao #programacaoNumeroSemana {
    color: #414146;
    font-weight: 700;
}

body.page-programacao .programacao-add,
body.page-programacao .programacao-save {
    display: block;
    min-height: 42px;
    margin: 16px auto 0;
    padding: 10px 22px;
    border: 0;
    border-radius: 999px;
    background: var(--metro-red);
    color: #fff;
    font: 700 12px/1 "Space Grotesk", sans-serif;
    cursor: pointer;
}

body.page-programacao .programacao-draft {
    margin-top: 22px;
    padding-top: 20px;
    border-top: 1px solid #ececef;
}

body.page-programacao .programacao-draft>header {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 15px;
    margin-bottom: 12px;
}

body.page-programacao .programacao-draft header span {
    color: var(--metro-red);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
}

body.page-programacao .programacao-draft h2 {
    margin: 4px 0 0;
    font-size: 18px;
}

body.page-programacao .programacao-draft>header>strong {
    color: #77777c;
    font-size: 12px;
}

body.page-programacao .programacao-draft-list {
    display: grid;
    gap: 8px;
}

body.page-programacao .programacao-empty {
    padding: 16px;
    border: 1px dashed #d5d5d9;
    border-radius: 14px;
    color: #85858a;
    font-size: 12px;
    text-align: center;
}

body.page-programacao .programacao-draft-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 12px 14px;
    border: 1px solid #e3e3e6;
    border-radius: 14px;
    background: #fff;
}

body.page-programacao .programacao-draft-item div {
    display: grid;
    gap: 3px;
    min-width: 0;
}

body.page-programacao .programacao-draft-item span {
    color: var(--metro-red);
    font-size: 9px;
    font-weight: 700;
    text-transform: uppercase;
}

body.page-programacao .programacao-draft-item strong {
    font-size: 13px;
}

body.page-programacao .programacao-draft-item p {
    margin: 0;
    color: #77777c;
    font-size: 11px;
}

body.page-programacao .programacao-draft-item button {
    border: 0;
    background: transparent;
    color: #88888d;
    font: 700 10px/1 "Space Grotesk", sans-serif;
    cursor: pointer;
    text-transform: uppercase;
}

body.page-programacao .programacao-item-actions {
    display: flex;
    flex: 0 0 auto;
    flex-direction: column;
    gap: 6px;
}

body.page-programacao button.programacao-editar-item,
body.page-programacao button.programacao-excluir-item {
    padding: 5px 12px;
    border: 1px solid #dedee2;
    border-radius: 999px;
    background: #fff;
    text-transform: uppercase;
}

body.page-programacao button.programacao-editar-item:hover {
    border-color: var(--metro-red);
    color: var(--metro-red);
}

body.page-programacao button.programacao-excluir-item {
    color: #b3413f;
}

body.page-programacao button.programacao-excluir-item:hover {
    border-color: #b3413f;
    background: #b3413f;
    color: #fff;
}

body.page-programacao .programacao-edit-modal {
    position: fixed;
    inset: 0;
    z-index: 1000;
    display: grid;
    place-items: center;
    padding: 20px;
    background: rgba(10, 10, 10, .48);
    backdrop-filter: blur(7px);
}

body.page-programacao .programacao-edit-modal[hidden] {
    display: none;
}

body.page-programacao .programacao-edit-panel {
    position: relative;
    width: min(100%, 560px);
    max-height: calc(100vh - 40px);
    overflow: auto;
    padding: 24px;
    border-radius: 26px;
    background: #fff;
    box-shadow: 0 30px 80px rgba(0, 0, 0, .24);
}

body.page-programacao .programacao-modal-close {
    position: absolute;
    top: 16px;
    right: 18px;
}

body.page-programacao .programacao-edit-eyebrow {
    margin-bottom: 5px;
    color: var(--metro-red);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
}

body.page-programacao .programacao-edit-panel h2 {
    margin: 0 44px 16px 0;
    font-size: 21px;
}

body.page-programacao .programacao-edit-form {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 14px;
}

body.page-programacao .programacao-edit-form label {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

body.page-programacao .programacao-edit-form label>span {
    color: #555;
    font-size: 11px;
    font-weight: 600;
}

body.page-programacao .programacao-edit-field-wide {
    grid-column: 1 / -1;
}

body.page-programacao .programacao-edit-form input,
body.page-programacao .programacao-edit-form select {
    width: 100%;
    min-height: 40px;
    padding: 9px 12px;
    border: 1px solid #d6d6d6;
    border-radius: 13px;
    background: #fff;
    font: 400 12px/1.3 "Space Grotesk", sans-serif;
}

body.page-programacao .programacao-edit-save {
    grid-column: 1 / -1;
    justify-self: center;
    min-height: 42px;
    margin-top: 6px;
    padding: 10px 28px;
    border: 0;
    border-radius: 999px;
    background: var(--metro-red);
    color: #fff;
    font: 700 12px/1 "Space Grotesk", sans-serif;
    text-transform: uppercase;
    letter-spacing: .04em;
    cursor: pointer;
}

body.page-programacao .programacao-edit-save:disabled {
    opacity: .6;
    cursor: default;
}

body.page-programacao .programacao-status {
    min-height: 18px;
    margin-top: 12px;
    color: #66666b;
    font-size: 12px;
    text-align: center;
}

body.page-programacao .programacao-status.success {
    color: #14702e;
}

body.page-programacao .programacao-status.error {
    color: #b30000;
}

body.programacao-modal-open {
    overflow: hidden;
}

body.page-programacao .programacao-modal-backdrop {
    position: fixed;
    inset: 0;
    z-index: 9999;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 20px;
    background: rgba(0, 0, 0, 0.4);
}

body.page-programacao .programacao-modal-backdrop.is-visible {
    display: flex;
}

body.page-programacao .programacao-message-modal {
    width: min(90vw, 420px);
    padding: 24px 28px;
    border: 1px solid #e3e3e3;
    border-radius: 24px;
    background: #fff;
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.16);
    text-align: center;
}

body.page-programacao .programacao-message-modal .ampulheta-processando {
    display: none;
}

body.page-programacao .programacao-modal-backdrop.is-processing .programacao-message-modal .ampulheta-processando {
    display: block;
}

body.page-programacao .programacao-message-modal .modal-title {
    margin-bottom: 8px;
    color: var(--metro-muted);
    font-size: 18px;
    font-weight: 700;
}

body.page-programacao .programacao-modal-backdrop.is-error .modal-title {
    color: var(--metro-red);
}

body.page-programacao .programacao-message-modal .modal-text {
    color: var(--metro-muted);
    font-size: 14px;
    line-height: 1.45;
    white-space: pre-line;
}

body.page-programacao .programacao-message-modal .btn-modal {
    margin-top: 16px;
    padding: 10px 26px;
    border: 0;
    border-radius: 999px;
    background: var(--metro-red);
    color: #fff;
    font: inherit;
    font-weight: 700;
    cursor: pointer;
}

body.page-programacao .programacao-save:disabled {
    cursor: not-allowed;
    opacity: 0.45;
}

/* Central de relatórios */
body.page-relatorios {
    --metro-red: #e02020;
    --metro-muted: #77777c;
    min-height: 100vh;
    padding: 32px 16px 24px;
    background: #fff;
    color: #17171a;
    font-family: "Space Grotesk", sans-serif;
}

/* Ouvidoria */
body.page-ouvidoria {
    --metro-red: #e02020;
    min-height: 100vh;
    padding: 32px 16px 24px;
    background: #fff;
    color: #17171a;
    font-family: "Space Grotesk", sans-serif;
}

body.page-ouvidoria * { box-sizing: border-box; }
body.page-ouvidoria .page { display: grid; grid-template-columns: 420px minmax(0, 1fr); align-items: start; gap: 40px; width: 100%; max-width: 1120px; margin: 0 auto; }
body.page-ouvidoria .ouvidoria-wrapper { min-width: 0; }
body.page-ouvidoria .ouvidoria-card { display: grid; gap: 22px; padding: 24px; border: 1px solid rgba(0,0,0,.08); border-radius: 28px; background: #fff; box-shadow: 0 14px 35px rgba(0,0,0,.06); }
body.page-ouvidoria .ouvidoria-heading { display: grid; gap: 0; }
body.page-ouvidoria .ouvidoria-eyebrow { color: var(--metro-red); font-size: 10px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
body.page-ouvidoria .ouvidoria-heading h1 { margin: 22px 0 6px; font-size: 22px; line-height: 1.2; }
body.page-ouvidoria .ouvidoria-heading p { margin: 0; color: #777; font-size: 13px; line-height: 1.5; }
body.page-ouvidoria .ouvidoria-intro { display: grid; gap: 4px; margin-bottom: 8px; }
body.page-ouvidoria .ouvidoria-security, body.page-ouvidoria .ouvidoria-section-title span { flex: 0 0 auto; padding: 7px 10px; border: 1px solid #f0c6c6; border-radius: 999px; background: #fff6f6; color: #a32626; font-size: 9px; font-weight: 700; text-transform: uppercase; }
body.page-ouvidoria .ouvidoria-alert { display: grid; gap: 6px; padding: 18px 20px; border: 1px solid rgba(224,32,32,.38); border-radius: 26px; background: #fffafa; color: #663232; font-size: 12px; line-height: 1.55; }
body.page-ouvidoria .ouvidoria-alert strong { font-size: 13px; }
body.page-ouvidoria .ouvidoria-section { display: grid; gap: 16px; padding-top: 18px; border-top: 1px solid #e7e7e9; }
body.page-ouvidoria .ouvidoria-section.is-restricted { padding: 20px; border: 1px solid rgba(224,32,32,.34); border-radius: 26px; background: #fffafa; }
body.page-ouvidoria .ouvidoria-section.is-internal { padding: 20px; border: 1px solid #d5d5d5; border-radius: 26px; background: #fff; }
body.page-ouvidoria .ouvidoria-section h2 { margin: 0; color: #777; font-size: 13px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
body.page-ouvidoria .ouvidoria-section-title { display: flex; align-items: center; justify-content: space-between; gap: 15px; }
body.page-ouvidoria .ouvidoria-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
body.page-ouvidoria .ouvidoria-grid>label, body.page-ouvidoria fieldset { display: grid; align-content: start; gap: 7px; margin: 0; }
body.page-ouvidoria .ouvidoria-grid>label.is-wide { grid-column: 1 / -1; }
body.page-ouvidoria label>span, body.page-ouvidoria legend { color: #111; font-size: 13px; font-weight: 500; text-transform: none; }
body.page-ouvidoria label b, body.page-ouvidoria legend b { color: var(--metro-red); }
body.page-ouvidoria input, body.page-ouvidoria select, body.page-ouvidoria textarea { width: 100%; min-height: 0; padding: 10px 14px; border: 1px solid #d5d5d5; border-radius: 999px; outline: none; background: #fff; color: #111; font: 400 14px/normal "Space Grotesk", sans-serif; transition: .15s border-color ease, .15s box-shadow ease, .15s background-color ease; }
body.page-ouvidoria textarea { min-height: 92px; border-radius: 18px; resize: vertical; }
body.page-ouvidoria input:focus, body.page-ouvidoria select:focus, body.page-ouvidoria textarea:focus { outline: none; border-color: var(--metro-red); box-shadow: 0 0 0 1px rgba(224,32,32,.08); }
body.page-ouvidoria input[readonly] { background: #f4f4f5; color: #68686d; }
body.page-ouvidoria fieldset { min-height: 0; padding: 10px 14px; border: 1px solid #d5d5d5; border-radius: 18px; }
body.page-ouvidoria .ouvidoria-radio { display: inline-flex; align-items: center; gap: 7px; font-size: 12px; }
body.page-ouvidoria .ouvidoria-radio input, body.page-ouvidoria .ouvidoria-consent input { width: 16px; min-height: 16px; margin: 0; }
body.page-ouvidoria small, body.page-ouvidoria output { color: #77777c; font-size: 10px; }
body.page-ouvidoria output.is-error { color: #b42318; }
body.page-ouvidoria .ouvidoria-consent { display: flex; align-items: flex-start; gap: 10px; padding: 14px; border-radius: 13px; background: #f7f7f8; }
body.page-ouvidoria .ouvidoria-consent span { font-weight: 500; line-height: 1.45; }
body.page-ouvidoria .ouvidoria-actions { display: flex; justify-content: flex-end; gap: 10px; }
body.page-ouvidoria .ouvidoria-actions button { min-height: 0; padding: 11px 26px; border: 0; border-radius: 999px; background: var(--metro-red); color: #fff; font: 600 13px/1 "Space Grotesk", sans-serif; cursor: pointer; transition: .15s; }
body.page-ouvidoria .ouvidoria-actions button:hover { transform: translateY(-1px); box-shadow: 0 10px 25px rgba(224,32,32,.25); }
body.page-ouvidoria .ouvidoria-actions button.secondary { border: 1px solid #d8d8dc; background: #fff; color: #55555a; }
body.page-ouvidoria .ouvidoria-actions button:disabled { cursor: wait; opacity: .6; }
body.page-ouvidoria .ouvidoria-status { min-height: 16px; margin: -6px 0; color: #6d6d72; font-size: 10px; text-align: center; }
body.page-ouvidoria .ouvidoria-status.is-error { color: #b42318; font-weight: 700; }
body.page-ouvidoria .ouvidoria-status.is-success { color: #237a3b; font-weight: 700; }
body.page-ouvidoria.ouvidoria-modal-open { overflow: hidden; }
body.page-ouvidoria .ouvidoria-modal-backdrop { position: fixed; z-index: 1500; inset: 0; display: none; align-items: center; justify-content: center; padding: 20px; background: rgba(0,0,0,.42); backdrop-filter: blur(4px); }
body.page-ouvidoria .ouvidoria-modal-backdrop.is-visible { display: flex; }
body.page-ouvidoria .ouvidoria-modal { width: min(520px, 100%); padding: 28px; border: 1px solid rgba(224,32,32,.32); border-radius: 28px; background: #fff; box-shadow: 0 20px 55px rgba(0,0,0,.2); text-align: center; }
body.page-ouvidoria .ouvidoria-modal h2 { margin: 12px 0 8px; font-size: 21px; }
body.page-ouvidoria .ouvidoria-modal p { margin: 0; color: #77777c; font-size: 13px; line-height: 1.55; }
body.page-ouvidoria .ouvidoria-spinner { width: 42px; height: 42px; margin: 0 auto; border: 4px solid #f3d4d4; border-top-color: var(--metro-red); border-radius: 50%; animation: ouvidoria-spin .8s linear infinite; }
body.page-ouvidoria .ouvidoria-success-icon { display: grid; width: 48px; height: 48px; margin: 0 auto; place-items: center; border-radius: 50%; background: #e8f5ec; color: #237a3b; font-size: 25px; font-weight: 700; }
body.page-ouvidoria .ouvidoria-protocol-card { display: grid; gap: 7px; margin: 20px 0; padding: 16px; border: 1px solid rgba(224,32,32,.38); border-radius: 22px; background: #fffafa; }
body.page-ouvidoria .ouvidoria-protocol-card span { color: #777; font-size: 10px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
body.page-ouvidoria .ouvidoria-protocol-card strong { color: var(--metro-red); font-size: 24px; letter-spacing: .04em; }
body.page-ouvidoria .ouvidoria-modal-actions { display: flex; justify-content: center; gap: 10px; }
body.page-ouvidoria .ouvidoria-modal-actions button { min-height: 42px; padding: 11px 20px; border: 0; border-radius: 999px; background: var(--metro-red); color: #fff; font: 700 11px/1 "Space Grotesk", sans-serif; cursor: pointer; }
body.page-ouvidoria .ouvidoria-modal-actions button.secondary { border: 1px solid #d5d5d5; background: #fff; color: #55555a; }
@keyframes ouvidoria-spin { to { transform: rotate(360deg); } }

@media print {
    body.page-ouvidoria>*:not(#ouvidoriaSuccessModal) { display: none !important; }
    body.page-ouvidoria #ouvidoriaSuccessModal { position: static; display: flex !important; padding: 0; background: #fff; }
    body.page-ouvidoria .ouvidoria-success-modal { box-shadow: none; }
    body.page-ouvidoria .ouvidoria-modal-actions { display: none; }
}

@media (max-width: 900px) {
    body.page-ouvidoria .page { grid-template-columns: 1fr; gap: 24px; }
    body.page-ouvidoria #profile-card-container { width: min(420px, 100%); margin: 0 auto; }
}
@media (max-width: 620px) {
    body.page-ouvidoria { padding: 16px 10px; }
    body.page-ouvidoria .ouvidoria-card { padding: 18px; border-radius: 20px; }
    body.page-ouvidoria .ouvidoria-heading { display: grid; }
    body.page-ouvidoria .ouvidoria-security { justify-self: start; }
    body.page-ouvidoria .ouvidoria-grid { grid-template-columns: 1fr; }
    body.page-ouvidoria .ouvidoria-grid>label.is-wide { grid-column: auto; }
}

body.page-relatorios * {
    box-sizing: border-box;
}

body.page-relatorios .page {
    display: grid;
    grid-template-columns: 420px minmax(0, 1fr);
    align-items: start;
    gap: 40px;
    width: 100%;
    max-width: 1120px;
    margin: 0 auto;
}

body.page-relatorios .reports-card {
    min-width: 0;
    padding: 24px;
    border: 1px solid rgba(0, 0, 0, 0.08);
    border-radius: 28px;
    background: #fff;
    box-shadow: 0 14px 35px rgba(0, 0, 0, 0.06);
}

body.page-relatorios .reports-heading {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin: 22px 0;
}

body.page-relatorios .reports-heading h1 {
    margin: 0 0 6px;
    font-size: 26px;
    line-height: 1.15;
}

body.page-relatorios .reports-heading p,
body.page-relatorios .report-workspace-header p {
    margin: 0;
    color: var(--metro-muted);
    font-size: 13px;
    line-height: 1.45;
}

body.page-relatorios .reports-count,
body.page-relatorios .report-source {
    flex: 0 0 auto;
    padding: 7px 11px;
    border: 1px solid #dedee2;
    border-radius: 999px;
    color: #66666b;
    font-size: 10px;
    font-weight: 700;
}

body.page-relatorios .reports-menu {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
}

body.page-relatorios .reports-menu button {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr);
    align-items: center;
    gap: 12px;
    min-height: 78px;
    padding: 14px;
    border: 1px solid #dedee2;
    border-radius: 18px;
    background: #fff;
    color: #222226;
    font: inherit;
    text-align: left;
    cursor: pointer;
    transition: 0.18s ease;
}

body.page-relatorios .reports-menu button:hover,
body.page-relatorios .reports-menu button:focus-visible {
    outline: 0;
    transform: translateY(-2px);
    border-color: rgba(224, 32, 32, 0.65);
    box-shadow: 0 10px 24px rgba(0, 0, 0, 0.08);
}

body.page-relatorios .reports-menu button>span {
    display: grid;
    width: 42px;
    height: 42px;
    place-items: center;
    border-radius: 13px;
    background: transparent;
    color: var(--metro-red);
    font-size: 11px;
    font-weight: 700;
}

body.page-relatorios .reports-menu button>span svg {
    width: 38px;
    height: 38px;
    fill: none;
    stroke: #e52025;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

body.page-relatorios .reports-menu button strong {
    font-size: 14px;
    line-height: 1.25;
}

body.page-relatorios .report-workspace[hidden],
body.page-relatorios .reports-menu[hidden] {
    display: none;
}

body.page-relatorios .report-workspace-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 18px;
    padding-bottom: 16px;
    border-bottom: 1px solid #e5e5e7;
}

body.page-relatorios .report-eyebrow,
body.page-relatorios .report-filters label>span {
    color: var(--metro-red);
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

body.page-relatorios .report-workspace-header h2 {
    margin: 5px 0;
    font-size: 22px;
}

body.page-relatorios .report-filters {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    padding: 14px;
    border: 1px solid #e1e1e4;
    border-radius: 18px;
    background: #fafafa;
}

body.page-relatorios .report-workspace.is-evaluation .report-workspace-header {
    display: none;
}

body.page-relatorios .report-workspace.is-evaluation .report-filters {
    grid-template-columns: 1fr;
    margin: 16px 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
}

body.page-relatorios .report-workspace.is-evaluation .evaluation-filters,
body.page-relatorios .report-workspace.is-evaluation .athlete-filters {
    grid-template-columns: 1fr;
}

body.page-relatorios .report-workspace.is-evaluation .report-multi-field,
body.page-relatorios .report-workspace.is-evaluation .report-filters>label {
    width: 100%;
}

body.page-relatorios .report-period-fields {
    display: grid;
    grid-column: 1 / -1;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

body.page-relatorios .report-filters label {
    display: grid;
    gap: 6px;
}

body.page-relatorios .evaluation-filters,
body.page-relatorios .athlete-filters {
    display: grid;
    grid-column: 1 / -1;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

body.page-relatorios .evaluation-filters[hidden],
body.page-relatorios .athlete-filters[hidden],
body.page-relatorios .report-period-fields[hidden] {
    display: none;
}

body.page-relatorios .report-multi-field {
    display: grid;
    align-content: start;
    gap: 6px;
}

body.page-relatorios .report-multi-field>label {
    color: var(--metro-red);
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

body.page-relatorios .report-multi-list {
    display: grid;
    gap: 8px;
}

body.page-relatorios .report-multi-list:empty {
    display: none;
}

body.page-relatorios .report-multi-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    min-height: 38px;
    padding: 8px 10px 8px 12px;
    border: 1px solid #e2e2e5;
    border-radius: 11px;
    background: #f1f1f3;
    color: #303035;
    font-size: 11px;
    font-weight: 700;
}

body.page-relatorios .report-filters .report-multi-item button {
    width: auto;
    min-height: 0;
    padding: 6px 10px;
    border: 0;
    border-radius: 8px;
    background: var(--metro-red);
    color: #fff;
    font-size: 10px;
    font-weight: 700;
    cursor: pointer;
}

body.page-relatorios .report-filters input,
body.page-relatorios .report-filters select {
    width: 100%;
    min-height: 40px;
    padding: 8px 10px;
    border: 1px solid #d8d8dc;
    border-radius: 11px;
    background: #fff;
    color: #222226;
    font: 500 12px/1.3 "Space Grotesk", sans-serif;
}

body.page-relatorios .report-filters button,
body.page-relatorios .report-actions button {
    min-height: 40px;
    padding: 10px 18px;
    border: 0;
    border-radius: 999px;
    background: var(--metro-red);
    color: #fff;
    font: 700 11px/1 "Space Grotesk", sans-serif;
    cursor: pointer;
}

body.page-relatorios .report-filter-actions {
    grid-column: 1 / -1;
    display: flex;
    justify-content: center;
    gap: 10px;
}

body.page-relatorios .report-data-status {
    grid-column: 1 / -1;
    min-height: 16px;
    margin: 0;
    color: var(--metro-muted);
    font-size: 10px;
    text-align: center;
}

body.page-relatorios .report-data-status:empty {
    display: none;
}

body.page-relatorios .report-data-status.is-loading {
    color: #55555a;
}

body.page-relatorios .report-data-status.is-error {
    color: var(--metro-red);
    font-weight: 700;
}

body.page-relatorios .report-filter-actions .secondary {
    border: 1px solid #d8d8dc;
    background: #fff;
    color: #55555a;
}

body.page-relatorios .report-preview {
    margin-top: 0;
    padding: 22px;
    border: 1px solid #dedee2;
    border-radius: 20px;
    background: #fff;
}

body.page-relatorios .report-preview-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 20px;
    padding-bottom: 0;
}

body.page-relatorios .report-placeholder strong {
    color: var(--metro-red);
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

body.page-relatorios .report-preview-header h2 {
    margin: 5px 0;
    font-size: 20px;
}

body.page-relatorios .report-preview-header p,
body.page-relatorios .report-placeholder p {
    margin: 0;
    color: var(--metro-muted);
    font-size: 11px;
    line-height: 1.45;
}

body.page-relatorios .report-summary-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 9px;
    margin: 16px 0;
}

body.page-relatorios .report-summary-grid article {
    display: grid;
    gap: 5px;
    padding: 12px;
    border-radius: 13px;
    background: #fafafa;
}

body.page-relatorios .report-summary-grid span,
body.page-relatorios .report-preview footer span {
    color: var(--metro-muted);
    font-size: 9px;
    text-transform: uppercase;
}

body.page-relatorios .report-summary-grid strong {
    font-size: 11px;
    line-height: 1.3;
}

body.page-relatorios .report-placeholder {
    min-height: 140px;
    padding: 18px;
    border: 1px dashed #d5d5d9;
    border-radius: 15px;
    background: #fcfcfc;
}

body.page-relatorios .report-placeholder p {
    margin-top: 8px;
}

body.page-relatorios .report-preview footer {
    display: flex;
    justify-content: space-between;
    gap: 15px;
    margin-top: 16px;
    padding-top: 12px;
    border-top: 1px solid #e5e5e7;
    font-size: 10px;
}

body.page-relatorios .report-actions {
    display: flex;
    justify-content: center;
    gap: 10px;
    margin-top: 16px;
}

body.page-relatorios .report-actions .secondary {
    border: 1px solid #d8d8dc;
    background: #fff;
    color: #55555a;
}

body.page-relatorios.report-modal-open {
    overflow: hidden;
}

body.page-relatorios .report-modal {
    position: fixed;
    z-index: 1200;
    inset: 0;
    display: none;
    place-items: center;
    padding: 24px;
    background: rgba(18, 18, 20, 0.62);
    backdrop-filter: blur(4px);
}

body.page-relatorios .report-modal.is-open {
    display: grid;
}

body.page-relatorios .report-modal-dialog {
    width: min(1180px, 100%);
    max-height: calc(100vh - 48px);
    overflow: auto;
    padding: 24px;
    border: 1px solid #dedee2;
    border-radius: 22px;
    background: #fff;
    box-shadow: 0 24px 70px rgba(0, 0, 0, 0.24);
}

body.page-relatorios .report-modal-header {
    display: grid;
    grid-template-columns: minmax(250px, .8fr) minmax(340px, 1.2fr) auto;
    align-items: flex-start;
    gap: 20px;
    padding-bottom: 16px;
    border-bottom: 1px solid #e5e5e7;
}

body.page-relatorios .report-document-meta {
    display: grid;
    gap: 4px;
    margin: 12px 0 0;
}

body.page-relatorios .report-document-meta>div {
    display: flex;
    gap: 6px;
    font-size: 9px;
}

body.page-relatorios .report-document-meta dt {
    color: var(--metro-muted);
}

body.page-relatorios .report-document-meta dt::after {
    content: ":";
}

body.page-relatorios .report-document-meta dd {
    margin: 0;
    color: #303035;
    font-weight: 700;
}

body.page-relatorios .report-executive-summary {
    padding: 14px;
    border-left: 4px solid var(--metro-red);
    border-radius: 0 12px 12px 0;
    background: #f7f7f8;
}

body.page-relatorios .report-executive-summary>span {
    color: var(--metro-red);
    font-size: 8px;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
}

body.page-relatorios .report-executive-summary h3 {
    margin: 4px 0 6px;
    font-size: 13px;
}

body.page-relatorios .report-executive-summary p {
    color: #55555a;
    font-size: 9px;
    line-height: 1.5;
}

body.page-relatorios .report-modal-header>div>span {
    color: var(--metro-red);
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

body.page-relatorios .report-modal-header h2 {
    margin: 5px 0;
    font-size: 24px;
}

body.page-relatorios .report-modal-header p {
    margin: 0;
    color: var(--metro-muted);
    font-size: 11px;
}

body.page-relatorios .report-modal-header>button {
    display: grid;
    width: 34px;
    height: 34px;
    min-height: 0;
    place-items: center;
    padding: 0;
    border: 1px solid #dedee2;
    border-radius: 50%;
    background: #fff;
    color: #444449;
    font-size: 22px;
    cursor: pointer;
}

body.page-relatorios .report-modal-filter-summary {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 6px;
    margin: 14px 0;
}

body.page-relatorios .report-modal-filter-summary span {
    padding: 6px 9px;
    border-radius: 999px;
    background: #f3f3f5;
    color: #55555a;
    font-size: 9px;
    font-weight: 700;
}

body.page-relatorios .report-modal-metrics {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 9px;
    margin-bottom: 16px;
}

body.page-relatorios .report-loading-modal {
    position: fixed;
    inset: 0;
    z-index: 1300;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 20px;
    background: rgba(0, 0, 0, 0.35);
}

body.page-relatorios .report-loading-modal.is-visible {
    display: flex;
}

body.page-relatorios .report-loading-dialog {
    width: min(550px, 90vw);
    padding: 28px;
    border-radius: 24px;
    background: #fff;
    box-shadow: 0 18px 45px rgba(0, 0, 0, 0.18);
    text-align: center;
}

body.page-relatorios .report-loading-dialog h2 {
    margin: 14px 0 10px;
    font-size: 20px;
}

body.page-relatorios .report-loading-dialog p {
    margin: 0;
    color: var(--metro-muted);
    font-size: 14px;
    line-height: 1.6;
}

body.page-relatorios .report-loading-spinner {
    width: 42px;
    height: 42px;
    margin: 0 auto;
    border: 4px solid #f0d5d5;
    border-top-color: var(--metro-red);
    border-radius: 50%;
    animation: report-loading-spin 0.8s linear infinite;
}

body.page-relatorios .report-category-heatmap-card {
    margin-bottom: 16px;
    padding: 16px;
    border: 1px solid #dedee2;
    border-radius: 16px;
    background: #fff;
}

body.page-relatorios .report-category-heatmap-card>header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    margin-bottom: 14px;
}

body.page-relatorios .report-category-heatmap-card>header>div {
    display: flex;
    align-items: center;
    gap: 9px;
}

body.page-relatorios .report-category-heatmap-card h3 {
    margin: 0;
    font-size: 14px;
    text-transform: uppercase;
}

body.page-relatorios .report-category-heatmap-icon {
    display: grid;
    width: 26px;
    height: 26px;
    place-items: center;
    border: 1px solid var(--metro-red);
    border-radius: 7px;
    color: var(--metro-red);
    font-weight: 700;
}

body.page-relatorios .report-category-heatmap-card>header p {
    margin: 0;
    padding: 7px 10px;
    border: 1px solid #e0e0e3;
    border-radius: 10px;
    background: #fafafa;
    color: #55555a;
    font-size: 10px;
    font-weight: 600;
}

body.page-relatorios .report-category-heatmap-scroll {
    overflow-x: auto;
}

body.page-relatorios .report-category-heatmap {
    display: grid;
    gap: 4px;
    min-width: max-content;
}

body.page-relatorios .report-category-heatmap.is-empty {
    display: block;
    min-width: 0;
    padding: 24px;
    border: 1px dashed #d8d8dc;
    border-radius: 12px;
    color: var(--metro-muted);
    text-align: center;
}

body.page-relatorios .report-category-heatmap-heading,
body.page-relatorios .report-category-heatmap-category,
body.page-relatorios .report-category-heatmap-cell {
    display: grid;
    min-height: 38px;
    place-items: center;
    padding: 7px;
    border-radius: 8px;
    font-size: 10px;
}

body.page-relatorios .report-category-heatmap-heading {
    color: #55555a;
    background: #f5f5f6;
    text-transform: uppercase;
}

body.page-relatorios .report-category-heatmap-category {
    justify-content: start;
    color: var(--metro-red);
    background: #fafafa;
}

body.page-relatorios .report-category-heatmap-cell {
    font-weight: 700;
}

body.page-relatorios .report-category-heatmap-card>footer {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin-top: 12px;
    color: var(--metro-muted);
    font-size: 9px;
    font-weight: 700;
    text-transform: uppercase;
}

body.page-relatorios .report-category-heatmap-card>footer>div {
    display: flex;
    gap: 3px;
}

body.page-relatorios .report-category-heatmap-card>footer i {
    width: 25px;
    height: 8px;
    border-radius: 3px;
    background: rgba(229, 31, 38, 0.1);
}

body.page-relatorios .report-category-heatmap-card>footer i:nth-child(2) {
    background: rgba(229, 31, 38, 0.25);
}

body.page-relatorios .report-category-heatmap-card>footer i:nth-child(3) {
    background: rgba(229, 31, 38, 0.4);
}

body.page-relatorios .report-category-heatmap-card>footer i:nth-child(4) {
    background: rgba(229, 31, 38, 0.58);
}

body.page-relatorios .report-category-heatmap-card>footer i:nth-child(5) {
    background: rgba(229, 31, 38, 0.76);
}

body.page-relatorios .report-category-heatmap-card>footer i:nth-child(6) {
    background: rgba(229, 31, 38, 1);
}

@keyframes report-loading-spin {
    to {
        transform: rotate(360deg);
    }
}

body.page-relatorios .report-modal-metrics article {
    display: grid;
    gap: 5px;
    padding: 13px;
    border-radius: 13px;
    background: #fafafa;
    text-align: center;
}

body.page-relatorios .report-modal-metrics span {
    color: var(--metro-muted);
    font-size: 9px;
    text-transform: uppercase;
}

body.page-relatorios .report-modal-metrics strong {
    color: var(--metro-red);
    font-size: 22px;
}

body.page-relatorios .report-modal-metrics small {
    color: #18864b;
    font-size: 9px;
    font-weight: 700;
}

body.page-relatorios .athlete-report-metrics {
    grid-template-columns: repeat(6, minmax(0, 1fr));
}

body.page-relatorios .ombudsman-report-metrics {
    grid-template-columns: repeat(4, minmax(160px, 220px));
    justify-content: center;
}

body.page-relatorios .athlete-report-distributions {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

body.page-relatorios .athlete-report-distributions .report-distribution-card {
    grid-column: auto;
}

body.page-relatorios .athlete-report-photo {
    display: grid;
    width: 61px;
    height: 81px;
    overflow: hidden;
    place-items: center;
    border: 1px solid #d2d2d6;
    border-radius: 6px;
    background: #f1f1f3;
    color: #77777c;
    font-size: 10px;
    font-weight: 700;
}

body.page-relatorios .athlete-report-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

body.page-relatorios #athleteReportRows td:nth-child(2) {
    white-space: nowrap;
}

body.page-relatorios .report-distributions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin-bottom: 16px;
}

body.page-relatorios .report-distribution-card {
    min-width: 0;
    padding: 14px;
    border: 1px solid #e2e2e5;
    border-radius: 14px;
    background: #fff;
}

body.page-relatorios .report-distribution-category {
    grid-column: auto;
}

body.page-relatorios .report-distribution-dates {
    grid-column: auto;
}

body.page-relatorios .report-city-map-card {
    grid-column: 1 / -1;
}

body.page-relatorios .report-distribution-card>header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

body.page-relatorios .report-distribution-card h3 {
    margin: 0 0 12px;
    font-size: 12px;
}

body.page-relatorios .report-distribution-card>header h3 {
    margin-bottom: 0;
}

body.page-relatorios .report-chart-legend {
    display: flex;
    gap: 12px;
    color: var(--metro-muted);
    font-size: 9px;
}

body.page-relatorios .report-chart-legend span {
    display: inline-flex;
    align-items: center;
    gap: 5px;
}

body.page-relatorios .report-chart-legend i {
    width: 9px;
    height: 9px;
    border-radius: 2px;
}

body.page-relatorios .report-chart-legend .male,
body.page-relatorios .report-category-track .male {
    background: var(--metro-red);
}

body.page-relatorios .report-chart-legend .female,
body.page-relatorios .report-category-track .female {
    background: #4c4c52;
}

body.page-relatorios .report-category-chart {
    display: grid;
    gap: 8px;
    margin-top: 14px;
}

body.page-relatorios .report-category-row {
    display: grid;
    grid-template-columns: 52px minmax(0, 1fr) 28px;
    align-items: center;
    gap: 10px;
    font-size: 10px;
}

body.page-relatorios .report-date-chart {
    display: flex;
    align-items: flex-end;
    gap: 10px;
    min-height: 150px;
    padding-top: 8px;
}

body.page-relatorios .report-date-chart>div {
    display: grid;
    flex: 1;
    grid-template-rows: 18px 100px 18px;
    justify-items: center;
    min-width: 34px;
    color: #66666b;
    font-size: 8px;
}

body.page-relatorios .report-date-chart strong {
    color: var(--metro-red);
    font-size: 10px;
}

body.page-relatorios .report-date-chart>div>div {
    position: relative;
    width: 22px;
    height: 100%;
    overflow: hidden;
    border-radius: 7px 7px 3px 3px;
    background: #ededf0;
}

body.page-relatorios .report-date-chart i {
    position: absolute;
    inset: auto 0 0;
    border-radius: inherit;
    background: linear-gradient(180deg, #f05b5f, var(--metro-red));
}

body.page-relatorios .report-category-row>span {
    font-weight: 700;
}

body.page-relatorios .report-category-row>strong {
    color: var(--metro-red);
    text-align: right;
}

body.page-relatorios .report-category-track {
    display: flex;
    min-width: 2px;
    height: 12px;
    overflow: hidden;
    border-radius: 999px;
    background: #ededf0;
}

body.page-relatorios .report-category-track i {
    display: block;
    height: 100%;
}

body.page-relatorios .report-count-list {
    display: grid;
    gap: 8px;
}

body.page-relatorios .report-count-list>div {
    display: flex;
    align-items: baseline;
    gap: 8px;
    color: #55555a;
    font-size: 10px;
}

body.page-relatorios .report-count-list>div::after {
    order: 2;
    flex: 1;
    border-bottom: 1px dotted #bdbdc2;
    content: "";
}

body.page-relatorios .report-count-list strong {
    order: 3;
    color: #222226;
}

body.page-relatorios .report-horizontal-chart {
    display: grid;
    gap: 8px;
}

body.page-relatorios .report-horizontal-chart>div {
    display: grid;
    grid-template-columns: 80px minmax(0, 1fr) 24px;
    align-items: center;
    gap: 8px;
    color: #55555a;
    font-size: 9px;
}

body.page-relatorios .report-horizontal-chart>div>span {
    font-weight: 700;
}

body.page-relatorios #gameCompetitionDistribution>div {
    grid-template-columns: 150px minmax(0, 1fr) 24px;
}

body.page-relatorios #gameCompetitionDistribution>div>span {
    white-space: nowrap;
}

body.page-relatorios #scoutAthleteDistribution>div {
    grid-template-columns: minmax(150px, 1fr) minmax(0, 385px) 58px;
}

body.page-relatorios #scoutAthleteDistribution>div>span {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

body.page-relatorios #scoutAthleteDistribution>div>strong::after {
    content: " min";
    font-size: 8px;
}

body.page-relatorios #scoutAthleteDistribution>div>strong {
    white-space: nowrap;
}

body.page-relatorios #medicalRecordTypeDistribution>div {
    grid-template-columns: 150px minmax(0, 1fr) 32px;
}

body.page-relatorios #medicalRecordTypeDistribution>div>span {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

body.page-relatorios .report-horizontal-chart>div>strong {
    color: var(--metro-red);
    text-align: right;
}

body.page-relatorios .report-horizontal-track {
    height: 10px;
    overflow: hidden;
    border-radius: 999px;
    background: #ededf0;
}

body.page-relatorios .report-horizontal-track i {
    display: block;
    height: 100%;
    min-width: 2px;
    border-radius: inherit;
    background: linear-gradient(90deg, var(--metro-red), #f05b5f);
}

body.page-relatorios .report-city-map-card>header>span {
    color: var(--metro-muted);
    font-size: 8px;
    text-transform: uppercase;
}

body.page-relatorios .report-city-heatmap {
    position: relative;
    height: 330px;
    overflow: hidden;
    border-radius: 12px;
    background: #eef0f2;
}

body.page-relatorios .report-city-heatmap .leaflet-control-attribution {
    font-size: 7px;
}

body.page-relatorios .report-city-heatmap .leaflet-tooltip {
    border: 0;
    border-radius: 8px;
    font: 9px/1.35 "Space Grotesk", sans-serif;
    box-shadow: 0 6px 18px rgba(0, 0, 0, .16);
}

body.page-relatorios .report-map-marker {
    display: grid;
    place-items: center;
    border: 2px solid #fff;
    border-radius: 50%;
    background: rgba(229, 32, 37, .82);
    color: #fff;
    font: 700 10px/1 "Space Grotesk", sans-serif;
    box-shadow: 0 5px 14px rgba(229, 32, 37, .3);
}

body.page-relatorios .report-map-marker span {
    pointer-events: none;
}

body.page-relatorios .report-modal-table-wrap {
    overflow-x: auto;
    border: 1px solid #e2e2e5;
    border-radius: 14px;
}

body.page-relatorios .scout-table-title {
    margin: 0;
    padding: 14px 18px 12px;
    color: #202024;
    font-size: 14px;
    font-weight: 700;
}

body.page-relatorios .scout-game-details {
    margin-top: 18px;
}

body.page-relatorios .game-report-calendars {
    display: grid;
    gap: 24px;
}

body.page-relatorios .game-report-calendars[hidden] {
    display: none;
}

body.page-relatorios .game-report-calendar {
    min-width: 760px;
    padding: 18px;
    overflow: hidden;
    border: 1px solid #e2e2e5;
    border-radius: 18px;
    background: #fff;
}

body.page-relatorios .game-report-calendar-heading {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 18px;
}

body.page-relatorios .game-report-calendar-heading h3 {
    color: #202024;
    font-size: 18px;
    text-transform: capitalize;
}

body.page-relatorios .game-report-calendar-heading span {
    color: var(--metro-muted);
    font-size: 11px;
}

body.page-relatorios .game-report-calendar-page {
    display: contents;
}

body.page-relatorios .game-report-calendar-page[hidden] {
    display: none !important;
}

body.page-relatorios .game-report-calendar-page.is-continuation>.game-report-calendar-heading,
body.page-relatorios .game-report-calendar-page.is-continuation>.game-report-calendar-weekdays {
    display: none;
}

body.page-relatorios .game-report-calendar-page.is-continuation>.game-report-calendar-grid {
    margin-top: 8px;
}

body.page-relatorios .game-report-calendar-page.is-pdf-capture {
    display: block;
    width: 100%;
    padding: 18px;
    border: 1px solid #e2e2e5;
    border-radius: 18px;
    background: #fff;
}

body.page-relatorios .game-report-calendar-page.is-pdf-capture>.game-report-calendar-heading {
    display: flex;
}

body.page-relatorios .game-report-calendar-page.is-pdf-capture>.game-report-calendar-weekdays {
    display: grid;
}

body.page-relatorios .game-report-calendar-page.is-pdf-capture>.game-report-calendar-grid {
    margin-top: 0;
}

body.page-relatorios .report-modal-dialog.is-pdf-capture {
    max-height: none;
    overflow: visible;
    border-color: transparent;
    box-shadow: none;
}

body.page-relatorios .report-modal-dialog.is-pdf-capture .report-modal-actions,
body.page-relatorios .report-modal-dialog.is-pdf-capture #gameModalCloseIcon,
body.page-relatorios .report-modal-dialog.is-pdf-capture #athleteModalCloseIcon,
body.page-relatorios .report-modal-dialog.is-pdf-capture #programModalCloseIcon,
body.page-relatorios .report-modal-dialog.is-pdf-capture #scoutModalCloseIcon {
    display: none !important;
}

body.page-relatorios .game-report-calendar-weekdays,
body.page-relatorios .game-report-calendar-grid {
    display: grid;
    grid-template-columns: repeat(7, minmax(0, 1fr));
    gap: 8px;
}

body.page-relatorios .game-report-calendar-weekdays {
    margin-bottom: 8px;
}

body.page-relatorios .game-report-calendar-weekdays span {
    color: #77777c;
    font-size: 9px;
    font-weight: 700;
    text-align: center;
    text-transform: uppercase;
}

body.page-relatorios .game-report-calendar-spacer {
    min-width: 0;
}

body.page-relatorios .game-report-calendar-day {
    position: relative;
    display: flex;
    min-width: 0;
    height: 213px;
    flex-direction: column;
    gap: 9px;
    padding: 10px;
    overflow: hidden;
    border: 1px solid #e1e1e4;
    border-radius: 15px;
    background: #fafafa;
}

body.page-relatorios .game-report-calendar-day.has-games {
    border-color: rgba(224, 32, 32, .28);
    background: #fff;
}

body.page-relatorios .game-report-calendar-number {
    color: var(--metro-red);
    font-size: 15px;
}

body.page-relatorios .game-report-calendar-events {
    display: grid;
    gap: 6px;
}

body.page-relatorios .game-report-calendar-event {
    position: relative;
    display: grid;
    min-width: 0;
    gap: 3px;
    padding: 7px 6px 7px 10px;
    border: 1px solid #e7e7e9;
    border-radius: 9px;
    background: #fff;
}

body.page-relatorios .game-report-calendar-event::before {
    content: "";
    position: absolute;
    top: 6px;
    bottom: 6px;
    left: 4px;
    width: 3px;
    border-radius: 999px;
    background: var(--metro-red);
}

body.page-relatorios .game-report-calendar-event b {
    color: var(--metro-red);
    font-size: 8px;
}

body.page-relatorios .game-report-calendar-event span {
    overflow: hidden;
    color: #29292d;
    font-size: 8px;
    font-weight: 700;
    line-height: 1.25;
    text-overflow: ellipsis;
}

body.page-relatorios .game-report-calendar-event em {
    overflow: hidden;
    color: #4f4f55;
    font-size: 7px;
    font-style: normal;
    font-weight: 700;
    line-height: 1.2;
    text-overflow: ellipsis;
    text-transform: uppercase;
}

body.page-relatorios .game-report-calendar-event small {
    overflow: hidden;
    color: var(--metro-muted);
    font-size: 7px;
    line-height: 1.2;
    text-overflow: ellipsis;
}

body.page-relatorios .game-report-calendar-empty {
    margin: auto 0;
    color: #aaa;
    font-size: 9px;
}

body.page-relatorios .game-report-calendar-more {
    color: var(--metro-red);
    font-size: 8px;
    font-weight: 700;
    text-align: center;
}

body.page-relatorios .game-report-calendar-day.today {
    border: 2px solid #f2c94c;
    background: #fff9e6;
    box-shadow: 0 8px 22px rgba(242, 201, 76, .25);
}

body.page-relatorios .game-report-calendar-day.today::after {
    content: "HOJE";
    position: absolute;
    top: 9px;
    right: 8px;
    padding: 3px 5px;
    border-radius: 999px;
    background: #f2c94c;
    color: #fff;
    font-size: 7px;
    font-weight: 700;
}

@media (max-width: 900px) {
    body.page-relatorios .game-report-calendars {
        overflow-x: auto;
    }
}

body.page-relatorios .report-modal-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 10px;
}

body.page-relatorios .report-modal-table th,
body.page-relatorios .report-modal-table td {
    padding: 10px;
    border-bottom: 1px solid #ececef;
    text-align: left;
    white-space: nowrap;
}

body.page-relatorios .report-modal-table th {
    background: #f7f7f8;
    color: #66666b;
    font-size: 8px;
    letter-spacing: 0.06em;
    text-transform: uppercase;
}

body.page-relatorios .report-modal-table tr:last-child td {
    border-bottom: 0;
}

body.page-relatorios .prescription-print-button {
    padding: 7px 12px;
    border: 0;
    border-radius: 999px;
    background: var(--metro-red);
    color: #fff;
    font: 700 10px/1 "Space Grotesk", sans-serif;
    cursor: pointer;
}

body.page-relatorios #prescriptionReportModal .report-modal-table {
    table-layout: fixed;
    font-size: 10px;
}

body.page-relatorios #prescriptionReportModal .report-modal-table th,
body.page-relatorios #prescriptionReportModal .report-modal-table td {
    white-space: nowrap;
    font-size: 10px;
    line-height: 1.35;
}

body.page-relatorios #prescriptionReportModal .report-modal-table th:nth-child(1) { width: 10%; }
body.page-relatorios #prescriptionReportModal .report-modal-table th:nth-child(2) { width: 14%; }
body.page-relatorios #prescriptionReportModal .report-modal-table th:nth-child(3) { width: 14%; }
body.page-relatorios #prescriptionReportModal .report-modal-table th:nth-child(4) { width: 38%; }
body.page-relatorios #prescriptionReportModal .report-modal-table th:nth-child(5) { width: 24%; }

body.page-relatorios #prescriptionReportModal .prescription-action-row td {
    padding: 9px 10px 12px;
    border-bottom: 1px solid #dcdce0;
    text-align: right;
}

body.page-relatorios #prescriptionReportModal .prescription-print-button {
    white-space: nowrap;
    font-size: 9px;
}

body.page-relatorios .report-result {
    color: #55555a;
    font-weight: 700;
}

body.page-relatorios .report-result-agendado {
    color: #2767b2;
}

body.page-relatorios .report-result-aprovado {
    color: #18864b;
}

body.page-relatorios .report-result-reprovado {
    color: var(--metro-red);
}

body.page-relatorios .report-result-nao-compareceu {
    color: #8a6a18;
}

body.page-relatorios .report-modal-empty {
    margin: 0;
    padding: 28px;
    color: var(--metro-muted);
    text-align: center;
}

body.page-relatorios .report-document-footer {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 20px;
    margin-top: 16px;
    padding-top: 12px;
    border-top: 1px solid #e5e5e7;
    color: var(--metro-muted);
    font-size: 8px;
}

body.page-relatorios .report-document-footer>div {
    display: grid;
    gap: 2px;
}

body.page-relatorios .report-document-footer strong {
    color: #303035;
}

body.page-relatorios .report-modal-actions {
    display: flex;
    justify-content: center;
    gap: 10px;
    margin-top: 16px;
}

body.page-relatorios .report-modal-actions button {
    min-height: 40px;
    padding: 10px 18px;
    border: 0;
    border-radius: 999px;
    background: var(--metro-red);
    color: #fff;
    font: 700 11px/1 "Space Grotesk", sans-serif;
    cursor: pointer;
}

body.page-relatorios .report-modal-actions .secondary {
    border: 1px solid #d8d8dc;
    background: #fff;
    color: #55555a;
}

@media (max-width: 980px) {
    body.page-relatorios .page {
        grid-template-columns: 1fr;
    }

    body.page-relatorios .report-modal-metrics {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    body.page-relatorios .athlete-report-metrics {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    body.page-relatorios .athlete-report-distributions {
        grid-template-columns: 1fr;
    }

    body.page-relatorios .report-modal-header {
        grid-template-columns: 1fr auto;
    }

    body.page-relatorios .report-executive-summary {
        grid-column: 1 / -1;
        grid-row: 2;
    }

    body.page-relatorios .report-distributions {
        grid-template-columns: 1fr;
    }

    body.page-relatorios .report-distribution-category {
        grid-column: auto;
    }

    body.page-relatorios .report-distribution-dates {
        grid-column: auto;
    }

    body.page-relatorios .report-city-map-card {
        grid-column: auto;
    }
}

@media (max-width: 620px) {
    body.page-relatorios {
        padding: 20px 12px;
    }

    body.page-relatorios .reports-card {
        padding: 18px;
    }

    body.page-relatorios .reports-heading,
    body.page-relatorios .report-workspace-header {
        align-items: stretch;
        flex-direction: column;
    }

    body.page-relatorios .reports-menu,
    body.page-relatorios .report-filters,
    body.page-relatorios .report-summary-grid {
        grid-template-columns: 1fr;
    }

    body.page-relatorios .evaluation-filters,
    body.page-relatorios .athlete-filters {
        grid-template-columns: 1fr;
    }

    body.page-relatorios .report-period-fields {
        grid-template-columns: 1fr;
    }

    body.page-relatorios .report-modal {
        padding: 10px;
    }

    body.page-relatorios .report-modal-dialog {
        max-height: calc(100vh - 20px);
        padding: 16px;
    }

    body.page-relatorios .report-modal-metrics {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    body.page-relatorios .report-distribution-card>header {
        align-items: flex-start;
        flex-direction: column;
    }
}

@media print {
    body.page-relatorios {
        padding: 0;
    }

    body.page-relatorios #profile-card-container,
    body.page-relatorios .page-breadcrumb,
    body.page-relatorios .reports-heading,
    body.page-relatorios .reports-menu,
    body.page-relatorios .report-workspace-header,
    body.page-relatorios .report-filters,
    body.page-relatorios .report-actions,
    body.page-relatorios #footer-container {
        display: none !important;
    }

    body.page-relatorios .report-modal {
        position: static;
        display: block !important;
        padding: 0;
        background: #fff;
    }

    body.page-relatorios.report-modal-open .page {
        display: none !important;
    }

    body.page-relatorios .report-modal:not(.is-open) {
        display: none !important;
    }

    body.page-relatorios .report-modal-dialog {
        width: 100%;
        max-height: none;
        overflow: visible;
        padding: 0;
        border: 0;
        box-shadow: none;
    }

    body.page-relatorios .report-modal-header>button,
    body.page-relatorios .report-modal-actions {
        display: none !important;
    }

    body.page-relatorios .page,
    body.page-relatorios .reports-card {
        display: block;
        width: 100%;
        max-width: none;
        padding: 0;
        border: 0;
        box-shadow: none;
    }

    body.page-relatorios .report-preview {
        margin: 0;
        border: 0;
    }

    body.page-relatorios #gameReportModal .report-modal-header,
    body.page-relatorios #gameReportModal .report-modal-metrics,
    body.page-relatorios #gameReportModal .athlete-report-distributions,
    body.page-relatorios #gameReportModal .game-city-distribution,
    body.page-relatorios #gameReportModal .report-city-map-card,
    body.page-relatorios #gameReportModal .report-city-heatmap {
        break-inside: avoid;
        page-break-inside: avoid;
    }

    body.page-relatorios #gameReportModal .game-city-distribution {
        margin-bottom: 10px;
    }

    body.page-relatorios #gameReportModal .report-city-map-card {
        padding: 10px;
    }

    body.page-relatorios #gameReportModal .report-city-map-card>header h3 {
        margin-bottom: 6px;
    }

    body.page-relatorios #gameReportModal .report-city-heatmap {
        height: 185px;
    }

    body.page-relatorios #gameReportModal #gameListLayout,
    body.page-relatorios #gameReportModal #gameCalendarLayout {
        break-before: page;
        page-break-before: always;
    }

    body.page-relatorios #gameReportModal .game-report-calendar {
        min-width: 0;
        padding: 0;
        overflow: visible;
        border: 0;
    }

    body.page-relatorios #gameReportModal .game-report-calendar-page {
        display: block;
        break-inside: avoid;
        page-break-inside: avoid;
    }

    body.page-relatorios #gameReportModal .game-report-calendar-page+.game-report-calendar-page {
        break-before: page;
        page-break-before: always;
    }

    body.page-relatorios #gameReportModal .game-report-calendar-page.is-continuation>.game-report-calendar-heading {
        display: flex;
    }

    body.page-relatorios #gameReportModal .game-report-calendar-page.is-continuation>.game-report-calendar-weekdays {
        display: grid;
    }

    body.page-relatorios #gameReportModal .game-report-calendar-page.is-continuation>.game-report-calendar-grid {
        margin-top: 0;
    }

    body.page-relatorios #gameReportModal .game-report-calendar-day {
        height: 180px;
        break-inside: avoid;
        page-break-inside: avoid;
    }

    body.page-relatorios #gameReportModal .report-document-footer {
        display: none !important;
    }
}

@media (max-width: 980px) {
    body.page-programacao .page {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 620px) {
    body.page-programacao {
        padding: 20px 12px;
    }

    body.page-programacao .programacao-card {
        padding: 18px;
        border-radius: 22px;
    }

    body.page-programacao .programacao-heading {
        align-items: stretch;
        flex-direction: column;
    }

    body.page-programacao .programacao-calendar {
        gap: 4px;
    }

    body.page-programacao .programacao-calendar button {
        min-height: 52px;
        padding: 6px;
    }

    body.page-programacao .programacao-calendar button span {
        display: none;
    }

    body.page-programacao .programacao-form-grid {
        grid-template-columns: 1fr;
    }

    body.page-programacao .programacao-field-wide {
        grid-column: auto;
    }
}

/* Padrão compartilhado para botões que fecham modais, painéis e avisos. */
body.page-agenda #agendaModalClose,
body.page-crias .close,
body.page-institucional .school-unit-modal-close,
body.page-loja .modal-close,
body.page-cadastros .cadastro-modal-close,
body.page-training-planner .planner-card .modal-close,
body.page-relatorios .report-modal-header>button,
body.page-index .cookie-header button,
body.page-programacao .programacao-modal-close {
    display: grid;
    place-items: center;
    width: 36px;
    min-width: 36px;
    height: 36px;
    min-height: 36px;
    padding: 0;
    border: 1px solid var(--metro-red, #e02020);
    border-radius: 50%;
    background: var(--metro-red, #e02020);
    color: #fff;
    font: 400 23px/1 sans-serif;
    cursor: pointer;
    transition: background-color .18s ease, border-color .18s ease, transform .18s ease;
}

body.page-agenda #agendaModalClose:hover,
body.page-crias .close:hover,
body.page-institucional .school-unit-modal-close:hover,
body.page-loja .modal-close:hover,
body.page-cadastros .cadastro-modal-close:hover,
body.page-training-planner .planner-card .modal-close:hover,
body.page-relatorios .report-modal-header>button:hover,
body.page-index .cookie-header button:hover,
body.page-programacao .programacao-modal-close:hover {
    border-color: #b21f24;
    background: #b21f24;
    color: #fff;
    opacity: 1;
    transform: scale(1.04);
}

/* Formulários — padrão visual compartilhado da inscrição de atletas. */
:root {
    --metro-form-control-height: 40px;
    --metro-form-control-padding-x: 14px;
    --metro-form-control-border: #d5d5d5;
    --metro-form-control-radius: 999px;
    --metro-form-control-font-size: 14px;
    --metro-form-label-size: 13px;
    --metro-form-field-gap: 6px;
}

/*
 * Cabeçalhos de formulários: reserva visual equivalente a três linhas.
 * Assim, cards e conteúdos começam sempre no mesmo eixo mesmo quando
 * a descrição de uma página é mais curta.
 */
body.page-form .form-subtitle,
body.page-analise-atleta .form-subtitle,
body.page-pos-treino .form-subtitle,
body.page-pre-treino .form-subtitle,
body.page-pre-sumula .form-subtitle,
body.page-scout .form-subtitle,
body.page-prontuario .form-subtitle,
body.page-registrar-jogos .form-subtitle,
body.page-solicitacao .form-subtitle,
body.page-cadastros .form-subtitle {
    height: 4.5em;
    min-height: 4.5em;
    margin: 0;
    line-height: 1.5;
    overflow: hidden;
}

body.page-form .form-title,
body.page-analise-atleta .form-title,
body.page-pos-treino .form-title,
body.page-pre-treino .form-title,
body.page-pre-sumula .form-title,
body.page-scout .form-title,
body.page-prontuario .form-title,
body.page-registrar-jogos .form-title,
body.page-solicitacao .form-title,
body.page-cadastros .form-title {
    margin: 0 0 4px;
    line-height: 1.2;
}

body.page-form .form-subtitle p,
body.page-analise-atleta .form-subtitle p,
body.page-pos-treino .form-subtitle p,
body.page-pre-treino .form-subtitle p,
body.page-pre-sumula .form-subtitle p,
body.page-scout .form-subtitle p,
body.page-prontuario .form-subtitle p,
body.page-registrar-jogos .form-subtitle p,
body.page-solicitacao .form-subtitle p,
body.page-cadastros .form-subtitle p {
    margin: 0;
}

.form-subtitle-line {
    display: block;
}

body.page-form .field-group,
body.page-pos-treino .field-group,
body.page-pre-treino .field-group,
body.page-pre-sumula .field-group,
body.page-prontuario .field-group,
body.page-registrar-jogos .field-group,
body.page-solicitacao .field-group,
body.page-cadastros .cadastro-form-field,
body.page-programacao .programacao-form-grid label {
    gap: var(--metro-form-field-gap);
}

body.page-form .field-label,
body.page-pos-treino .field-label,
body.page-pre-treino .field-label,
body.page-pre-sumula .field-label,
body.page-prontuario .field-label,
body.page-registrar-jogos .field-label,
body.page-solicitacao .field-label,
body.page-cadastros .cadastro-form-field>span,
body.page-programacao .programacao-form-grid label {
    color: var(--metro-text);
    font-family: "Space Grotesk", sans-serif;
    font-size: var(--metro-form-label-size);
    font-weight: 500;
}

body.page-form .field-group>input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]),
body.page-form .field-group>select,
body.page-pos-treino .field-group>input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]),
body.page-pos-treino .field-group>select,
body.page-pre-treino .field-group>input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]),
body.page-pre-treino .field-group>select,
body.page-pre-sumula .field-group>input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]),
body.page-pre-sumula .field-group>select,
body.page-prontuario .field-group>input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]),
body.page-prontuario .field-group>select,
body.page-registrar-jogos .field-group>input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]),
body.page-registrar-jogos .field-group>select,
body.page-solicitacao .field-group>input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]),
body.page-solicitacao .field-group>select,
body.page-cadastros .cadastro-form-field>input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]),
body.page-cadastros .cadastro-form-field>select,
body.page-programacao .programacao-form-grid input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]):not([type="file"]),
body.page-programacao .programacao-form-grid select {
    box-sizing: border-box;
    width: 100%;
    height: var(--metro-form-control-height);
    min-height: var(--metro-form-control-height);
    padding: 6px var(--metro-form-control-padding-x);
    border: 1px solid var(--metro-form-control-border);
    border-radius: var(--metro-form-control-radius);
    outline: none;
    background: #fff;
    color: var(--metro-text);
    font-family: "Space Grotesk", sans-serif;
    font-size: var(--metro-form-control-font-size);
    font-weight: 400;
    line-height: 1.2;
    transition: border-color .15s ease, box-shadow .15s ease, background-color .15s ease;
}

body.page-form .field-group>textarea,
body.page-pos-treino .field-group>textarea,
body.page-pre-treino .field-group>textarea,
body.page-pre-sumula .field-group>textarea,
body.page-prontuario .field-group>textarea,
body.page-registrar-jogos .field-group>textarea,
body.page-solicitacao .field-group>textarea,
body.page-cadastros .cadastro-form-field>textarea,
body.page-programacao .programacao-form-grid textarea {
    box-sizing: border-box;
    width: 100%;
    min-height: 92px;
    padding: 10px var(--metro-form-control-padding-x);
    border: 1px solid var(--metro-form-control-border);
    border-radius: 18px;
    outline: none;
    background: #fff;
    color: var(--metro-text);
    font-family: "Space Grotesk", sans-serif;
    font-size: var(--metro-form-control-font-size);
    font-weight: 400;
    line-height: 1.4;
    resize: vertical;
}

body.page-form .field-group>input::placeholder,
body.page-form .field-group>textarea::placeholder,
body.page-pos-treino .field-group>input::placeholder,
body.page-pos-treino .field-group>textarea::placeholder,
body.page-pre-treino .field-group>input::placeholder,
body.page-pre-treino .field-group>textarea::placeholder,
body.page-pre-sumula .field-group>input::placeholder,
body.page-pre-sumula .field-group>textarea::placeholder,
body.page-prontuario .field-group>input::placeholder,
body.page-prontuario .field-group>textarea::placeholder,
body.page-registrar-jogos .field-group>input::placeholder,
body.page-registrar-jogos .field-group>textarea::placeholder,
body.page-solicitacao .field-group>input::placeholder,
body.page-solicitacao .field-group>textarea::placeholder,
body.page-cadastros .cadastro-form-field>input::placeholder,
body.page-cadastros .cadastro-form-field>textarea::placeholder,
body.page-programacao .programacao-form-grid input::placeholder,
body.page-programacao .programacao-form-grid textarea::placeholder {
    color: #999;
    opacity: 1;
}

body.page-form .field-group>input:focus,
body.page-form .field-group>select:focus,
body.page-form .field-group>textarea:focus,
body.page-pos-treino .field-group>input:focus,
body.page-pos-treino .field-group>select:focus,
body.page-pos-treino .field-group>textarea:focus,
body.page-pre-treino .field-group>input:focus,
body.page-pre-treino .field-group>select:focus,
body.page-pre-treino .field-group>textarea:focus,
body.page-pre-sumula .field-group>input:focus,
body.page-pre-sumula .field-group>select:focus,
body.page-pre-sumula .field-group>textarea:focus,
body.page-prontuario .field-group>input:focus,
body.page-prontuario .field-group>select:focus,
body.page-prontuario .field-group>textarea:focus,
body.page-registrar-jogos .field-group>input:focus,
body.page-registrar-jogos .field-group>select:focus,
body.page-registrar-jogos .field-group>textarea:focus,
body.page-solicitacao .field-group>input:focus,
body.page-solicitacao .field-group>select:focus,
body.page-solicitacao .field-group>textarea:focus,
body.page-cadastros .cadastro-form-field>input:focus,
body.page-cadastros .cadastro-form-field>select:focus,
body.page-cadastros .cadastro-form-field>textarea:focus,
body.page-programacao .programacao-form-grid input:focus,
body.page-programacao .programacao-form-grid select:focus,
body.page-programacao .programacao-form-grid textarea:focus {
    border-color: var(--metro-red);
    box-shadow: 0 0 0 1px rgba(224, 32, 32, .08);
    background: #fff;
}

/* Ajustes de largura, alinhamento e ritmo vertical dos formulários. */
body.page-training-planner .activity-editor-card {
    width: min(calc(100% - 48px), 920px);
    margin: 20px auto;
}

body.page-training-planner .activity-editor-card>.panel-header {
    align-items: center;
    padding: 18px 22px 10px;
    text-align: center;
}

body.page-training-planner .activity-editor-card>.panel-body {
    padding: 10px 22px 24px;
}

body.page-training-planner .activity-editor-card label,
body.page-training-planner .activity-editor-card input:not([type="range"]),
body.page-training-planner .activity-editor-card select {
    text-align: center;
    text-align-last: center;
}

body.page-training-planner .activity-editor-card label {
    margin-top: 16px;
    margin-bottom: 7px;
}

body.page-training-planner .activity-editor-card textarea {
    padding: 12px 16px;
    line-height: 1.5;
}

body.page-training-planner .activity-editor-card .estimated-load-card {
    margin: 18px 0;
}

body.page-pre-treino .form-wrapper,
body.page-pos-treino .form-wrapper,
body.page-prontuario .form-wrapper {
    justify-content: center;
    width: 100%;
}

body.page-pre-treino .form-card,
body.page-pos-treino .form-card,
body.page-prontuario .form-card {
    width: min(100%, 640px);
    margin-inline: auto;
}

body.page-pre-treino .question-image,
body.page-pos-treino .question-image {
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: 190px;
    margin: 6px auto 4px;
    object-fit: contain;
    object-position: center;
}

body.page-pre-treino img.question-image[src*="/humor.png"],
body.page-pos-treino img.question-image[src*="/humor.png"],
body.page-pos-treino img.question-image[src*="/intensidade.png"] {
    height: auto;
    max-height: 285px;
}

body.page-pre-treino img.question-image[src*="/dor.png"],
body.page-pos-treino img.question-image[src*="/dor.png"] {
    height: auto;
    max-height: 570px;
}

body.page-pre-treino .scale-row,
body.page-pos-treino .scale-row {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    flex-wrap: nowrap;
    gap: 14px;
    width: min(100%, 560px);
    margin: 6px auto 2px;
    padding-bottom: 6px;
    overflow-x: auto;
    overscroll-behavior-inline: contain;
}

body.page-pre-treino .scale-row label,
body.page-pos-treino .scale-row label {
    display: flex;
    flex: 1 0 max-content;
    flex-direction: column;
    align-items: center;
    gap: 7px;
    min-width: 0;
    line-height: 1.35;
    text-align: center;
}

body.page-pre-treino .scale-row input,
body.page-pos-treino .scale-row input {
    width: 18px;
    height: 18px;
    margin: 0;
}

body.page-pre-treino .scale-row span,
body.page-pos-treino .scale-row span {
    display: block;
    text-align: center;
    white-space: nowrap;
}

body.page-pre-treino .scale-row>.label-extremo,
body.page-pos-treino .scale-row>.label-extremo {
    flex: 0 0 auto;
    padding-top: 1px;
}

body.page-pre-treino .body-status-row label,
body.page-pos-treino .body-status-row label {
    font-size: 10px;
}

body.page-pre-treino .body-status-row label span,
body.page-pos-treino .body-status-row label span {
    font-size: inherit;
}

body.page-pre-treino .pain-details[hidden],
body.page-pos-treino .pain-details[hidden] {
    display: none !important;
}

body.page-pre-treino .pain-details>.field-label,
body.page-pos-treino .pain-details>.field-label {
    text-align: center;
}

body.page-prontuario .form-card {
    gap: 16px;
}

body.page-prontuario .bloco-prontuario {
    padding-top: 4px;
}

body.page-prontuario .bloco-prontuario>.field-group {
    margin-bottom: 16px;
}

body.page-prontuario .field-label,
body.page-prontuario .section-label,
body.page-prontuario .form-title,
body.page-prontuario .form-subtitle {
    text-align: left;
}

body.page-prontuario .field-group>input:not([type="file"]),
body.page-prontuario .field-group>select {
    text-align: left;
    text-align-last: left;
}

body.page-prontuario .u-inline-33 {
    gap: 14px 20px;
    margin-top: 4px;
}

body.page-prontuario .u-inline-33 label {
    display: grid;
    grid-template-rows: 18px auto;
    place-items: center;
    gap: 6px;
    line-height: 1.3;
    text-align: center;
}

body.page-prontuario .u-inline-33 input[type="checkbox"] {
    width: 16px;
    height: 16px;
    margin: 0;
}

body.page-prontuario #file-name,
body.page-prontuario .contador-text {
    display: block;
    margin-left: 0;
    text-align: center;
}

body.page-prontuario .custom-file-upload {
    margin-inline: auto;
}

body.page-prontuario .prontuario-multi-field {
    display: grid;
    gap: 8px;
}

body.page-prontuario .prontuario-multi-list {
    display: grid;
    gap: 8px;
}

body.page-prontuario .prontuario-multi-list:empty {
    display: none;
}

body.page-prontuario .prontuario-multi-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    min-height: 40px;
    padding: 8px 10px 8px 14px;
    border: 1px solid #e2e2e5;
    border-radius: 11px;
    background: #f1f1f3;
    color: #303035;
    font-size: 12px;
    font-weight: 700;
}

body.page-prontuario .prontuario-multi-item button {
    width: auto;
    min-height: 0;
    padding: 7px 11px;
    border: 0;
    border-radius: 8px;
    background: var(--metro-red);
    color: #fff;
    font-family: "Space Grotesk", sans-serif;
    font-size: 10px;
    font-weight: 700;
    cursor: pointer;
}

/* Prontuário em dois cards: identificação fixa + conteúdo específico. */
body.page-prontuario .form-card {
    gap: 18px;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}

body.page-prontuario .prontuario-base-card,
body.page-prontuario .bloco-prontuario {
    width: 100%;
    padding: 24px;
    border: 1px solid rgba(0, 0, 0, .08);
    border-radius: 28px;
    background: #fff;
    box-shadow: 0 14px 35px rgba(0, 0, 0, .06);
}

body.page-prontuario .prontuario-base-card {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

body.page-prontuario .prontuario-base-row {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: end;
    gap: 16px
}

body.page-prontuario .prontuario-base-row[hidden] {
    display: none
}

body.page-prontuario .prontuario-base-row>.field-group {
    min-width: 0;
    margin: 0
}

@media (max-width: 620px) {
    body.page-prontuario .prontuario-base-row {
        grid-template-columns: 1fr
    }
}

body.page-prontuario .bloco-prontuario {
    margin: 0;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: start;
    gap: 16px;
}

body.page-prontuario .bloco-prontuario>*:not(.field-group),
body.page-prontuario .bloco-prontuario>.field-group:has(textarea),
body.page-prontuario .bloco-prontuario>.field-group:has(.prontuario-multi-field),
body.page-prontuario .bloco-prontuario>.field-group:has(input[type="checkbox"]),
body.page-prontuario .bloco-prontuario>.field-group:has(input[type="radio"]),
body.page-prontuario .bloco-prontuario>.field-group:has(select[multiple]) {
    grid-column: 1 / -1;
}

body.page-prontuario .bloco-prontuario>.field-group {
    min-width: 0;
    margin: 0;
}

/* Mantém os dois seletores de exames lado a lado no desktop. */
body.page-prontuario #form-LESOES>.field-group:has(#exames-realizar-select),
body.page-prontuario #form-LESOES>.field-group:has(#exames-realizados-select) {
    grid-column: auto;
}

/* Área de anexos compacta e centralizada em todos os prontuários. */
body.page-prontuario .bloco-prontuario>.field-group:has(input[type="file"]) {
    grid-column: 1 / -1;
    align-items: center;
    justify-content: center;
    width: min(100%, 420px);
    min-height: 122px;
    margin-inline: auto;
    padding: 16px;
    border: 1px solid #e6e6e9;
    border-radius: 18px;
    background: #fafafa;
    text-align: center;
}

body.page-prontuario .bloco-prontuario>.field-group:has(input[type="file"])>.field-label {
    width: 100%;
    color: #55555b;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .06em;
    text-align: center;
    text-transform: uppercase;
}

body.page-prontuario .bloco-prontuario>.field-group:has(input[type="file"])>.custom-file-upload {
    max-width: none;
    min-height: 36px;
    margin: 2px auto 0;
    padding: 8px 16px;
    border-radius: 10px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .01em;
}

body.page-prontuario .bloco-prontuario>.field-group:has(input[type="file"])>span {
    display: block;
    width: 100%;
    margin: 0;
    color: #77777d;
    font-size: 11px;
    line-height: 1.35;
    overflow-wrap: anywhere;
    text-align: center;
}

body.page-prontuario .bloco-prontuario>.section-label:first-child {
    margin-top: 0;
    margin-bottom: 18px;
}

body.page-prontuario #grupo-profissional {
    gap: var(--metro-form-field-gap);
}

body.page-prontuario #grupo-profissional .field-label {
    margin: 0;
}

body.page-prontuario #grupo-profissional select {
    box-sizing: border-box;
    width: 100%;
    height: var(--metro-form-control-height);
    min-height: var(--metro-form-control-height);
    padding: 6px 44px 6px var(--metro-form-control-padding-x);
    border: 1px solid var(--metro-form-control-border);
    border-radius: var(--metro-form-control-radius);
    line-height: 1.2;
    text-overflow: ellipsis;
    white-space: nowrap;
}

@media (max-width: 900px) {

    body.page-pre-treino .form-wrapper,
    body.page-pos-treino .form-wrapper,
    body.page-prontuario .form-wrapper {
        padding-inline: 10px;
    }

    body.page-pre-treino .form-card,
    body.page-pos-treino .form-card,
    body.page-prontuario .form-card {
        width: min(100%, 620px);
    }
}

@media (max-width: 560px) {
    body.page-training-planner .activity-editor-card {
        width: calc(100% - 28px);
        margin-block: 14px;
    }

    body.page-training-planner .activity-editor-card>.panel-header {
        padding-inline: 16px;
    }

    body.page-training-planner .activity-editor-card>.panel-body {
        padding: 8px 16px 20px;
    }

    body.page-pre-treino,
    body.page-pos-treino,
    body.page-prontuario {
        padding-inline: 8px;
    }

    body.page-pre-treino .form-wrapper,
    body.page-pos-treino .form-wrapper,
    body.page-prontuario .form-wrapper {
        padding-inline: 6px;
    }

    body.page-pre-treino .form-card,
    body.page-pos-treino .form-card,
    body.page-prontuario .form-card {
        padding: 0;
    }

    body.page-pre-treino .question-image,
    body.page-pos-treino .question-image {
        height: auto;
        max-height: 170px;
    }

    body.page-pre-treino img.question-image[src*="/humor.png"],
    body.page-pos-treino img.question-image[src*="/humor.png"],
    body.page-pos-treino img.question-image[src*="/intensidade.png"] {
        height: auto;
        max-height: 255px;
    }

    body.page-pre-treino img.question-image[src*="/dor.png"],
    body.page-pos-treino img.question-image[src*="/dor.png"] {
        height: auto;
        max-height: 510px;
    }

    body.page-prontuario .prontuario-base-card,
    body.page-prontuario .bloco-prontuario {
        padding: 20px 18px;
        border-radius: 24px;
    }

    body.page-prontuario .bloco-prontuario {
        grid-template-columns: 1fr;
    }

    body.page-prontuario .u-inline-33 {
        grid-template-columns: 1fr 1fr;
        gap: 16px 12px;
    }
}

/* Modal de Cadastros: densidade vertical equivalente aos controles de input. */
body.page-cadastros .cadastro-form {
    row-gap: 2px;
}

body.page-cadastros .cadastro-form-field {
    gap: 4px;
}

body.page-cadastros .cadastro-form-field>textarea {
    min-height: 64px;
}

/* Planejador: editor tático usando praticamente toda a janela disponível. */
body.page-training-planner .tactical-modal {
    padding: 8px;
}

body.page-training-planner .tactical-modal-dialog {
    width: calc(100vw - 16px) !important;
    max-width: none !important;
    min-height: calc(100dvh - 16px);
    max-height: calc(100dvh - 16px) !important;
    margin: 0 auto;
}

body.page-training-planner .tactical-modal .field-wrap {
    grid-template-columns: minmax(0, 1fr) 240px !important;
    grid-template-areas: "field settings" !important;
    width: 100%;
    gap: 16px;
    padding-inline: 18px;
}

body.page-training-planner .tactical-modal .field-left-controls {
    display: none !important;
}

body.page-training-planner .tactical-modal .object-settings {
    grid-area: settings;
    width: 100%;
}

body.page-training-planner .tactical-modal .object-settings .field-toolbar {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    width: 100%;
    margin-top: 4px;
}

body.page-training-planner .tactical-modal .object-settings .field-toolbar button,
body.page-training-planner .tactical-modal .object-settings .field-toolbar .dark {
    width: 100%;
    min-height: 38px;
    margin: 0;
    padding: 8px 10px;
    white-space: normal;
}

body.page-training-planner .duration-summary {
    grid-template-columns: repeat(2, 106px) !important;
    gap: 12px;
    width: fit-content;
    max-width: 100%;
    margin: 12px auto 0;
}

body.page-training-planner .duration-summary>div {
    display: flex;
    aspect-ratio: 1 / 1;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    width: 106px;
    min-width: 0;
    padding: 10px;
    border: 2px solid #f2c94c;
    border-radius: 18px;
    background: #fff9e6;
    box-shadow: 0 8px 22px rgba(242, 201, 76, .28);
}

body.page-training-planner .duration-summary span {
    color: #8b7425;
    font-size: 8px;
}

body.page-training-planner .duration-summary strong {
    color: #d6a900;
    font-size: 15px;
}

body.page-training-planner .tactical-modal #field,
body.page-training-planner .tactical-modal .field {
    width: 100% !important;
    max-width: none !important;
    aspect-ratio: 175 / 102 !important;
}

@media (max-width: 1100px) {
    body.page-training-planner .tactical-modal .field-wrap {
        grid-template-columns: minmax(0, 1fr) !important;
        grid-template-areas:
            "field"
            "settings" !important;
    }
}

@media (max-width: 420px) {
    body.page-training-planner .duration-summary {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        width: min(100%, 224px);
        gap: 8px;
    }

    body.page-training-planner .duration-summary>div {
        width: 100%;
    }
}

/* Planejador: ritmo vertical uniforme entre os cards principais. */
body.page-training-planner .planner-card {
    --planner-main-card-gap: 12px;
}

body.page-training-planner .planner-card .layout {
    gap: var(--planner-main-card-gap);
}

body.page-training-planner .planner-card .left-panel {
    margin: 16px 16px 0;
}

body.page-training-planner .planner-card .left-panel > .panel-body,
body.page-training-planner .planner-card .left-panel + .panel {
    display: grid;
    gap: var(--planner-main-card-gap);
}

body.page-training-planner .planner-card .activity-editor-card {
    margin-block: 0;
}

body.page-training-planner .planner-card .tactical-preview {
    margin-block: 0 16px;
}

/* Cabeçalhos de página — padrão visual do formulário de inscrição. */
:root {
    --portal-heading-title-size: 22px;
    --portal-heading-copy-size: 13px;
    --portal-heading-line-height: 1.5;
    --portal-heading-title-color: #111111;
    --portal-heading-copy-color: #777777;
}

.portal-heading-copy,
body.page-form:not(.page-training-planner) .form-title-block,
body.page-scout .scout-intro,
body.page-pre-sumula .pre-sumula-intro {
    display: grid;
    gap: 0;
    width: 100%;
    min-width: 0;
}

.portal-heading-copy h1,
body.page-training-planner .planner-heading h1,
body.page-form .form-title,
body.page-analise-atleta .form-title,
body.page-pos-treino .form-title,
body.page-pre-treino .form-title,
body.page-pre-sumula .form-title,
body.page-scout .form-title,
body.page-prontuario .form-title,
body.page-registrar-jogos .form-title,
body.page-solicitacao .form-title,
body.page-cadastros .form-title {
    margin: 0 0 4px;
    color: var(--portal-heading-title-color);
    font-family: "Space Grotesk", sans-serif;
    font-size: var(--portal-heading-title-size);
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: 0;
    text-align: left;
    text-transform: none;
}

.portal-heading-subtitle,
body.page-form .form-subtitle,
body.page-analise-atleta .form-subtitle,
body.page-pos-treino .form-subtitle,
body.page-pre-treino .form-subtitle,
body.page-pre-sumula .form-subtitle,
body.page-scout .form-subtitle,
body.page-prontuario .form-subtitle,
body.page-registrar-jogos .form-subtitle,
body.page-solicitacao .form-subtitle,
body.page-cadastros .form-subtitle {
    display: block;
    width: 100%;
    max-width: none;
    height: 4.5em;
    min-height: 4.5em;
    margin: 0;
    overflow: hidden;
    color: var(--portal-heading-copy-color);
    font-family: "Space Grotesk", sans-serif;
    font-size: var(--portal-heading-copy-size);
    font-weight: 400;
    line-height: var(--portal-heading-line-height);
    text-align: left;
}

.portal-heading-subtitle > span,
.form-subtitle-line {
    display: block;
    min-height: 1.5em;
}

.portal-page-heading,
body.page-relatorios .reports-heading,
body.page-programacao .programacao-heading,
body.page-biblioteca .biblioteca-header {
    margin-top: 0;
    margin-bottom: 18px;
}

body.page-training-planner .planner-heading {
    max-width: none;
}

body.page-training-planner .planner-heading .portal-heading-subtitle {
    margin: 0;
}

body.page-analise-atleta .analysis-card > .page-breadcrumb {
    margin-bottom: -10px;
}

body.page-cadastros .cadastros-controls-card > .page-breadcrumb {
    margin-bottom: -12px;
}

body.page-ouvidoria .ouvidoria-heading h1,
body.page-ouvidoria .internal-header h1 {
    margin: 0 0 4px;
    font-size: var(--portal-heading-title-size);
    line-height: 1.2;
    text-transform: none;
}

body.page-ouvidoria .ouvidoria-intro,
body.page-ouvidoria .internal-intro {
    gap: 0;
    margin: 0;
}

body.page-ouvidoria .ouvidoria-card > .ouvidoria-heading.portal-page-heading {
    margin-bottom: -4px;
}

body.page-biblioteca .biblioteca-header.portal-page-heading .portal-heading-copy h1 {
    font-size: var(--portal-heading-title-size);
}

@media (max-width: 620px) {
    .portal-page-heading {
        align-items: stretch;
        flex-direction: column;
    }

    .portal-heading-subtitle,
    body.page-form .form-subtitle,
    body.page-analise-atleta .form-subtitle,
    body.page-pos-treino .form-subtitle,
    body.page-pre-treino .form-subtitle,
    body.page-pre-sumula .form-subtitle,
    body.page-scout .form-subtitle,
    body.page-prontuario .form-subtitle,
    body.page-registrar-jogos .form-subtitle,
    body.page-solicitacao .form-subtitle,
    body.page-cadastros .form-subtitle {
        height: auto;
        min-height: 4.5em;
        overflow: visible;
    }
}

/* Acompanhamento Nutricional (paginas/acomp-nutricional.html) — pequenos
   complementos reaproveitando os padrões já usados em body.page-form. */
body.page-form .step-note {
    font-size: 13px;
    color: var(--metro-muted);
    margin-top: -6px;
    margin-bottom: -2px
}

body.page-form .field-note {
    font-size: 11px;
    color: var(--metro-muted);
    margin-top: -2px
}

body.page-form .input-readonly {
    background: rgba(0, 0, 0, 0.03);
    color: var(--metro-muted);
    cursor: default
}

body.page-form .field-group.is-disabled {
    opacity: 0.42;
    pointer-events: none
}

/* Biblioteca (paginas/biblioteca.html) — movido de css/biblioteca.css para
   centralizar os estilos em um único arquivo. */
body.page-biblioteca {
    min-height: 100vh;
    margin: 0;
    padding: 32px 16px 24px;
    background: #fff;
    color: var(--metro-text);
    font-family: "Space Grotesk", sans-serif;
}

body.page-biblioteca * {
    box-sizing: border-box;
}

body.page-biblioteca .page {
    width: 100%;
    max-width: 1120px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 420px minmax(0, 1fr);
    gap: 40px;
    align-items: start;
}

body.page-biblioteca #profile-card-container {
    width: 100%;
    min-width: 420px;
}

body.page-biblioteca .biblioteca-content,
body.page-biblioteca .biblioteca-grupos {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 24px;
}

body.page-biblioteca .biblioteca-card {
    width: 100%;
    min-width: 0;
    padding: 24px;
    border: 1px solid #e2e2e5;
    border-radius: 28px;
    background: #fff;
    box-shadow: 0 14px 35px rgba(0, 0, 0, .06);
}

body.page-biblioteca .biblioteca-intro {
    padding-top: 16px;
}

body.page-biblioteca .biblioteca-header,
body.page-biblioteca .biblioteca-grupo>header,
body.page-biblioteca .biblioteca-documento-topo {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

body.page-biblioteca .biblioteca-header h1,
body.page-biblioteca .biblioteca-grupo h2,
body.page-biblioteca .biblioteca-documento h3 {
    margin: 0;
}

body.page-biblioteca .biblioteca-header h1 {
    font-size: 28px;
}

body.page-biblioteca .biblioteca-header p {
    margin: 7px 0 0;
    color: var(--metro-muted);
    font-size: 13px;
    line-height: 1.55;
}

body.page-biblioteca .biblioteca-total {
    flex: 0 0 auto;
    display: flex;
    align-items: baseline;
    gap: 6px;
    color: var(--metro-muted);
    font-size: 12px;
}

body.page-biblioteca .biblioteca-total strong {
    color: var(--metro-red);
    font-size: 22px;
}

body.page-biblioteca .biblioteca-busca {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 20px;
    padding: 0 15px;
    border: 1px solid #d7d7d9;
    border-radius: 999px;
    color: #777;
}

body.page-biblioteca .biblioteca-busca:focus-within {
    border-color: var(--metro-red);
    box-shadow: 0 0 0 3px rgba(224, 32, 32, .1);
}

body.page-biblioteca .biblioteca-busca .sr-only {
    flex: 0 0 auto;
    white-space: nowrap;
}

body.page-biblioteca .biblioteca-busca input {
    width: 100%;
    min-height: 44px;
    border: 0;
    outline: 0;
    background: transparent;
    font: 400 12px/1 "Space Grotesk", sans-serif;
}

body.page-biblioteca .biblioteca-categorias {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px;
    margin-top: 16px;
}

body.page-biblioteca .biblioteca-categorias button {
    min-height: 38px;
    padding: 9px 15px;
    border: 1px solid #d7d7d9;
    border-radius: 999px;
    background: #fff;
    color: #555;
    font: 700 11px/1 "Space Grotesk", sans-serif;
    cursor: pointer;
}

body.page-biblioteca .biblioteca-categorias button:hover,
body.page-biblioteca .biblioteca-categorias button.is-active {
    border-color: var(--metro-red);
    background: var(--metro-red);
    color: #fff;
}

body.page-biblioteca .biblioteca-status {
    padding: 36px 20px;
    border: 1px dashed #d4d4d4;
    border-radius: 20px;
    color: #777;
    font-size: 13px;
    text-align: center;
}

body.page-biblioteca .biblioteca-status[hidden] {
    display: none;
}

body.page-biblioteca .biblioteca-status.is-error {
    border-color: #f1bcbc;
    background: #fff4f4;
    color: #a51f24;
}

body.page-biblioteca .biblioteca-grupo>header {
    padding-bottom: 16px;
    border-bottom: 1px solid #ececef;
}

body.page-biblioteca .biblioteca-grupo h2 {
    font-size: 21px;
}

body.page-biblioteca .biblioteca-grupo>header span {
    color: var(--metro-muted);
    font-size: 11px;
    font-weight: 600;
}

body.page-biblioteca .biblioteca-documentos {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin-top: 16px;
}

body.page-biblioteca .biblioteca-documento {
    min-width: 0;
    display: flex;
    flex-direction: column;
    padding: 16px;
    border: 1px solid #e7e7e9;
    border-radius: 19px;
    background: #fafafa;
}

body.page-biblioteca .biblioteca-tipo {
    padding: 6px 9px;
    border-radius: 999px;
    background: rgba(224, 32, 32, .08);
    color: var(--metro-red);
    font-size: 9px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
}

body.page-biblioteca .biblioteca-ordem {
    overflow: hidden;
    color: #888;
    font-size: 10px;
    text-overflow: ellipsis;
    white-space: nowrap;
}

body.page-biblioteca .biblioteca-documento h3 {
    margin-top: 14px;
    color: #171717;
    font-size: 16px;
    line-height: 1.3;
}

body.page-biblioteca .biblioteca-documento p {
    flex: 1;
    margin: 8px 0 16px;
    color: #707074;
    font-size: 11px;
    line-height: 1.5;
}

body.page-biblioteca .biblioteca-documento a {
    align-self: flex-start;
    padding: 9px 14px;
    border: 1px solid var(--metro-red);
    border-radius: 999px;
    background: var(--metro-red);
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    text-decoration: none;
}

body.page-biblioteca .biblioteca-documento a:hover {
    background: #be1b1b;
}

@media (max-width: 980px) {
    body.page-biblioteca .page {
        grid-template-columns: 1fr;
    }

    body.page-biblioteca #profile-card-container {
        min-width: 0;
    }
}

@media (max-width: 680px) {
    body.page-biblioteca {
        padding: 20px 12px;
    }

    body.page-biblioteca .biblioteca-card {
        padding: 20px;
        border-radius: 22px;
    }

    body.page-biblioteca .biblioteca-header,
    body.page-biblioteca .biblioteca-documento-topo {
        align-items: flex-start;
        flex-direction: column;
    }

    body.page-biblioteca .biblioteca-documentos {
        grid-template-columns: 1fr;
    }

    body.page-biblioteca .biblioteca-ordem {
        max-width: 100%;
    }
}

/* ==========================================================================
   DASHBOARD DO ATLETA (paginas/dashboard-atleta.html)
   ========================================================================== */

body.page-dashboard-atleta {
    --metro-red: #e02020;
    --metro-text: #111;
    --metro-muted: #777;
    --metro-border: rgba(0, 0, 0, .08)
}

body.page-dashboard-atleta * {
    box-sizing: border-box
}

body.page-dashboard-atleta {
    font-family: "Space Grotesk", sans-serif;
    background: #fff;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    padding: 32px 16px 24px;
    color: var(--metro-text)
}

body.page-dashboard-atleta .page {
    flex: 1;
    width: 100%;
    max-width: 1120px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 420px minmax(0, 1fr);
    gap: 40px;
    align-items: flex-start
}

body.page-dashboard-atleta #profile-card-container {
    min-width: 420px
}

body.page-dashboard-atleta .dash-atleta-content {
    width: 100%;
    min-width: 0
}

body.page-dashboard-atleta .dash-main-card {
    width: 100%;
    min-width: 0;
    padding: 22px;
    border: 1px solid rgba(0, 0, 0, .06);
    border-radius: 24px;
    background: #fff;
    box-shadow: 0 10px 25px rgba(0, 0, 0, .05)
}

body.page-dashboard-atleta .dash-card {
    background: #fff;
    border: 1px solid var(--metro-border);
    border-radius: 20px;
    padding: 24px;
    box-shadow: 0 8px 22px rgba(0, 0, 0, .04)
}

body.page-dashboard-atleta .dash-card-title {
    font-size: 15px;
    font-weight: 700;
    margin-bottom: 16px
}

body.page-dashboard-atleta .dash-card-cabecalho-colapsavel {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    min-height: 32px;
    margin-bottom: 0
}

body.page-dashboard-atleta .dash-card-toggle {
    min-width: 0;
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none !important;
    filter: none;
    transform: none;
    appearance: none;
    -webkit-appearance: none;
    color: inherit;
    font-family: inherit;
    text-align: left;
    cursor: pointer
}

body.page-dashboard-atleta .dash-card-toggle:hover,
body.page-dashboard-atleta .dash-card-toggle:focus,
body.page-dashboard-atleta .dash-card-toggle:focus-visible,
body.page-dashboard-atleta .dash-card-toggle:active {
    outline: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none !important;
    filter: none;
    transform: none
}

body.page-dashboard-atleta .dash-card-cabecalho-colapsavel .dash-card-title {
    margin-bottom: 0
}

body.page-dashboard-atleta .dash-card-indicador {
    width: 32px;
    height: 32px;
    flex: 0 0 32px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #f1f1f3;
    color: var(--metro-red);
    font-size: 22px;
    font-weight: 700;
    line-height: 1
}

body.page-dashboard-atleta .dash-card-conteudo {
    margin-top: 16px;
    margin-bottom: 24px
}

body.page-dashboard-atleta .dash-card-conteudo[hidden] {
    display: none
}

body.page-dashboard-atleta .dash-prontuario-acesso-card {
    display: block
}

body.page-dashboard-atleta .dash-prontuario-acesso-card .dash-modulo-title {
    margin: 0
}

body.page-dashboard-atleta .dash-modulo-cabecalho {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 18px
}

body.page-dashboard-atleta .dash-modulo-cabecalho.dash-card-cabecalho-colapsavel {
    margin-bottom: 0
}

body.page-dashboard-atleta .dash-modulo-funcao {
    display: flex;
    flex-direction: column;
    gap: 12px;
    min-width: 0;
    padding: 18px;
    border: 1px solid var(--metro-border);
    border-radius: 18px;
    background: #fff
}

body.page-dashboard-atleta .dash-modulo-funcao[hidden] {
    display: none
}

body.page-dashboard-atleta .dash-modulo-funcoes {
    display: flex;
    flex-direction: column;
    gap: 26px
}

body.page-dashboard-atleta .dash-modulo-grupo-titulo {
    margin: 0 0 12px;
    color: var(--metro-text);
    font-size: 15px;
    font-weight: 700
}

body.page-dashboard-atleta .dash-modulo-grupo-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    align-items: stretch
}

body.page-dashboard-atleta .dash-modulo-funcao-topo {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0
}

body.page-dashboard-atleta .dash-modulo-icone {
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: rgba(224, 32, 32, .1);
    color: var(--metro-red)
}

body.page-dashboard-atleta .dash-modulo-icone svg {
    width: 20px;
    height: 20px
}

body.page-dashboard-atleta .dash-modulo-texto {
    flex: 1 1 auto;
    min-width: 0
}

body.page-dashboard-atleta .dash-modulo-funcao h3 {
    margin: 0;
    font-size: 14px
}

body.page-dashboard-atleta .dash-modulo-funcao p {
    margin: 0;
    width: 100%;
    max-width: none;
    min-height: 2.8em;
    display: -webkit-box;
    overflow: hidden;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    color: var(--metro-muted);
    font-size: 11.5px;
    line-height: 1.4
}

body.page-dashboard-atleta .dash-modulo-abrir {
    flex: 0 0 auto;
    align-self: center;
    width: 190px;
    max-width: 100%;
    margin-top: auto;
    white-space: nowrap;
    font-size: 11px
}

body.page-dashboard-atleta .btn-submit.dash-modulo-abrir {
    padding: 8px 16px
}

body.page-dashboard-atleta .dash-card-eyebrow {
    color: var(--metro-red);
    font-size: 9px;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase
}

body.page-dashboard-atleta .dash-modulos-admin {
    display: grid;
    gap: 14px;
    margin: 0 0 18px;
    padding: 16px;
    border: 1px solid rgba(224, 32, 32, .25);
    border-radius: 18px;
    background: rgba(224, 32, 32, .035)
}

body.page-dashboard-atleta .dash-modulos-admin[hidden] {
    display: none
}

body.page-dashboard-atleta .dash-modulos-admin h3 {
    margin: 0 0 4px;
    font-size: 14px
}

body.page-dashboard-atleta .dash-modulos-admin p,
body.page-dashboard-atleta .dash-modulos-vazio {
    margin: 0;
    color: var(--metro-muted);
    font-size: 12px;
    line-height: 1.45
}

body.page-dashboard-atleta .dash-modulos-admin-lista {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px
}

body.page-dashboard-atleta .dash-modulo-permissao {
    display: flex;
    align-items: center;
    gap: 9px;
    min-width: 0;
    padding: 9px 11px;
    border: 1px solid var(--metro-border);
    border-radius: 12px;
    background: #fff;
    color: #333;
    font-family: "Space Grotesk", sans-serif;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.35;
    letter-spacing: 0;
    text-transform: none;
    cursor: pointer
}

body.page-dashboard-atleta .dash-modulo-permissao input {
    width: 16px;
    height: 16px;
    margin: 0;
    accent-color: var(--metro-red)
}

body.page-dashboard-atleta .dash-modulos-admin-acoes {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 24px
}

body.page-dashboard-atleta .dash-modulos-vazio {
    padding: 16px;
    border: 1px dashed var(--metro-border);
    border-radius: 14px;
    text-align: center
}

body.page-dashboard-atleta .dash-permissoes-modal .dash-prontuario-modal-dialog {
    width: min(660px, 100%);
    height: min(760px, calc(100vh - 40px))
}

body.page-dashboard-atleta .dash-permissoes-conteudo {
    display: block;
    min-height: 0;
    padding: 18px;
    overflow: auto;
    background: #f7f7f8
}

body.page-dashboard-atleta .dash-permissoes-card {
    width: 100%;
    min-height: 100%;
    padding: 24px;
    border: 1px solid var(--metro-border);
    border-radius: 24px;
    background: #fff;
    box-shadow: 0 10px 25px rgba(0, 0, 0, .04)
}

body.page-dashboard-atleta .dash-permissoes-pagina-cabecalho {
    margin-bottom: 24px;
    padding: 0;
    background: #fff
}

body.page-dashboard-atleta .dash-permissoes-pagina-cabecalho .page-breadcrumb {
    margin-bottom: 16px;
    color: var(--metro-muted);
    font-family: "Space Grotesk", sans-serif;
    font-size: 13px;
    font-weight: 400;
    letter-spacing: 0;
    text-transform: none
}

body.page-dashboard-atleta .dash-permissoes-pagina-cabecalho .page-breadcrumb strong {
    color: var(--metro-text);
    font-weight: 700
}

body.page-dashboard-atleta .dash-permissoes-pagina-cabecalho h1 {
    max-width: none;
    margin: 0 0 4px;
    color: var(--portal-heading-title-color, #111);
    font-family: "Space Grotesk", sans-serif;
    font-size: var(--portal-heading-title-size, 22px);
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: 0;
    text-align: left;
    text-transform: none
}

body.page-dashboard-atleta .dash-permissoes-pagina-cabecalho p {
    max-width: 560px;
    margin: 0;
    color: var(--portal-heading-copy-color, #777);
    font-family: "Space Grotesk", sans-serif;
    font-size: var(--portal-heading-copy-size, 13px);
    font-weight: 400;
    line-height: var(--portal-heading-line-height, 1.5);
    letter-spacing: 0;
    text-transform: none
}

body.page-dashboard-atleta .dash-permissoes-lista {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    align-content: start;
    gap: 8px;
    overflow: visible
}

body.page-dashboard-atleta .dash-permissoes-profissional {
    display: flex;
    min-width: 0;
    min-height: 142px;
    width: 100%;
    padding: 8px 6px;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    gap: 5px;
    border: 1px solid #d9d9df;
    border-radius: 12px;
    background: #fff;
    color: #333;
    font: 600 10px/1.2 "Space Grotesk", sans-serif;
    letter-spacing: 0;
    text-transform: uppercase;
    text-align: center;
    cursor: pointer
}

body.page-dashboard-atleta .dash-permissoes-profissional:hover,
body.page-dashboard-atleta .dash-permissoes-profissional.is-active {
    border-color: rgba(224, 32, 32, .35);
    background: rgba(224, 32, 32, .06);
    color: var(--metro-red)
}

body.page-dashboard-atleta .dash-permissoes-profissional-foto {
    display: block;
    width: 68px;
    height: 68px;
    overflow: hidden;
    border: 1px solid #dedee3;
    border-radius: 50%;
    background: #f4f4f5
}

body.page-dashboard-atleta .dash-permissoes-profissional-foto img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center 8%
}

body.page-dashboard-atleta .dash-pessoa-perfil-foto {
    width: 96px;
    height: 96px;
    margin: 0 auto 14px;
}

body.page-dashboard-atleta .dash-permissoes-profissional strong {
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

body.page-dashboard-atleta .dash-permissoes-profissional-cargo {
    max-width: 100%;
    overflow: hidden;
    color: var(--metro-muted);
    font: 500 9px/1.2 "Space Grotesk", sans-serif;
    letter-spacing: 0;
    text-overflow: ellipsis;
    text-transform: none;
    white-space: nowrap
}

body.page-dashboard-atleta .dash-permissoes-editor {
    overflow: auto;
    background: #fff
}

body.page-dashboard-atleta .dash-permissoes-editor-modal .dash-prontuario-modal-dialog {
    width: min(660px, 100%);
    height: auto;
    max-height: calc(100vh - 40px)
}

body.page-dashboard-atleta .dash-permissoes-editor-conteudo {
    min-height: 0;
    margin: 18px;
    padding: 24px;
    overflow: auto;
    border: 1px solid var(--metro-border);
    border-radius: 24px;
    background: #fff;
    box-shadow: 0 10px 25px rgba(0, 0, 0, .04)
}

body.page-dashboard-atleta .dash-permissoes-editor-conteudo>.page-breadcrumb {
    margin-bottom: 18px;
    color: var(--metro-muted);
    font-size: 13px
}

body.page-dashboard-atleta .dash-permissoes-instrucao {
    margin: 0 0 16px;
    color: var(--metro-muted);
    font-size: 13px;
    line-height: 1.5
}

body.page-dashboard-atleta .dash-permissoes-profissional-selecionado {
    display: grid;
    gap: 3px;
    margin-bottom: 16px
}

body.page-dashboard-atleta .dash-permissoes-profissional-selecionado span {
    color: var(--metro-muted);
    font-family: "Space Grotesk", sans-serif;
    font-size: 11px;
    font-weight: 500;
    letter-spacing: 0;
    text-transform: none
}

body.page-dashboard-atleta .dash-permissoes-profissional-selecionado strong {
    color: var(--metro-text);
    font-family: "Space Grotesk", sans-serif;
    font-size: 16px;
    font-weight: 700;
    line-height: 1.3;
    letter-spacing: 0;
    text-transform: none
}

body.dash-prontuario-modal-open {
    overflow: hidden
}

body.page-dashboard-atleta .dash-prontuario-modal {
    position: fixed;
    z-index: 1500;
    inset: 0;
    display: none;
    padding: 20px;
    background: rgba(18, 18, 20, .68);
    backdrop-filter: blur(5px)
}

body.page-dashboard-atleta .dash-prontuario-modal.is-open {
    display: grid;
    place-items: center
}

body.page-dashboard-atleta .dash-prontuario-modal-dialog {
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    width: min(660px, 100%);
    height: min(900px, calc(100vh - 40px));
    overflow: hidden;
    border-radius: 24px;
    background: #f7f7f8;
    box-shadow: 0 28px 80px rgba(0, 0, 0, .3)
}

/* Somente o modal central aberto pelos botões do Módulo de funções. */
body.page-dashboard-atleta #funcoes-modal .dash-prontuario-modal-dialog,
body.page-dashboard-atleta #prontuario-modal .dash-prontuario-modal-dialog {
    width: min(850px, 100%)
}

body.page-dashboard-atleta .dash-prontuario-modal-dialog>header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 18px 22px;
    border-bottom: 1px solid var(--metro-border);
    background: #fff
}

body.page-dashboard-atleta .dash-prontuario-modal-dialog>header span {
    color: var(--metro-red);
    font-size: 9px;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase
}

body.page-dashboard-atleta .dash-prontuario-modal-dialog>header h2 {
    margin: 3px 0 0;
    font-size: 18px
}

body.page-dashboard-atleta .dash-prontuario-modal-dialog>header button {
    display: grid;
    width: 38px;
    height: 38px;
    min-height: 0;
    padding: 0;
    place-items: center;
    border: 1px solid var(--metro-border);
    border-radius: 50%;
    background: #fff;
    color: var(--metro-text);
    font-size: 25px;
    cursor: pointer
}

body.page-dashboard-atleta .dash-prontuario-modal iframe {
    width: 100%;
    height: 100%;
    border: 0;
    background: #f7f7f8
}

html.dashboard-staff-embed,
html.dashboard-staff-embed body {
    min-height: 100%;
    background: #f7f7f8
}

html.dashboard-staff-embed body {
    padding: 0
}

html.dashboard-staff-embed body .page {
    display: block;
    width: 100%;
    max-width: none;
    padding: 18px
}

html.dashboard-staff-embed body #profile-card-container,
html.dashboard-staff-embed body #footer-container {
    display: none
}

html.dashboard-staff-embed body .form-wrapper,
html.dashboard-staff-embed body .scout-card,
html.dashboard-staff-embed body .reports-card,
html.dashboard-staff-embed body .cadastros-content,
html.dashboard-staff-embed body .programacao-card,
html.dashboard-staff-embed body .planner-column,
html.dashboard-staff-embed body .analysis-wrapper,
html.dashboard-staff-embed body .agenda-card,
html.dashboard-staff-embed body .biblioteca-content,
html.dashboard-staff-embed body .financeiro-content,
html.dashboard-staff-embed body .ouvidoria-wrapper {
    width: 100%;
    max-width: none
}

html.dashboard-staff-embed body .form-card {
    width: 100%;
    max-width: none;
    margin: 0
}

/* Financeiro do atleta — piloto com dados fictícios. */
body.page-financeiro {
    min-height: 100vh;
    margin: 0;
    padding: 28px 16px;
    background: #f7f7f8;
    color: var(--metro-text);
    font-family: "Space Grotesk", sans-serif
}

body.page-financeiro * {
    box-sizing: border-box
}

body.page-financeiro .page {
    display: grid;
    grid-template-columns: 420px minmax(0, 1fr);
    align-items: start;
    gap: 40px;
    width: 100%;
    max-width: 1120px;
    margin: 0 auto
}

body.page-financeiro .financeiro-content {
    min-width: 0
}

body.page-financeiro .financeiro-card {
    padding: 24px;
    border: 1px solid var(--metro-border);
    border-radius: 28px;
    background: #fff;
    box-shadow: 0 14px 35px rgba(0, 0, 0, .06)
}

body.page-financeiro .financeiro-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 24px;
    margin: 22px 0
}

body.page-financeiro .financeiro-responsavel {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    margin: 0 0 18px;
    padding: 13px 16px;
    border: 1px solid var(--metro-border);
    background: #fafafa
}

body.page-financeiro .financeiro-responsavel[hidden] {
    display: none
}

body.page-financeiro .financeiro-responsavel span {
    color: var(--metro-muted);
    font-size: 11px;
    font-weight: 700;
    text-transform: uppercase
}

body.page-financeiro .financeiro-responsavel strong {
    font-size: 14px;
    text-align: right
}

body.page-financeiro .financeiro-header h1 {
    margin: 4px 0 6px;
    font-size: 26px
}

body.page-financeiro .financeiro-eyebrow {
    color: var(--metro-red);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase
}

body.page-financeiro .financeiro-atleta {
    display: grid;
    flex: 0 0 auto;
    gap: 3px;
    min-width: 170px;
    padding: 13px 16px;
    border: 1px solid rgba(224, 32, 32, .25);
    border-radius: 16px;
    background: #fffafa
}

body.page-financeiro .financeiro-atleta span {
    color: var(--metro-muted);
    font-size: 10px
}

body.page-financeiro .financeiro-atleta strong {
    font-size: 14px
}

body.page-financeiro .financeiro-aviso {
    margin-bottom: 18px;
    padding: 12px 15px;
    border: 1px dashed rgba(224, 32, 32, .35);
    border-radius: 14px;
    background: #fffafa;
    color: #744;
    font-size: 11px;
    line-height: 1.45
}

body.page-financeiro .financeiro-tabela-wrapper {
    overflow-x: auto;
    border: 1px solid var(--metro-border);
    border-radius: 0
}

body.page-financeiro .financeiro-tabela-wrapper.is-loading {
    visibility: hidden
}

body.page-financeiro .financeiro-processamento {
    position: fixed;
    z-index: 1500;
    inset: 0;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 20px;
    background: rgba(247, 247, 248, .94);
    backdrop-filter: blur(4px)
}

body.page-financeiro .financeiro-processamento.is-visible {
    display: flex
}

body.page-financeiro .financeiro-processamento-card {
    display: grid;
    justify-items: center;
    gap: 10px;
    width: min(360px, 100%);
    padding: 28px 24px;
    border: 1px solid var(--metro-border);
    border-radius: 20px;
    background: #fff;
    box-shadow: 0 18px 46px rgba(0, 0, 0, .12);
    text-align: center
}

body.page-financeiro .financeiro-processamento-card strong {
    font-size: 18px
}

body.page-financeiro .financeiro-processamento-card span {
    color: var(--metro-muted);
    font-size: 13px;
    line-height: 1.45
}

body.page-financeiro .financeiro-processamento-spinner {
    width: 44px;
    height: 44px;
    border: 4px solid #f3d4d4;
    border-top-color: var(--metro-red);
    border-radius: 50%;
    animation: financeiro-processamento-giro .8s linear infinite
}

@keyframes financeiro-processamento-giro {
    to { transform: rotate(360deg) }
}

body.page-financeiro .financeiro-tabela {
    width: 100%;
    min-width: 0;
    table-layout: fixed;
    border-collapse: collapse;
    font-size: 11.5px
}

body.page-financeiro .financeiro-tabela th:nth-child(1),
body.page-financeiro .financeiro-tabela td:nth-child(1) { width: 15% }
body.page-financeiro .financeiro-tabela th:nth-child(2),
body.page-financeiro .financeiro-tabela td:nth-child(2) { width: 15% }
body.page-financeiro .financeiro-tabela th:nth-child(3),
body.page-financeiro .financeiro-tabela td:nth-child(3) { width: 16% }
body.page-financeiro .financeiro-tabela th:nth-child(4),
body.page-financeiro .financeiro-tabela td:nth-child(4) { width: 16% }
body.page-financeiro .financeiro-tabela th:nth-child(5),
body.page-financeiro .financeiro-tabela td:nth-child(5) { width: 19% }
body.page-financeiro .financeiro-tabela th:nth-child(6),
body.page-financeiro .financeiro-tabela td:nth-child(6) { width: 19% }

body.page-financeiro .financeiro-tabela th,
body.page-financeiro .financeiro-tabela td {
    padding: 9px 1px;
    border-bottom: 1px solid var(--metro-border);
    text-align: center;
    white-space: nowrap
}

body.page-financeiro .financeiro-tabela th {
    background: #f7f7f8;
    color: var(--metro-muted);
    font-size: 9.5px;
    letter-spacing: .035em;
    text-transform: uppercase
}

body.page-financeiro .financeiro-tabela tbody tr:last-child td {
    border-bottom: 0
}

body.page-financeiro .financeiro-status {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    min-width: 82px;
    max-width: 100%;
    min-height: 28px;
    padding: 5px 6px;
    border-radius: 999px;
    font-size: 11.5px;
    font-weight: 700;
    line-height: 1;
    white-space: nowrap;
    text-transform: uppercase
}

body.page-financeiro .financeiro-status.is-pago {
    background: #e8f5ec;
    color: #237a3b
}

body.page-financeiro .financeiro-status.is-pendente {
    background: #fff5d9;
    color: #8a6511
}

body.page-financeiro .financeiro-status.is-vencido {
    background: #fdeaea;
    color: #b42318
}

body.page-financeiro .financeiro-status.is-futuro {
    background: #edf1f7;
    color: #536176
}

body.page-financeiro .financeiro-status.is-neutro {
    background: #f0f0f1;
    color: #666
}

body.page-financeiro .financeiro-tabela .financeiro-erro td {
    padding: 28px 12px;
    color: #b42318;
    text-align: center;
    white-space: normal
}

body.page-financeiro .financeiro-fatura {
    text-align: center
}

body.page-financeiro .financeiro-fatura a {
    display: inline-flex;
    padding: 6px 9px;
    border-radius: 999px;
    background: var(--metro-red);
    color: #fff;
    font-size: 11.5px;
    font-weight: 700;
    text-decoration: none
}

@media (max-width: 760px) {
    body.page-financeiro {
        padding: 16px 10px
    }

    body.page-financeiro .page {
        grid-template-columns: 1fr
    }

    body.page-financeiro #profile-card-container {
        width: min(420px, 100%);
        margin: 0 auto
    }

    body.page-financeiro .financeiro-card {
        padding: 18px;
        border-radius: 20px
    }

    body.page-financeiro .financeiro-header {
        display: grid
    }

    body.page-financeiro .financeiro-atleta {
        width: 100%
    }

}

html.dashboard-staff-embed body.page-financeiro {
    padding: 0
}

html.dashboard-staff-embed body.page-financeiro .page {
    display: block;
    width: 100%;
    max-width: none;
    padding: 18px
}

body.page-financeiro-staff .financeiro-staff-acoes {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
    margin-bottom: 18px
}

body.page-financeiro-staff .btn-submit {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: none;
    border-radius: 999px;
    padding: 10px 18px;
    background: var(--metro-red);
    color: #fff;
    font: 700 12px "Space Grotesk", sans-serif;
    text-decoration: none;
    white-space: nowrap;
    cursor: pointer;
    transition: .15s
}

body.page-financeiro-staff .btn-submit:hover {
    transform: translateY(-1px);
    box-shadow: 0 10px 25px rgba(224, 32, 32, .3)
}

body.page-financeiro-staff .btn-submit:disabled {
    opacity: .6;
    cursor: default;
    transform: none;
    box-shadow: none
}

body.page-financeiro-staff .btn-submit-small {
    padding: 7px 12px;
    font-size: 11px
}

body.page-financeiro-staff .btn-submit-outline {
    background: #fff;
    color: var(--metro-red);
    border: 1px solid rgba(224, 32, 32, .35)
}

body.page-financeiro-staff .dash-servico-label {
    display: block;
    margin-bottom: 6px;
    color: var(--metro-muted);
    font-size: 12px;
    font-weight: 600
}

body.page-financeiro-staff .dash-servico-status {
    min-height: 18px;
    margin: 8px 0 0;
    color: var(--metro-muted);
    font-size: 12px
}

body.page-financeiro-staff #anualTabelaWrapper {
    margin-bottom: 22px
}

body.page-financeiro-staff .financeiro-tabela-anual {
    width: 100%;
    min-width: 560px;
    border-collapse: collapse;
    font-size: 11.5px
}

body.page-financeiro-staff .financeiro-tabela-anual th,
body.page-financeiro-staff .financeiro-tabela-anual td {
    padding: 8px 5px;
    border-bottom: 1px solid var(--metro-border);
    text-align: right;
    white-space: nowrap
}

body.page-financeiro-staff .financeiro-tabela-anual th:first-child,
body.page-financeiro-staff .financeiro-tabela-anual td:first-child {
    text-align: left
}

body.page-financeiro-staff .financeiro-tabela-anual th {
    background: #f7f7f8;
    color: var(--metro-muted);
    font-size: 10px;
    letter-spacing: .03em;
    text-transform: uppercase
}

body.page-financeiro-staff .financeiro-tabela-anual tbody tr:last-child td {
    border-bottom: 0
}

body.page-financeiro-staff .financeiro-tabela-anual-total td {
    border-top: 2px solid var(--metro-border);
    border-bottom: 0;
    background: #fafafa;
    color: var(--metro-text);
    font-weight: 700
}

body.page-financeiro-staff .financeiro-tabela-anual td.valor-total-cor {
    color: #1d5fbf
}

body.page-financeiro-staff .financeiro-tabela-anual td.valor-pago-cor {
    color: #237a3b
}

body.page-financeiro-staff .financeiro-tabela-anual td.valor-avencer-cor {
    color: #8a6511
}

body.page-financeiro-staff .financeiro-tabela-anual td.valor-aberto-cor {
    color: #b42318
}

body.page-financeiro-staff .dash-subtitulo {
    margin: 0 0 10px;
    color: var(--metro-muted);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase
}

body.page-financeiro-staff .financeiro-staff-inadimplentes[hidden] {
    display: none
}

body.page-financeiro-staff #financeiroStaffNegativados {
    padding-top: 16px
}

body.page-financeiro-staff .financeiro-staff-boletos[hidden],
body.page-financeiro-staff .financeiro-tabela-wrapper[hidden],
body.page-financeiro-staff .financeiro-boletos-envio[hidden] {
    display: none
}

body.page-financeiro-staff .financeiro-staff-boletos {
    padding-top: 16px;
    font-size: 11.5px
}

body.page-financeiro-staff .financeiro-staff-boletos * {
    font-size: 11.5px
}

body.page-financeiro-staff .financeiro-boletos-filtros {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) max-content;
    align-items: end;
    gap: 14px;
    margin-bottom: 20px
}

body.page-financeiro-staff .financeiro-boletos-filtros label {
    display: grid;
    gap: 7px;
    color: var(--metro-muted);
    font-size: 11.5px;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase
}

body.page-financeiro-staff .financeiro-boletos-filtros select {
    min-height: 42px;
    padding: 8px 12px;
    border: 1px solid var(--metro-border);
    border-radius: 12px;
    background: #fff;
    color: var(--metro-text);
    font: 500 11.5px "Space Grotesk", sans-serif
}

body.page-financeiro-staff .financeiro-tabela-boletos {
    display: block;
    width: 100%;
    font-size: 11.5px
}

body.page-financeiro-staff #boletosCategoriaTabelaWrapper {
    overflow: visible
}

body.page-financeiro-staff .financeiro-tabela-boletos thead {
    display: none
}

body.page-financeiro-staff .financeiro-tabela-boletos tbody {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
    gap: 12px
}

body.page-financeiro-staff .financeiro-tabela-boletos tr {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 13px 8px;
    padding: 16px;
    border: 1px solid var(--metro-border);
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 5px 16px rgba(0, 0, 0, .035)
}

body.page-financeiro-staff .financeiro-tabela-boletos td {
    display: grid;
    align-content: start;
    gap: 4px;
    width: auto !important;
    padding: 0;
    border: 0;
    text-align: left;
    min-width: 0
}

body.page-financeiro-staff .financeiro-tabela-boletos td::before {
    content: attr(data-label);
    color: var(--metro-muted);
    font-size: 11.5px;
    font-weight: 700;
    letter-spacing: .045em;
    text-transform: uppercase
}

body.page-financeiro-staff .financeiro-tabela-boletos td:first-child,
body.page-financeiro-staff .financeiro-tabela-boletos td:last-child {
    grid-column: 1 / -1
}

body.page-financeiro-staff .financeiro-tabela-boletos td:first-child small {
    color: var(--metro-text);
    font-size: 11.5px;
    font-weight: 700;
    line-height: 1.3;
    overflow-wrap: anywhere
}

body.page-financeiro-staff .financeiro-fatura-acoes {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    gap: 5px
}

body.page-financeiro-staff .financeiro-fatura-acoes .btn-submit,
body.page-financeiro-staff .financeiro-fatura-acoes a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    flex: 0 0 140px;
    width: 140px;
    min-height: 34px;
    padding: 7px 10px;
    font-size: 11.5px;
    line-height: 1;
    text-align: center
}

body.page-financeiro-staff .financeiro-boletos-envio {
    display: grid;
    justify-items: center;
    gap: 10px;
    padding-top: 22px
}

@media (max-width: 760px) {
    body.page-financeiro-staff .financeiro-boletos-filtros {
        grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) max-content;
        gap: 8px
    }

    body.page-financeiro-staff .financeiro-tabela-boletos tbody {
        grid-template-columns: 1fr
    }

    body.page-financeiro-staff .financeiro-tabela-boletos tr {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }
}

body.page-financeiro-staff .financeiro-tabela-inadimplentes {
    width: 100%;
    border-collapse: collapse;
    font-size: 11.5px
}

body.page-financeiro-staff .financeiro-tabela-inadimplentes th,
body.page-financeiro-staff .financeiro-tabela-inadimplentes td {
    padding: 10px 12px;
    border-bottom: 1px solid var(--metro-border);
    text-align: left
}

body.page-financeiro-staff .financeiro-tabela-inadimplentes th {
    background: #f7f7f8;
    color: var(--metro-muted);
    font-size: 10px;
    letter-spacing: .03em;
    text-transform: uppercase
}

body.page-financeiro-staff .financeiro-tabela-inadimplentes tbody tr:last-child td {
    border-bottom: 0
}

body.page-financeiro-staff .financeiro-tabela-inadimplentes td:last-child {
    text-align: right
}

body.page-dashboard-atleta .dash-card-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 16px
}

body.page-dashboard-atleta .dash-login-topbar {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px
}

body.page-dashboard-atleta .dash-admin-session-actions {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    margin: 0
}

body.page-dashboard-atleta .dash-admin-session-actions[hidden] {
    display: none
}

body.page-dashboard-atleta .dash-card-heading .dash-card-title {
    margin-bottom: 0
}

body.page-dashboard-atleta .dash-card-heading-actions {
    display: flex;
    align-items: center;
    gap: 14px
}

body.page-dashboard-atleta .dash-notification-button {
    position: relative;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    padding: 8px 16px;
    border: 1px solid #f2c84b;
    border-radius: 999px;
    background: #fff9e8;
    color: #181818;
    font: inherit;
    font-size: 12px;
    font-weight: 600;
    cursor: pointer;
    transition: .15s;
}
body.page-dashboard-atleta .dash-notification-button:hover {
    color: #181818;
    transform: translateY(-1px);
    box-shadow: 0 10px 25px rgba(242, 200, 75, .35);
}
body.page-dashboard-atleta .dash-notification-button.is-alerta {
    animation: dashNotificacaoPiscar 1.4s ease-in-out infinite;
}
@keyframes dashNotificacaoPiscar {
    0%, 100% { box-shadow: 0 0 0 0 rgba(226, 30, 37, .55); }
    50% { box-shadow: 0 0 0 9px rgba(226, 30, 37, 0); }
}
body.page-dashboard-atleta #notificacoesBadge {
    min-width: 22px; height: 22px; padding: 0 6px; border-radius: 11px; background: #e21e25;
    color: #fff; font-size: 12px; line-height: 22px; text-align: center;
}
body.page-dashboard-atleta .dash-notifications-modal {
    position: fixed; inset: 0; z-index: 1200; display: grid; place-items: center;
    padding: 20px; background: rgba(12, 12, 12, .58); opacity: 0; visibility: hidden;
    transition: opacity .18s ease, visibility .18s ease;
}
body.page-dashboard-atleta .dash-notifications-modal.is-open { opacity: 1; visibility: visible; }
body.page-dashboard-atleta .dash-notifications-dialog {
    width: min(680px, 100%); max-height: min(780px, calc(100vh - 40px)); overflow: hidden;
    border-radius: 24px; background: #fff; box-shadow: 0 24px 80px rgba(0,0,0,.22);
}
body.page-dashboard-atleta .dash-notifications-dialog > header {
    display: flex; align-items: center; justify-content: space-between; padding: 24px 26px 18px;
    border-bottom: 1px solid #eee;
}
body.page-dashboard-atleta .dash-notifications-eyebrow { color: #e21e25; font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .08em; }
body.page-dashboard-atleta .dash-notifications-dialog h2 { margin: 3px 0 0; font-size: 25px; }
body.page-dashboard-atleta #btnFecharNotificacoes { border: 0; background: transparent; font-size: 32px; cursor: pointer; }
body.page-dashboard-atleta .dash-notifications-toolbar { display: flex; gap: 8px; flex-wrap: wrap; padding: 15px 26px; border-bottom: 1px solid #eee; }
body.page-dashboard-atleta .dash-notifications-toolbar button { border: 1px solid #ddd; border-radius: 999px; padding: 8px 12px; background: #fff; font: inherit; font-size: 13px; font-weight: 700; cursor: pointer; }
body.page-dashboard-atleta .dash-notifications-toolbar button.is-active { border-color: #e21e25; background: #e21e25; color: #fff; }
body.page-dashboard-atleta #btnMarcarTodasLidas { margin-left: auto; color: #e21e25; }
body.page-dashboard-atleta .dash-notifications-list { max-height: 520px; overflow-y: auto; padding: 10px 26px 24px; }
body.page-dashboard-atleta .dash-notification-item { display: grid; grid-template-columns: 40px 1fr; gap: 13px; padding: 16px 4px; border-bottom: 1px solid #eee; cursor: pointer; }
body.page-dashboard-atleta .dash-notification-item.is-unread { background: linear-gradient(90deg, #fff5f5, transparent); }
body.page-dashboard-atleta .dash-notification-icon { display: grid; place-items: center; width: 38px; height: 38px; border-radius: 50%; background: #f2f2f2; }
body.page-dashboard-atleta .dash-notification-copy strong { display: block; margin-bottom: 4px; }
body.page-dashboard-atleta .dash-notification-copy p { margin: 0; color: #5d5d5d; line-height: 1.45; overflow-wrap: anywhere; }
body.page-dashboard-atleta .dash-notification-copy p strong { display: inline; margin: 0; color: inherit; }
body.page-dashboard-atleta .dash-notification-meta { display: flex; gap: 8px; margin-top: 7px; color: #8a8a8a; font-size: 12px; }
body.page-dashboard-atleta .dash-notifications-empty { padding: 48px 10px; color: #777; text-align: center; }

/* Dashboard do atleta — composição compacta inspirada no resumo semanal. */
body.page-dashboard-atleta .dash-main-card { max-width: 980px; margin: 0 auto; }
body.page-dashboard-atleta .dash-grid { gap: 0; }
body.page-dashboard-atleta .dash-grid > .dash-card:first-child {
    margin-bottom: 15px; padding: 32px 36px; border: 1px solid #e3e3e3; border-radius: 24px;
    box-shadow: 0 8px 30px rgba(0,0,0,.035);
}
body.page-dashboard-atleta .dash-grid > .dash-card:not(:first-child) {
    margin-bottom: 15px; padding: 0 28px; border: 1px solid #e3e3e3; border-radius: 20px;
    box-shadow: 0 6px 18px rgba(0,0,0,.025);
}
body.page-dashboard-atleta .dash-week-overview + .dash-card { border-radius: 20px; }
body.page-dashboard-atleta .dash-grid > .dash-card:last-child { margin-bottom: 21px; border-radius: 20px; }
body.page-dashboard-atleta .dash-card-cabecalho-colapsavel { min-height: 78px; }
body.page-dashboard-atleta .dash-card-toggle { min-height: 78px; }
body.page-dashboard-atleta .dash-card-indicador { font-size: 0; }
body.page-dashboard-atleta .dash-card-indicador::after {
    content: "";
    display: block;
    width: 14px;
    height: 14px;
    background-color: var(--metro-red);
    -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
    mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
    -webkit-mask-repeat: no-repeat;
    mask-repeat: no-repeat;
    -webkit-mask-position: center;
    mask-position: center;
    -webkit-mask-size: contain;
    mask-size: contain;
    transition: transform .15s ease;
}
body.page-dashboard-atleta .dash-card-toggle[aria-expanded="true"] .dash-card-indicador::after { transform: rotate(180deg); }
body.page-dashboard-atleta .dash-perfil-cabecalho { align-items: center; gap: 34px; }
body.page-dashboard-atleta .dash-avatar { width: 210px; height: 220px; flex: 0 0 210px; }
body.page-dashboard-atleta .dash-avatar img { width: 100%; height: 100%; object-fit: contain; object-position: center bottom; }
body.page-dashboard-atleta .dash-perfil-info { flex: 1; align-items: flex-start; }
body.page-dashboard-atleta .dash-perfil-info > strong { font-size: 16px; line-height: 1.25; text-transform: uppercase; }
body.page-dashboard-atleta .dash-perfil-apelido { margin-top: 7px; font-size: 12px; }
body.page-dashboard-atleta .dash-profile-summary { display: flex; margin-top: 25px; }
body.page-dashboard-atleta .dash-profile-summary > div { min-width: 135px; padding: 0 28px; border-left: 1px solid #ddd; }
body.page-dashboard-atleta .dash-profile-summary > div:first-child { padding-left: 0; border-left: 0; }
body.page-dashboard-atleta .dash-profile-summary strong { display: block; font-size: 14px; text-transform: uppercase; }
body.page-dashboard-atleta .dash-profile-summary span { display: block; margin-top: 7px; color: #777; font-size: 12px; }
body.page-dashboard-atleta .dash-profile-more { margin-top: 20px; padding: 0; border: 0; background: none; color: var(--metro-red); font: inherit; font-weight: 700; font-size: 12px; text-decoration: none; cursor: pointer; }
body.page-dashboard-atleta .dash-profile-full { margin-top: 24px; border-top: 1px solid #eee; padding-top: 12px; }
body.page-dashboard-atleta .dash-week-overview { grid-column: 1 / -1; margin-bottom: 20px; padding: 28px 32px; border: 1px solid #e3e3e3; border-radius: 20px; background: #fff; box-shadow: 0 8px 22px rgba(0,0,0,.035); }
body.page-dashboard-atleta .dash-week-overview > h2 { margin: 0 0 6px; font-size: 15px; font-weight: 700; }
body.page-dashboard-atleta .dash-next-activity { display: grid; grid-template-columns: 92px auto auto; column-gap: 16px; align-items: center; min-height: 106px; padding: 8px 18px; background: #fff; }
body.page-dashboard-atleta .dash-next-activity-weather { display: flex; flex-direction: column; align-items: center; gap: 8px; margin-left: 16px; }
body.page-dashboard-atleta .dash-next-activity-weather[hidden] { display: none; }
body.page-dashboard-atleta .dash-next-activity-weather-title { font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: #999; }
body.page-dashboard-atleta .dash-next-activity-weather-row { display: flex; gap: 22px; }
body.page-dashboard-atleta .dash-next-activity-weather-row span { display: flex; flex-direction: column; align-items: center; gap: 3px; }
body.page-dashboard-atleta .dash-next-activity-weather svg { width: 18px; height: 18px; fill: none; stroke: var(--metro-red); stroke-width: 1.6; }
body.page-dashboard-atleta .dash-next-activity-weather strong { font-size: 13px; font-weight: 700; white-space: nowrap; }
body.page-dashboard-atleta .dash-next-activity-weather small { font-size: 9.5px; font-weight: 600; letter-spacing: .03em; text-transform: uppercase; color: #999; white-space: nowrap; }
body.page-dashboard-atleta .dash-next-activity-symbol { display: grid; place-items: center; width: 68px; height: 68px; border-radius: 50%; background: #fff3f3; color: var(--metro-red); }
body.page-dashboard-atleta .dash-next-activity-symbol svg { width: 30px; height: 30px; fill: none; stroke: currentColor; stroke-width: 1.8; }
body.page-dashboard-atleta .dash-next-activity-copy > span { color: var(--metro-red); font-size: 11px; font-weight: 700; text-transform: uppercase; }
body.page-dashboard-atleta .dash-next-activity-copy strong { display: block; margin: 5px 0; font-size: 16px; }
body.page-dashboard-atleta .dash-next-activity-copy p { display: flex; flex-direction: column; align-items: flex-start; gap: 6px; margin: 7px 0 0; color: #666; font-size: 12px; }
body.page-dashboard-atleta .dash-next-activity-copy p span { display: inline-flex; align-items: center; gap: 6px; }
body.page-dashboard-atleta .dash-next-activity-copy p svg { width: 15px; height: 15px; fill: none; stroke: currentColor; stroke-width: 1.8; }
body.page-dashboard-atleta .dash-week-metrics { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; margin: 12px 0 28px; border-top: 1px solid #e8e8e8; border-bottom: 1px solid #e8e8e8; }
body.page-dashboard-atleta .dash-week-metrics article { position: relative; min-height: 112px; padding: 22px 28px; border-right: 1px solid #e8e8e8; }
body.page-dashboard-atleta .dash-week-metrics article:last-child { border-right: 0; }
body.page-dashboard-atleta .dash-week-metrics span { display: block; font-size: 12px; }
body.page-dashboard-atleta .dash-week-metrics strong { display: block; margin: 10px 0 3px; font-size: 20px; }
body.page-dashboard-atleta .dash-week-metrics small { color: #777; font-size: 11px; }
body.page-dashboard-atleta .dash-week-metrics span.dash-metric-value { display: flex; align-items: center; gap: 8px; margin: 10px 0 3px; }
body.page-dashboard-atleta .dash-metric-value strong { margin: 0; }
body.page-dashboard-atleta .dash-week-metrics i { position: static; width: 10px; height: 10px; flex: 0 0 10px; border-radius: 50%; }
body.page-dashboard-atleta .dash-week-metrics .is-ok { background: #22b52b; }
body.page-dashboard-atleta .dash-week-metrics .is-alert { background: var(--metro-red); }
body.page-dashboard-atleta .dash-metric-frequencia .dash-metric-value { justify-content: space-between; margin-top: 8px; }
body.page-dashboard-atleta .dash-frequencia-ring circle { fill: none; stroke-width: 4; }
body.page-dashboard-atleta .dash-frequencia-ring-bg { stroke: #f4d9d7; }
body.page-dashboard-atleta .dash-frequencia-ring-value { stroke: var(--metro-red); stroke-linecap: round; transform: rotate(-90deg); transform-origin: 20px 20px; transition: stroke-dashoffset .4s ease; }
body.page-dashboard-atleta .dash-upcoming-block h3 { margin: 0 0 16px; font-size: 15px; }

body.page-dashboard-atleta .dash-calendar-scroll { overflow-x: auto; border: 1px solid #e3e3e3; border-radius: 16px; }
body.page-dashboard-atleta .dash-calendar-grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); background: #fff; }
body.page-dashboard-atleta .dash-calendar-grid > p { grid-column: 1 / -1; padding: 22px; color: #777; }
body.page-dashboard-atleta .dash-cal-daycell { padding: 12px 6px; border-right: 1px solid #eee; border-bottom: 1px solid #eee; text-align: center; font-size: 12px; font-weight: 700; text-transform: uppercase; color: #333; }
body.page-dashboard-atleta .dash-cal-cell { display: flex; flex-direction: column; gap: 6px; min-height: 60px; padding: 8px 6px; border-right: 1px solid #eee; }
body.page-dashboard-atleta .dash-calendar-grid > *:nth-child(7n) { border-right: 0; }

body.page-dashboard-atleta .dash-cal-event { display: flex; flex-direction: column; gap: 4px; width: 100%; padding: 8px 10px; border: 0; border-radius: 10px; font: inherit; font-size: 11px; line-height: 1.3; text-align: left; appearance: none; cursor: pointer; transition: filter .15s ease; }
body.page-dashboard-atleta .dash-cal-event:hover, body.page-dashboard-atleta .dash-cal-event:focus-visible { filter: brightness(0.97); }
body.page-dashboard-atleta .dash-cal-event-top { display: flex; align-items: center; gap: 6px; }
body.page-dashboard-atleta .dash-cal-event svg { width: 14px; height: 14px; flex: 0 0 14px; fill: none; stroke-width: 1.8; }
body.page-dashboard-atleta .dash-cal-event strong { font-size: 12px; font-weight: 700; }
body.page-dashboard-atleta .dash-cal-event.is-treino { background: #fdeceb; border-left: 3px solid var(--metro-red); color: #333; }
body.page-dashboard-atleta .dash-cal-event.is-treino svg { stroke: var(--metro-red); }
body.page-dashboard-atleta .dash-cal-event.is-atendimento { background: #f0f0f3; border-left: 3px solid #a9a9b3; color: #333; }
body.page-dashboard-atleta .dash-cal-event.is-atendimento svg { stroke: #8a8a90; }
body.page-dashboard-atleta .dash-cal-event.is-jogo { background: var(--metro-red); border-left: 3px solid #9c1616; color: #fff; }
body.page-dashboard-atleta .dash-cal-event.is-jogo svg { stroke: #fff; }
body.page-dashboard-atleta .dash-cal-event.is-jogo strong { text-transform: uppercase; }

body.page-dashboard-atleta .dash-calendar-legend { display: flex; flex-wrap: wrap; justify-content: center; gap: 20px; margin-top: 16px; font-size: 12px; color: #555; }
body.page-dashboard-atleta .dash-calendar-legend span { display: inline-flex; align-items: center; gap: 8px; }
body.page-dashboard-atleta .dash-legend-dot { width: 12px; height: 12px; border-radius: 3px; }
body.page-dashboard-atleta .dash-legend-dot.is-treino { background: #fdeceb; border: 1px solid var(--metro-red); }
body.page-dashboard-atleta .dash-legend-dot.is-atendimento { background: #f0f0f3; border: 1px solid #a9a9b3; }
body.page-dashboard-atleta .dash-legend-dot.is-jogo { background: var(--metro-red); }
body.page-dashboard-atleta .dash-week-alert { grid-column: 1 / -1; display: grid; grid-template-columns: 55px 1fr auto; gap: 18px; align-items: center; margin-bottom: 15px; padding: 20px 26px; border: 1px solid #f2c84b; border-radius: 18px; background: #fff9e8; }
body.page-dashboard-atleta .dash-week-alert[hidden] { display: none; }
body.page-dashboard-atleta .dash-week-alert-symbol { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 10px; background: #f4bd37; color: #111; }
body.page-dashboard-atleta .dash-week-alert-symbol svg { width: 24px; height: 24px; fill: none; stroke: currentColor; stroke-width: 1.8; }
body.page-dashboard-atleta .dash-week-alert strong { font-size: 14px; }
body.page-dashboard-atleta .dash-week-alert p { font-size: 12px; }
body.page-dashboard-atleta .dash-week-alert p { margin: 5px 0 0; }
body.page-dashboard-atleta .dash-week-alert button { border: 0; background: transparent; color: var(--metro-red); font: inherit; font-weight: 700; font-size: 12px; text-decoration: none; cursor: pointer; }
@media (max-width: 720px) {
    body.page-dashboard-atleta .dash-grid > .dash-card:first-child { padding: 22px 18px; }
    body.page-dashboard-atleta .dash-perfil-cabecalho { align-items: flex-start; gap: 16px; }
    body.page-dashboard-atleta .dash-avatar { width: 112px; height: 145px; flex-basis: 112px; }
    body.page-dashboard-atleta .dash-perfil-info > strong { font-size: 16px; }
    body.page-dashboard-atleta .dash-profile-summary { flex-wrap: wrap; gap: 12px; margin-top: 15px; }
    body.page-dashboard-atleta .dash-profile-summary > div { min-width: 72px; padding: 0 10px; }
    body.page-dashboard-atleta .dash-profile-summary strong { font-size: 14px; }
    body.page-dashboard-atleta .dash-profile-summary span { font-size: 11px; }
    body.page-dashboard-atleta .dash-week-metrics { gap: 8px; }
    body.page-dashboard-atleta .dash-week-overview { padding: 22px 16px; }
    body.page-dashboard-atleta .dash-week-metrics article { min-height: 100px; padding: 16px 13px; }
    body.page-dashboard-atleta .dash-week-metrics strong { font-size: 20px; }
    body.page-dashboard-atleta .dash-next-activity { grid-template-columns: 60px 1fr; padding: 20px 18px; }
    body.page-dashboard-atleta .dash-next-activity-symbol { width: 48px; height: 48px; }
    body.page-dashboard-atleta .dash-next-activity-weather { grid-column: 1 / -1; align-items: center; margin-top: 10px; margin-left: 0; padding: 10px 0 0; border-top: 1px solid #eee; }
    body.page-dashboard-atleta .dash-next-activity-weather-row { justify-content: space-around; width: 100%; }
    body.page-dashboard-atleta .dash-week-alert { grid-template-columns: 44px 1fr; }
    body.page-dashboard-atleta .dash-week-alert button { grid-column: 2; justify-self: start; }
}
@media (max-width: 640px) {
    body.page-dashboard-atleta .dash-card-heading-actions { flex-wrap: wrap; }
    body.page-dashboard-atleta .dash-notifications-modal { padding: 0; align-items: end; }
    body.page-dashboard-atleta .dash-notifications-dialog { max-height: 88vh; border-radius: 24px 24px 0 0; }
    body.page-dashboard-atleta #btnMarcarTodasLidas { width: 100%; margin-left: 0; }
}

body.page-dashboard-atleta .dash-admin-lista {
    display: flex;
    flex-direction: column;
    gap: 14px;
    margin-top: 20px
}

body.page-dashboard-atleta .dash-admin-lista-itens {
    display: flex;
    flex-direction: column;
    gap: 6px;
    max-height: 320px;
    padding: 8px;
    border: 1px solid #e1e1e1;
    border-radius: 14px;
    overflow-y: auto
}

body.page-dashboard-atleta .dash-admin-atleta-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 10px 12px;
    border: 0;
    border-radius: 10px;
    background: transparent;
    color: inherit;
    font: inherit;
    text-align: left;
    cursor: pointer;
    transition: background-color .15s ease
}

body.page-dashboard-atleta .dash-admin-atleta-item:hover {
    background: #f5f5f5
}

body.page-dashboard-atleta .dash-admin-atleta-item strong {
    color: var(--metro-text);
    font-size: 14px;
    font-weight: 600
}

body.page-dashboard-atleta .dash-admin-atleta-item small {
    color: var(--metro-muted);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .03em;
    text-transform: uppercase
}

body.page-dashboard-atleta .dash-login-card {
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 22px;
    border-color: rgba(0, 0, 0, .06);
    border-radius: 24px;
    box-shadow: 0 10px 25px rgba(0, 0, 0, .05)
}

body.page-dashboard-atleta .dash-title {
    font-size: 22px;
    font-weight: 700;
    margin-top: 14px
}

body.page-dashboard-atleta .dash-subtitle {
    color: var(--metro-muted);
    font-size: 14px;
    margin: 6px 0 20px
}

body.page-dashboard-atleta .dash-login-form {
    display: flex;
    flex-direction: column;
    gap: 16px
}

body.page-dashboard-atleta [hidden] {
    display: none !important
}

body.page-dashboard-atleta .btn-login-secondary {
    align-self: center;
    border: 0;
    background: transparent;
    color: var(--metro-muted);
    cursor: pointer;
    font: inherit;
    text-decoration: underline
}

body.page-dashboard-atleta .modal.dash-otp-phone-modal {
    width: 90%;
    max-width: 550px;
    padding: 24px 28px;
    border: 0;
    border-radius: 24px;
    color: var(--metro-text);
    font-family: inherit;
    text-align: center
}

body.page-dashboard-atleta .dash-otp-phone-modal .modal-title::before {
    content: none
}

body.page-dashboard-atleta .dash-otp-phone-modal .modal-title {
    margin-bottom: 10px;
    color: var(--metro-text);
    font-size: 18px;
    font-weight: 700;
    line-height: 1.3
}

body.page-dashboard-atleta .dash-otp-phone-modal .modal-text {
    font-size: 14px;
    line-height: 1.4;
    color: var(--metro-muted)
}

body.page-dashboard-atleta .dash-otp-phone-list {
    display: grid;
    gap: 10px;
    margin: 18px 0;
    text-align: left
}

body.page-dashboard-atleta .dash-otp-phone-option {
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: 0;
    gap: 12px;
    padding: 12px 16px;
    border: 1px solid #e1e1e1;
    border-radius: 14px;
    background: #fff;
    cursor: pointer;
    transition: border-color .15s ease, background-color .15s ease, transform .15s ease
}

body.page-dashboard-atleta .dash-otp-phone-option:hover {
    border-color: #c8c8c8;
    transform: none
}

body.page-dashboard-atleta .dash-otp-phone-option:has(input:checked) {
    border-color: var(--metro-red);
    background: #fff7f7;
    box-shadow: 0 0 0 1px rgba(224, 32, 32, .08)
}

body.page-dashboard-atleta .dash-otp-phone-option span {
    display: grid;
    flex: 1;
    gap: 3px;
    min-width: 0;
    text-align: left
}

body.page-dashboard-atleta .dash-otp-phone-option small {
    color: var(--metro-muted);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .03em;
    line-height: 1.2;
    text-transform: uppercase
}

body.page-dashboard-atleta .dash-otp-phone-option strong {
    color: var(--metro-text);
    font-size: 14px;
    font-weight: 600;
    line-height: 1.25;
    white-space: nowrap
}

body.page-dashboard-atleta .dash-otp-phone-option input[type="radio"] {
    flex: 0 0 18px;
    width: 18px;
    height: 18px;
    margin: 0;
    accent-color: var(--metro-red);
    cursor: pointer
}

body.page-dashboard-atleta .dash-otp-phone-actions {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-top: 18px
}

body.page-dashboard-atleta .dash-otp-phone-actions .btn-login-secondary {
    padding: 10px 12px;
    font-size: 13px;
    text-decoration: none
}

body.page-dashboard-atleta .dash-otp-phone-actions .btn-submit {
    min-width: 150px;
    padding: 10px 24px
}

@media (max-width: 520px) {
    body.page-dashboard-atleta .modal.dash-otp-phone-modal {
        width: 90%;
        padding: 24px 20px
    }

    body.page-dashboard-atleta .dash-otp-phone-actions {
        align-items: stretch;
        flex-direction: column-reverse;
        gap: 6px
    }

    body.page-dashboard-atleta .dash-otp-phone-actions .btn-submit {
        width: 100%
    }
}

body.page-dashboard-atleta .field-group {
    display: flex;
    flex-direction: column;
    gap: 6px
}

/* O atributo "hidden" perde para qualquer "display" definido por seletor de
   classe (regra de autor sempre vence a regra padrão do navegador para
   [hidden]) — sem isso, campos escondidos via JS (ex.: gerenciamento-pessoas.js
   alternando grupoPessoaCategoria) continuam visíveis. Mesmo bug já corrigido
   para body.page-prontuario. */
body.page-dashboard-atleta .field-group[hidden] {
    display: none
}

body.page-dashboard-atleta .field-label {
    font-size: 13px;
    font-weight: 500
}

body.page-dashboard-atleta input[type="text"] {
    width: 100%;
    border-radius: 999px;
    border: 1px solid #d5d5d5;
    padding: 10px 16px;
    font-size: 14px;
    outline: none;
    background: #fff;
    color: var(--metro-text)
}

body.page-dashboard-atleta input[type="text"]:focus {
    border-color: var(--metro-red);
    box-shadow: 0 0 0 1px rgba(224, 32, 32, .08)
}

body.page-dashboard-atleta .btn-submit {
    border: none;
    border-radius: 999px;
    padding: 12px 20px;
    background: var(--metro-red);
    color: #fff;
    font-weight: 600;
    cursor: pointer;
    transition: .15s
}

body.page-dashboard-atleta .btn-submit:hover {
    transform: translateY(-1px);
    box-shadow: 0 10px 25px rgba(224, 32, 32, .35)
}

body.page-dashboard-atleta .dash-status-select,
body.page-dashboard-atleta .dash-status-textarea {
    width: 100%;
    border: 1px solid #d5d5d5;
    padding: 10px 16px;
    font-size: 14px;
    outline: none;
    background: #fff;
    color: var(--metro-text);
    font-family: inherit;
}

body.page-dashboard-atleta .dash-status-select {
    border-radius: 999px;
}

body.page-dashboard-atleta .dash-status-textarea {
    border-radius: 16px;
    resize: vertical;
}

body.page-dashboard-atleta .dash-status-select:focus,
body.page-dashboard-atleta .dash-status-textarea:focus {
    border-color: var(--metro-red);
    box-shadow: 0 0 0 1px rgba(224, 32, 32, .08)
}

body.page-dashboard-atleta .dash-status-obs-contador {
    display: block;
    margin-top: 4px;
    color: var(--metro-muted);
    font-size: 11px;
    text-align: right;
}

body.page-dashboard-atleta #status-atleta-modal .field-group {
    text-align: left;
    margin-top: 14px;
}

body.page-dashboard-atleta .dash-status-atleta-acoes {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    margin-top: 18px;
}

body.page-dashboard-atleta .dash-status-atleta-lista {
    margin-top: 20px;
}

body.page-dashboard-atleta .dash-status-filtros-linha {
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
}

body.page-dashboard-atleta .dash-status-filtros-linha .field-group {
    flex: 1 1 160px;
    min-width: 0;
}

/* Tag de status (módulo Gerenciamento de pessoas): pílula colorida por
   significado, reaproveitada no cartão da lista e no modal de perfil.
   ATIVO=verde, DESISTIU=roxo, DM=azul, DISPENSADO/INATIVO=vermelho. */
body.page-dashboard-atleta .dash-status-tag {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    max-width: max-content;
    padding: 3px 10px;
    border: 1px solid transparent;
    border-radius: 999px;
    font: 700 9px/1.4 "Space Grotesk", sans-serif;
    letter-spacing: .02em;
    text-transform: uppercase;
    white-space: nowrap;
}

/* Variante usada no modal de perfil ("Status atual"), no mesmo tamanho de
   fonte das demais linhas (.dash-linha) — a versão compacta (9px) continua
   sendo usada no cartão da lista, onde o espaço é menor. */
body.page-dashboard-atleta .dash-status-tag--grande {
    padding: 4px 12px;
    font-size: 13px;
}

body.page-dashboard-atleta .dash-status-tag--ativo {
    background: #eaf7ec;
    border-color: #a9dab0;
    color: #2f7d38;
}

body.page-dashboard-atleta .dash-status-tag--desistiu {
    background: #f3ecfc;
    border-color: #d3b8f0;
    color: #7132b5;
}

body.page-dashboard-atleta .dash-status-tag--dm {
    background: #eaf2ff;
    border-color: #b6d0ff;
    color: #1d5fd8;
}

body.page-dashboard-atleta .dash-status-tag--dispensado,
body.page-dashboard-atleta .dash-status-tag--inativo {
    background: #fdecea;
    border-color: #f2b3ab;
    color: #c8342a;
}

body.page-dashboard-atleta .btn-submit:disabled {
    opacity: .6;
    cursor: default;
    transform: none;
    box-shadow: none
}

body.page-dashboard-atleta .btn-submit-small {
    padding: 8px 16px;
    font-size: 12px
}

body.page-dashboard-atleta .dash-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px
}

body.page-dashboard-atleta .dash-header-title {
    font-size: 22px;
    font-weight: 700
}

body.page-dashboard-atleta .dash-header-sub {
    color: var(--metro-muted);
    font-size: 13px;
    margin-top: 2px
}

body.page-dashboard-atleta .dash-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px
}

body.page-dashboard-atleta .dash-card-wide {
    grid-column: 1 / -1
}

body.page-dashboard-atleta .dash-perfil-cabecalho {
    display: flex;
    align-items: center;
    gap: 14px;
    margin-bottom: 16px
}

body.page-dashboard-atleta .dash-avatar {
    width: 109px;
    height: 145px;
    border-radius: 20px;
    background: #f7f7f8;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-weight: 700;
    font-size: 18px;
    flex: 0 0 auto;
    overflow: hidden
}

body.page-dashboard-atleta .dash-avatar img {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: contain;
    object-position: center
}

body.page-dashboard-atleta .dash-perfil-info {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0
}

body.page-dashboard-atleta .dash-perfil-info strong {
    font-size: 16px
}

body.page-dashboard-atleta .dash-perfil-apelido {
    color: var(--metro-muted);
    font-size: 12px
}

body.page-dashboard-atleta .dash-perfil-detalhes,
body.page-dashboard-atleta .dash-dados-conteudo {
    display: flex;
    flex-direction: column;
    gap: 2px
}

body.page-dashboard-atleta .dash-perfil-imc {
    margin-top: 4px;
    padding-top: 12px;
    border-top: 1px solid var(--metro-border)
}

body.page-dashboard-atleta .imc-chart-summary {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 22px;
    font-size: 13px
}

body.page-dashboard-atleta .imc-chart-summary strong {
    font-size: 14px
}

body.page-dashboard-atleta .imc-scale {
    position: relative;
    width: 100%;
    height: 10px;
    border-radius: 999px;
    background: linear-gradient(90deg, #62a8df 0 21.43%, #4eb878 21.43% 52.38%, #f2b84b 52.38% 76.19%, #df5b55 76.19% 100%);
    box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .08)
}

body.page-dashboard-atleta .imc-marker {
    position: absolute;
    top: 0;
    width: 0;
    height: 0;
    background: transparent;
    transform: translateX(-50%);
    z-index: 1
}

body.page-dashboard-atleta .imc-marker span {
    position: absolute;
    top: 5px;
    left: 50%;
    padding: 2px 7px;
    border-radius: 999px;
    background: #111;
    color: #fff;
    font-size: 10px;
    font-weight: 700;
    line-height: 1.4;
    transform: translate(-50%, -50%);
    white-space: nowrap
}

body.page-dashboard-atleta .imc-range-labels {
    display: grid;
    grid-template-columns: 21.43fr 30.95fr 23.81fr 23.81fr;
    margin-top: 8px;
    color: var(--metro-muted);
    font-size: 9px;
    font-weight: 600;
    line-height: 1.2;
    text-align: center
}

body.page-dashboard-atleta .dash-perfil-ultimo-login {
    margin-top: 16px;
    padding-top: 12px;
    border-top: 1px solid var(--metro-border);
    color: var(--metro-muted);
    font-size: 11px;
    text-align: center
}

body.page-dashboard-atleta .dash-dados-bloco {
    overflow: hidden;
    border: 1px solid var(--metro-border);
    border-radius: 16px;
    background: #fff
}

body.page-dashboard-atleta .dash-dados-cabecalho {
    width: 100%;
    min-height: 52px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 8px 10px 8px 16px;
    border: 0;
    background: #fff;
    color: var(--metro-text);
    font-family: inherit;
    text-align: left
}

body.page-dashboard-atleta .dash-dados-toggle {
    min-width: 0;
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 6px 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none !important;
    filter: none;
    transform: none;
    appearance: none;
    -webkit-appearance: none;
    color: inherit;
    font-family: inherit;
    text-align: left;
    cursor: pointer
}

body.page-dashboard-atleta .dash-dados-toggle:hover,
body.page-dashboard-atleta .dash-dados-toggle:focus,
body.page-dashboard-atleta .dash-dados-toggle:focus-visible,
body.page-dashboard-atleta .dash-dados-toggle:active {
    outline: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none !important;
    filter: none;
    transform: none
}

body.page-dashboard-atleta .dash-documento-upload {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    opacity: 0;
    pointer-events: none
}

body.page-dashboard-atleta .dash-documento-atual {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-right: 10px;
    color: var(--metro-muted);
    font-size: 12px
}

body.page-dashboard-atleta .dash-documento-atual a {
    color: var(--metro-red);
    font-weight: 700;
    text-decoration: none
}

body.page-dashboard-atleta .dash-documento-seletor {
    display: inline-flex;
    align-items: center;
    padding: 8px 12px;
    border: 1px solid var(--metro-border);
    border-radius: 999px;
    background: #fff;
    color: var(--metro-text);
    font: 700 11px/1 "Space Grotesk", sans-serif;
    cursor: pointer
}

body.page-dashboard-atleta .dash-documento-selecionado {
    display: block;
    margin-top: 6px;
    color: var(--metro-muted);
    font-size: 11px
}

body.page-dashboard-atleta .dash-documento-acoes {
    display: inline-flex;
    align-items: center;
    gap: 8px
}

body.page-dashboard-atleta .dash-documento-visualizar,
body.page-dashboard-atleta .dash-documento-remover {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 32px;
    padding: 7px 12px;
    border-radius: 999px;
    font: 700 11px/1 "Space Grotesk", sans-serif;
    text-decoration: none;
    cursor: pointer
}

body.page-dashboard-atleta .dash-documento-visualizar {
    border: 1px solid var(--metro-border);
    background: #fff;
    color: var(--metro-text)
}

body.page-dashboard-atleta .dash-documento-remover {
    border: 1px solid rgba(224, 32, 32, .35);
    background: #fff;
    color: var(--metro-red)
}

body.page-dashboard-atleta .dash-documento-remover:disabled {
    opacity: .55;
    cursor: default
}

body.page-dashboard-atleta .dash-dados-cabecalho:hover {
    background: #fafafa
}

body.page-dashboard-atleta .dash-dados-cabecalho .dash-subtitulo {
    margin: 0
}

body.page-dashboard-atleta .dash-dados-indicador {
    width: 28px;
    height: 28px;
    flex: 0 0 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #f1f1f3;
    color: var(--metro-red);
    font-size: 20px;
    font-weight: 700;
    line-height: 1
}

body.page-dashboard-atleta .dash-dados-editar {
    flex: 0 0 auto;
    padding: 8px 13px;
    border: 1px solid #dedee2;
    border-radius: 999px;
    background: #fff;
    color: #66666b;
    font: 700 11px/1 "Space Grotesk", sans-serif;
    cursor: pointer
}

body.page-dashboard-atleta .dash-dados-editar:hover,
body.page-dashboard-atleta .dash-dados-editar[data-editando="true"] {
    border-color: var(--metro-red);
    color: var(--metro-red)
}

body.page-dashboard-atleta .dash-linha-valor.is-editing {
    min-width: 90px;
    padding: 4px 7px;
    border-radius: 7px;
    outline: 1px solid rgba(224, 32, 32, .35);
    background: #fff
}

body.page-dashboard-atleta .dash-dados-conteudo {
    padding: 12px 16px 14px;
    border-top: 1px solid #f0f0f0
}

body.page-dashboard-atleta .dash-dados-conteudo[hidden] {
    display: none
}

body.page-dashboard-atleta .dash-linha {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    padding: 8px 0;
    border-bottom: 1px solid #f0f0f0;
    font-size: 13px
}

body.page-dashboard-atleta .dash-linha-dupla {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 16px;
    border-bottom: 1px solid #f0f0f0
}

body.page-dashboard-atleta .dash-linha-dupla .dash-linha {
    min-width: 0;
    border-bottom: 0
}

body.page-dashboard-atleta .dash-linha-dupla .dash-linha-rotulo,
body.page-dashboard-atleta .dash-linha-dupla .dash-linha-valor {
    min-width: 0;
    overflow-wrap: anywhere
}

body.page-dashboard-atleta .dash-linha:last-child {
    border-bottom: none
}

body.page-dashboard-atleta .dash-linha-rotulo {
    color: var(--metro-muted)
}

body.page-dashboard-atleta .dash-linha-valor {
    color: var(--metro-text);
    font-weight: 400;
    text-align: right
}

body.page-dashboard-atleta .dash-linha-valor-email {
    color: #1d63e0
}

body.page-dashboard-atleta .dash-linha-valor-report {
    color: var(--metro-red)
}

body.page-dashboard-atleta .dash-empty {
    color: var(--metro-muted);
    font-size: 13px;
    padding: 14px 0
}

body.page-dashboard-atleta .dash-scout-frequencia {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 14px;
    border: 1px solid var(--metro-border);
    border-radius: 14px;
    margin-bottom: 14px;
    font-size: 13px
}

body.page-dashboard-atleta .dash-scout-resumo {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 8px;
    margin-bottom: 14px
}

body.page-dashboard-atleta .dash-frequencia-resumo {
    margin-bottom: 0
}

body.page-dashboard-atleta .dash-frequencia-tabela-wrapper {
    overflow-x: auto;
    border: 1px solid var(--metro-border);
    border-radius: 14px;
    margin-bottom: 14px
}

body.page-dashboard-atleta .dash-frequencia-tabela {
    width: 100%;
    min-width: 360px;
    border-collapse: collapse;
    font-size: 12px
}

body.page-dashboard-atleta .dash-frequencia-tabela th,
body.page-dashboard-atleta .dash-frequencia-tabela td {
    padding: 9px 8px;
    border-bottom: 1px solid var(--metro-border);
    text-align: center;
    white-space: nowrap
}

body.page-dashboard-atleta .dash-frequencia-tabela th:first-child,
body.page-dashboard-atleta .dash-frequencia-tabela td:first-child {
    text-align: left
}

body.page-dashboard-atleta .dash-frequencia-tabela th {
    background: #f7f7f8;
    color: var(--metro-muted);
    font-size: 9.5px;
    letter-spacing: .035em;
    text-transform: uppercase
}

body.page-dashboard-atleta .dash-frequencia-tabela tbody tr:last-child td {
    border-bottom: none
}

body.page-dashboard-atleta .dash-frequencia-tabela tfoot td {
    padding: 9px 8px;
    border-top: 2px solid var(--metro-border);
    text-align: center;
    font-weight: 700;
    white-space: nowrap
}

body.page-dashboard-atleta .dash-frequencia-tabela tfoot td:first-child {
    text-align: left
}

body.page-dashboard-atleta .dash-frequencia-vazio {
    padding: 14px;
    color: var(--metro-muted);
    font-size: 12.5px;
    text-align: center
}

body.page-dashboard-atleta .dash-scout-quadro {
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    padding: 13px 7px;
    border: 1px solid var(--metro-border);
    border-radius: 14px;
    background: #fff;
    text-align: center
}

body.page-dashboard-atleta .dash-scout-quadro strong {
    color: var(--metro-red);
    font-size: 20px;
    line-height: 1
}

body.page-dashboard-atleta .dash-scout-quadro span {
    color: var(--metro-muted);
    font-size: 10px;
    font-weight: 700
}

body.page-dashboard-atleta .dash-badge-em-breve {
    background: #f1e9fb;
    color: #6b3fa0;
    border-radius: 999px;
    padding: 3px 10px;
    font-size: 11px;
    font-weight: 700
}

body.page-dashboard-atleta .dash-scout-lista {
    display: flex;
    flex-direction: column;
    gap: 10px
}

body.page-dashboard-atleta .dash-scout-item {
    display: flex;
    flex-direction: column;
    border: 1px solid var(--metro-border);
    border-radius: 14px;
    padding: 12px 14px 16px
}

body.page-dashboard-atleta .dash-scout-item-meta {
    order: 1;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 8px
}

body.page-dashboard-atleta .dash-scout-item-meta span {
    background: #ffe0e0;
    color: #a61b1b;
    border-radius: 999px;
    padding: 4px 10px;
    font-size: 11px;
    font-weight: 700
}

body.page-dashboard-atleta .dash-scout-item-stats {
    order: 3;
    display: flex;
    flex-wrap: wrap;
    gap: 6px
}

body.page-dashboard-atleta .dash-scout-item-stats span {
    background: #ececef;
    color: #606065;
    border-radius: 999px;
    padding: 4px 10px;
    font-size: 11px;
    font-weight: 600
}

body.page-dashboard-atleta .dash-scout-item-localizacao {
    order: 2;
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 8px
}

body.page-dashboard-atleta .dash-scout-item-localizacao span {
    background: #fff0a8;
    color: #6f5700;
    border-radius: 999px;
    padding: 4px 10px;
    font-size: 11px;
    font-weight: 700
}

body.page-dashboard-atleta .dash-avaliacoes-bloco+.dash-avaliacoes-bloco {
    margin-top: 18px
}

body.page-dashboard-atleta .dash-subtitulo {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: var(--metro-muted);
    margin-bottom: 8px
}

body.page-dashboard-atleta .dash-avaliacoes-lista {
    display: flex;
    flex-direction: column;
    gap: 8px
}

body.page-dashboard-atleta .dash-avaliacoes-item {
    display: flex;
    flex-direction: column;
    gap: 2px;
    border: 1px solid var(--metro-border);
    border-radius: 12px;
    padding: 10px 12px;
    font-size: 13px
}

body.page-dashboard-atleta .dash-avaliacoes-item span {
    color: var(--metro-muted);
    font-size: 12px
}

body.page-dashboard-atleta .dash-prontuario-tiles {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 12px
}

body.page-dashboard-atleta .dash-prontuario-tile {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    border: 1px solid var(--metro-border);
    border-radius: 16px;
    padding: 16px 10px;
    background: #fff;
    cursor: pointer;
    transition: .15s;
    font-family: inherit
}

body.page-dashboard-atleta .dash-prontuario-tile:hover {
    border-color: var(--metro-red);
    box-shadow: 0 8px 20px rgba(224, 32, 32, .12);
    transform: translateY(-1px)
}

body.page-dashboard-atleta .dash-prontuario-tile strong {
    font-size: 22px;
    color: var(--metro-red)
}

body.page-dashboard-atleta .dash-prontuario-tile span {
    font-size: 12px;
    color: var(--metro-muted);
    text-align: center
}

body.page-dashboard-atleta .dash-dados-atleta {
    display: flex;
    flex-direction: column;
    gap: 12px
}

body.page-dashboard-atleta .dash-servico-form {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 10px;
    align-items: end
}

body.page-dashboard-atleta .dash-servico-label {
    grid-column: 1 / -1;
    color: var(--metro-muted);
    font-size: 12px;
    font-weight: 600
}

body.page-dashboard-atleta .dash-servico-campo-largo {
    grid-column: 1 / -1
}

body.page-dashboard-atleta .dash-servico-campo {
    display: flex;
    flex-direction: column;
    gap: 6px
}

body.page-dashboard-atleta .dash-servico-campo[hidden] {
    display: none
}

body.page-dashboard-atleta .dash-servico-select {
    width: 100%;
    min-height: 42px;
    padding: 9px 14px;
    border: 1px solid #d5d5d5;
    border-radius: 999px;
    background: #fff;
    color: var(--metro-text);
    font: 400 13px "Space Grotesk", sans-serif
}

body.page-dashboard-atleta .dash-servico-ajuda {
    margin: -6px 0 14px;
    color: var(--metro-muted);
    font-size: 12px
}

body.page-dashboard-atleta .dash-especialidades {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 14px
}

body.page-dashboard-atleta .dash-especialidade {
    position: relative
}

body.page-dashboard-atleta .dash-especialidade input {
    position: absolute;
    opacity: 0;
    pointer-events: none
}

body.page-dashboard-atleta .dash-especialidade span {
    display: inline-flex;
    padding: 8px 13px;
    border: 1px solid #dedee2;
    border-radius: 999px;
    color: #606065;
    font-size: 12px;
    cursor: pointer
}

body.page-dashboard-atleta .dash-especialidade input:checked+span {
    border-color: var(--metro-red);
    background: #ffe0e0;
    color: #a61b1b
}

body.page-dashboard-atleta .dash-servico-status {
    min-height: 18px;
    margin-top: 10px;
    color: var(--metro-muted);
    font-size: 12px
}

body.page-dashboard-atleta .modal-backdrop {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, .35);
    display: none;
    align-items: center;
    justify-content: center;
    z-index: 999
}

/* Confirmações e alertas das permissões devem ficar acima do editor administrativo. */
body.page-dashboard-atleta #permissoes-feedback-modal {
    z-index: 2500;
    padding: 20px;
    background: rgba(18, 18, 20, .72);
    backdrop-filter: blur(5px)
}

body.page-dashboard-atleta .modal {
    background: #fff;
    border-radius: 24px;
    padding: 24px 28px;
    max-width: 550px;
    width: 90%;
    box-shadow: 0 18px 45px rgba(0, 0, 0, .18);
    text-align: center
}

body.page-dashboard-atleta .modal-title {
    font-size: 18px;
    font-weight: 700;
    margin-bottom: 10px
}

body.page-dashboard-atleta .modal-text {
    font-size: 14px;
    color: var(--metro-muted)
}

body.page-dashboard-atleta .btn-modal {
    margin-top: 18px;
    padding: 10px 24px;
    border-radius: 999px;
    border: none;
    background: var(--metro-red);
    color: #fff;
    font-weight: 600;
    cursor: pointer
}

/* Cadastro público por convite individual */
body.page-cadastro-atleta-publico {
    min-height: 100vh;
    background: #f5f5f6
}

body.page-cadastro-atleta-publico .cadastro-publico-page {
    display: block;
    width: min(660px, calc(100% - 32px));
    margin: 0 auto;
    padding: 32px 0 56px
}

body.page-cadastro-atleta-publico .cadastro-publico-card {
    padding: clamp(22px, 4vw, 42px);
    border: 1px solid var(--metro-border);
    border-radius: 28px;
    background: #fff;
    box-shadow: 0 18px 44px rgba(0, 0, 0, .08)
}

body.page-cadastro-atleta-publico .cadastro-publico-header {
    display: flex;
    align-items: center;
    gap: 20px;
    margin-bottom: 30px;
    padding-bottom: 24px;
    border-bottom: 1px solid var(--metro-border)
}

body.page-cadastro-atleta-publico .cadastro-publico-header>div {
    min-width: 0
}

body.page-cadastro-atleta-publico .cadastro-publico-header img {
    width: 76px;
    height: 76px;
    object-fit: contain
}

body.page-cadastro-atleta-publico .cadastro-publico-header h1 {
    margin: 5px 0 8px;
    font-size: clamp(16px, 3vw, 32px);
    line-height: 1.1;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}

body.page-cadastro-atleta-publico .cadastro-publico-header p,
body.page-cadastro-atleta-publico .cadastro-atleta-intro {
    margin: 0;
    color: var(--metro-muted);
    line-height: 1.55
}

body.page-cadastro-atleta-publico .cadastro-publico-estado {
    padding: 24px;
    border: 1px solid var(--metro-border);
    border-radius: 18px;
    color: var(--metro-muted);
    text-align: center
}

body.page-cadastro-atleta-publico .cadastro-publico-estado.is-erro {
    border-color: rgba(224, 32, 32, .35);
    background: rgba(224, 32, 32, .05);
    color: var(--metro-red)
}

body.page-cadastro-atleta-publico .cadastro-publico-estado.is-sucesso {
    color: #177245
}

body.page-cadastro-atleta-publico #form-CADASTRO_ATLETAS {
    margin: 0
}

body.page-cadastro-atleta-publico .cadastro-publico-ajuda,
body.page-gestao-avaliacoes .cadastro-convite-validade {
    display: block;
    margin-top: 7px;
    color: var(--metro-muted);
    font-size: 12px
}

body.page-cadastro-atleta-publico .modal-backdrop {
    z-index: 3000
}

@media (max-width: 640px) {
    body.page-cadastro-atleta-publico .cadastro-publico-header {
        align-items: flex-start
    }

    body.page-cadastro-atleta-publico .cadastro-publico-header img {
        width: 58px;
        height: 58px
    }
}

body.page-dashboard-atleta .dash-detail-modal {
    max-width: 640px;
    text-align: left
}

body.page-dashboard-atleta .dash-detail-list {
    max-height: 50vh;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin: 4px 0
}

body.page-dashboard-atleta .dash-detail-item {
    border: 1px solid var(--metro-border);
    border-radius: 14px;
    padding: 12px 14px
}

body.page-dashboard-atleta .dash-detail-item-topo {
    display: flex;
    justify-content: space-between;
    font-size: 13px;
    margin-bottom: 6px
}

body.page-dashboard-atleta .dash-detail-item-topo span {
    color: var(--metro-muted)
}

body.page-dashboard-atleta .dash-detail-item-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 6px
}

body.page-dashboard-atleta .dash-detail-item-tags span {
    background: #ececef;
    color: #606065;
    border-radius: 999px;
    padding: 3px 9px;
    font-size: 11px;
    font-weight: 600
}

body.page-dashboard-atleta .dash-detail-item-descricao {
    font-size: 13px;
    line-height: 1.5;
    color: var(--metro-text)
}

body.page-dashboard-atleta .dash-detail-item-anexo {
    display: inline-block;
    margin-top: 8px;
    font-size: 11px;
    color: var(--metro-muted)
}

body.page-dashboard-atleta .dash-evento-modal { max-width: 420px; text-align: left; }
body.page-dashboard-atleta .dash-evento-modal-badge { display: inline-block; margin-bottom: 10px; padding: 4px 12px; border-radius: 999px; font-size: 11px; font-weight: 700; text-transform: uppercase; }
body.page-dashboard-atleta .dash-evento-modal-badge.is-treino { background: #fdeceb; color: var(--metro-red); }
body.page-dashboard-atleta .dash-evento-modal-badge.is-atendimento { background: #f0f0f3; color: #6a6a72; }
body.page-dashboard-atleta .dash-evento-modal-badge.is-jogo { background: var(--metro-red); color: #fff; }
body.page-dashboard-atleta .dash-evento-modal .modal-title { margin-bottom: 16px; }
body.page-dashboard-atleta .dash-evento-modal-linha { display: flex; align-items: center; gap: 10px; margin-top: 10px; font-size: 13px; color: var(--metro-text); }
body.page-dashboard-atleta .dash-evento-modal-linha svg { width: 16px; height: 16px; flex: 0 0 16px; fill: none; stroke: var(--metro-red); stroke-width: 1.8; }
body.page-dashboard-atleta .dash-evento-modal .btn-modal { display: block; width: 50%; margin-left: auto; margin-right: auto; padding: 5px 12px; }

@media (max-width: 980px) {
    body.page-dashboard-atleta .page {
        grid-template-columns: 1fr
    }

    body.page-dashboard-atleta #profile-card-container {
        min-width: 0
    }
}

@media (max-width: 680px) {
    body.page-dashboard-atleta {
        padding: 20px 12px
    }

    body.page-dashboard-atleta .dash-servico-form {
        grid-template-columns: 1fr
    }

    body.page-dashboard-atleta .dash-servico-form .btn-submit {
        width: 100%
    }

    body.page-dashboard-atleta .dash-card {
        padding: 20px;
        border-radius: 20px
    }

    body.page-dashboard-atleta .dash-modulo-grupo-grid {
        grid-template-columns: 1fr
    }

    body.page-dashboard-atleta .dash-modulo-funcao {
        align-items: stretch;
        flex-direction: column
    }

    body.page-dashboard-atleta .dash-modulo-abrir {
        flex: 0 0 auto;
        width: 100%
    }

    body.page-dashboard-atleta .dash-modulos-admin-lista {
        grid-template-columns: 1fr
    }

    body.page-dashboard-atleta .dash-modulos-admin-acoes {
        align-items: stretch;
        flex-direction: column
    }

    body.page-dashboard-atleta .dash-modulos-admin-acoes .btn-submit {
        width: 100%
    }

    body.page-dashboard-atleta .dash-permissoes-conteudo {
        grid-template-columns: 1fr;
        overflow: auto
    }

    body.page-dashboard-atleta .dash-permissoes-profissionais {
        min-height: 280px;
        border-right: 0;
        border-bottom: 1px solid var(--metro-border)
    }

    body.page-dashboard-atleta .dash-permissoes-lista {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }

    body.page-dashboard-atleta .dash-permissoes-editor {
        overflow: visible
    }

    body.page-dashboard-atleta .dash-prontuario-modal {
        padding: 0
    }

    body.page-dashboard-atleta .dash-prontuario-modal-dialog {
        width: 100%;
        height: 100vh;
        border-radius: 0
    }

    html.dashboard-staff-embed body .page {
        padding: 10px
    }

    body.page-dashboard-atleta .dash-main-card {
        padding: 14px;
        border-radius: 22px
    }

    body.page-dashboard-atleta .dash-avatar {
        width: 92px;
        height: 122px;
        border-radius: 18px
    }

    body.page-dashboard-atleta .dash-linha-dupla {
        grid-template-columns: 1fr;
        gap: 0
    }

    body.page-dashboard-atleta .dash-linha-dupla .dash-linha:first-child {
        border-bottom: 1px solid #f0f0f0
    }

    body.page-dashboard-atleta .dash-grid {
        grid-template-columns: 1fr
    }

    body.page-dashboard-atleta .dash-prontuario-tiles {
        grid-template-columns: repeat(2, minmax(0, 1fr))
    }

    body.page-dashboard-atleta .dash-dados-atleta {
        grid-template-columns: 1fr
    }

    body.page-dashboard-atleta .dash-header {
        flex-direction: column;
        align-items: flex-start;
        gap: 10px
    }
}