@import url('https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&display=swap');
:root{
  --cf-void:#070512;--cf-deep:#0E0A24;--cf-surface:#171134;--cf-line:#241B4A;
  --cf-blue:#3800FF;--cf-orange:#FF5A00;--cf-star:#EDEAFB;--cf-dim:#8E88C0;--cf-faint:#5F5A98;
}
body,.login-container{background:radial-gradient(1100px 760px at 50% -25%,#0F0B22 0%,var(--cf-void) 72%)!important;color:var(--cf-star);font-family:'Space Grotesk',system-ui,sans-serif;}
/* ---- login box ---- */
.login-box{background:var(--cf-deep);border:1px solid var(--cf-line);border-radius:12px;box-shadow:0 12px 44px rgba(0,0,0,.55);padding:30px 28px;max-width:360px;margin:9vh auto 0;}
.cf-wordmark{font-weight:600;font-size:1.35rem;letter-spacing:.01em;text-align:center;margin-bottom:3px;color:var(--cf-star);}
.cf-sub{text-align:center;color:var(--cf-faint);font-size:.82rem;margin-bottom:22px;}
#loginform label{color:var(--cf-dim);font-size:.8rem;}
#username,#password{background:var(--cf-surface)!important;border:1px solid var(--cf-line)!important;color:var(--cf-star)!important;border-radius:7px;width:100%;padding:10px;}
#username:focus,#password:focus{outline:none;box-shadow:0 0 0 2px rgba(56,0,255,.30)!important;border-color:var(--cf-blue)!important;}
#passwordform{display:none;}
.host-mode #passwordform{display:block;}
#connectbutton{background:var(--cf-orange)!important;border:none!important;color:#fff!important;font-weight:600;border-radius:7px;width:100%;padding:11px;cursor:pointer;transition:filter .15s;}
#connectbutton:hover{filter:brightness(1.07);}
#cf-hostlink{display:block;text-align:center;margin-top:18px;color:var(--cf-faint);font-size:.74rem;cursor:pointer;}
#cf-hostlink:hover{color:var(--cf-dim);text-decoration:underline;}
/* ---- top banner (was purple #610a86) ---- */
.navbar,.topnav,.nav-fixed .topnav{background:var(--cf-deep)!important;border-bottom:1px solid var(--cf-line)!important;box-shadow:none!important;}
.header-title,#title{color:var(--cf-star)!important;font-family:'Space Grotesk',sans-serif;}
#title{font-size:0!important;}
#title::after{content:"Chris Miller's Room";font-size:1.05rem;font-weight:600;color:var(--cf-star);}
.nav-menu a,.navbar a,#sidebarCollapse i{color:var(--cf-dim)!important;}
/* ---- left column / user list / chat (was white) ---- */
.coln-left,#left,#left-sidebar,#users,#chatbox,#chat,.bg-white{background:var(--cf-void)!important;color:var(--cf-star)!important;}
.users-header{background:var(--cf-void)!important;border-bottom:1px solid var(--cf-line)!important;color:var(--cf-dim)!important;}
#users>div{color:var(--cf-star)!important;}
#users>div:hover{background:var(--cf-surface)!important;}
/* ---- settings sidenav ---- */
.sidenav,.sidenav-content,.sidenav-header{background:var(--cf-deep)!important;color:var(--cf-star)!important;}
.sidenav a,.sidenav-label,.sidenav-label-first,.sidenav-header h2{color:var(--cf-dim)!important;}
.sidenav select,.sidenav input{background:var(--cf-surface)!important;color:var(--cf-star)!important;border:1px solid var(--cf-line)!important;}
/* ---- landing (index.html) ---- */
.navbar-brand,#title{color:var(--cf-star)!important;font-family:'Space Grotesk',sans-serif;}
.cf-landing{max-width:380px;margin:12vh auto 0;background:var(--cf-deep);border:1px solid var(--cf-line);border-radius:12px;box-shadow:0 12px 44px rgba(0,0,0,.55);padding:30px 28px;text-align:center;}
.cf-landing .cf-sub{margin-bottom:18px;}
#groupform{display:flex;gap:8px;align-items:center;justify-content:center;flex-wrap:wrap;}
#groupform label{display:none;}
#group{background:var(--cf-surface)!important;border:1px solid var(--cf-line)!important;color:var(--cf-star)!important;border-radius:7px;padding:10px;flex:1;min-width:180px;}
#group:focus{outline:none;box-shadow:0 0 0 2px rgba(56,0,255,.30)!important;border-color:var(--cf-blue)!important;}
#submitbutton{background:var(--cf-orange)!important;border:none!important;color:#fff!important;font-weight:600;border-radius:7px;padding:10px 18px;cursor:pointer;}
#public-groups{display:none!important;}
/* subtle, professional footer */
body>p:last-of-type,.footer{color:var(--cf-faint)!important;font-size:.68rem;text-align:center;margin-top:30px;}
body>p:last-of-type a{color:var(--cf-faint)!important;}
/* ---- kill stray Galène + clean the in-call chrome (was white) ---- */
.galene-header{display:none!important;}
#left-sidebar,#left,.coln-left,#users,#chat,#chatbox{background:var(--cf-void)!important;border-color:var(--cf-line)!important;}
#left-sidebar{border-right:1px solid var(--cf-line)!important;}
#input,.form-reply,textarea.form-reply{background:var(--cf-surface)!important;color:var(--cf-star)!important;border:1px solid var(--cf-line)!important;border-radius:6px;}
#inputform{background:var(--cf-void)!important;}
#inputbutton{background:var(--cf-surface)!important;color:var(--cf-star)!important;border:1px solid var(--cf-line)!important;border-radius:6px;}
.close-chat,#close-chat,#chat i{color:var(--cf-dim)!important;}
/* mute the open-source footer credit (keep it, but subtle not blue) */
a[href*="galene.org"],a[rel="author"]{color:var(--cf-faint)!important;text-decoration:none;}
/* ---- in-call Record / Leave buttons ---- */
.cf-callbtn{background:var(--cf-surface);color:var(--cf-star);border:1px solid var(--cf-line);border-radius:7px;padding:7px 14px;font-weight:600;cursor:pointer;margin-left:8px;font-family:'Space Grotesk',sans-serif;}
.cf-callbtn:hover{filter:brightness(1.12);}
#cf-record.recording{background:#FF3355!important;border-color:#FF3355!important;color:#fff!important;}
.cf-leave{background:#FF3355!important;border-color:#FF3355!important;color:#fff!important;}
/* ---- main video area (was white) ---- */
.coln-right,#right,#video-container,#expand-video,#peers,#mainrow{background:var(--cf-void)!important;}
html,body{background:var(--cf-void)!important;}