/* ═══ Central de Apps Opus 3 — estilo compartilhado ═══ */
:root, :root[data-theme="dark"]{
  --bg:#0A1020;
  --panel:#111A2C;
  --panel-2:#18233A;
  --line:#26344F;
  --ink:#F2F5FA;
  --ink-2:#B3BDCF;
  --ink-3:#8A97AE;
  --accent:#FF8A1F;
  --accent-2:#FFB066;
  --accent-text:#FFA24D;
  --accent-ink:#1B1206;
  --ok:#3DDC97;
  --ok-bg:rgba(61,220,151,.13);
  --verde:#12A85C;
  --verde-2:#16C06B;
  --acao:#FFFFFF;
  --erro:#FF8080;
  --erro-bg:rgba(255,128,128,.13);
  --lock:#8A97AE;
  --halo:rgba(255,138,31,.12);
  --sombra:0 22px 48px -30px rgba(0,0,0,.9);
}
:root[data-theme="light"]{
  --bg:#F4F6FB;
  --panel:#FFFFFF;
  --panel-2:#EEF2F8;
  --line:#D8DFEB;
  --ink:#121A2B;
  --ink-2:#46546C;
  --ink-3:#5F6C83;
  --accent:#FF8A1F;
  --accent-2:#E57300;
  --accent-text:#B55400;
  --accent-ink:#1B1206;
  --ok:#0E8A5A;
  --ok-bg:rgba(14,138,90,.10);
  --verde:#0F9C53;
  --verde-2:#12A85C;
  --acao:#101B33;
  --erro:#C43B3B;
  --erro-bg:rgba(196,59,59,.09);
  --lock:#6B778C;
  --halo:rgba(255,138,31,.10);
  --sombra:0 18px 40px -28px rgba(18,26,43,.35);
}

*{box-sizing:border-box}
[hidden]{display:none !important}
html{font-size:17px}
body{
  margin:0;min-height:100vh;
  background:radial-gradient(90% 50% at 50% -12%, var(--halo), transparent 62%), var(--bg);
  background-repeat:no-repeat;background-color:var(--bg);
  color:var(--ink);
  font-family:ui-sans-serif, system-ui, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  line-height:1.55;-webkit-font-smoothing:antialiased;
}
a{color:var(--accent-text)}
img{max-width:100%}

.logo-claro{display:none}
:root[data-theme="light"] .logo-escuro{display:none}
:root[data-theme="light"] .logo-claro{display:inline-block}

/* ── Botões e campos ─────────────────────────────── */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  width:100%;font-family:inherit;font-weight:700;font-size:1rem;
  background:var(--verde);color:#FFFFFF;border:0;border-radius:10px;
  padding:14px 18px;cursor:pointer;text-decoration:none;
  transition:background-color .15s, transform .15s;
}
/* Todo botão de ação é verde com letra branca; o laranja fica para a marca */
.btn:hover:not(:disabled){background:var(--verde-2);transform:translateY(-1px)}
/* Botões da oferta da Escola: um pouco maiores e com sombra */
.btn-verde{font-size:1.08rem;box-shadow:0 10px 20px -12px rgba(18,168,92,.85)}
.btn:disabled{opacity:.55;cursor:not-allowed}
.btn-vazio{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  width:100%;font-family:inherit;font-weight:600;font-size:1rem;
  background:transparent;color:var(--ink);border:1.5px solid var(--line);border-radius:10px;
  padding:12px 16px;cursor:pointer;text-decoration:none;
}
.btn-vazio:hover{border-color:var(--ink-3)}
.link{
  background:none;border:0;color:var(--accent-text);font-family:inherit;
  font-size:.92rem;cursor:pointer;text-decoration:underline;padding:4px;
}
.btn:focus-visible,.btn-vazio:focus-visible,.link:focus-visible,input:focus-visible,button:focus-visible{
  outline:3px solid var(--accent-2);outline-offset:2px;
}
.btn:focus-visible{outline-color:var(--verde-2)}
label{display:block;font-size:.88rem;font-weight:600;color:var(--ink-2);margin-bottom:6px}
input{
  width:100%;font-family:inherit;font-size:1.05rem;color:var(--ink);
  background:var(--panel-2);border:1.5px solid var(--line);border-radius:10px;
  padding:13px 14px;margin-bottom:16px;
}
input:focus{outline:none;border-color:var(--accent)}
input::placeholder{color:var(--ink-3)}

.msg{display:none;padding:12px 14px;border-radius:10px;font-size:.95rem;margin-bottom:16px}
.msg.show{display:block}
.msg.err{background:var(--erro-bg);color:var(--erro)}
.msg.ok{background:var(--ok-bg);color:var(--ok)}

/* ── Telas de entrada ────────────────────────────── */
.tela-acesso{display:flex;align-items:center;justify-content:center;padding:24px 16px}
.cartao-acesso{
  width:100%;max-width:440px;background:var(--panel);border:1px solid var(--line);
  border-radius:16px;padding:30px 26px 24px;box-shadow:var(--sombra);
}
.marca{text-align:center;margin-bottom:22px}
.marca img{height:58px;width:auto}
.marca-nome{margin:8px 0 0;font-size:.8rem;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--accent-text)}
.cartao-acesso h1{font-size:1.6rem;line-height:1.2;margin:0 0 8px;text-align:center}
.lead{margin:0 0 20px;color:var(--ink-2);text-align:center;text-wrap:balance}
.etapa{display:none}
.etapa.on{display:block}
.chip{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  background:var(--panel-2);border:1px solid var(--line);border-radius:10px;
  padding:9px 12px;margin-bottom:16px;font-size:.95rem;
}
.chip span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pe{margin-top:14px;text-align:center}
.selo{margin:22px 0 0;padding-top:14px;border-top:1px solid var(--line);font-size:.78rem;color:var(--ink-3);text-align:center}