/* ===== Base (do arquivo original) ===== */
    body { font-family: Arial, sans-serif; background-color: #f5f7fa; margin: 0; padding: 0; color: #1b1f23; }
    header { display: flex; align-items: center; justify-content: space-between; padding: 10px 20px; border-bottom: 1px solid #ccc; background-color: #fff; box-shadow: 0 2px 5px rgb(0 0 0 / 0.1); }
    .logo-container { display: flex; align-items: center; gap: 10px; text-decoration: none; color: inherit; }
    .logo-container img { height: 60px; width: auto; user-select: none; }
    .logo-text { font-weight: 600; font-size: 14px; color: #696969; line-height: 1.15; }
    .buttons-container { display: flex; gap: 15px; flex-wrap: wrap; }
    .btn { display: inline-flex; align-items: center; gap: 6px; padding: 8px 14px; border-radius: 20px; border: none; font-size: 14px; cursor: pointer; user-select: none; text-decoration: none; color: white; white-space: nowrap; }
    .btn-whatsapp { background-color: #25D366; } .btn-whatsapp:hover { background-color: #1ebe56; }

    .form { display: grid; gap: 18px; margin-top: 10px; }
    .field { display: grid; gap: 8px; }
    .label { font-size: 13px; font-weight: 600; color: #111827; }
    .control { display: flex; align-items: center; background: #fff; border: 2px solid rgba(0,0,0,.07); border-radius: 12px; padding: 12px 14px; }
    .control:focus-within { border-color: #1473ff; box-shadow: 0 0 0 3px rgba(20,115,255,.14); outline: 0; }
    .input, .select { width: 100%; border: 0; outline: 0; background: transparent; font: inherit; font-size: 15px; color: #1b1f23; }
    .btn-submit { width: 100%; height: 48px; border-radius: 12px; font-weight: 700; font-size: 15px; border: 0; cursor: pointer; background: #1473ff; color: #fff; }
    .btn-submit:hover { background: #0f5ddb; }
    .footnote { text-align: center; margin-top: 14px; font-size: 13px; color: #6b7280; }
    .link { color: #0b57d0; text-decoration: none; } .link:hover { text-decoration: underline; }

    /* ===== Toast ===== */
    .toast { position: fixed; left: 20px; bottom: 20px; z-index: 9999; background: #fff; border: 1px solid #e5e7eb; box-shadow: 0 20px 40px rgba(0,0,0,.12); padding: 14px 16px; border-radius: 14px; font-size: 14px; color: #1b1f23; }
    .toast--success { border-color: #c6f6d5; }
    .toast--error   { border-color: #fecaca; }

    /* ===== Overlays/Modals ===== */
    .overlay { position: fixed; inset: 0; background: rgba(0,0,0,.4); display: none; place-items: center; z-index: 9998; padding: 20px; }
    .overlay[aria-hidden="false"] { display: grid; }
    .modal { width: 100%; max-width: 420px; background: #fff; border-radius: 16px; box-shadow: 0 20px 60px rgba(0,0,0,.2); border: 1px solid #e5e7eb; }
    .modal__header { display: flex; align-items: center; justify-content: space-between; padding: 16px 18px; border-bottom: 1px solid #eef0f3; }
    .modal__title { margin: 0; font-size: 16px; font-weight: 800; color: #696969; }
    .modal__close { background: transparent; border: 0; font-size: 22px; line-height: 1; cursor: pointer; color: #6b7280; }
    .modal__body { padding: 18px; }
    .modal__footer{padding:14px 18px;border-top:1px solid #eef0f3;display:flex;gap:10px;justify-content:flex-end}
    .btn-primary{background:#1d4ed8;color:#fff;border:0;border-radius:10px;padding:12px 16px;font-weight:600;cursor:pointer}
    .btn-secondary{background:#eef2f7;color:#0f172a;border:0;border-radius:10px;padding:12px 16px;font-weight:600;cursor:pointer}
    .btn-primary[disabled],.btn-secondary[disabled]{opacity:.6;cursor:not-allowed}

    /* ===== Fluxo Reset ===== */
    .orion-input{width:100%;border:1px solid #d9dee8;border-radius:10px;padding:12px 14px;font-size:15px;outline:none}
    .orion-input:focus{border-color:#3b82f6;box-shadow:0 0 0 3px rgba(59,130,246,.15)}
    .muted{color:#6b7280;font-size:13px}
    .orion-msg{font-size:13px;margin-top:8px}
    .orion-msg.ok{color:#166534}
    .orion-msg.err{color:#b91c1c}
    .step{display:none}
    .step.active{display:block}
    .code-grid{display:flex;gap:8px;justify-content:center}
    .code-grid input{width:44px;height:52px;text-align:center;font-size:20px;border:1px solid #d9dee8;border-radius:10px}
    .pwd-meter{height:8px;border-radius:6px;background:#e5e7eb;overflow:hidden}
    .pwd-meter > span{display:block;height:100%;width:0;background:#22c55e;transition:width .25s}

    /* Ajustes finos – Modal Recuperar acesso (Step 1) */
    #reset-overlay [data-step="1"] label[for="rp-email"]{ display:block; margin-bottom: 8px; }
    #reset-overlay [data-step="1"] .orion-input{ max-width: 350px; width: 100%; display: block; }
    #reset-overlay .modal__body{ padding-top: 14px; }

    /* ===== NOVO LAYOUT — Split-screen centralizado (apenas visual) ===== */
    .canvas { display:flex; align-items:center; justify-content:center; padding: 40px 16px; min-height: calc(100vh - 82px); }
    .split { display:flex; gap:20px; max-width:1100px; width:100%; flex-wrap:wrap; justify-content:center; }
    .left-box, .right-box { flex:1 1 440px; border-radius:12px; background:#fff; padding:30px; box-shadow:0 4px 10px rgba(0,0,0,.06); }

    /* Coluna esquerda com azul pastel suave */
    .left-box{ background:#4682B4; text-align:center; }
    .left-box h2{ font-size:20px; font-weight:700; color:#DCDCDC; margin:0 0 10px; }
    .left-box p{ font-size:14px; color:#DCDCDC; line-height:1.6; margin:0 0 10px; }
    .btn-donate{ display:inline-flex; align-items:center; gap:8px; margin-top:12px; background:#f59e0b; color:#fff; font-weight:600; padding:10px 18px; border-radius:9999px; text-decoration:none; }
    .btn-donate:hover{ background:#d97706; }

    /* Coluna direita: cartão do login */
    .panel{ max-width: unset; margin:0; background:transparent; border:none; box-shadow:none; padding:0; } /* usa o card do right-box */
    .panel__title{ margin:0 0 6px 0; font-size:18px; font-weight:800; color:#1e293b; }

    /* Responsivo */
    @media (max-width: 880px){
      .split{ flex-direction:column; }
      .left-box, .right-box { padding:22px; }
    }

    /* (do original) – estilo do corpo dos modais em tamanho menor */
    .modal__body.small-text { font-size: 13px; line-height: 1.5; color: #374151; }