/* Theme-aware member authentication. Legacy filename retained for existing asset paths. */
html[data-member-ui] {
  background:var(--theme-page);
}

.member-login-page {
  --paper:var(--theme-page);
  --page-bg:var(--theme-page);
  --surface:var(--theme-surface);
  --ink:var(--theme-ink);
  --muted:var(--theme-muted);
  --line:var(--theme-line);
  --accent:var(--theme-accent);
  --accent-soft:var(--theme-accent-soft);
  position:relative;
  min-width:0;
  min-height:100svh;
  justify-content:flex-start;
  background:var(--theme-page);
  color:var(--theme-ink);
}

.member-login-page ::selection { background:var(--theme-button); color:var(--theme-on-accent); }
.member-login-page :focus-visible { outline:3px solid var(--theme-accent); outline-offset:4px; }
.member-login-page .skip-link { background:var(--theme-button); color:var(--theme-on-accent); border-radius:8px; }

.member-login-page .login-topbar {
  position:absolute;
  top:0;
  right:0;
  z-index:4;
  width:50%;
  margin:0;
  padding:36px clamp(32px,4.5vw,72px);
  gap:20px;
}
.member-login-page .member-brand { gap:10px; color:var(--theme-ink); font-size:22px; letter-spacing:.07em; flex-shrink:0; }
.member-login-page .member-brand small { color:var(--theme-muted); font-size:7px; letter-spacing:.22em; margin-top:6px; }
.member-login-page .member-monogram {
  width:38px;
  height:42px;
  background:var(--theme-ink);
  color:var(--theme-page);
  border-radius:11px;
  box-shadow:none;
  font-size:21px;
}
.member-login-page .login-edition { color:var(--theme-muted); font-size:11px; white-space:nowrap; }
.member-login-page .login-edition .jing-icon { width:14px; color:var(--theme-accent); }
.member-login-page .login-topbar .member-theme-toggle { flex-shrink:0; margin-left:auto; }

.member-login-page .login-layout {
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  width:100%;
  min-height:100svh;
  margin:0;
  gap:0;
  flex:1;
}
.member-login-page .login-scene {
  position:relative;
  display:flex;
  flex-direction:column;
  min-height:100%;
  height:auto;
  padding:38px clamp(28px,4vw,64px) 34px;
  border:0;
  border-radius:0;
  background:#34383b;
  color:#fff;
  isolation:isolate;
}
.member-login-page .wardrobe-art {
  position:absolute;
  inset:0;
  z-index:-2;
  display:grid;
  grid-template-columns:1.08fr 1fr;
  width:100%;
  height:100%;
  min-height:0;
  margin:0;
  transform:none;
}
.auth-editorial-photo { display:block; width:100%; height:100%; min-width:0; object-fit:cover; object-position:50% 35%; }
.auth-editorial-men { border-left:1px solid #ffffff24; object-position:50% 35%; }
.member-login-page .login-scene::after {
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  pointer-events:none;
  background:linear-gradient(180deg,#10101036 0%,transparent 28%,#10101008 40%,#101010bd 77%,#101010eb 100%);
}
.member-login-page .scene-topline {
  position:relative;
  z-index:1;
  display:flex;
  justify-content:space-between;
  gap:16px;
  color:#ffffffd1;
  font-size:8px;
  font-weight:500;
  letter-spacing:.13em;
}
.member-login-page .scene-copy { margin-top:auto; padding-top:280px; }
.member-login-page .login-eyebrow { margin:0 0 16px; color:#ffffffb3; font-size:12px; letter-spacing:.16em; }
.member-login-page .scene-copy h1 { margin:0; color:#fff; font-size:clamp(40px,4.2vw,64px); line-height:1.28; font-weight:550; letter-spacing:.01em; }
.member-login-page .scene-copy h1 span { color:#fff; }
.member-login-page .scene-copy>p:last-child { display:block; color:#ffffffb8; font-size:13px; line-height:1.8; margin:22px 0 0; }
.member-login-page .scene-footer {
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:20px;
  margin-top:48px;
  padding-top:22px;
  border-top:1px solid #ffffff30;
  color:#ffffff9c;
  font-size:10px;
  letter-spacing:.1em;
}
.member-login-page .scene-footer>span:first-child { font-size:8px; line-height:1.6; letter-spacing:.13em; }

.member-login-page .login-controls {
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:100svh;
  padding:136px clamp(32px,5vw,80px) 94px;
  border-radius:0;
  background:var(--theme-page);
}
.member-login-page .login-form-wrap { width:100%; max-width:410px; min-width:0; }
.member-login-page .login-index { margin-bottom:14px; color:var(--theme-muted); font-size:9px; font-weight:500; letter-spacing:.14em; }
.member-login-page .login-form-wrap h2 { color:var(--theme-ink); font-size:34px; font-weight:550; letter-spacing:0; line-height:1.4; }
.member-login-page .login-subtitle { margin:9px 0 30px; color:var(--theme-muted); font-size:13px; line-height:1.75; }
.member-login-page .auth-mode-switch { gap:0; padding:0; margin:0 0 27px; border:0; border-bottom:1px solid var(--theme-line); border-radius:0; background:none; }
.member-login-page .auth-mode-button { position:relative; min-height:45px; padding:0 16px 12px; border-radius:0; color:var(--theme-muted); font-size:14px; }
.member-login-page .auth-mode-button.active { color:var(--theme-ink); background:none; box-shadow:none; font-weight:550; }
.member-login-page .auth-mode-button.active::after { content:""; position:absolute; left:0; right:0; bottom:-1px; height:2px; background:var(--theme-accent); }
.member-login-page .auth-mode-button:focus-visible { outline:3px solid var(--theme-accent); outline-offset:1px; border-radius:4px; }
.member-login-page #memberLoginForm { gap:21px; }
.member-login-page #memberRegisterForm { gap:17px; }
.member-login-page .auth-field label { color:var(--theme-ink); font-size:12px; font-weight:400; margin-bottom:9px; }
.member-login-page .auth-input { gap:10px; padding-left:15px; background:var(--theme-input); border:1px solid var(--theme-line); border-radius:8px; }
.member-login-page .auth-input>.jing-icon { color:var(--theme-muted); width:17px; }
.member-login-page .auth-input:focus-within { background:var(--theme-input); border-color:var(--theme-accent); box-shadow:0 0 0 3px var(--theme-accent-soft); }
.member-login-page .auth-input:has(input[aria-invalid=true]) { border-color:var(--theme-danger); box-shadow:0 0 0 3px var(--theme-danger-bg); }
.member-login-page .auth-input input { color:var(--theme-ink); background:transparent; height:51px; padding-right:12px; font-size:14px; caret-color:var(--theme-ink); }
.member-login-page .auth-input input::placeholder { color:var(--theme-subtle); font-size:12px; opacity:1; }
.member-login-page .auth-input input:-webkit-autofill,
.member-login-page .auth-input input:-webkit-autofill:hover,
.member-login-page .auth-input input:-webkit-autofill:focus { -webkit-text-fill-color:var(--theme-ink); -webkit-box-shadow:0 0 0 1000px var(--theme-input) inset!important; caret-color:var(--theme-ink); }
.member-login-page .auth-input input:autofill { color:var(--theme-ink); background:var(--theme-input); box-shadow:0 0 0 1000px var(--theme-input) inset!important; }
.member-login-page .password-toggle { min-width:46px; border-radius:7px; color:var(--theme-muted); }
.member-login-page .password-toggle:hover { color:var(--theme-ink); background:var(--theme-raised); }
.member-login-page .auth-code-input { grid-template-columns:minmax(0,1fr) 112px; gap:9px; }
.member-login-page .code-button { min-width:0; padding:0 10px; background:var(--theme-raised); color:var(--theme-ink); border:1px solid var(--theme-line); border-radius:8px; font-size:11px; }
.member-login-page .code-button:hover:not(:disabled) { background:var(--theme-accent-soft); border-color:var(--theme-accent); color:var(--theme-accent); }
.member-login-page .code-button:disabled { color:var(--theme-subtle); border-color:var(--theme-line); background:var(--theme-input); }
.member-login-page .auth-submit { min-height:52px; margin-top:3px; padding:15px 19px; background:var(--theme-button); border-color:var(--theme-button); color:var(--theme-on-accent)!important; border-radius:8px; box-shadow:none; font-size:13px; font-weight:500; }
.member-login-page .auth-submit:hover { background:var(--theme-button-hover); border-color:var(--theme-button-hover); box-shadow:0 0 0 3px var(--theme-accent-soft); }
.member-login-page .auth-submit:disabled { opacity:.65; }
.member-login-page .auth-feedback { background:var(--theme-danger-bg); border-color:var(--theme-danger); border-radius:8px; color:var(--theme-danger); font-size:12px; }
.member-login-page #registrationAvailability { background:var(--theme-accent-soft); border-color:var(--theme-line); color:var(--theme-accent); }
.member-login-page .register-note { color:var(--theme-muted); font-size:11px; line-height:1.8; }
.member-login-page .login-help { margin-top:22px; gap:8px; color:var(--theme-muted); font-size:11px; line-height:1.85; }
.member-login-page .login-help .jing-icon { color:var(--theme-muted); width:14px; height:16px; }
.member-login-page .login-help b { display:block; color:var(--theme-ink); font-weight:400; }
.member-login-page .login-points { margin-top:27px; padding-top:22px; border-color:var(--theme-line); }
.member-login-page .login-points>.jing-icon { color:var(--theme-accent); }
.member-login-page .login-points strong { color:var(--theme-ink); font-size:11px; font-weight:400; }
.member-login-page .login-points p { color:var(--theme-muted); margin:9px 0 6px; font-size:10px; gap:10px; }
.member-login-page .login-points p span { background:var(--theme-line); }
.member-login-page .login-points small { color:var(--theme-muted); font-size:10px; line-height:1.7; }
.member-login-page .login-success { padding:12px 0; }
.member-login-page .success-seal { background:var(--theme-accent-soft); color:var(--theme-accent); border-radius:12px; }
.member-login-page .login-success h3 { color:var(--theme-ink); font-size:24px; }
.member-login-page .login-success p { color:var(--theme-muted); line-height:1.8; }
.member-login-page .login-footer { position:absolute; bottom:0; right:0; width:50%; margin:0; padding:24px clamp(32px,4.5vw,72px); color:var(--theme-muted); font-size:9px; letter-spacing:.02em; gap:18px; }
.member-login-page .login-footer>span { min-width:0; }
.member-login-page .login-footer .jing-icon { color:var(--theme-subtle); }

@media (hover:hover) {
  [data-member-ui] .member-login-page button:not(:disabled):hover,
  [data-member-ui] .member-login-page .auth-submit:hover { scale:1; }
  .member-login-page .auth-mode-button:hover { color:var(--theme-ink); }
}

@media (min-width:801px) and (max-width:1100px) {
  .member-login-page .login-layout { grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); }
  .member-login-page .login-topbar,.member-login-page .login-footer { width:55%; }
  .member-login-page .login-controls { padding-left:36px; padding-right:36px; }
  .member-login-page .scene-topline>span:last-child { display:none; }
  .member-login-page .scene-copy h1 { font-size:44px; }
  .member-login-page .login-edition { display:none; }
}

@media (max-width:800px) {
  .member-login-page .login-topbar { position:relative; width:100%; padding:21px 24px; }
  .member-login-page .member-brand { font-size:20px; }
  .member-login-page .member-monogram { width:32px; height:36px; border-radius:9px; font-size:18px; }
  .member-login-page .member-brand small { font-size:6px; margin-top:5px; }
  .member-login-page .login-edition { display:none; }
  .member-login-page .login-layout { display:flex; flex-direction:column; width:100%; min-height:0; flex:0; }
  .member-login-page .login-scene { height:210px; min-height:210px; padding:20px 24px 23px; border-radius:0; }
  .member-login-page .wardrobe-art { grid-template-columns:1fr 1fr; }
  .member-login-page .auth-editorial-photo { object-position:50% 12%; }
  .member-login-page .login-scene::after { background:linear-gradient(180deg,#10101016 0%,#10101008 22%,#10101040 46%,#101010c9 100%); }
  .member-login-page .scene-topline { font-size:7px; letter-spacing:.12em; }
  .member-login-page .scene-topline>span:last-child { display:none; }
  .member-login-page .scene-copy { margin-top:auto; padding-top:0; }
  .member-login-page .login-eyebrow { margin-bottom:7px; font-size:9px; }
  .member-login-page .scene-copy h1 { font-size:26px; line-height:1.23; letter-spacing:.02em; }
  .member-login-page .scene-copy>p:last-child,.member-login-page .scene-footer { display:none; }
  .member-login-page .login-controls { min-height:0; padding:33px 24px 34px; border-radius:0; }
  .member-login-page .login-form-wrap { max-width:410px; }
  .member-login-page .login-index { margin-bottom:9px; font-size:8px; }
  .member-login-page .login-form-wrap h2 { font-size:28px; }
  .member-login-page .login-subtitle { margin:8px 0 22px; font-size:12px; }
  .member-login-page .auth-mode-switch { margin-bottom:24px; }
  .member-login-page .auth-mode-button { min-height:43px; font-size:13px; }
  .member-login-page #memberLoginForm { gap:20px; }
  .member-login-page #memberRegisterForm { gap:17px; }
  .member-login-page .auth-input input { font-size:16px; }
  .member-login-page .auth-input input::placeholder { font-size:12px; }
  .member-login-page .login-help { margin-top:21px; }
  .member-login-page .login-points { margin-top:24px; padding-top:21px; }
  .member-login-page .login-footer { position:static; width:100%; max-width:458px; margin:auto auto 0; padding:0 24px 24px; flex-wrap:wrap; gap:10px; font-size:8px; }
  .member-login-page .login-footer>span:last-child { font-size:8px; }
}

@media (max-width:360px) {
  .member-login-page .login-topbar { padding:18px 20px; gap:12px; }
  .member-login-page .login-edition { font-size:9px; }
  .member-login-page .login-scene { height:190px; min-height:190px; padding:18px 20px 21px; }
  .member-login-page .scene-copy h1 { font-size:24px; }
  .member-login-page .login-controls { padding:30px 20px; }
  .member-login-page .auth-code-input { grid-template-columns:minmax(0,1fr) 106px; gap:8px; }
  .member-login-page .auth-code-input .auth-input { padding-left:12px; gap:8px; }
  .member-login-page .code-button { padding:0 8px; font-size:10px; }
  .member-login-page .login-footer { padding-left:20px; padding-right:20px; }
}

@media (prefers-reduced-motion:reduce) {
  html[data-member-ui] { scroll-behavior:auto; }
  .member-login-page *, .member-login-page *::before, .member-login-page *::after { animation:none!important; transition:none!important; }
  [data-member-ui] .member-login-page button:not(:disabled):active,
  [data-member-ui] .member-login-page .auth-submit:active { scale:1; }
}
