:root {
  --ink: #101620;
  --ink-1: #121925;
  --ink-2: #1B2330;
  --ink-3: #222C3B;
  --card-radius: 14px;
  --card-border: rgba(194,204,218,0.34);
  --card-border-strong: rgba(246,248,251,0.42);
  --card-shadow: inset 0 1px 0 rgba(255,255,255,0.20), inset 0 18px 30px rgba(246,248,251,0.04), 0 18px 34px rgba(0,0,0,0.18);
  --card-hover-shadow: inset 2px 0 0 var(--metal-soft), 0 14px 28px rgba(0,0,0,0.14);
  --card-surface: linear-gradient(180deg, rgba(145,176,218,0.28) 0%, rgba(91,134,194,0.16) 14%, rgba(46,74,116,0.55) 42%, rgba(22,52,92,0.88) 100%);
  --card-surface-wide: linear-gradient(155deg, rgba(246,248,251,0.34) 0%, rgba(231,235,241,0.26) 12%, rgba(157,170,188,0.18) 18%, var(--ink-2) 40%, var(--ink-1) 100%);
  --line: rgba(255,255,255,0.14);
  --line-soft: rgba(255,255,255,0.08);
  --tx: #F3F6FA;
  --tx-soft: #D2DCE8;
  --tx-mute: #97A3B4;
  --accent: #5B86C2;
  --accent-soft: #91B0DA;
  --accent-deep: #2E4A74;
  --metal: #9DAABC;
  --metal-soft: #C2CCDA;
  --metal-deep: #586474;
  --metal-tint: rgba(157,170,188,0.13);
  --metal-hi: #F6F8FB;
  --metal-mid: #E7EBF1;
  --metal-low: #C9D2DD;
  --danger: #C97A7A;
  --ok: #8AA888;
  --warn: #C4A574;
  --font-display: "Sora", system-ui, sans-serif;
  --font-body: "Manrope", system-ui, sans-serif;
  --font-mono: "IBM Plex Mono", monospace;
  --container: 1120px;
  --ease: cubic-bezier(.2, .7, .2, 1);
}

*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; }
body {
  font-family: var(--font-body);
  color: var(--tx);
  background:
    radial-gradient(1100px 720px at 18% 0%, rgba(46,74,116,0.38), transparent 58%),
    radial-gradient(900px 640px at 92% 12%, rgba(157,170,188,0.16), transparent 48%),
    linear-gradient(165deg, #0E1C30 0%, #16345C 28%, #2E4A74 58%, #4A6890 84%, #7A8A9E 100%);
  background-attachment: fixed;
  line-height: 1.65;
  -webkit-font-smoothing: antialiased;
}
a { color: inherit; }
button, input { font: inherit; }
:focus-visible { outline: 2px solid #91B0DA; outline-offset: 2px; }

.container { max-width: var(--container); margin: 0 auto; padding: 0 32px; }

#matrix-bg {
  position: fixed; inset: 0; width: 100vw; height: 100vh;
  z-index: 0; pointer-events: none; opacity: 0.14;
  -webkit-mask-image: linear-gradient(180deg, transparent 0, #000 8%, #000 90%, transparent 100%);
          mask-image: linear-gradient(180deg, transparent 0, #000 8%, #000 90%, transparent 100%);
}
body > *:not(#matrix-bg):not(.sfoot):not(#fx-grain) { position: relative; z-index: 1; }
body::after {
  content: ""; position: fixed; inset: 0; pointer-events: none; z-index: 88;
  background: radial-gradient(120% 120% at 50% 42%, transparent 68%, rgba(22,52,92,0.22) 100%);
}
#fx-grain {
  position: fixed; inset: 0; width: 100%; height: 100%;
  pointer-events: none; z-index: 89;
  opacity: 0.08; mix-blend-mode: overlay;
}

.skip-link {
  position: absolute; left: 12px; top: -40px; z-index: 20;
  background: var(--accent-deep); color: #fff;
  padding: 8px 12px;
}
.skip-link:focus { top: 12px; }

.snav {
  position: sticky; top: 0; z-index: 200;
  padding: 16px 0 8px;
  background: transparent;
  border: 0;
  perspective: 1400px;
}
.snav-inner {
  position: relative;
  display: flex; align-items: center; justify-content: space-between;
  height: 64px;
  border-radius: var(--card-radius);
  background:
    linear-gradient(180deg, rgba(246,248,251,0.34) 0%, rgba(231,235,241,0.12) 16%, transparent 36%),
    linear-gradient(180deg, rgba(39,58,82,0.94) 0%, rgba(26,38,55,0.90) 58%, rgba(17,24,39,0.86) 100%);
  border: 1px solid rgba(194,204,218,0.38);
  box-shadow:
    inset 0 1px 0 rgba(246,248,251,0.32),
    inset 0 -18px 30px rgba(0,0,0,0.28),
    0 28px 48px rgba(0,0,0,0.38),
    0 8px 0 rgba(10,14,22,0.45);
  backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px);
  transform: rotateX(12deg) translateZ(18px);
  transform-origin: center top;
  transform-style: preserve-3d;
}
.snav-inner::before {
  content: "";
  position: absolute; left: 0; right: 0; top: 0; height: 12px;
  background: linear-gradient(180deg, rgba(246,248,251,0.36), rgba(231,235,241,0.14) 58%, transparent 100%);
  pointer-events: none;
}
.snav-logo img {
  height: 38px; display: block;
  filter: brightness(1.28) contrast(1.08);
}
.snav-links { display: flex; gap: 28px; align-items: center; }
.snav-links a {
  text-decoration: none; color: #D8E2EF;
  font-size: 13px; font-weight: 700;
  letter-spacing: .5px; text-transform: uppercase;
  transition: color .2s;
  white-space: nowrap;
}
.snav-links a:hover { color: #fff; }
.snav-links a[aria-current="page"] { color: #fff; }
.sident { padding: 22px 0 0; }
.sident-kicker {
  font-family: var(--font-mono); font-size: 11px;
  letter-spacing: .22em; text-transform: uppercase;
  color: var(--metal-soft); margin: 0 0 8px;
}
.sident-name {
  font-family: var(--font-display); font-weight: 700;
  font-size: clamp(32px, 4.4vw, 52px);
  line-height: 1.05; letter-spacing: -0.025em;
  color: #FFFFFF; margin: 0;
}
.btn-sair {
  background: transparent; color: #fff;
  border: 1px solid rgba(194,204,218,0.36); padding: 8px 16px;
  min-height: 40px; cursor: pointer; border-radius: 8px;
  font-size: 13px; font-weight: 700; letter-spacing: .4px;
  text-transform: uppercase;
}
.btn-sair:hover { border-color: var(--metal-soft); background: var(--metal-tint); }
.btn-sair:disabled { opacity: 0.68; cursor: wait; }
.snav-toggle {
  display: none; flex-direction: column; justify-content: center; gap: 5px;
  width: 44px; height: 44px; padding: 0 10px;
  background: transparent; border: 1px solid rgba(194,204,218,0.36);
  border-radius: 8px; cursor: pointer;
}
.snav-toggle span { display: block; width: 22px; height: 2px; background: var(--tx); transition: transform .2s ease, opacity .2s ease; }
.snav.open .snav-toggle span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.snav.open .snav-toggle span:nth-child(2) { opacity: 0; }
.snav.open .snav-toggle span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

@media (max-width: 900px) {
  .snav { perspective: none; }
  .snav-inner { transform: none; }
  .snav-toggle { display: inline-flex; }
  .snav-links {
    display: none; position: absolute; top: calc(100% - 4px); left: 20px; right: 20px;
    flex-direction: column; align-items: stretch; gap: 0;
    padding: 8px 24px 18px;
    background:
      linear-gradient(180deg, rgba(246,248,251,0.16) 0%, transparent 18%),
      linear-gradient(180deg, #1a2433, #101620);
    border: 1px solid rgba(194,204,218,0.28);
    border-radius: 0 0 var(--card-radius) var(--card-radius);
    box-shadow: 0 24px 60px rgba(0,0,0,.55);
  }
  .snav.open { z-index: 300; }
  .snav.open .snav-links { display: flex; }
  .snav-links a, .btn-sair {
    padding: 14px 2px; border-bottom: 1px solid rgba(255,255,255,.05);
  }
  .btn-sair { width: 100%; text-align: left; border: 0; padding-left: 2px; }
}

.shero { padding: 80px 0 28px; position: relative; }
.eyebrow {
  display: inline-flex; align-items: center; gap: 10px;
  font-family: var(--font-mono); font-size: 11.5px;
  letter-spacing: .24em; text-transform: uppercase;
  color: var(--metal-soft); margin: 0 0 20px;
}
.eyebrow::before { content: ""; width: 26px; height: 1px; background: var(--metal); }
.shero h1, .page-head h1 {
  font-family: var(--font-display); font-weight: 700;
  font-size: clamp(34px, 5vw, 58px); line-height: 1.04;
  letter-spacing: -0.025em; margin: 0 0 18px; max-width: 18ch;
}
.lede {
  font-size: clamp(17px, 2vw, 20px); color: var(--tx-soft);
  max-width: 60ch; margin: 0;
}

.sec { padding: 64px 0; border-bottom: 1px solid var(--line-soft); }
.sec:last-of-type { border-bottom: 0; }
.sec-label {
  font-family: var(--font-mono); font-size: 11px;
  letter-spacing: .22em; text-transform: uppercase;
  color: var(--metal-soft); margin: 0 0 16px;
}
.sec h2 {
  font-family: var(--font-display); font-weight: 600;
  font-size: clamp(26px, 3.2vw, 38px); line-height: 1.1;
  letter-spacing: -0.02em; margin: 0 0 22px; max-width: 22ch;
}

.metal-sheen::before {
  content: "";
  position: absolute; left: 0; right: 0; top: 0; height: 12px;
  background: linear-gradient(180deg, rgba(246,248,251,0.36), rgba(231,235,241,0.14) 58%, transparent 100%);
  pointer-events: none;
}

.measure {
  position: relative;
  overflow: hidden;
  background: var(--card-surface);
  border: 1px solid var(--card-border);
  border-left: 3px solid var(--metal);
  border-radius: 0 var(--card-radius) var(--card-radius) 0;
  padding: 32px 36px;
  box-shadow: var(--card-shadow);
}
.amount {
  font-family: var(--font-display); font-size: clamp(36px, 5vw, 56px);
  font-weight: 600; letter-spacing: -0.03em; color: var(--metal-hi);
  margin: 0 0 10px; line-height: 1;
}
.meta { color: var(--tx-soft); margin: 0 0 6px; font-size: 17px; }
.condition {
  font-family: var(--font-mono); font-size: 12px;
  letter-spacing: .08em; text-transform: uppercase;
  color: var(--metal-soft); margin: 10px 0 0;
}

.rail { display: flex; flex-direction: column; gap: 12px; }
.row {
  position: relative;
  overflow: hidden;
  display: grid;
  grid-template-columns: 1fr auto auto;
  gap: 16px;
  align-items: center;
  padding: 20px 22px;
  background: var(--card-surface);
  border: 1px solid var(--card-border);
  border-radius: var(--card-radius);
  box-shadow: var(--card-shadow);
}
.row:hover {
  border-color: var(--card-border-strong);
  box-shadow: var(--card-hover-shadow);
}
.row strong { font-weight: 600; color: var(--metal-hi); }
.row .muted { color: var(--tx-mute); font-size: 14px; margin-top: 4px; }
.row .value {
  font-family: var(--font-mono); font-size: 13px;
  font-variant-numeric: tabular-nums; color: #FFFFFF; font-weight: 600;
}
.badge {
  font-family: var(--font-mono); font-size: 11px;
  letter-spacing: 0.08em; text-transform: uppercase; color: var(--tx-mute);
}
.badge-ok { color: var(--ok); }
.badge-due { color: var(--accent-soft); }
.badge-late { color: var(--danger); }
.badge-warn { color: var(--warn); }

.empty, .error-box { color: var(--tx-soft); padding: 8px 0; }

.ptabs { display: flex; flex-wrap: wrap; gap: 10px; padding: 8px 0 0; }
.ptab {
  position: relative; overflow: hidden;
  background: var(--card-surface);
  border: 1px solid var(--card-border);
  color: #D8E2EF;
  font-family: var(--font-display); font-weight: 600; font-size: 16px;
  padding: 12px 22px; min-height: 48px; border-radius: var(--card-radius);
  cursor: pointer; box-shadow: var(--card-shadow);
}
.ptab:hover { border-color: var(--card-border-strong); color: #fff; }
.ptab[aria-selected="true"] {
  color: #fff; border-color: var(--card-border-strong);
  box-shadow: var(--card-hover-shadow);
}
.stabs { display: flex; flex-wrap: wrap; gap: 8px 28px; margin: 0 0 28px; }
.stab {
  background: none; border: 0; border-bottom: 2px solid transparent;
  color: var(--tx-mute); font-size: 13px; font-weight: 700;
  letter-spacing: .08em; text-transform: uppercase;
  padding: 10px 0; min-height: 44px; cursor: pointer;
}
.stab:hover { color: #fff; }
.stab[aria-selected="true"] { color: #fff; border-bottom-color: var(--metal-soft); }
.stab-panel[hidden] { display: none; }

.lesson-list { display: flex; flex-direction: column; gap: 12px; }
.lesson {
  position: relative;
  overflow: hidden;
  display: grid;
  grid-template-columns: 48px 1fr auto;
  gap: 16px;
  align-items: center;
  width: 100%;
  text-align: left;
  background: var(--card-surface);
  border: 1px solid var(--card-border);
  border-radius: var(--card-radius);
  box-shadow: var(--card-shadow);
  color: var(--tx); padding: 18px 20px; min-height: 56px; cursor: pointer;
  transition: border-color .2s, box-shadow .2s, transform .2s;
}
.lesson:hover {
  border-color: var(--card-border-strong);
  transform: translateY(-2px);
  box-shadow: var(--card-hover-shadow);
}
.lesson[aria-current="true"] {
  border-color: var(--card-border-strong);
  box-shadow: var(--card-hover-shadow);
}
.lesson[aria-current="true"] .lesson-n,
.lesson[aria-current="true"] .lesson-title { color: var(--accent-soft); }
.lesson-n {
  font-family: var(--font-mono); font-size: 12px;
  letter-spacing: .08em; color: var(--tx-mute);
}
.lesson-title { font-size: 17px; font-weight: 600; color: var(--metal-hi); }
.lesson-time { font-family: var(--font-mono); font-size: 12px; color: var(--tx-mute); }

.now-playing {
  font-family: var(--font-mono); font-size: 12px;
  letter-spacing: .12em; text-transform: uppercase;
  color: var(--metal-soft); margin: 36px 0 16px;
}
.player {
  position: relative;
  overflow: hidden;
  width: 100%;
  background: #000;
  border: 1px solid var(--card-border);
  border-radius: var(--card-radius);
  box-shadow: var(--card-shadow);
}
.player video { width: 100%; display: block; }

.preview-bar {
  margin: 18px auto 0;
  padding: 12px 16px;
  border: 1px solid var(--card-border);
  border-radius: 12px;
  background: rgba(22, 52, 92, 0.55);
  color: var(--tx-soft);
  font-size: 14px;
}
.preview-bar a {
  margin-left: 8px;
  color: var(--accent-soft);
  font-weight: 700;
  text-decoration: underline;
}

.btn-google, .btn-microsoft {
  display: inline-flex; align-items: center; justify-content: center; gap: 12px;
  width: 100%; max-width: 420px; min-height: 48px; margin-top: 12px;
  background: #fff; color: #1f1f1f; border: 0; border-radius: 11px;
  font-weight: 700; cursor: pointer;
}
.btn-google { margin-top: 28px; }
.btn-microsoft svg { width: 18px; height: 18px; }
.btn-microsoft:hover { transform: translateY(-1px); }
.btn-microsoft:disabled { opacity: 0.68; cursor: wait; transform: none; }
.btn-google svg { width: 18px; height: 18px; }
.btn-google:hover { transform: translateY(-1px); }
.btn-google:disabled { opacity: 0.68; cursor: wait; transform: none; }
.auth-split {
  max-width: 420px; display: flex; align-items: center; gap: 12px;
  margin: 22px 0 0; color: var(--tx-mute); font-size: 13px;
}
.auth-split::before, .auth-split::after {
  content: ""; flex: 1; height: 1px; background: var(--line);
}
body.auth-page { padding-bottom: 180px; }
.auth-form { max-width: 420px; margin-top: 36px; }
.field { display: flex; flex-direction: column; gap: 8px; margin-bottom: 16px; }
.field label { font-size: 14px; font-weight: 600; }
.field input {
  min-height: 48px; padding: 12px 14px;
  border: 1px solid var(--card-border);
  background: rgba(10, 14, 22, 0.72); color: var(--tx);
  border-radius: 4px;
}
.field input:focus {
  border-color: var(--accent);
  box-shadow: 0 0 0 3px rgba(91,134,194,0.16);
  outline: none;
}
body[data-admin="true"] .auth-form { max-width: 560px; }
.field-split {
  display: flex;
  gap: 8px;
  align-items: stretch;
}
.field-split input { flex: 1; min-width: 0; }
.field-split .btn-ghost,
.field-split .btn-primary {
  width: auto;
  min-width: 168px;
  padding: 12px 14px;
  white-space: nowrap;
}
.field-split .btn-ghost:disabled,
.field-split .btn-primary:disabled { opacity: 0.68; cursor: wait; }
.field-hint {
  margin: 0;
  font-size: 13px;
  color: var(--tx-mute);
}
.field-hint.is-warn { color: var(--warn); }
.field-hint.is-ok { color: var(--ok); }

.btn-primary {
  display: inline-flex; align-items: center; justify-content: center;
  min-height: 48px; padding: 14px 32px;
  background: linear-gradient(180deg, var(--accent-soft), var(--accent));
  color: #08111d; border: 0; border-radius: 11px;
  font-weight: 700; font-size: 15px; letter-spacing: 0;
  cursor: pointer; width: 100%;
  box-shadow: 0 10px 26px -10px var(--accent);
}
.btn-primary:hover { transform: translateY(-1px); box-shadow: 0 14px 32px -10px var(--accent); }
.btn-primary:disabled { opacity: 0.68; cursor: wait; transform: none; }
.btn-primary.is-loading,
.btn-sair.is-loading {
  gap: 10px;
  pointer-events: none;
  cursor: wait;
}
.btn-sair.is-loading {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.btn-spinner {
  display: inline-block;
  width: 0.9em;
  height: 0.9em;
  border: 2px solid currentColor;
  border-right-color: transparent;
  border-radius: 50%;
  animation: fx-btn-spin 0.7s linear infinite;
  flex-shrink: 0;
}
@keyframes fx-btn-spin {
  to { transform: rotate(360deg); }
}
.btn-ghost {
  background: transparent; color: var(--tx);
  border: 1px solid var(--line); min-height: 48px; padding: 14px 28px;
  cursor: pointer; border-radius: 11px;
}
.btn-ghost:hover { border-color: var(--metal); background: var(--metal-tint); }

.auth-error, .page-error { color: var(--danger); margin: 0 0 16px; min-height: 1.4em; }
.auth-ok { color: var(--ok); margin: 0 0 16px; }
.auth-error[hidden],
.auth-ok[hidden],
#equipe-notice[hidden] { display: none; }
.auth-alt { margin: 18px 0 0; }
.auth-alt button {
  background: none; border: 0; color: var(--accent-soft);
  cursor: pointer; text-decoration: underline; padding: 8px 0;
}

.modal {
  position: fixed; inset: 0; z-index: 120;
  background: rgba(10, 14, 22, 0.86);
  display: grid; place-items: start center; padding: 80px 20px 40px;
}
.modal[hidden] { display: none; }
.modal-card { width: min(480px, 100%); background: transparent; border: 0; padding: 0; }
.auth-kicker {
  display: inline-flex; align-items: center; gap: 10px;
  font-family: var(--font-mono); font-size: 11.5px;
  letter-spacing: .24em; text-transform: uppercase;
  color: var(--metal-soft); margin: 0 0 16px;
}
.auth-kicker::before { content: ""; width: 26px; height: 1px; background: var(--metal); }
.modal-card h2 {
  font-family: var(--font-display); font-weight: 700;
  font-size: clamp(28px, 4vw, 40px); letter-spacing: -0.025em; margin: 0 0 12px;
}
.auth-lead { color: var(--tx-soft); font-size: 17px; max-width: 48ch; margin: 0 0 28px; }

#shell { padding-bottom: 120px; }
.sfoot {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 150;
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 22px 0 18px;
  background: linear-gradient(180deg, transparent 0%, rgba(8, 14, 24, 0.28) 55%, rgba(8, 14, 24, 0.55) 100%);
  border: 0;
  outline: 0;
  box-shadow: none;
  backdrop-filter: none; -webkit-backdrop-filter: none;
}
.sfoot-inner {
  display: flex; justify-content: space-between; align-items: center;
  gap: 24px;
}
.sfoot img {
  height: 52px; display: block;
  filter: brightness(1.28) contrast(1.08);
}
.sfoot .r {
  font-family: var(--font-mono); font-size: 16px;
  letter-spacing: .12em; text-transform: uppercase;
  color: #FFFFFF; font-weight: 500;
}

.license-key {
  font-family: var(--font-mono); font-size: 12px;
  letter-spacing: .06em; color: var(--metal-soft);
  margin-top: 8px;
}
.sec-more { margin: 18px 0 0; }
.sec-more a {
  font-family: var(--font-mono); font-size: 12px;
  letter-spacing: .12em; text-transform: uppercase;
  color: var(--accent-soft); text-decoration: none;
}
.sec-more a:hover { color: var(--tx); }

@media (max-width: 900px) {
  .container { padding: 0 20px; }
  .shero { padding: 48px 0 36px; }
  .row, .lesson { grid-template-columns: 1fr; }
  .lesson-time { justify-self: start; }
  .measure { padding: 24px 20px; }
  #shell { padding-bottom: 140px; }
  .sfoot-inner { flex-wrap: wrap; }
  .sfoot img { height: 42px; }
  .sfoot .r { font-size: 13px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
  #matrix-bg, #fx-grain { display: none; }
  .snav { perspective: none; }
  .snav-inner { transform: none; }
  .btn-spinner { animation: none !important; border-right-color: currentColor; opacity: 0.55; }
}
/* ===========================================================================
   PAINEL DA FX — cartao de empresa (escopo [data-admin], so a tela de admin)
   ---------------------------------------------------------------------------
   Por que existe: a lista de empresas usava `.row`, uma grade de 3 colunas com
   `overflow:hidden`. Com 6 elementos dentro (dados, selo, link, teto, admin e
   usuarios) o e-mail era CORTADO e o bloco de criar usuario ficava espremido
   num canto, invisivel na pratica. `.row` continua intacta: a area do cliente
   a usa em 4 lugares.
   Arquitetura: cartao em blocos verticais —
   cabecalho (quem e) / identificacao / secao USUARIOS em leitura
   / secao CONFIGURACOES (teto e trocar admin). Criar e remover pessoa
   mora na aba Equipe, nao neste cartao.
   =========================================================================== */

[data-admin] .org-card {
  position: relative;
  display: block;
  padding: 24px;
  /* azul claro em vez de leitoso: tinta azul no topo caindo pra azul profundo,
     sem os brilhos internos quase brancos de --card-shadow */
  background: linear-gradient(180deg,
    rgba(145,176,218,0.34) 0%,
    rgba(91,134,194,0.24) 22%,
    rgba(46,74,116,0.46) 55%,
    rgba(24,48,86,0.90) 100%);
  border: 1px solid rgba(145,176,218,0.38);
  border-radius: var(--card-radius);
  box-shadow: inset 0 1px 0 rgba(145,176,218,0.35), 0 18px 34px rgba(0,0,0,0.18);
  transition: border-color 200ms var(--ease), box-shadow 200ms var(--ease);
}
[data-admin] .org-card + .org-card { margin-top: 20px; }
[data-admin] .org-card:hover {
  border-color: var(--card-border-strong);
  box-shadow: var(--card-hover-shadow);
}

/* --- cabecalho: nome + selo de estado --- */
[data-admin] .org-head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
}
[data-admin] .org-name {
  margin: 0;
  font-family: var(--font-display);
  font-size: 1.25rem;
  line-height: 1.2;
  font-weight: 600;
  color: var(--metal-hi);
}

/* --- identificacao: CNPJ, e-mail e vagas. O e-mail NAO pode ser cortado. --- */
[data-admin] .org-ident {
  margin: 10px 0 0;
  display: flex;
  flex-wrap: wrap;
  gap: 4px 20px;
  font-size: 0.875rem;
  color: var(--tx-mute);
}
[data-admin] .org-ident span { display: inline-block; }
[data-admin] .org-ident .mono {
  font-family: var(--font-mono);
  font-variant-numeric: tabular-nums;
}
[data-admin] .org-ident .org-email {
  color: var(--tx-soft);
  overflow-wrap: anywhere;   /* e-mail longo quebra em vez de sumir */
  word-break: break-word;
  max-width: 100%;
}
[data-admin] .org-seats { color: var(--tx-soft); font-weight: 600; }

/* --- secoes internas --- */
[data-admin] .org-section {
  margin-top: 24px;
  padding-top: 20px;
  border-top: 1px solid var(--line-soft);
}
[data-admin] .org-section-title {
  margin: 0 0 14px;
  font-family: var(--font-mono);
  font-size: 0.75rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--metal);
}

/* --- lista de usuarios --- */
[data-admin] .org-members { display: flex; flex-direction: column; gap: 8px; }
[data-admin] .org-member {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 14px;
  padding: 10px 14px;
  background: rgba(145,176,218,0.14);
  border: 1px solid rgba(145,176,218,0.26);
  border-radius: 10px;
}
[data-admin] .org-member-name {
  flex: 1 1 220px;
  min-width: 0;
  color: var(--tx);
  overflow-wrap: anywhere;
}
[data-admin] .org-member-mail {
  display: block;
  font-size: 0.8125rem;
  color: var(--tx-mute);
  overflow-wrap: anywhere;
}
[data-admin] .org-role {
  font-family: var(--font-mono);
  font-size: 0.6875rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  padding: 4px 10px;
  border-radius: 999px;
  border: 1px solid var(--line);
  color: var(--tx-soft);
  white-space: nowrap;
}
[data-admin] .org-role.is-admin { color: var(--accent-soft); border-color: var(--accent-deep); }
[data-admin] .org-empty { margin: 0; color: var(--tx-mute); font-size: 0.875rem; }

/* --- formularios de acao dentro do cartao --- */
[data-admin] .org-form {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 12px;
  margin: 0;
  max-width: none;   /* .auth-form limita a 420px; aqui o cartao manda */
}
[data-admin] .org-form + .org-form { margin-top: 14px; }
[data-admin] .org-field { display: flex; flex-direction: column; gap: 6px; flex: 1 1 220px; min-width: 0; }
[data-admin] .org-field.is-narrow { flex: 0 0 120px; }
[data-admin] .org-field label {
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  color: var(--tx-mute);
}
[data-admin] .org-field input {
  width: 100%;
  min-height: 44px;           /* alvo de toque */
  padding: 10px 14px;
  font-family: var(--font-body);
  font-size: 1rem;            /* 16px: evita zoom automatico no celular */
  color: var(--tx);
  background: rgba(16,22,32,0.55);
  border: 1px solid var(--card-border);
  border-radius: 10px;
}
[data-admin] .org-form .btn-sair,
[data-admin] .org-form .btn-primary { min-height: 44px; white-space: nowrap; }

/* --- links de abrir a area do cliente e preview como membro --- */
[data-admin] .org-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 16px;
}
[data-admin] .org-open {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 0 16px;
  border-radius: 10px;
  border: 1px solid var(--card-border);
  color: var(--tx-soft);
  text-decoration: none;
  font-size: 0.875rem;
}
[data-admin] .org-open:hover { border-color: var(--accent-soft); color: var(--metal-hi); }
[data-admin] .org-open:focus-visible {
  outline: 2px solid var(--accent-soft);
  outline-offset: 2px;
}

@media (max-width: 640px) {
  [data-admin] .org-card { padding: 18px; }
  [data-admin] .org-field.is-narrow { flex: 1 1 120px; }
}

/* ===========================================================================
   ABA EQUIPE — cartao FX (so a pagina Equipe). Nao toca em .row.
   Fechado por padrao: um clique revela o modo "agindo como FX".
   =========================================================================== */
body[data-page="equipe"] .fx-equipe-card {
  border: 1px solid var(--accent-soft);
  background: linear-gradient(180deg,
    rgba(145,176,218,0.22) 0%,
    rgba(91,134,194,0.18) 30%,
    rgba(46,74,116,0.44) 65%,
    rgba(22,44,80,0.90) 100%);
  border-radius: var(--card-radius);
  box-shadow: inset 0 1px 0 rgba(145,176,218,0.30), 0 18px 34px rgba(0,0,0,0.18);
  padding: 20px 24px;
}
body[data-page="equipe"] .fx-equipe-chip {
  display: inline-block;
  margin: 0 0 12px;
  padding: 4px 10px;
  font-family: var(--font-mono);
  font-size: 0.6875rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--accent-soft);
  border: 1px solid var(--accent-deep);
  border-radius: 999px;
}
body[data-page="equipe"] .fx-equipe-toggle {
  min-height: 44px;
}
body[data-page="equipe"] .fx-equipe-card[data-open="1"] .fx-equipe-closed { display: none; }
body[data-page="equipe"] .fx-equipe-card:not([data-open="1"]) .fx-equipe-panel { display: none; }
body[data-page="equipe"] .fx-equipe-banner {
  margin: 0 0 16px;
  padding: 12px 14px;
  min-height: 44px;
  display: flex;
  align-items: center;
  color: var(--tx);
  background: rgba(145,176,218,0.16);
  border: 1px solid var(--accent-deep);
  border-radius: 10px;
}
body[data-page="equipe"] .fx-equipe-panel .auth-form { max-width: none; }
body[data-page="equipe"] .fx-equipe-banner .fx-equipe-close {
  margin-left: auto;
  min-height: 44px;
  white-space: nowrap;
}
body[data-page="equipe"] .fx-equipe-panel .field input,
body[data-page="equipe"] .fx-equipe-panel .btn-primary,
body[data-page="equipe"] .fx-equipe-panel .btn-sair { min-height: 44px; }

.sec-head {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
  margin: 0 0 22px;
}
.sec-head .sec-label { margin-bottom: 8px; }
.sec-head h2 { margin: 0; }
.sec-head .btn-primary {
  width: auto;
  min-height: 44px;
  padding: 12px 20px;
}
#invite-panel { margin: 0 0 24px; }
#invite-label {
  margin: 0 0 12px;
  font-family: var(--font-display);
  font-size: 1.1rem;
}

.btn-text {
  background: none;
  border: 0;
  color: var(--accent-soft);
  cursor: pointer;
  text-decoration: underline;
  min-height: 44px;
  padding: 8px 4px;
  font: inherit;
}
.btn-text:hover { color: var(--tx); }

.org-dialog {
  width: min(640px, 100%);
  max-height: min(92vh, 920px);
  margin: auto;
  padding: 0;
  border: 1px solid rgba(145,176,218,0.38);
  border-radius: var(--card-radius);
  color: var(--tx);
  background: linear-gradient(180deg,
    rgba(14, 28, 48, 0.98) 0%,
    rgba(16, 34, 60, 0.98) 100%);
  box-shadow: 0 24px 48px rgba(0,0,0,0.35);
}
.org-dialog::backdrop {
  background: rgba(10, 14, 22, 0.86);
}
.org-dialog-inner {
  display: flex;
  flex-direction: column;
  max-height: min(92vh, 920px);
}
.org-dialog-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 20px 24px 12px;
}
.org-dialog-head h2 {
  margin: 0;
  font-family: var(--font-display);
  font-weight: 700;
  font-size: clamp(22px, 3vw, 32px);
  letter-spacing: -0.025em;
}
.org-dialog-close {
  flex: 0 0 auto;
  width: 44px;
  height: 44px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: transparent;
  color: var(--tx);
  cursor: pointer;
}
.org-dialog-body {
  overflow: auto;
  padding: 0 24px 16px;
  flex: 1 1 auto;
}
.org-dialog .auth-form {
  max-width: none;
  margin-top: 8px;
}
.org-dialog .mono { font-family: var(--font-mono); }
.org-group {
  border: 0;
  margin: 0 0 20px;
  padding: 0;
}
.org-group legend {
  font-family: var(--font-mono);
  font-size: 11px;
  letter-spacing: 0.22em;
  text-transform: uppercase;
  color: var(--accent-soft);
  margin: 0 0 12px;
  padding: 0;
}
.org-fields-2 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0 16px;
}
.org-address {
  margin: 0 0 20px;
  border: 1px solid var(--line-soft);
  border-radius: 10px;
  padding: 8px 14px 4px;
}
.org-address summary {
  cursor: pointer;
  min-height: 44px;
  display: flex;
  align-items: center;
  color: var(--tx-soft);
  font-weight: 600;
}
.org-dialog-foot {
  position: sticky;
  bottom: 0;
  padding: 12px 24px 20px;
  border-top: 1px solid var(--line-soft);
  background: rgba(14, 28, 48, 0.96);
}
.org-dialog-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 12px;
}
.org-dialog-actions .btn-primary,
.org-dialog-actions .btn-ghost {
  width: auto;
  min-width: 160px;
  min-height: 44px;
}
.org-dialog-dirty {
  margin: 0 0 12px;
  color: var(--warn);
}
@media (max-width: 640px) {
  .org-dialog {
    width: 100%;
    height: 100%;
    max-height: 100%;
    margin: 0;
    border-radius: 0;
  }
  .org-dialog-inner { max-height: 100%; height: 100%; }
  .org-fields-2 { grid-template-columns: 1fr; }
}
