/* Submint sign-in composition, using Staff's existing theme tokens and fonts. */
body.design-modern.staff-login { min-height: 100dvh; }
.staff-login .login-layout { display: grid; grid-template-columns: 1fr 1fr; min-height: 100dvh; }
.staff-login .login-form-panel { display: flex; align-items: center; justify-content: center; padding: 64px 32px; background: var(--rc-surface); }
.staff-login .login-content { width: 100%; max-width: 448px; }
.staff-login .login-heading { margin-bottom: 32px; }
.staff-login .login-heading h1 { margin: 0 0 12px; font-family: var(--rc-font-head); font-size: 36px; font-weight: 700; line-height: 1.22; letter-spacing: -.035em; }
.staff-login .login-heading p { margin: 0; color: var(--rc-text-2); line-height: 1.5; }
.staff-login .login-field { margin-bottom: 24px; }
.staff-login .form-label { margin-bottom: 8px; font-weight: 500; }
.staff-login .form-control { min-height: 44px; padding: 10px 16px; }
.staff-login .login-password { position: relative; }
.staff-login .login-password input { padding-right: 48px; }
.staff-login .login-password-toggle { position: absolute; right: 4px; top: 2px; width: 40px; height: 40px; display: grid; place-items: center; border: 0; background: transparent; color: var(--rc-text-3); border-radius: var(--rc-radius); }
.staff-login .login-password-toggle:hover { color: var(--rc-text); }
.staff-login .login-remember { margin-bottom: 24px; color: var(--rc-text-2); }
.staff-login .login-submit { width: 100%; min-height: 44px; font-weight: 600; }
.staff-login .login-brand-panel { position: relative; overflow: hidden; display: flex; align-items: center; justify-content: center; background: var(--rc-surface-root); isolation: isolate; }
body.design-modern .login-brand.staff-brand { position: relative; gap: 20px; font-size: 72px; }
body.design-modern .login-brand img { width: 80px; height: 80px; }
.staff-login .login-grid { position: absolute; width: 420px; height: 300px; z-index: -1; background-image: linear-gradient(var(--rc-border) 1px, transparent 1px), linear-gradient(90deg, var(--rc-border) 1px, transparent 1px); background-size: 52px 52px; mask-image: radial-gradient(ellipse at center, #000, transparent 72%); opacity: .65; }
.staff-login .login-grid::after { content: ''; position: absolute; top: 104px; left: 156px; width: 52px; height: 52px; background: var(--rc-primary-tint); box-shadow: -52px 52px var(--rc-primary-tint), 104px 52px var(--rc-primary-tint); }
.staff-login .login-grid-first { right: 40%; bottom: 43%; }
.staff-login .login-grid-second { left: 43%; top: 42%; }
body.design-modern .login-mobile-brand { display: none; }
.staff-login .login-theme { position: fixed; right: 24px; bottom: 24px; z-index: 2; }
.staff-login .login-theme summary { list-style: none; width: 56px; height: 56px; display: grid; place-items: center; border-radius: 50%; background: var(--rc-primary); color: var(--rc-surface); font-size: 22px; cursor: pointer; }
.staff-login .login-theme summary::-webkit-details-marker { display: none; }
.staff-login .login-theme-options { position: absolute; bottom: 68px; right: 0; display: flex; gap: 4px; padding: 6px; border: 1px solid var(--rc-border); border-radius: var(--rc-radius-lg); background: var(--rc-surface); }
.staff-login .theme-opt { width: 40px; height: 40px; border: 0; border-radius: var(--rc-radius); background: transparent; color: var(--rc-text-2); }
.staff-login .theme-opt.active { background: var(--rc-surface-3); color: var(--rc-primary); }
.staff-login button:focus-visible, .staff-login summary:focus-visible { outline: 2px solid var(--rc-primary); outline-offset: 3px; }
@media (max-width: 991.98px) {
    .staff-login .login-layout { grid-template-columns: 1fr; }
    .staff-login .login-brand-panel { display: none; }
    .staff-login .login-form-panel { padding: 48px 24px 96px; }
    body.design-modern .login-mobile-brand { display: inline-flex; margin-bottom: 40px; }
    .staff-login .login-heading h1 { font-size: 32px; }
    .staff-login .login-theme { right: 16px; bottom: 16px; }
    .staff-login .login-theme summary { width: 48px; height: 48px; }
}