html:not([data-remote-state="ready"]) body > :not(#remote-login):not(script) { display: none !important; }
html:not([data-remote-state="ready"]) body { margin: 0; min-height: 100vh; overflow: auto; }
html[data-remote-state="ready"] #remote-login { display: none !important; }
.remote-login { box-sizing: border-box; min-height: 100svh; display: grid; place-items: center; padding: 28px 20px; background: #eef5fc; color: #20384d; font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei", sans-serif; }
.remote-login-card { box-sizing: border-box; width: min(100%, 430px); padding: 34px; border: 1px solid #fff; border-radius: 26px; background: rgba(255,255,255,.87); box-shadow: 0 20px 65px #274f6f12; }
.remote-login-logo { display: block; object-fit: contain; }
.remote-login-brand { margin: 18px 0 8px; font-size: 14px; color: #56738a; }
.remote-login h1 { margin: 0; font-size: clamp(23px, 5vw, 28px); line-height: 1.4; letter-spacing: -.03em; }
.remote-login-description { margin: 12px 0 26px; font-size: 14px; line-height: 1.75; color: #5b7183; }
.remote-login form { display: grid; gap: 10px; }
.remote-login label { font-size: 14px; font-weight: 600; }
.remote-login input { box-sizing: border-box; min-width: 0; width: 100%; border: 1px solid #c6d6e4; border-radius: 12px; background: #fff; padding: 13px 14px; color: #20384d; font-size: 17px; }
.remote-login button { margin-top: 5px; border: 0; border-radius: 12px; min-height: 46px; padding: 12px 18px; background: #267aaf; color: #fff; font: inherit; font-weight: 600; cursor: pointer; }
.remote-login input:focus-visible, .remote-login button:focus-visible, .remote-logout:focus-visible { outline: 3px solid #5aa9dc; outline-offset: 3px; }
.remote-login button:disabled { opacity: .55; cursor: default; }
.remote-login-status { min-height: 1.7em; margin: 14px 0; color: #8b4b22; line-height: 1.7; font-size: 13px; overflow-wrap: anywhere; }
.remote-login-scope { margin: 22px 0 0; border-top: 1px solid #e2ebf3; padding-top: 18px; color: #6c8090; font-size: 12px; line-height: 1.8; }
.remote-logout { background: transparent; border: 0; color: inherit; opacity: .72; padding: 6px 0; font: inherit; font-size: 12px; text-align: left; cursor: pointer; }
html[data-remote-state="ready"] .group-live-label { display: block; flex: 0 1 auto; max-width: 46%; white-space: normal; line-height: 1.5; }
html[data-remote-state="ready"] .group-list-foot > small { display: block; width: 100%; line-height: 1.5; }
html[data-theme="dark"] .remote-login { background: #101e2c; color: #e8f2fa; }
html[data-theme="dark"] .remote-login-card { background: #192b3b; border-color: #31485c; }
html[data-theme="dark"] .remote-login input { background: #122232; border-color: #466075; color: #e8f2fa; }
html[data-theme="dark"] .remote-login-description, html[data-theme="dark"] .remote-login-brand, html[data-theme="dark"] .remote-login-scope { color: #adc2d3; }
html[data-theme="dark"] .remote-login-status { color: #e7b484; }
@media (max-width: 480px) { .remote-login-card { padding: 27px 23px; } }