:root{font-family:Inter,Pretendard,-apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans KR",sans-serif;color:#28362f;background:#faf9f6;font-synthesis:none}
*{box-sizing:border-box}body{margin:0;min-height:100vh;min-height:100dvh;display:grid;place-items:center;padding:32px 20px}.login-wrap{width:100%;max-width:420px}.brand{display:block;text-decoration:none;color:#263e32;font-size:26px;font-weight:800;letter-spacing:-1px}.intro{font-size:14px;color:#68736a;margin:10px 0 28px}.login-card{padding:30px;background:#fff;border:1px solid #e7e8e1;border-radius:18px;box-shadow:0 8px 30px #20302505}h1{font-size:23px;letter-spacing:-.6px;margin:0 0 12px}.hint{font-size:14px;line-height:1.65;color:#68736a;margin:0 0 24px}label{display:block;font-size:13px;font-weight:650;margin:18px 0 8px}input{display:block;width:100%;height:46px;padding:10px 12px;border:1px solid #dce1d9;border-radius:9px;background:#fff;font:inherit;font-size:16px;color:inherit}input:focus-visible,button:focus-visible,a:focus-visible{outline:3px solid #93bc9f;outline-offset:3px}button{width:100%;margin-top:24px;border:0;border-radius:9px;padding:14px;font:inherit;font-weight:700;background:#365b43;color:#fff;cursor:pointer}button:hover{background:#2a4935}button:disabled,input:disabled{opacity:.55;cursor:not-allowed}.notice{padding:12px 14px;border-radius:8px;background:#fff2ed;color:#8b3e29;font-size:14px;line-height:1.5}@media(max-width:420px){.login-card{padding:24px}.brand{font-size:24px}}


/* Minimal friend sign-in, 20261103. All rules are limited to the login page. */
body.minimal-login-page {
  color-scheme: light;
  min-width: 0;
  min-height: 100vh;
  min-height: 100svh;
  margin: 0;
  padding: max(24px, env(safe-area-inset-top, 0px)) max(16px, env(safe-area-inset-right, 0px)) max(24px, env(safe-area-inset-bottom, 0px)) max(16px, env(safe-area-inset-left, 0px));
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  place-items: center;
  background: #f5f6f8;
  color: #1f2937;
  font: 16px/1.5 -apple-system, BlinkMacSystemFont, "Segoe UI", "Apple SD Gothic Neo", "Malgun Gothic", sans-serif;
}
.minimal-login-page *,
.minimal-login-page *::before,
.minimal-login-page *::after {
  box-sizing: border-box;
}
.minimal-login-page .minimal-login-card {
  width: 100%;
  max-width: 360px;
  min-width: 0;
  margin: 0;
  padding: 24px;
  border: 1px solid #e1e5ea;
  border-radius: 16px;
  background: #fff;
  box-shadow: 0 6px 24px rgb(31 41 55 / 4%);
  text-align: left;
}
.minimal-login-page .minimal-login-form {
  position: relative;
  display: grid;
  gap: 12px;
  min-width: 0;
  margin: 0;
}
.minimal-login-page .minimal-login-label {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}
.minimal-login-page .minimal-login-form input[type="hidden"] {
  display: none;
}
.minimal-login-page .minimal-login-form input:not([type="hidden"]) {
  display: block;
  width: 100%;
  min-width: 0;
  min-height: 50px;
  height: 50px;
  margin: 0;
  padding: 12px 14px;
  border: 1px solid #c8cfd8;
  border-radius: 9px;
  background: #fff;
  color: #1f2937;
  font: inherit;
  font-size: 16px;
  line-height: 1.5;
}
.minimal-login-page .minimal-login-form input::placeholder {
  color: #687384;
  opacity: 1;
}
.minimal-login-page .minimal-login-button {
  display: block;
  width: 100%;
  min-width: 0;
  min-height: 50px;
  margin: 4px 0 0;
  padding: 12px 14px;
  border: 1px solid #263445;
  border-radius: 9px;
  background: #263445;
  color: #fff;
  font: inherit;
  font-size: 16px;
  font-weight: 700;
  line-height: 1.5;
  text-align: center;
  cursor: pointer;
}
.minimal-login-page .minimal-login-button:hover:not(:disabled) {
  border-color: #192534;
  background: #192534;
}
.minimal-login-page .minimal-login-form input:focus-visible,
.minimal-login-page .minimal-login-button:focus-visible {
  outline: 3px solid #728daf;
  outline-offset: 3px;
}
.minimal-login-page .minimal-login-form input:disabled,
.minimal-login-page .minimal-login-button:disabled {
  opacity: .55;
  cursor: not-allowed;
}
.minimal-login-page .minimal-login-message {
  margin: 0 0 16px;
  padding: 10px 12px;
  border: 1px solid #edcac6;
  border-radius: 9px;
  background: #fff3f1;
  color: #8b332a;
  font-size: 14px;
  line-height: 1.5;
  overflow-wrap: anywhere;
}
@media (max-width: 360px) {
  .minimal-login-page .minimal-login-card { padding: 20px; }
}
@media (max-height: 420px) {
  body.minimal-login-page { align-items: start; padding-top: 16px; padding-bottom: 16px; }
}
