@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{--ds-brand-50:#f0edf9;--ds-brand-100:#e5e6f2;--ds-brand-300:#a6a4da;--ds-brand-500:#6060b7;--ds-brand-600:#506bbd;--ds-brand-700:#494996;--ds-info:#6060b7;--ds-shadow-focus:0 0 0 3px #6060b744;--dd-color:#a6a4da!important;--swal-join-bg:#506bbd!important;--swal-join-hover-bg:#494996!important}
body,input,select,textarea{font-family:'DM Sans',sans-serif!important}h1,h2,h3,h4{font-family:Manrope,sans-serif!important}
.site-header .brand img,.site-footer .brand img{width:110px!important;height:76px!important;object-fit:contain}
.spinner-logo{object-fit:contain!important;animation:none!important;width:110px!important;height:88px!important}
body:has(.body-wrap){background:#fafaff!important;color:#272b45!important}
.body-wrap{background:transparent!important}
.site-header{background:#fafaffee!important;border-bottom:1px solid #e5e6f2!important;backdrop-filter:blur(16px)}
.site-header .brand{background:transparent!important;box-shadow:none!important;border:0!important}
.site-header a,.landing-nav-link{color:#535465!important}
.hero-title,#appTitle,#newRoomTitle,#joinRoomTitle{color:#272b45!important;letter-spacing:-1.5px!important}
#appTitle h1{color:#6060b7!important;font-size:clamp(36px,5vw,64px)!important}
.hero-paragraph,#appDescription,#appJoinDescription,.section-paragraph{color:#696a77!important}
.hero::before,.hero::after{opacity:.12!important}
.button-primary,.swal2-confirm{background:#506bbd!important;color:#fff!important;border-color:#506bbd!important;box-shadow:0 6px 20px #506bbd22!important}
.button-primary:hover,.swal2-confirm:hover{background:#494996!important}
.button:not(.button-primary){border-color:#d7d8e5!important}
#roomName,#joinRoomForm input{background:white!important;color:#272b45!important;border:1px solid #d7d8e5!important;border-radius:10px!important}
#roomName:focus{border-color:#a1329f!important;box-shadow:0 0 0 3px #a1329f22!important}
#appJoinDescription{font-size:23px!important}
.site-footer{background:#f0edf9!important;color:#535465!important}
.site-footer a{color:#494996!important}
#loginForm,#joinRoomForm{background:#fff!important;border:1px solid #e5e6f2!important;color:#272b45!important;box-shadow:0 18px 50px #272b4510!important}
#loginForm label,#loginForm h1,#loginForm h2,#loginForm p{color:#272b45!important}
@media(max-width:640px){.site-header .brand img{width:85px!important;height:64px!important}.landing-nav{gap:12px!important}.hero-title{font-size:32px!important}}

.landing-page{--landing-primary:#506bbd;--landing-primary-bright:#6060b7;--landing-accent:#a1329f;background:#fafaff!important}.landing-page::before,.landing-page::after,.site-header::before,.site-header::after{display:none!important}.cta-inner{background:#fff!important;border:1px solid #e5e6f2!important;box-shadow:0 16px 45px #272b4510!important}.cta-inner::before,.cta-inner::after{display:none!important}.landing-nav-cta{background:#506bbd!important;color:white!important}.site-header .landing-nav-cta{color:white!important}.cta-inner .button:not(.button-primary){background:#f0edf9!important;color:#494996!important}.sabidos-footer{padding:28px 0;background:#f0edf9;color:#535465;font-size:13px}.sabidos-footer .container{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap}.sabidos-footer a{color:#494996;text-decoration:underline}

.hero{background:linear-gradient(135deg,#fafaff,#f0edf9)!important;background-image:linear-gradient(135deg,#fafaff,#f0edf9)!important}.hero .split-wrap .split-item{min-height:350px!important}.hero .section-inner{padding-top:64px!important;padding-bottom:40px!important}

/* Center the entire login layout, replacing the inherited two-column hero. */
.sabidos-login-page .split-wrap{margin:0!important;display:flex!important;justify-content:center!important}.sabidos-login-page .split-item{width:100%!important;flex:0 1 100%!important;max-width:none!important;padding:0!important;margin:0!important;min-height:0!important;justify-content:center!important}.sabidos-login-page .split-item-content{width:100%!important;flex:0 1 100%!important;max-width:460px!important;margin:0 auto!important}.sabidos-login-page .hero .section-inner{padding:40px 0!important;min-height:calc(100svh - 80px);box-sizing:border-box;display:flex;align-items:center;justify-content:center}.sabidos-login-page .hero-inner>.split-wrap{width:100%}.sabidos-login-page .login-card{box-sizing:border-box;width:100%;margin:0 auto!important}.sabidos-login-page .hero .container{width:calc(100% - 32px)!important;max-width:1100px!important}@media(max-width:480px){.sabidos-login-page #loginForm,.sabidos-login-page #joinRoomForm{padding:32px 22px!important}.sabidos-login-page .hero .section-inner{padding:24px 0!important}}

/* System theme: public pages, login and room controls. */
:root { color-scheme: light dark; }
body:has(.body-wrap) {
 --sabidos-page:#fafaff; --sabidos-page-end:#f0edf9; --sabidos-card:#ffffff;
 --sabidos-text:#272b45; --sabidos-muted:#696a77; --sabidos-border:#d7d8e5;
 --sabidos-field:#ffffff; --sabidos-accent:#506bbd; --sabidos-placeholder:#6a6c80;
 background:var(--sabidos-page)!important; color:var(--sabidos-text)!important;
}
body:has(.body-wrap) .hero {background:linear-gradient(135deg,var(--sabidos-page),var(--sabidos-page-end))!important}
body:has(.body-wrap) .site-header {background:var(--sabidos-page)!important;border-color:var(--sabidos-border)!important}
body:has(.body-wrap) .site-header a:not(.landing-nav-cta),
body:has(.body-wrap) .hero-title,body:has(.body-wrap) #appTitle,
body:has(.body-wrap) #newRoomTitle,body:has(.body-wrap) #joinRoomTitle,
body:has(.body-wrap) #appJoinDescription {color:var(--sabidos-text)!important}
body:has(.body-wrap) .hero-paragraph,body:has(.body-wrap) #appDescription,
body:has(.body-wrap) .section-paragraph {color:var(--sabidos-muted)!important}
body:has(.body-wrap) #loginForm,body:has(.body-wrap) #joinRoomForm,
body:has(.body-wrap) .cta-inner {background:var(--sabidos-card)!important;border-color:var(--sabidos-border)!important;color:var(--sabidos-text)!important}
body:has(.body-wrap) #loginForm label,body:has(.body-wrap) #loginForm h1,
body:has(.body-wrap) #loginForm h2,body:has(.body-wrap) #loginForm p {color:var(--sabidos-text)!important}
body:has(.body-wrap) input.form-input,body:has(.body-wrap) select.form-input,
body:has(.body-wrap) #roomName,body:has(.body-wrap) #joinRoomForm input {
 background:var(--sabidos-field)!important; color:var(--sabidos-text)!important;
 -webkit-text-fill-color:var(--sabidos-text)!important;caret-color:var(--sabidos-text)!important;
 border:1px solid var(--sabidos-border)!important;
}
body:has(.body-wrap) input.form-input::placeholder {color:var(--sabidos-placeholder)!important;opacity:1;-webkit-text-fill-color:var(--sabidos-placeholder)!important}
body:has(.body-wrap) input.form-input:focus {border-color:var(--sabidos-accent)!important;box-shadow:0 0 0 3px #6060b733!important}
body:has(.body-wrap) input.form-input:-webkit-autofill,
body:has(.body-wrap) input.form-input:-webkit-autofill:hover,
body:has(.body-wrap) input.form-input:-webkit-autofill:focus {
 -webkit-text-fill-color:var(--sabidos-text)!important;
 -webkit-box-shadow:0 0 0 1000px var(--sabidos-field) inset!important;
 caret-color:var(--sabidos-text)!important;
}
body:has(.body-wrap) input::selection {background:#6060b7;color:#fff;-webkit-text-fill-color:#fff}
body:has(.body-wrap) .login-input-group i {color:var(--sabidos-placeholder)!important}
body:has(.body-wrap) .site-footer,body:has(.body-wrap) .sabidos-footer {background:var(--sabidos-page-end)!important;color:var(--sabidos-muted)!important}
body:has(.body-wrap) .site-footer a,body:has(.body-wrap) .sabidos-footer a {color:var(--sabidos-accent)!important}
body:has(.body-wrap) .login-btn,body:has(.body-wrap) .join-room-btn {background:#506bbd!important;color:#fff!important}
@media(prefers-color-scheme:dark) {
 body:has(.body-wrap) {
 --sabidos-page:#151626; --sabidos-page-end:#202239; --sabidos-card:#25283f;
 --sabidos-text:#f2f1fa; --sabidos-muted:#c0bfd2; --sabidos-border:#454963;
 --sabidos-field:#1b1e31; --sabidos-accent:#b5aff2; --sabidos-placeholder:#aaaec5;
 }
 body:has(.body-wrap) #appTitle h1 {color:#b5aff2!important}
 body:has(.body-wrap) .cta-inner .button:not(.button-primary) {background:#353950!important;color:#ece9ff!important;border-color:#454963!important}
 body:has(.body-wrap) .hero::before,body:has(.body-wrap) .hero::after {opacity:.04!important}
}

/* Icon buttons must retain their glyph font. */
.fa,.fas,.fa-solid{font-family:"Font Awesome 6 Free"!important;font-weight:900!important}.far,.fa-regular{font-family:"Font Awesome 6 Free"!important;font-weight:400!important}.fab,.fa-brands{font-family:"Font Awesome 6 Brands"!important;font-weight:400!important}