.auth-shell { grid-template-columns: minmax(0,1.15fr) minmax(420px,.85fr); min-height: 100svh; background: radial-gradient(ellipse at top right,#ead8bb80,transparent 70%),var(--jx-bg); }
.auth-hero { min-height: 100svh; background: linear-gradient(0deg,#2c1c119e,transparent 76%),url('/assets/brand/login-wide.webp') 48% center/cover; }
.auth-hero-overlay { background: none; }
.auth-brand { position: absolute; z-index: 2; left: clamp(28px,4vw,70px); top: 34px; color: #fff3dd; }
.auth-brand .jx-brand { color: #fff3dd; }
.auth-brand .jx-brand-copy small { color: #fff3dd; }
.auth-hero-copy { padding: clamp(32px,5vw,76px); padding-top: 145px; }
.auth-hero-copy .auth-slogan { font-family: var(--jx-display); font-size: clamp(36px,3.25vw,58px); font-weight: 400; letter-spacing: 3px; line-height: 1.4; }
.auth-slogan span:last-child { color: #fff3dd; }
.auth-culture-label { border: 0; background: none; padding: 0; font-weight: 500; letter-spacing: 3px; }
.auth-entry-copy { color: #fff3dd; font-size: 13px !important; }
.auth-card { align-self: center; justify-self: center; width: calc(100% - 64px); max-width: 510px; margin: 44px 0; padding: 42px; border: 1px solid #fff; border-radius: 22px; background: #fffdf9f5; box-shadow: 0 20px 55px #68482512; gap: 24px; }
.auth-form { gap: 20px; }
.auth-copy h2 { font-family: var(--jx-display); font-size: 32px; font-weight: 500; }
.auth-copy p { color: var(--jx-muted); font-size: 14px; line-height: 1.7; }
.auth-form input { background: var(--jx-paper); min-height: 50px; }
.auth-form input:focus { border-color: var(--jx-primary); box-shadow: 0 0 0 3px #80603918; }
.auth-form label>span { color: var(--jx-text); font-size: 14px; }
.auth-card .primary-button { min-height: 52px; font-size: 16px; font-weight: 600; }
.auth-hint { padding: 16px 18px; border: 0; border-radius: 12px; background: #f2ebdf; color: var(--jx-muted); font-size: 13px; line-height: 1.65; }
.auth-hint strong { color: var(--jx-primary); }
.auth-register-link,.auth-back-link { min-height: 44px; padding: 4px 8px; color: var(--jx-primary); }
.pw-toggle { min-width: 44px; min-height: 44px; right: 4px; color: var(--jx-muted); }
.auth-field-hint { color: var(--jx-muted); line-height: 1.6; }
.auth-success { color: #466750; background: #eaf0e7; border-color: #c5d5c2; }
.auth-error { color: var(--jx-danger); background: #f8e7e1; border-color: #e4b7ad; }
@media(max-width:850px) {
  .auth-shell { grid-template-columns: 1fr; }
  .auth-hero { min-height: 240px; height: 240px; background-image: linear-gradient(0deg,#2c1c11a6,transparent 88%),url('/assets/brand/login-mobile.webp'); background-position: center 58%; }
  .auth-brand { top: 18px; left: 24px; gap: 8px; }
  .auth-brand .jx-brand-copy strong { font-size: 17px; }
  .auth-hero-copy { padding: 76px 26px 26px; }
  .auth-hero-copy .auth-slogan { font-size: 27px; line-height: 1.35; margin-bottom: 8px; letter-spacing: 2px; }
  .auth-kicker { font-size: 11px; margin-bottom: 6px; }
  .auth-culture-label { font-size: 11px !important; margin-bottom: 0 !important; letter-spacing: 1px; }
  .auth-entry-copy { display: none; }
  .auth-card { position: relative; width: 100%; max-width: none; margin: -16px 0 0; padding: 28px max(24px,env(safe-area-inset-right)) calc(28px + env(safe-area-inset-bottom)) max(24px,env(safe-area-inset-left)); border-radius: 22px 22px 0 0; gap: 16px; min-height: calc(100svh - 224px); box-shadow: none; }
  .auth-copy h2 { font-size: 27px; }
  .auth-copy p { font-size: 13px; }
  .auth-form { gap: 15px; }
  .auth-hint { font-size: 12px; padding: 14px; }
}
@media(max-width:370px) { .auth-hero { height: 218px; min-height: 218px; }.auth-hero-copy { padding-bottom: 22px; }.auth-hero-copy .auth-slogan { font-size: 24px; }.auth-card { min-height: calc(100svh - 202px); padding: 24px 22px; } }