.tgd-signin,
.signin-support {
    --ctc-violet: var(--color-primary);
    --ctc-violet-bright: var(--color-secondary);
    --ctc-violet-deep: var(--color-primary);
    --ctc-tint: #f0eef8;
    --ctc-line: #dedbea;
    --ctc-shadow-md: 0 18px 44px rgba(32, 26, 112, .1);
}
.signin-support .ctc-channel:hover,
.signin-support .ctc-sponsor__links a:hover { border-color: rgba(32, 26, 112, .35); }
.tgd-signin {
    position: relative;
    isolation: isolate;
    padding: 56px 24px 64px;
    background: linear-gradient(135deg, #f8f6fc 0%, #f1edf9 55%, #fffbf2 100%);
}
.signin-backdrop { position: absolute; inset: 0; overflow: hidden; pointer-events: none; }
.signin-grid {
    position: absolute;
    inset: 0;
    background-image: radial-gradient(rgba(32, 26, 112, .18) 1px, transparent 1px);
    background-size: 28px 28px;
    mask-image: linear-gradient(90deg, #000, transparent 40%, transparent 60%, #000);
    opacity: .55;
}
.signin-orb {
    position: absolute;
    width: clamp(280px, 35vw, 520px);
    aspect-ratio: 1;
    border-radius: 50%;
    filter: blur(65px);
    animation: signin-drift 24s ease-in-out infinite alternate;
}
.signin-orb--violet { left: -8%; top: 5%; background: rgba(32, 26, 112, .15); }
.signin-orb--blue { right: -8%; top: 28%; background: rgba(73, 182, 234, .14); animation-delay: -8s; }
.signin-orb--gold { left: 20%; bottom: -25%; background: rgba(217, 167, 53, .14); animation-delay: -16s; }
.signin-orbit {
    position: absolute;
    left: 50%;
    top: 48%;
    width: 1050px;
    height: 1050px;
    margin: -525px;
    border: 1px solid rgba(32, 26, 112, .07);
    border-radius: 50%;
    animation: signin-orbit 70s linear infinite;
}
.signin-orbit::after {
    content: '';
    position: absolute;
    top: 50%;
    left: -4px;
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: rgba(32, 26, 112, .3);
    box-shadow: 0 0 16px rgba(32, 26, 112, .15);
}
.signin-orbit--inner { width: 820px; height: 820px; margin: -410px; animation-duration: 90s; animation-direction: reverse; }
.signin-orbit--inner::after { background: rgba(217, 167, 53, .45); }
@keyframes signin-drift { to { transform: translate3d(45px, -30px, 0) scale(1.12); } }
@keyframes signin-orbit { to { transform: rotate(360deg); } }
.signin-container { position: relative; z-index: 1; max-width: 520px; margin: 0 auto; }
.signin-card {
    padding: 36px 40px;
    background: var(--ctc-surface);
    border: 1px solid var(--ctc-line);
    border-radius: var(--ctc-radius-lg);
    box-shadow: var(--ctc-shadow-md);
}
.signin-logo { display: block; width: 200px; height: 73px; object-fit: contain; margin: 0 auto 28px; }
.signin-heading { text-align: center; margin-bottom: 28px; }
.signin-heading h1 { font-size: 34px; margin-bottom: 12px; }
.signin-heading p, .signin-signup { color: var(--ctc-ink-soft); font-size: 14px; }
.signin-form { display: grid; gap: 22px; }
.signin-field label { display: block; font-size: 14px; font-weight: 600; margin-bottom: 8px; color: var(--ctc-ink); }
.signin-field input {
    width: 100%;
    height: 50px;
    border: 1px solid var(--ctc-line);
    border-radius: 10px;
    background: var(--ctc-surface);
    color: var(--ctc-ink);
    padding: 12px 14px;
    font: inherit;
    font-size: 16px;
    box-shadow: none;
}
.signin-field input:focus-visible { border-color: var(--ctc-violet); outline: 3px solid var(--ctc-tint); outline-offset: 1px; }
.signin-password-label { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.signin-password-label a, .signin-signup a { color: var(--ctc-violet-deep); font-size: 13px; font-weight: 600; }
.signin-password-label a:hover, .signin-signup a:hover { text-decoration: underline; text-underline-offset: 3px; }
.signin-password { position: relative; }
.signin-password input { padding-right: 52px; }
.signin-password-toggle {
    position: absolute;
    right: 3px;
    top: 3px;
    width: 44px;
    height: 44px;
    display: grid;
    place-items: center;
    padding: 0;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: var(--ctc-ink-soft);
    font-size: 19px;
}
.signin-password-toggle:hover { background: var(--ctc-tint); color: var(--ctc-violet-deep); }
.signin-password-toggle:focus-visible { outline: 3px solid var(--ctc-violet-bright); outline-offset: 1px; }
.signin-submit {
    width: 100%;
    min-height: 50px;
    justify-content: center;
    margin-top: 2px;
    box-shadow: 0 12px 30px rgba(32, 26, 112, .22);
}
.signin-submit:hover { box-shadow: 0 18px 40px rgba(32, 26, 112, .3); }
.signin-submit:disabled { opacity: .7; cursor: wait; }
.signin-signup { text-align: center; margin-top: 24px; }
.signin-signup a { font-size: inherit; white-space: nowrap; }
.signin-enterprise { margin-top: 28px; padding: 22px 0 0; border-top: 1px solid var(--ctc-line); }
.signin-enterprise h2 { font-size: 16px; margin-bottom: 6px; letter-spacing: 0; }
.signin-enterprise p { font-size: 13px; color: var(--ctc-ink-soft); margin-bottom: 14px; }
.signin-enterprise .rbt-eden-launch {
    display: grid;
    grid-template-columns: 18px minmax(0, 1fr) 18px;
    align-items: center;
    gap: 12px;
    width: 100%;
    height: auto;
    min-height: 46px;
    padding: 10px 16px;
    color: #fff;
    font-family: inherit;
    font-size: 14px;
    letter-spacing: 0;
    text-transform: none;
    animation: rbt-eden-aurora 9s linear infinite;
    box-shadow: 0 4px 14px rgba(217, 167, 53, .35), 0 0 24px rgba(242, 193, 78, .3);
}
.signin-enterprise .rbt-eden-launch-label { grid-column: 2; text-align: center; }
.signin-enterprise .rbt-eden-launch-icon { grid-column: 3; color: #f2c14e; font-size: 18px; }
.signin-enterprise .rbt-eden-launch:hover,
.signin-enterprise .rbt-eden-launch:focus-visible {
    box-shadow: 0 6px 20px rgba(217, 167, 53, .5), 0 0 32px rgba(242, 193, 78, .4);
}
.signin-enterprise .rbt-eden-launch:focus-visible { outline-color: #f2c14e; }
.signin-alert {
    margin-bottom: 22px;
    padding: 14px 16px;
    border: 1px solid var(--ctc-line);
    border-left: 3px solid var(--ctc-violet);
    border-radius: 8px;
    background: var(--ctc-tint);
    color: var(--ctc-ink);
    font-size: 14px;
}
.signin-status { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.signin-spinner:not([hidden]) {
    width: 16px;
    height: 16px;
    border: 2px solid currentColor;
    border-right-color: transparent;
    border-radius: 50%;
    animation: signin-spin .8s linear infinite;
}
@keyframes signin-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) {
    .signin-spinner:not([hidden]), .signin-enterprise .rbt-eden-launch,
    .signin-orb, .signin-orbit { animation: none; }
}
@media (max-width: 575px) {
    .tgd-signin { padding: 32px 16px 40px; }
    .signin-card { padding: 28px 22px; border-radius: var(--ctc-radius); }
    .signin-heading h1 { font-size: 30px; }
    .signin-orbit { opacity: .5; }
}
