/* Codex-only layout. Brand, controls, typography and themes come from redeem-storefront.css. */
.codex-page [hidden] { display: none !important; }
.codex-page #code, .codex-page #email { width: 100%; min-width: 0; min-height: 52px; padding: 14px 16px; border-radius: 4px; background: transparent; border: 1px solid var(--ui-line); }
.codex-actions { display: flex; gap: 12px; flex-wrap: wrap; }
.codex-actions .btn-primary { flex: 1; }
.codex-page .codex-message { margin: 16px 0 0; color: var(--ui-body); overflow-wrap: anywhere; }
.codex-result { border-top: 1px solid var(--ui-line); margin-top: 24px; padding-top: 24px; }
.codex-result h2 { margin: 0 0 20px; font-size: 1.125rem; color: var(--ui-ink); }
.codex-email-row { display: flex; gap: 12px; }
.codex-email-row .btn-secondary { flex-shrink: 0; }
.codex-page #confirm-panel { margin-top: 20px; }
.codex-check { display: flex; align-items: center; gap: 10px; margin: 16px 0; cursor: pointer; }
.codex-page .codex-check input { width: 18px; height: 18px; flex-shrink: 0; accent-color: var(--ui-ink); }
.codex-page #guidance:not(:empty) { margin-top: 16px; }
.codex-page .step-line { flex: 1; min-width: 8px; }
.codex-page :is(button,input):focus-visible { outline: 2px solid var(--ui-ink); outline-offset: 3px; }
@media (max-width: 760px) {
  .codex-page .step-item { flex-direction: column; gap: 6px; text-align: center; }
  .codex-page .step-line { margin-inline: 8px; }
  .codex-page .step-label { font-size: .6875rem; white-space: nowrap; }
  .codex-actions, .codex-email-row { flex-direction: column; }
  .codex-page #confirm { width: 100%; }
}