/* The login shares the compact dashboard palette; journal styles stay scoped. */
.login-screen {
  --ink: #14140f;
  --muted: #818177;
  --green: #14140f;
  --lime: #ebc017;
  --line: #e6e4dc;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 100dvh;
  padding: 36px;
  background: #f4f3ef;
  color: var(--ink);
  font-family: Manrope, Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}
.login-frame {
  display: grid;
  grid-template-columns: .95fr 1.05fr;
  width: 100%;
  max-width: 1060px;
  min-height: 640px;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 12px;
  overflow: hidden;
}
.login-brand-panel {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: 50px;
  padding: 42px;
  background: #ebc017;
}
.login-panel-brand {display: flex; align-items: center; justify-content: space-between; gap: 16px}
.login-panel-brand>span {font-size: 31px; font-weight: 650; letter-spacing: -1px}
.login-panel-brand>small {font-size: 8px; letter-spacing: 1.5px; color: #5b4b13}
.login-panel-copy>p {font-size: 8px; font-weight: 600; letter-spacing: 1.2px; color: #5b4b13}
.login-panel-copy h2 {font-size: clamp(42px, 4vw, 57px); font-weight: 550; line-height: 1.08; letter-spacing: -2.4px; margin: 20px 0}
.login-panel-copy>span {font-size: 13px; line-height: 1.7; color: #514517}
.login-panel-topics {display: flex; flex-direction: column}
.login-panel-topics>span {display: flex; gap: 20px; align-items: center; padding: 13px 0; border-top: 1px solid #14140f2b; font-size: 12px; font-weight: 500}
.login-panel-topics small {font-size: 9px; color: #685617}
.login-screen .login-card {width: 100%; max-width: 490px; padding: 48px 54px; margin: auto; min-width: 0}
.login-screen .login-card .brand {margin-bottom: 40px; font-size: 29px; letter-spacing: -1px; color: var(--ink)}
.login-screen .brand-mark {background: #ebc017; color: #14140f; border-radius: 10px}
.login-screen .private-label {color: var(--muted); border-left-color: var(--line); font-size: 9px; padding-left: 12px}
.login-screen .login-card>.eyebrow {font-size: 8px; letter-spacing: 1.5px; margin-bottom: 11px; color: var(--muted)}
.login-screen .login-card h1 {font-size: 35px; font-weight: 550; line-height: 1.2; letter-spacing: -1.3px}
.login-screen .login-card>.muted {font-size: 12px; line-height: 1.75; color: var(--muted); margin: 13px 0 28px}
.login-screen label {font-size: 11px; font-weight: 500; color: #515148; gap: 8px; margin-bottom: 18px}
.login-screen input {min-height: 48px; padding: 12px 14px; border: 1px solid var(--line); border-radius: 7px; background: #fafaf7; color: var(--ink); font-size: 16px; box-shadow: none; caret-color: #14140f}
.login-screen input:hover {border-color: #cac7b8}
.login-screen input:focus-visible,.login-screen button:focus-visible {outline: 3px solid #b09b40; outline-offset: 3px}
.login-screen input:autofill {box-shadow: 0 0 0 100px #fffce9 inset; color: #14140f}
.login-screen .primary {min-height: 48px; padding: 12px 16px; border-radius: 7px; background: #14140f; color: #fff; font-size: 12px; font-weight: 500}
.login-screen .primary:hover {background: #33332a}
.login-screen .primary>span {font-size: 18px; line-height: 1; color: #ebc017}
.login-screen .login-card>.fine {font-size: 10px; line-height: 1.7; color: var(--muted); margin-top: 18px}
.login-screen .login-card>.error:not(:empty) {font-size: 12px; color: #514517; background: #fcf6dc; border: 1px solid #e7dca4; border-radius: 7px; padding: 10px 12px; margin: 0 0 16px}
@media(max-width: 1000px) {
  .login-screen {padding: 26px}
  .login-brand-panel {padding: 32px}
  .login-screen .login-card {padding: 42px 34px}
  .login-panel-brand>small {font-size: 7px; letter-spacing: 1px}
}
@media(max-width: 760px) {
  .login-screen {padding: 24px 16px}
  .login-frame {display: block; max-width: 460px; min-height: 0; border-top: 4px solid #ebc017; border-radius: 10px}
  .login-brand-panel {display: none}
  .login-screen .login-card {padding: 32px 27px}
  .login-screen .login-card .brand {margin-bottom: 34px}
  .login-screen .login-card h1 {font-size: 31px; letter-spacing: -1.1px}
}
@media(max-width: 360px) {
  .login-screen {padding: 18px 12px}
  .login-screen .login-card {padding: 28px 21px}
  .login-screen .login-card h1 {font-size: 28px}
  .login-screen .login-card>.muted {font-size: 11px}
}