/** Derived from the user-approved verification source; no demo network logic. */


    .verification-template .cursor-interaction:not(:disabled) { cursor: pointer; }

    .verification-template {
      --sfa-page: light-dark(#faf7fb, #171318);
      --sfa-surface: light-dark(#ffffff, #211b23);
      --sfa-text: light-dark(#29232a, #f4edf4);
      --sfa-muted: light-dark(#716674, #b7a9ba);
      --sfa-line: light-dark(#e8e1e9, #3b303e);
      --sfa-soft: light-dark(#f6eff4, #30232e);
      --sfa-brand: light-dark(#560c30, #e8a5c8);
      --sfa-button: light-dark(#560c30, #843057);
      --sfa-button-text: #ffffff;
      --sfa-success: light-dark(#28745a, #8cc8aa);
      --sfa-success-soft: light-dark(#edf6f0, #22392e);
      --sfa-error: light-dark(#ac3650, #f29bae);
      --sfa-error-soft: light-dark(#fff0f2, #3a222b);
      --sfa-shadow: light-dark(rgba(48,22,42,.07), rgba(0,0,0,.22));
      --sfa-gap: 8px;
      --sfa-active: 0;
      width: 100%; color: var(--sfa-text); background: var(--sfa-page); color-scheme: light;
      font: 400 16px/1.6 -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
      -webkit-font-smoothing: antialiased;
    }
    .verification-template *, .verification-template *::before, .verification-template *::after { box-sizing: border-box; }
    .verification-template [hidden] { display: none !important; }
    .verification-template button, .verification-template input, .verification-template select { font: inherit; }
    .verification-template button, .verification-template select { -webkit-tap-highlight-color: transparent; touch-action: manipulation; }
    .verification-template button:disabled { cursor: default; }
    .verification-template .sfa-page { isolation: isolate; display: flex; flex-direction: column; gap: 14px; padding: 24px 36px 20px; }
    .verification-template .sfa-header {
      display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 16px 24px;
      min-width: 0; min-height: 44px;
    }
    .verification-template .sfa-brand { display: flex; align-items: center; min-width: 0; }
    .verification-template .sfa-logo { display: block; width: 373px; height: auto; max-width: 100%; }
    .verification-template .sfa-chrome { display: flex; align-items: center; gap: 9px; flex: 0 0 auto; margin-left: auto; }
    .verification-template .sfa-install { min-height: 44px; padding: 0 12px; border: 0; border-radius: 9px; background: transparent; color: var(--sfa-brand); font-size: 12.8px; font-weight: 620; line-height: 16px; }
    .verification-template .sfa-language {
      max-width: 114px; padding: 0 7px; min-height: 44px; color: var(--sfa-muted);
      background: var(--sfa-page); border: 1px solid transparent; border-radius: 9px; font-size: 12.8px; line-height: 16px;
    }
    .verification-template .sfa-icon { display: inline-flex; align-items: center; }
    .verification-template .sfa-main {
      display: grid; grid-template-columns: minmax(0, 1fr) 440px; align-items: center; gap: 64px;
      width: 100%; max-width: 1200px; min-height: 620px; margin: 0 auto; padding: 28px 0;
    }
    .verification-template .sfa-story { min-width: 0; max-width: 480px; color: var(--sfa-text); font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
    .verification-template .sfa-eyebrow { margin: 0 0 13px; color: var(--sfa-brand); font-family: inherit; font-size: 10.72px; font-weight: 720; line-height: normal; letter-spacing: .15em; }
    .verification-template .sfa-eyebrow::before { content: ""; display: block; width: 46px; height: 4px; margin-bottom: 20px; border-radius: 2px; background: var(--sfa-brand); }
    .verification-template .sfa-headline {
      margin: 0; max-width: 480px; color: var(--sfa-text); -webkit-text-fill-color: currentColor;
      font-family: inherit; font-size: 56px; font-weight: 530; font-style: normal; letter-spacing: -.06em;
      line-height: 1.1; overflow-wrap: break-word; text-wrap: wrap;
    }
    .verification-template .sfa-story-subtitle { margin: 23px 0 0; color: var(--sfa-muted); font-family: inherit; font-size: 16px; font-weight: 400; line-height: 1.6; letter-spacing: normal; }
    .verification-template .sfa-card {
      min-width: 0; padding: 28px; background: var(--sfa-surface);
      border: 1px solid var(--sfa-line); border-radius: 18px; box-shadow: 0 14px 45px var(--sfa-shadow);
    }
    .verification-template .sfa-status-text { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
    .verification-template .sfa-card h2 { margin: 0; color: var(--sfa-text); font-size: 26.4px; font-weight: 620; line-height: 1.17; letter-spacing: -.5px; }
    .verification-template .sfa-card-subtitle { color: var(--sfa-muted); margin: 10px 0 0; font-size: 13px; line-height: 1.75; }
    .verification-template .sfa-method { display: flex; align-items: stretch; gap: 24px; margin: 24px 0; border-bottom: 1px solid var(--sfa-line); }
    .verification-template .sfa-method-tab { position: relative; padding: 0 0 12px; border: 0; background: transparent; color: var(--sfa-muted); font-size: 12.64px; line-height: 18px; white-space: nowrap; }
    .verification-template .sfa-method-tab.is-active { color: var(--sfa-brand); font-weight: 600; }
    .verification-template .sfa-method-tab.is-active::after { position: absolute; content: ""; bottom: -1px; left: 0; right: 0; height: 2px; background: var(--sfa-brand); }
    .verification-template .sfa-address { display: flex; align-items: center; gap: 9px; margin-bottom: 16px; min-width: 0; }
    .verification-template .sfa-address > .sfa-icon { color: var(--sfa-muted); flex: 0 0 auto; }
    .verification-template .sfa-address svg { width: 15px; height: 15px; }
    .verification-template .sfa-address-text { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; }
    .verification-template .sfa-change { flex: 0 0 auto; padding: 5px 0 5px 8px; min-height: 34px; background: transparent; color: var(--sfa-brand); border: 0; font-size: 12px; }
    .verification-template .sfa-label-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 10px; font-size: 12px; }
    .verification-template .sfa-counter { color: var(--sfa-muted); font-size: 11px; font-variant-numeric: tabular-nums; letter-spacing: .8px; }
    .verification-template .sfa-code-control { position: relative; border-radius: 9px; }
    .verification-template .sfa-digits { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: var(--sfa-gap); }
    .verification-template .sfa-digit {
      display: grid; place-items: center; height: 54px; min-width: 0;
      border: 1px solid var(--sfa-line); border-radius: 9px; background: var(--sfa-surface); color: var(--sfa-text);
      font-size: 24px; font-weight: 500; font-variant-numeric: tabular-nums;
      transition: background 180ms ease, border-color 180ms ease, transform 220ms ease;
    }
    .verification-template .sfa-digit.has-value { background: var(--sfa-soft); border-color: transparent; }
    .verification-template .sfa-digit.is-pop { animation: sfa-digit-pop 280ms cubic-bezier(.2,1.4,.4,1); }
    .verification-template .sfa-focus-tile {
      position: absolute; z-index: 2; top: 0; bottom: 0; left: 0; pointer-events: none; opacity: 0;
      width: calc((100% - 5 * var(--sfa-gap)) / 6); border: 2px solid var(--sfa-brand); border-radius: 9px;
      box-shadow: none; transform: translateX(calc(var(--sfa-active) * (100% + var(--sfa-gap))));
      transition: transform 250ms cubic-bezier(.2,1.05,.3,1), opacity 120ms ease;
    }
    .verification-template .sfa-code-control:focus-within .sfa-focus-tile { opacity: 1; }
    .verification-template .sfa-code-input {
      position: absolute; inset: 0; z-index: 3; width: 100%; height: 100%; margin: 0; padding: 0;
      opacity: 0; font-size: 24px; cursor: text;
    }
    .verification-template .sfa-feedback { display: flex; align-items: center; gap: 6px; min-height: 44px; padding: 9px 0; color: var(--sfa-muted); font-size: 11px; line-height: 1.6; }
    .verification-template .sfa-feedback .sfa-icon { flex: 0 0 auto; }
    .verification-template .sfa-feedback svg { width: 13px; height: 13px; }
    .verification-template .sfa-primary {
      display: flex; align-items: center; justify-content: center; gap: 9px; width: 100%; min-height: 42px; padding: 10px 17px;
      border: 1px solid transparent; border-radius: 9px; background: var(--sfa-button); color: var(--sfa-button-text);
      font-size: 13.28px; font-weight: 620; line-height: 20px; transition: opacity 180ms ease, transform 180ms cubic-bezier(.2,1.4,.4,1), box-shadow 180ms ease;
    }
    .verification-template .sfa-primary:not(:disabled):hover { transform: translateY(-1px); box-shadow: 0 5px 14px var(--sfa-shadow); }
    .verification-template .sfa-primary:not(:disabled):active { transform: scale(.985); }
    .verification-template .sfa-primary:disabled { opacity: .44; }
    .verification-template .sfa-primary svg { width: 15px; height: 15px; }
    .verification-template .sfa-spinner { display: inline-block; width: 14px; height: 14px; flex: 0 0 14px; border: 1.5px solid currentColor; border-right-color: transparent; border-radius: 50%; animation: sfa-spin 800ms linear infinite; }
    .verification-template .sfa-resend-row { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; column-gap: 5px; min-height: 47px; padding-top: 5px; color: var(--sfa-muted); font-size: 11px; }
    .verification-template .sfa-resend { min-height: 36px; padding: 6px 3px; background: transparent; border: 0; color: var(--sfa-brand); font-size: 11px; font-variant-numeric: tabular-nums; }
    .verification-template .sfa-resend:disabled { color: var(--sfa-muted); }
    .verification-template .sfa-email-label { display: block; margin-bottom: 9px; font-size: 12px; }
    .verification-template .sfa-email-input { width: 100%; min-height: 44px; padding: 11px 13px; border: 1px solid var(--sfa-line); border-radius: 9px; background: var(--sfa-surface); color: var(--sfa-text); font-size: 16px; line-height: 20px; }
    .verification-template .sfa-email-input[aria-invalid="true"] { border-color: var(--sfa-error); }
    .verification-template .sfa-email-error { color: var(--sfa-error); min-height: 40px; margin: 0; padding: 8px 0; font-size: 11px; }
    .verification-template .sfa-back { display: block; margin: 8px auto 0; min-height: 40px; padding: 8px 10px; background: transparent; border: 0; color: var(--sfa-muted); font-size: 12px; }
    .verification-template .sfa-success-stage { padding-top: 25px; }
    .verification-template .sfa-success-mark { display: grid; place-items: center; width: 36px; height: 36px; margin-bottom: 16px; border-radius: 50%; color: var(--sfa-success); background: var(--sfa-success-soft); }
    .verification-template .sfa-success-mark svg { width: 20px; height: 20px; stroke-width: 1.8; }
    .verification-template .sfa-success-mark .sfa-check-stroke { stroke-dasharray: 1 1; stroke-dashoffset: 0; opacity: 1; }
    .verification-template .sfa-success-stage.sfa-enter { animation: none; }
    .verification-template .sfa-success-stage.sfa-enter .sfa-check-stroke { animation: sfa-check-draw 280ms cubic-bezier(.25,.1,.25,1) 40ms both; }
    .verification-template .sfa-success-address { overflow-wrap: anywhere; margin: 0 0 25px; font-size: 14px; }
    .verification-template .sfa-success-stage .sfa-back { min-height: 32px; margin-bottom: 0; }
    .verification-template .sfa-register-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 8px; padding-top: 12px; border-top: 1px solid var(--sfa-line); color: var(--sfa-muted); font-size: 12px; }
    .verification-template .sfa-register { flex: 0 0 auto; min-height: 44px; padding: 7px 0 7px 12px; border: 0; background: transparent; color: var(--sfa-brand); font-size: 12px; font-weight: 620; line-height: 18.6px; }
    .verification-template .sfa-footer { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px; color: var(--sfa-muted); font-size: 11.52px; }
    .verification-template .sfa-support { padding: 7px 0 7px 12px; min-height: 36px; background: transparent; border: 0; color: var(--sfa-muted); font-size: 11px; }
    .verification-template .sfa-support-note { width: 100%; margin: 0; color: var(--sfa-muted); text-align: right; font-size: 12px; }
    .verification-template .sfa-demo-strip { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 7px; padding: 10px 14px; border-top: 1px solid var(--sfa-line); background: var(--sfa-surface); color: var(--sfa-muted); font-size: 11px; }
    .verification-template .sfa-demo-fill { display: inline-flex; align-items: center; gap: 5px; min-height: 30px; padding: 4px 8px; border: 1px solid transparent; border-radius: 6px; background: var(--sfa-soft); color: var(--sfa-brand); font-size: 11px; letter-spacing: .8px; font-variant-numeric: tabular-nums; }
    .verification-template .sfa-demo-fill svg { width: 12px; height: 12px; }
    .verification-template .sfa-demo-fill:disabled { opacity: .45; }
    .verification-template [data-state="error"] .sfa-digit { border-color: var(--sfa-error); background: var(--sfa-surface); }
    .verification-template [data-state="error"] .sfa-focus-tile { border-color: var(--sfa-error); }
    .verification-template [data-state="error"] .sfa-feedback { color: var(--sfa-error); }
    .verification-template [data-state="verifying"] .sfa-digit { animation: sfa-wave 850ms ease-in-out infinite; animation-delay: calc(var(--sfa-index) * 65ms); }
    .verification-template [data-state="verifying"] .sfa-focus-tile { opacity: 0; }
    .verification-template [data-state="verifying"] .sfa-primary, .verification-template [data-state="sending"] .sfa-email-submit { opacity: 1; }
    .verification-template .sfa-shake { animation: sfa-shake 360ms ease; }
    .verification-template .sfa-enter { animation: sfa-enter 380ms cubic-bezier(.2,1,.3,1) both; }
    @keyframes sfa-digit-pop { 0% { transform: translateY(2px) scale(.92); } 65% { transform: translateY(-2px) scale(1.04); } 100% { transform: translateY(0) scale(1); } }
    @keyframes sfa-wave { 0%, 100% { transform: translateY(0); } 45% { transform: translateY(-3px); } }
    @keyframes sfa-spin { to { transform: rotate(360deg); } }
    @keyframes sfa-shake { 0%, 100% { transform: translateX(0); } 20%, 60% { transform: translateX(-4px); } 40%, 80% { transform: translateX(4px); } }
    @keyframes sfa-enter { from { opacity: .2; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }
    @keyframes sfa-check-draw { 0% { stroke-dashoffset: var(--sfa-check-start, 1); opacity: 0; } 1% { opacity: 1; } 100% { stroke-dashoffset: 0; opacity: 1; } }
    @media (max-width: 880px) and (min-width: 701px) {
      .verification-template .sfa-main { grid-template-columns: minmax(0,1fr) 356px; padding: 40px 0; gap: 32px; }
      .verification-template .sfa-headline { font-size: 34px; }
      .verification-template .sfa-card { padding: 24px; }
      .verification-template .sfa-eyebrow { font-size: 12px; }
      .verification-template .sfa-story-subtitle { font-size: 13px; }
    }
    @media (max-width: 700px) {
      .verification-template .sfa-page { padding: 20px 24px 14px; }
      .verification-template .sfa-logo { width: 240px; }
      .verification-template .sfa-main { grid-template-columns: minmax(0,1fr); max-width: 440px; min-height: 0; padding: 23px 0 31px; gap: 27px; }
      .verification-template .sfa-story { padding: 0 3px; }
      .verification-template .sfa-eyebrow { margin-bottom: 13px; font-size: 12px; }
      .verification-template .sfa-eyebrow::before { margin-bottom: 14px; }
      .verification-template .sfa-headline { font-size: 28px; line-height: 1.35; text-wrap: wrap; }
      .verification-template .sfa-story-subtitle { margin-top: 12px; font-size: 12px; }
      .verification-template .sfa-card { padding: 24px; }
    }
    @media (max-width: 380px) {
      .verification-template { --sfa-gap: 6px; }
      .verification-template .sfa-page { padding: 17px 16px 14px; }
      .verification-template .sfa-header { gap: 8px; }
      .verification-template .sfa-chrome { gap: 4px; }
      .verification-template .sfa-language { max-width: 100px; padding: 6px 2px; font-size: 11px; }
      .verification-template .sfa-main { padding: 16px 0 26px; gap: 24px; }
      .verification-template .sfa-headline { font-size: 25px; }
      .verification-template .sfa-card { padding: 21px 18px; }
      .verification-template .sfa-card h2 { font-size: 24px; }
      .verification-template .sfa-digit { height: 49px; font-size: 22px; }
      .verification-template .sfa-demo-strip { gap: 5px; }
    }
    @media (pointer: coarse) {
      .verification-template .sfa-primary, .verification-template .sfa-method-tab { min-height: 44px; }
      .verification-template .sfa-language { min-height: 44px; }
      .verification-template .sfa-change, .verification-template .sfa-resend, .verification-template .sfa-back, .verification-template .sfa-support, .verification-template .sfa-demo-fill { min-height: 44px; }
    }
    @media (prefers-reduced-motion: reduce) {
      .verification-template *, .verification-template *::before, .verification-template *::after { animation: none !important; transition: none !important; }
    }
  
/* Production shell and real backend additions. Template component rules above are retained. */
.verification-template { background:transparent; color-scheme:inherit; --sfa-text:var(--ink); --sfa-muted:var(--muted); --sfa-brand:var(--primary-text,#560c30); --sfa-button:var(--primary,#560c30); font-family:inherit; }
.verification-template .sfa-card { box-shadow:none; border:0; padding:0; background:transparent; }
.auth-page[data-auth-scene="verification"] .auth-form > h1,.auth-page[data-auth-scene="verification"] .auth-form > .subtitle { display:none; }
.auth-page[data-auth-scene="verification"] .auth-content { padding:0; margin:0; scrollbar-gutter:auto; }
.auth-page[data-auth-scene="verification"] .auth-form { border-radius:18px; }
.auth-page[data-auth-scene="verification"] .sfa-code-input { min-height:0!important; }
.verification-template .sfa-success-mark { width:36px; height:36px; }
.verification-template .sfa-success-mark svg { width:20px; height:20px; }
.verification-template .sfa-totp-slot:empty,.verification-template .sfa-technical:empty { display:none; }
.verification-template .sfa-totp-slot { margin:12px 0; }
.verification-template .sfa-totp-slot input { min-height:44px; font-size:16px; }
.verification-template .sfa-technical { font-size:11px; color:var(--sfa-muted); overflow-wrap:anywhere; margin:8px 0; }
.verification-template .sfa-technical summary { cursor:pointer; }
.verification-template .sfa-back-to-signin { display:block; margin:8px auto 0; padding:8px 10px; min-height:40px; border:0; background:transparent; color:var(--sfa-muted); font:inherit; font-size:12px; }
.verification-template .sfa-replay { display:none; }
.verification-template .sfa-code-input:focus-visible { outline:none; box-shadow:none; }
@media(forced-colors:active) { .verification-template .sfa-focus-tile { border-color:Highlight; box-shadow:none; } }
/* Reference card spacing at its original tablet/phone breakpoints. */
@media(max-width:880px) and (min-width:701px) {
  .auth-page[data-auth-scene="verification"] .auth-form { padding:24px; }
}
@media(max-width:700px) {
  .auth-page[data-auth-scene="verification"] { padding: max(20px,env(safe-area-inset-top)) max(24px,env(safe-area-inset-right)) max(14px,env(safe-area-inset-bottom)) max(24px,env(safe-area-inset-left)); }
  .auth-page[data-auth-scene="verification"] .auth-body { max-width:440px; }
  .auth-page[data-auth-scene="verification"] .auth-form { padding:24px; }
}
@media(max-width:380px) {
  .auth-page[data-auth-scene="verification"] { padding: max(17px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(14px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left)); }
  .auth-page[data-auth-scene="verification"] .auth-form { padding:21px 18px; }
}
.verification-template .sfa-delivery-feedback { margin:6px 0; color:var(--sfa-error); font-size:11px; line-height:1.6; }
/* Additional-factor and transport failures must not accuse the email code. */
.verification-template [data-factor-error] .sfa-digit { border-color:var(--sfa-line); background:var(--sfa-surface); }
.verification-template [data-factor-error] .sfa-digit.has-value { border-color:transparent; background:var(--sfa-soft); }
.verification-template [data-factor-error] .sfa-focus-tile { border-color:var(--sfa-brand); }
.auth-page[data-auth-scene="verification"] .verification-support { display:contents; --sfa-muted:var(--muted); }
.auth-page[data-auth-scene="verification"] .verification-support .sfa-support { padding:7px 0 7px 12px; min-height:36px; background:transparent; border:0; color:var(--sfa-muted); font-size:11px; font-weight:400; }
.auth-page[data-auth-scene="verification"] .verification-support .sfa-support-note { width:100%; margin:0; color:var(--sfa-muted); text-align:right; font-size:12px; }
@media(pointer:coarse) { .auth-page[data-auth-scene="verification"] .verification-support .sfa-support { min-height:44px; } }
