/**
 * SignIn organism — port of ui-core v2.0.104.
 * Upstream: 250fdd8 · Last synced: 2026-07-18
 */
@import url("../tokens.4b8ea74adec1.css");
@import url("../Footer/footer.1f31a3de24a7.css");
@import url("../Input/input.ecf665a32354.css");
@import url("../InputWithValidation/inputwithvalidation.682c55ae4c83.css");
@import url("../Logo/logo.8cfa5300334a.css");
@import url("../MarketingPane/marketingpane.3bc6663153e5.css");
@import url("../Toast/toast.a8901128d22e.css");

.ui-signin {
    display: grid;
    grid-template-columns: 1fr;
    min-height: 100vh;
    font-family: var(--font-spline, "Spline Sans", sans-serif);
    animation: cs-fade-up .25s ease both;
}

.ui-signin__left { position: relative; display: none; overflow: hidden; isolation: isolate; color: #fff; background: var(--color-midnight); }
.ui-signin__left-glow { position: absolute; z-index: 0; inset: 0; pointer-events: none; background: radial-gradient(ellipse 60% 40% at 18% 22%, color-mix(in srgb, var(--color-green-500) 18%, transparent), transparent 60%), radial-gradient(ellipse 70% 50% at 85% 80%, color-mix(in srgb, var(--color-green-500) 8%, transparent), transparent 65%); }
.ui-signin__right { display: flex; min-width: 0; flex-direction: column; background: #fff; }
.ui-signin__header { display: flex; flex: none; height: 72px; align-items: center; justify-content: space-between; gap: var(--cs16); border-bottom: 1px solid var(--color-gray-200); padding: 0 var(--cs24) 0 var(--cs8); }
.ui-signin__header-brand { display: flex; min-width: 0; flex: 1; align-items: center; gap: var(--cs6); }
.ui-signin__logo-link { display: inline-flex; align-items: center; }.ui-signin__logo-link img { display: block; width: auto; height: 30px; }
.ui-signin__back-slot { display: inline-flex; width: 32px; height: 32px; flex: none; align-items: center; justify-content: center; }
.ui-signin__icon-button { display: inline-flex; width: 32px; height: 32px; align-items: center; justify-content: center; border: 0; border-radius: 50%; color: var(--color-gray-700); background: transparent; cursor: pointer; text-decoration: none; transition: color 150ms ease, background 150ms ease; }.ui-signin__icon-button:hover { color: var(--color-gray-900); background: var(--color-gray-100); }.ui-signin__icon-button svg { width: 20px; height: 20px; }
.ui-signin__header-right { display: flex; align-items: center; gap: var(--cs8); font-size: 13px; }.ui-signin__header-link { color: var(--color-green-700); cursor: pointer; font-size: 13px; font-weight: 600; line-height: 1.25; text-decoration: none; transition: color 150ms ease; }.ui-signin__header-link:hover { color: var(--color-green-800); }
.ui-signin__body { display: flex; min-height: 0; flex: 1; flex-direction: column; align-items: center; justify-content: center; overflow-y: auto; padding: 40px var(--cs24) 48px; }
.ui-signin__card { display: flex; width: 100%; max-width: 400px; flex-direction: column; gap: var(--cs20); }
.ui-signin__head { margin-bottom: var(--cs4); }.ui-signin__title { margin: 0; color: var(--color-gray-900); font-size: 28px; font-weight: 500; letter-spacing: -.01em; line-height: 1.18; }
.ui-signin__home-input .ui-input { border-width: 1.5px; border-color: var(--color-green-500); box-shadow: 0 0 12px 0 color-mix(in srgb, var(--color-green-500) 30%, transparent); }.ui-signin__home-input .ui-input:focus { border-color: var(--color-green-700); outline: none; box-shadow: 0 0 0 3px color-mix(in srgb, var(--color-green-700) 22%, transparent); }.ui-signin__home-input .ui-input:focus-visible { outline: none; }
.ui-signin__error .ui-toast-content { font-size: 14px; line-height: 1.4285714; }
.ui-signin__method-reveal,.ui-signin__kickoff { display: flex; width: 100%; flex-direction: column; }.ui-signin__method-group { animation: cs-method-reveal .4s cubic-bezier(.4, 0, .2, 1) both; }
.ui-signin__method-card { position: relative; display: flex; width: 100%; box-sizing: border-box; align-items: center; gap: 14px; border: 2px solid var(--color-green-500); border-radius: 12px; padding: 14px var(--cs16); color: inherit; background: color-mix(in srgb, var(--color-green-500) 4%, white); cursor: pointer; font: inherit; text-align: left; box-shadow: 0 1px 2px rgb(0 0 0 / .05); transition: border-color 150ms ease, background 150ms ease, transform 150ms ease; }.ui-signin__method-card:hover { border-color: var(--color-green-500); background: color-mix(in srgb, var(--color-green-500) 7%, white); }.ui-signin__method-card:active { transform: scale(.99); }.ui-signin__method-card:disabled { cursor: not-allowed; opacity: .6; }.ui-signin__method-card--kickoff { text-decoration: none; }
.ui-signin__method-icon { display: inline-flex; width: 36px; height: 36px; flex: none; align-items: center; justify-content: center; border-radius: 10px; color: #fff; background: var(--color-green-500); }.ui-signin__method-icon svg { width: 18px; height: 18px; }.ui-signin__method-icon--plain { border: 1px solid var(--color-gray-300); color: var(--color-gray-700); background: #fff; }.ui-signin__method-icon--plain .ui-logo { width: 18px !important; height: 18px !important; }
.ui-signin__method-icon[data-icon-method] { display: none; }.ui-signin__method-card[data-method="sms"] [data-icon-method="sms"],.ui-signin__method-card[data-method="email"] [data-icon-method="email"],.ui-signin__method-card[data-method="sso"] [data-icon-method="sso"] { display: inline-flex; }
.ui-signin__method-body { min-width: 0; flex: 1; }.ui-signin__method-title { display: flex; align-items: center; gap: var(--cs8); margin: 0; color: var(--color-gray-900); font-size: 14px; font-weight: 500; }.ui-signin__method-chevron { flex: none; color: var(--color-gray-400); }.ui-signin__method-chevron svg { display: block; width: 16px; height: 16px; }
.ui-signin [hidden] { display: none !important; }

@keyframes cs-fade-up { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: translateY(0); } }
@keyframes cs-method-reveal { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: translateY(0); } }

@media (min-width: 1024px) { .ui-signin { grid-template-columns: 9fr 13fr; }.ui-signin__left { display: block; } }
@media (prefers-reduced-motion: reduce) { .ui-signin,.ui-signin *,.ui-signin *::before,.ui-signin *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; transition-duration: .001ms !important; } }