:root {
  color-scheme: light;
  --ink: #273c35;
  --muted: #7a847c;
  --border: #e4e6de;
  --green: #45674c;
  --cream: #f6f5ee;
}
.login-pf body {
  background: var(--cream);
  color: var(--ink);
  font-family: "Apple SD Gothic Neo", "Noto Sans KR", system-ui, sans-serif;
}
.login-pf-page { padding: 24px 20px 32px; }
#kc-header { color: var(--ink); }
#kc-header-wrapper {
  padding: 8px 0 24px;
  font-size: 30px;
  font-weight: 750;
  letter-spacing: -1px;
  text-transform: none;
}
#kc-header-wrapper::before {
  content: "";
  display: block;
  width: 160px;
  height: 160px;
  margin: 0 auto 12px;
  background: url('../img/zipsa-lab.png') center / contain no-repeat;
}
#kc-header-wrapper::after {
  content: "LINE COLOR STUDIO";
  display: block;
  margin-top: 9px;
  color: var(--muted);
  font-size: 10px;
  font-weight: 600;
  letter-spacing: 2px;
}
.login-pf-page .card-pf {
  max-width: 440px;
  padding: 36px;
  border: 1px solid var(--border);
  border-radius: 18px;
  box-shadow: 0 12px 35px #24372b08;
}
#kc-page-title { font-size: 22px; font-weight: 650; letter-spacing: -.7px; }
.pf-c-form__label-text { color: var(--ink); font-size: 13px; }
.pf-c-form-control {
  height: 44px;
  border: 1px solid var(--border);
  border-radius: 7px;
  color: var(--ink);
  font: inherit;
}
.pf-c-button.pf-m-control { border-radius: 0 7px 7px 0; }
.pf-c-button.pf-m-primary {
  min-height: 44px;
  border-radius: 7px;
  background: var(--green);
  color: white;
  font: inherit;
  font-weight: 650;
}
.pf-c-button.pf-m-primary:hover { background: #36533c; }
.studio-copyright {
  margin: 24px 0 0;
  color: var(--muted);
  text-align: center;
  font-size: 12px;
}
input:focus-visible, button:focus-visible, a:focus-visible {
  outline: 3px solid #5a8060;
  outline-offset: 3px;
}
@media (max-width: 480px) {
  .login-pf-page { padding: 16px 16px 24px; }
  .login-pf-page .card-pf { padding: 28px 24px; }
  #kc-header-wrapper { padding: 8px 0 24px; text-align: center; }
  #kc-header-wrapper::before { width: 128px; height: 128px; }
}
