/* Public access-code pages use the website palette from marketing.css. */
.code-auth-page {
  --brand-primary: #0d9488;
  --brand-turquoise: #16b8a6;
  --brand-aqua: #22d3c5;
  --brand-mint: #34d399;
  --brand-yellow: #f6b81a;
  --brand-ink: #123b39;
  --brand-copy: #4b6966;
  --brand-canvas: #f2fbf8;
  --brand-line: rgba(13, 148, 136, .15);
  --auth-ink: var(--brand-ink);
  --auth-muted: var(--brand-copy);
  --auth-teal: #087e73;
  --auth-teal-dark: #07685f;
  --auth-line: var(--brand-line);
  --auth-soft: #e7faf5;
  --auth-focus: rgba(13, 148, 136, .18);
  --auth-shadow: 0 24px 70px rgba(8, 105, 96, .1);
  background: var(--brand-canvas);
}
.code-auth-page .auth-shell { grid-template-columns: minmax(360px, 1fr) minmax(480px, 1fr); }
.code-auth-page .auth-story {
  color: var(--brand-ink);
  background: radial-gradient(circle at 90% 15%, rgba(34, 211, 197, .2), transparent 32%), radial-gradient(circle at 12% 85%, rgba(246, 184, 26, .15), transparent 26%), linear-gradient(145deg, #fff 0%, #f3fffc 44%, #e7faf5 100%);
}
.code-auth-page .auth-story::before, .code-auth-page .auth-story::after { border-color: var(--brand-line); }
.code-auth-page .auth-brand { color: var(--brand-ink); }
.code-auth-page .auth-brand-mark { color: var(--brand-ink); background: var(--brand-yellow); border-color: rgba(246, 184, 26, .4); box-shadow: none; }
.code-auth-page .auth-kicker { color: var(--auth-teal); }
.code-auth-page .auth-story h1 { font-size: clamp(40px, 4.5vw, 64px); line-height: 1.08; }
.code-auth-page .auth-story h1 em { color: var(--auth-teal); font-style: normal; }
.code-auth-page .auth-story-copy > p { color: var(--brand-copy); }
.code-auth-page .auth-trust span { color: var(--brand-copy); border-color: var(--brand-line); background: rgba(255,255,255,.7); }
.code-auth-page .auth-form-side { background: var(--brand-canvas); }
.code-auth-page .auth-form-side::after { background-image: radial-gradient(var(--brand-primary) 1px, transparent 1px); opacity: .18; }
.code-auth-page .auth-card { width: min(540px, 100%); border-color: var(--brand-line); }
.code-auth-page .auth-card > p { color: var(--brand-copy); font-size: 14px; line-height: 1.65; }
.code-auth-page .auth-form { gap: 16px; }
.code-auth-page .auth-form label { display: grid; gap: 7px; min-width: 0; color: var(--brand-ink); font-size: 12px; font-weight: 700; }
.code-auth-page .auth-form input:not([type="hidden"]) { width: 100%; min-height: 47px; padding: 12px 14px; border: 1px solid rgba(13,148,136,.25); border-radius: 10px; color: var(--brand-ink); background: #fff; }
.code-auth-page .auth-form input:focus { outline: 0; border-color: var(--brand-primary); box-shadow: 0 0 0 4px var(--auth-focus); }
.code-auth-page .auth-form input::placeholder { color: #738d89; }
.code-auth-page .auth-submit { background: var(--auth-teal); box-shadow: 0 8px 20px rgba(13,148,136,.18); }
.code-auth-page .auth-submit:hover { background: var(--auth-teal-dark); }
.code-auth-names { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.code-auth-hint { margin: 0; font-size: 11px; line-height: 1.6; color: var(--brand-copy); }
.code-grant { margin: 14px 0; padding: 18px; border: 1px solid var(--brand-line); background: var(--auth-soft); border-radius: 12px; font-size: 13px; line-height: 1.65; }
.code-grant p { color: var(--brand-copy); }
.code-grant a { color: var(--auth-teal); font-weight: 700; }
@media (max-width: 930px) { .code-auth-page .auth-shell { grid-template-columns: 1fr; } .code-auth-page .auth-story { min-height: 350px; gap: 28px; } }
@media (max-width: 600px) { .code-auth-page .auth-story { min-height: 330px; } .code-auth-page .auth-story h1 { font-size: 38px; } .code-auth-names { grid-template-columns: 1fr; gap: 16px; } }

.code-selection-card{padding:16px;border:1px solid #99ddd0;border-radius:12px;background:#effcf8;color:#12594f}.code-selection-card p{margin:8px 0;font-size:13px}.code-selection-card select{width:100%;background:#fff;color:#183b38;border:1px solid #99ddd0;border-radius:8px;padding:12px}.code-selection-card[hidden]{display:none}

[data-code-class][hidden]{display:none!important}