:root {
  color-scheme: dark;
  font-family: Inter, -apple-system, BlinkMacSystemFont,
    "Segoe UI", Arial, sans-serif;
  background: #080e19;
  color: #f4f7fb;
  font-synthesis: none;
}

* { box-sizing: border-box; }

body {
  margin: 0;
  min-height: 100vh;
  font-size: 14px;
}

button, input { font: inherit; }
button { cursor: pointer; }

button:disabled {
  opacity: .45;
  cursor: not-allowed;
}

:focus-visible {
  outline: 2px solid #30d9bd;
  outline-offset: 3px;
}

h1, h2, p { margin-top: 0; }

h1 { letter-spacing: -.045em; }

h2 { letter-spacing: -.025em; }

.brand {
  display: flex;
  gap: 12px;
  align-items: center;
  font-size: 21px;
  font-weight: 800;
  letter-spacing: .08em;
}

.brand-symbol, .card-icon {
  display: grid;
  place-items: center;
  background: linear-gradient(145deg, #36e4c0, #16a4c2);
  color: #082027;
  border-radius: 12px;
  font-weight: 900;
  letter-spacing: -.05em;
}

.brand-symbol {
  width: 42px;
  height: 42px;
  font-size: 16px;
}

.eyebrow {
  color: #37dcc0;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .15em;
}

.muted, .muted-small { color: #97a5b9; }
.muted-small { font-size: 12px; }

.button {
  min-height: 42px;
  padding: 10px 17px;
  border-radius: 9px;
  border: 1px solid transparent;
  font-weight: 700;
}

.button-primary {
  color: #082027;
  background: linear-gradient(125deg, #40edc2, #30c4d5);
}

.button-primary:hover { filter: brightness(1.07); }

.button-secondary {
  color: #dce6f5;
  border-color: #2b3b51;
  background: #172234;
}

.button-secondary:hover { background: #213148; }

.form-message {
  min-height: 20px;
  margin: 14px 0 0;
  color: #f4acac;
}

.login-body {
  background:
    radial-gradient(
      ellipse at 16% 48%,
      rgba(20, 172, 168, .13), transparent 45%
    ),
    #080e19;
}

.login-layout {
  min-height: 100vh;
  max-width: 1180px;
  margin: auto;
  padding: 50px 28px;
  display: grid;
  grid-template-columns: 1.05fr .95fr;
  align-items: center;
  gap: 80px;
}

.login-intro h1 {
  margin: 22px 0;
  max-width: 540px;
  font-size: clamp(40px, 5vw, 67px);
  line-height: 1.07;
}

.login-intro h1 span {
  display: block;
  color: #39e0be;
}

.intro-copy {
  max-width: 450px;
  color: #a4b1c3;
  font-size: 17px;
  line-height: 1.8;
}

.feature-line {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 40px;
  color: #b7c8d7;
}

.feature-dot {
  height: 9px;
  width: 9px;
  border-radius: 50%;
  background: #37e6a8;
}

.login-card {
  padding: 42px;
  border: 1px solid #28374c;
  border-radius: 19px;
  background: #111b2b;
  box-shadow: 0 24px 80px rgba(0, 0, 0, .22);
}

.card-icon {
  width: 50px;
  height: 50px;
  margin-bottom: 28px;
  font-size: 19px;
}

.login-card h2 { font-size: 28px; }

.login-card label {
  display: block;
  margin: 24px 0 9px;
  color: #d2dceb;
  font-weight: 650;
}

.login-card input {
  display: block;
  width: 100%;
  min-height: 48px;
  padding: 12px 14px;
  color: #f5f7fc;
  background: #0a1321;
  border: 1px solid #344259;
  border-radius: 9px;
}

.login-card input::placeholder { color: #738397; }

.login-card .button-primary {
  width: 100%;
  margin-top: 29px;
  min-height: 48px;
}

.login-footer {
  margin-top: 33px;
  padding-top: 22px;
  border-top: 1px solid #2b394e;
  color: #78889e;
  text-align: center;
  font-size: 12px;
}

.dashboard-layout {
  min-height: 100vh;
  display: grid;
  grid-template-columns: 240px minmax(0, 1fr);
}

.sidebar {
  min-height: 100vh;
  padding: 30px 20px;
  background: #0e1726;
  border-right: 1px solid #233148;
  display: flex;
  flex-direction: column;
}

.sidebar .brand { margin-bottom: 55px; }
.sidebar-label {
  padding-left: 12px;
  color: #78899e;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .12em;
}

.nav-link {
  display: block;
  padding: 13px;
  border-radius: 10px;
  color: #c2cfde;
  font-weight: 700;
}

.nav-link.active {
  color: #4af0c9;
  background: rgba(48, 217, 189, .12);
}

.sidebar-bottom {
  margin-top: auto;
  padding: 22px 8px 0;
}

.sidebar-bottom .button { width: 100%; }

.dashboard-main {
  min-width: 0;
  max-width: 1440px;
  width: 100%;
  margin: 0 auto;
  padding: 34px clamp(18px, 3vw, 48px);
}

.topbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 25px;
  margin-bottom: 29px;
}

.topbar h1 {
  margin-bottom: 0;
  font-size: 31px;
}

.user-badge {
  display: flex;
  align-items: center;
  gap: 12px;
}

.user-avatar {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  background: #223f47;
  color: #4be4c7;
  font-weight: 800;
}

.user-badge small {
  display: block;
  margin-top: 3px;
  color: #8c9eb4;
}

.welcome-banner {
  position: relative;
  display: flex;
  justify-content: space-between;
  overflow: hidden;
  min-height: 165px;
  padding: 29px 34px;
  border: 1px solid #256456;
  border-radius: 16px;
  background: linear-gradient(115deg, #143c42, #12243b);
}

.welcome-banner h2 {
  margin: 9px 0;
  font-size: 26px;
}

.welcome-banner p:last-child { color: #b5c9d2; }

.banner-decoration {
  align-self: center;
  color: rgba(62, 225, 192, .13);
  font-size: 105px;
  font-weight: 900;
  letter-spacing: -.1em;
}

.metrics {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 17px;
  margin: 22px 0;
}

.metric-card, .table-panel {
  border: 1px solid #26364b;
  border-radius: 13px;
  background: #111b2b;
}

.metric-card { padding: 22px 25px; }

.metric-card p {
  margin-bottom: 12px;
  color: #a5b4c7;
}

.metric-card strong {
  display: block;
  margin-bottom: 9px;
  font-size: 32px;
  letter-spacing: -.04em;
}

.metric-card span { color: #8798ad; }

.table-panel { padding: 24px; }

.section-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  margin-bottom: 18px;
}

.section-heading h2 {
  margin: 8px 0 0;
  font-size: 22px;
}

.table-scroll { overflow-x: auto; }

table {
  width: 100%;
  border-collapse: collapse;
  text-align: left;
}

th {
  padding: 15px;
  color: #95a6ba;
  background: #172337;
  font-size: 12px;
  font-weight: 700;
}

td {
  padding: 18px 15px;
  border-bottom: 1px solid #253449;
}

.empty-cell {
  padding: 35px;
  color: #8ea0b6;
  text-align: center;
}

.status-pill {
  display: inline-block;
  padding: 5px 10px;
  border-radius: 7px;
  background: #23324a;
  color: #c6d5e5;
  font-size: 12px;
  font-weight: 700;
}

.status-pill[data-status="ACTIVE"] {
  background: rgba(45, 212, 161, .13);
  color: #52e6b4;
}

.pagination {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 15px;
  padding-top: 22px;
  color: #9baabe;
}

.pagination-buttons {
  display: flex;
  gap: 9px;
}

.dashboard-footnote {
  margin-top: 25px;
  text-align: center;
  color: #728298;
  font-size: 12px;
}

@media (max-width: 800px) {
  .login-layout {
    grid-template-columns: 1fr;
    gap: 32px;
  }

  .login-intro h1 { font-size: 39px; }
  .login-card { padding: 28px; }

  .dashboard-layout { grid-template-columns: 1fr; }
  .sidebar { min-height: auto; padding: 20px; }
  .sidebar .brand { margin-bottom: 20px; }
  .sidebar-label, .sidebar nav { display: none; }
  .sidebar-bottom { margin-top: 0; padding: 15px 0 0; }

  .topbar { align-items: flex-start; }
  .user-badge { max-width: 160px; }

  .metrics { grid-template-columns: 1fr; }

  .welcome-banner { padding: 25px; }
  .banner-decoration { display: none; }
}

@media (max-width: 480px) {
  .login-layout { padding: 28px 18px; }

  .topbar, .section-heading, .pagination {
    align-items: flex-start;
    flex-direction: column;
  }

  .table-panel { padding: 15px; }
  .pagination-buttons { width: 100%; }
  .pagination-buttons button { flex: 1; }
}

/* CF_PLAYER_DASHBOARD_102 — estilos exclusivos da área autenticada */
.dashboard-body { background:radial-gradient(circle at 72% -10%,#122943 0,transparent 38%),#080e19; }
.dashboard-body .dashboard-main { max-width:1600px; }
.dashboard-body .nav-link { text-decoration:none; }
.dashboard-body .nav-link:hover { background:#1c3043; color:#fff; }
.premium-metrics { display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px;margin:20px 0; }
.premium-kpi { min-width:0;position:relative;padding:22px 21px 20px;border-radius:17px;overflow:hidden;border:1px solid #28425b;background:linear-gradient(145deg,#13263b,#101b2b); }
.premium-kpi::after { content:"";position:absolute;width:125px;height:125px;right:-48px;top:-49px;border-radius:50%;background:currentColor;opacity:.05; }
.premium-kpi-teal { color:#34e2bf;border-top:3px solid #34e2bf; }
.premium-kpi-blue { color:#84aaff;border-top:3px solid #679bfa; }
.premium-kpi-amber { color:#ffbf70;border-top:3px solid #ffbb60; }
.premium-kpi-purple { color:#c4a6ff;border-top:3px solid #ad85f6; }
.premium-kpi p { color:#a9bad1;font-size:13px;margin:12px 0 8px; }
.premium-kpi strong {display:block;overflow-wrap:anywhere;font-size:clamp(29px,3vw,39px);letter-spacing:-.06em;line-height:1.12;}
.premium-kpi small {display:block;margin-top:12px;font-size:11px;color:#869bb1;}
.premium-kpi-icon {display:grid;place-items:center;width:34px;height:34px;font-size:18px;border:1px solid currentColor;border-radius:10px;background:#0a1422;}
.premium-analytics {display:grid;grid-template-columns:1.07fr 1fr;gap:17px;margin-bottom:18px;}
.premium-panel {min-width:0;border:1px solid #28405b;background:#111d2e;border-radius:17px;padding:24px;}
.premium-heading {display:flex;justify-content:space-between;align-items:flex-start;gap:8px;}
.premium-heading h2 {font-size:21px;margin:8px 0 0;letter-spacing:-.03em;}
.premium-label {white-space:nowrap;font-size:10px;font-weight:700;color:#32e0bd;background:#173b3c;padding:7px 9px;border-radius:999px;}
.premium-donut-layout {display:grid;grid-template-columns:minmax(130px,190px) minmax(150px,1fr);gap:17px;align-items:center;margin:18px 0 8px;}
.premium-donut-wrap svg {display:block;width:100%;max-width:190px;}
.premium-donut-number {font-size:27px;font-weight:800;fill:#f2f7ff;}
.premium-donut-caption {font-size:10px;fill:#8da4bd;}
.premium-legend {display:grid;gap:13px;min-width:0;}
.premium-legend>div {display:flex;align-items:center;gap:8px;color:#b1c2d7;font-size:12px;}
.premium-legend b {margin-left:auto;font-size:15px;color:#fff;}
.premium-dot {display:inline-block;width:9px;height:9px;border-radius:50%;flex:none;}
.premium-teal {background:#32e0bd;}.premium-blue {background:#689aff;}.premium-amber {background:#ffbd65;}.premium-purple {background:#af8af7;}
.premium-hint {margin:18px 0 0;color:#8da3bb;font-size:12px;line-height:1.5;}
.premium-bars {display:grid;gap:24px;margin-top:32px;}
.premium-bar-label {display:flex;justify-content:space-between;color:#acbdd1;font-size:13px;margin-bottom:10px;}
.premium-bar-label b {color:#edf3fc;}
.premium-progress {display:block;width:100%;height:11px;overflow:hidden;border:0;border-radius:100px;background:#24344a;appearance:none;-webkit-appearance:none;}
.premium-progress::-webkit-progress-bar {background:#24344a;border-radius:100px;}
.premium-progress::-webkit-progress-value {background:var(--bar-color);border-radius:100px;}
.premium-progress::-moz-progress-bar {background:var(--bar-color);border-radius:100px;}
.premium-progress-teal {--bar-color:#32e0bd;}.premium-progress-blue {--bar-color:#689aff;}.premium-progress-amber {--bar-color:#ffbd65;}.premium-progress-purple {--bar-color:#af8af7;}
.premium-future {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px;margin-bottom:20px;}
.premium-future article {display:flex;align-items:center;gap:12px;min-width:0;padding:17px;background:linear-gradient(130deg,#172237,#111b2b);border:1px solid #27374c;border-radius:14px;}
.premium-future-icon {flex:none;color:#81adfc;font-size:23px;}
.premium-future h3 {font-size:14px;margin:0 0 5px;color:#eaf2fd;}
.premium-future p {font-size:11px;line-height:1.4;margin:0;color:#93a7bf;}
.premium-future b {margin-left:auto;color:#7388a1;font-size:23px;}
@media(max-width:1180px){.premium-metrics{grid-template-columns:repeat(2,minmax(0,1fr));}.premium-analytics{grid-template-columns:1fr;}}
@media(max-width:720px){.premium-future{grid-template-columns:1fr;}.premium-donut-layout{grid-template-columns:minmax(0,1fr);}.premium-donut-wrap svg{margin:auto;}.premium-heading h2{font-size:18px;}}
@media(max-width:480px){.premium-metrics{gap:10px;}.premium-kpi{padding:16px 13px;}.premium-kpi strong{font-size:28px;}.premium-kpi p{font-size:12px;}.premium-panel{padding:17px;}.premium-label{font-size:9px;}}

/* CF_PLAYER_CLIENTS_103B */
.cf-customer-toolbar{display:flex;flex-wrap:wrap;gap:9px;align-items:center}
.cf-customer-toolbar input{width:min(230px,45vw);padding:11px 12px;background:#0b1525;color:#e8f2ff;border:1px solid #36516d;border-radius:10px}
.cf-customer-toolbar .button{white-space:nowrap}
.cf-customer-dialog{width:min(92vw,680px);max-height:92vh;overflow:auto;background:#101d30;color:#eff7ff;border:1px solid #345474;border-radius:20px;padding:28px;box-shadow:0 22px 80px #0008}
.cf-customer-dialog::backdrop{background:#020814b8}
.cf-customer-dialog-top,.cf-customer-actions{display:flex;justify-content:space-between;align-items:center;gap:12px}
.cf-customer-dialog h2{margin:7px 0 20px;font-size:24px}
.cf-customer-fields{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.cf-customer-fields label{display:flex;flex-direction:column;gap:8px;color:#b5cbe3;font-size:12px;font-weight:650}
.cf-customer-fields input,.cf-customer-fields select,.cf-customer-fields textarea{width:100%;box-sizing:border-box;border:1px solid #34516f;background:#091424;color:#f0f8ff;border-radius:10px;padding:12px;font:inherit;font-size:14px}
.cf-customer-wide{grid-column:1/-1}
.cf-customer-small{font-size:12px;color:#8eabc3}
.cf-customer-error{color:#ff98a3;min-height:16px;font-size:13px}
.cf-customer-actions{justify-content:flex-end;margin-top:17px}
.cf-edit-customer{border:1px solid #3b6280;background:#18364b;color:#a4f9e9;border-radius:8px;padding:7px 11px;cursor:pointer;font-weight:650}
.cf-edit-customer:hover{background:#215568}
@media(max-width:640px){.cf-customer-fields{grid-template-columns:1fr}.cf-customer-dialog{padding:18px}.cf-customer-toolbar{width:100%;margin-top:12px}.cf-customer-toolbar input{width:100%}}

/* CF_PLAYER_CLIENTS_103C */
.cf-contact-cell {
  min-width:180px;
  max-width:340px;
  overflow-wrap:anywhere;
  color:#a9bed9;
  font-size:12px;
}
.cf-contact-email {
  display:block;
  color:#9bbefd;
  margin-top:5px;
  text-decoration:none;
}
.cf-contact-wa {
  display:inline-block;
  margin-left:8px;
  color:#3ee0b7;
  font-weight:700;
  text-decoration:none;
}
.cf-edit-customer {
  background:#173e52;
  border-color:#2ea7a3;
  color:#43e5cd;
}
.cf-edit-customer:hover {
  background:#20576e;
  border-color:#45d8c2;
}
.cf-customer-toolbar .button:last-child {
  background:linear-gradient(125deg,#38e2bc,#32bfd1);
  color:#062332;
  font-weight:800;
}