.user-flow-shell{--flow-bg:#fff7e8;--flow-surface:#fffcf6;--flow-green:#3f6246;--flow-olive:#71865b;--flow-sage:#dde9cd;--flow-text:#293229;--flow-muted:#687064;--flow-fs-title:var(--fs-page-title,clamp(24px, 2.2vw, 28px));--flow-fs-section:var(--fs-section-title,clamp(21px, 1.9vw, 25px));--flow-fs-lead:var(--fs-hero-lead,clamp(13.4px, .9vw, 14px));--flow-fs-button:var(--fs-button,clamp(12.8px, .92vw, 13.5px));--flow-fs-meta:var(--fs-meta,clamp(11.8px, .88vw, 12.6px));min-height:100vh;color:var(--flow-text);background:var(--flow-bg)}.flow-page--center{place-items:start center;min-height:100vh;padding:42px 16px 64px;display:grid}.flow-card{box-sizing:border-box;border:1px solid color-mix(in srgb, var(--flow-sage) 56%, var(--flow-surface));background:color-mix(in srgb, var(--flow-surface) 96%, white);border-radius:22px;width:min(100%,460px);max-width:460px;margin-inline:auto;padding:24px;box-shadow:0 18px 44px #3f624614}.flow-logo{justify-content:center;margin-bottom:18px;display:flex}.flow-logo img{width:132px;height:auto}.flow-kicker{color:var(--flow-green);font-size:12px;font-weight:var(--fw-bold,700)}.flow-card h1{color:var(--flow-text);font-size:var(--flow-fs-title);margin:0;line-height:1.35}.flow-card p{color:var(--flow-muted);font-size:var(--flow-fs-lead);line-height:1.78}.flow-form{gap:14px;width:100%;min-width:0;margin-top:18px;display:grid}.flow-field{color:var(--flow-text);font-size:var(--flow-fs-button);font-weight:var(--fw-bold);gap:7px;display:grid}.flow-field input{border:1px solid color-mix(in srgb, var(--flow-sage) 62%, var(--flow-surface));background:color-mix(in srgb, var(--flow-surface) 85%, white);width:100%;min-width:0;max-width:100%;min-height:43px;color:var(--flow-text);font:inherit;border-radius:14px;outline:none;padding:10px 13px}.flow-field input:focus{border-color:color-mix(in srgb, var(--flow-green) 40%, var(--flow-sage));box-shadow:0 0 0 3px color-mix(in srgb, var(--flow-sage) 45%, transparent)}.flow-field.is-error input{border-color:#c77463}.flow-status{color:#a64233;min-height:20px;font-size:12px;font-weight:var(--fw-bold)}.flow-status.is-success{color:var(--flow-green)}.flow-primary,.flow-ghost{min-height:40px;font-size:var(--flow-fs-button);font-weight:var(--fw-semibold,600);cursor:pointer;border:0;border-radius:14px;justify-content:center;align-items:center;gap:8px;padding:10px 18px;text-decoration:none;display:inline-flex}.flow-primary{background:var(--flow-green);width:100%;min-height:44px;color:var(--flow-surface)}.flow-primary:disabled{opacity:.6;cursor:not-allowed}.flow-ghost{color:var(--flow-green);background:0 0}.otp-row{direction:ltr;grid-template-columns:repeat(6,minmax(0,1fr));gap:9px;width:100%;min-width:0;display:grid}.otp-row input{box-sizing:border-box;border:1px solid color-mix(in srgb, var(--flow-sage) 54%, var(--flow-surface));background:color-mix(in srgb, var(--flow-surface) 92%, white);width:100%;min-width:0;max-width:100%;height:50px;min-height:50px;color:var(--flow-text);text-align:center;font-size:var(--flow-fs-section);font-weight:var(--fw-semibold,600);border-radius:13px;outline:0;padding:4px;transition:border-color .16s,box-shadow .16s,background .16s;box-shadow:inset 0 1px #ffffffd1}.otp-row input:focus{border-color:color-mix(in srgb, var(--flow-green) 34%, var(--flow-sage));background:var(--flow-surface);box-shadow:0 0 0 3px color-mix(in srgb, var(--flow-sage) 42%, transparent), inset 0 1px 0 #ffffffdb}.auth-tools{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;font-size:13px;display:flex}.auth-tools .flow-ghost{min-height:36px;font-size:13px;font-weight:var(--fw-semibold,600);padding:6px 0}.flow-note{background:color-mix(in srgb, var(--flow-sage) 34%, var(--flow-surface));color:var(--flow-olive);border-radius:16px;margin-top:14px;padding:12px 14px;font-size:13px;line-height:1.8}.flow-dev-code{background:color-mix(in srgb, var(--flow-sage) 42%, var(--flow-surface));color:var(--flow-green);font-size:var(--flow-fs-meta);direction:rtl;border-radius:12px;margin-top:12px;padding:10px 12px;line-height:1.75}@media (max-width:920px){.flow-card{width:calc(100% - 32px);padding:22px}}@media (max-width:390px){.otp-row{gap:6px}.otp-row input{border-radius:11px;height:44px;min-height:44px}}
