body:not(.planner-auth-ready) > :not(#planner-login) { visibility: hidden !important; }
body.planner-auth-ready:not(.planner-logged-in) > :not(#planner-login) { display: none !important; }
#planner-login { display: none; min-height: 100dvh; box-sizing: border-box; padding: 24px; place-items: center; background: #f3f0e8; color: #20251f; font-family: "DM Sans", Arial, sans-serif; }
body.planner-auth-ready:not(.planner-logged-in) #planner-login { display: grid; }
.planner-login-card { width: min(100%, 410px); box-sizing: border-box; padding: 32px; background: #fff; border: 1px solid #d9dad0; border-radius: 14px; box-shadow: 0 14px 45px #20251f12; }
.planner-login-mark { color: #20251f; font-family: Georgia, serif; font-size: 25px; line-height: 1.1; letter-spacing: .04em; }
.planner-login-mark span { display: block; margin-top: 7px; font: 600 10px Arial, sans-serif; letter-spacing: .2em; }
.planner-login-card h1 { margin: 30px 0 8px; font: 600 26px Arial, sans-serif; }
.planner-login-card p { color: #6a6d64; line-height: 1.55; }
.planner-login-card label { display: block; margin-top: 18px; font-size: 13px; font-weight: 600; }
.planner-login-card input { display: block; box-sizing: border-box; width: 100%; margin-top: 7px; padding: 12px; border: 1px solid #c9cbc1; border-radius: 8px; font: inherit; }
.planner-login-card button { width: 100%; margin-top: 22px; padding: 13px; border: 0; border-radius: 8px; background: #20251f; color: #fff; font: 600 15px Arial, sans-serif; cursor: pointer; }
.planner-login-card button:disabled { opacity: .6; cursor: wait; }
#planner-login-error { min-height: 1.2em; color: #a52222; font-size: 13px; }
#planner-signout { margin-left: auto; border: 0; background: transparent; color: #6a6d64; font: inherit; font-size: 12px; cursor: pointer; }