/* v127: one guild identity; three palettes. Auth fields and dialog safety stay shared. */
:root[data-appearance="classic"] #loginModal {
  --access-brand:#12231d;--access-brand-glow:#567257;--access-brand-ink:#f2edda;
  --access-brand-muted:#c7ccb8;--access-metal:#d5c18b;--access-radius:18px;
}
:root[data-appearance="cloud"] #loginModal {
  --access-brand:#dce9d9;--access-brand-glow:#a8c4a1;--access-brand-ink:#294b3d;
  --access-brand-muted:#466151;--access-metal:#496e4c;--access-radius:28px;
}
:root[data-appearance="maple"] #loginModal {
  --access-brand:#0e2138;--access-brand-glow:#43688a;--access-brand-ink:#f0eee6;
  --access-brand-muted:#b7c9d9;--access-metal:#d8c18f;--access-radius:20px;
}
:root[data-appearance] #loginModal {
  grid-template-columns:minmax(0,1fr);justify-items:center;
  & .member-access-dialog {
    --dialog-gutter:0px;width:min(960px,100%)!important;max-width:960px!important;
    padding:0!important;border-radius:var(--access-radius)!important;
    border:1px solid var(--ui-line)!important;background:var(--ui-panel)!important;
    box-shadow:0 32px 100px #0008,0 0 0 1px #ffffff08!important;
    overflow:auto;scrollbar-gutter:stable;scroll-padding-top:76px;
  }
  & .dialog-close-bar {margin:0!important;padding:8px 14px 8px 24px;background:var(--ui-panel);border-bottom:1px solid var(--ui-line)}
  & .dialog-chrome-brand {letter-spacing:.28em;font-size:13px;color:var(--ui-muted)}
  & .dialog-close-bar .modal-close {border-radius:10px!important;background:transparent!important;min-width:88px!important}
  & .member-access-layout {display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);min-width:0}
  & .member-access-brand {
    position:relative;isolation:isolate;display:flex;flex-direction:column;align-items:center;justify-content:center;
    gap:26px;min-width:0;padding:38px 28px;background:var(--access-brand);overflow:hidden;
    color:var(--access-brand-ink);border-right:1px solid var(--ui-line);text-align:center;
  }
  & .member-access-brand:before {
    content:'';position:absolute;inset:0;z-index:-2;pointer-events:none;
    background:linear-gradient(180deg,transparent,var(--access-brand) 94%),url('assets/zhuyu-world-bg-desktop-v24-v78.webp') center/cover;
    opacity:.2;
  }
  & .member-access-brand:after {
    content:'';position:absolute;z-index:-1;width:390px;height:390px;top:50%;left:50%;transform:translate(-50%,-58%);
    border:1px solid color-mix(in srgb,var(--access-metal) 23%,transparent);border-radius:50%;pointer-events:none;
    background:radial-gradient(ellipse,var(--access-brand-glow) 0%,transparent 67%);
    box-shadow:0 0 0 27px color-mix(in srgb,var(--access-metal) 2%,transparent),0 0 0 28px color-mix(in srgb,var(--access-metal) 9%,transparent);
  }
  & .member-access-edition {font:600 11px/1.5 'Noto Sans TC',sans-serif;letter-spacing:.26em;color:var(--access-brand-muted)}
  & .member-access-identity {position:relative;display:flex;flex-direction:column;align-items:center;gap:12px}
  & .member-access-emblem {display:block;width:176px;height:176px;object-fit:contain;filter:drop-shadow(0 12px 20px #0004)}
  & .member-access-wordmark {display:flex;flex-direction:column;gap:8px}
  & .member-access-wordmark strong {font:900 48px/1.2 'Noto Serif TC',serif;letter-spacing:.18em;padding-left:.18em;color:var(--access-brand-ink)}
  & .member-access-wordmark span {font-size:11px;letter-spacing:.17em;color:var(--access-brand-muted)}
  & .member-access-welcome {margin:0;color:var(--access-brand-ink)!important;font:600 22px/1.75 'Noto Serif TC',serif;letter-spacing:.035em}
  & .member-access-trail {display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:8px;font-size:11px;letter-spacing:.04em;color:var(--access-brand-muted);padding-top:6px}
  & .member-access-trail i {width:3px;height:3px;background:var(--access-metal);transform:rotate(45deg)}
  & .member-access-form {min-width:0;padding:38px 44px 32px;align-self:center}
  & .member-access-kicker {color:var(--ui-accent)!important;font:700 11px/1.6 'Noto Sans TC',sans-serif;letter-spacing:.14em}
  & #loginTitle {font:800 32px/1.4 'Noto Serif TC',serif!important;letter-spacing:.015em;margin:7px 0 9px!important;color:var(--ui-ink)!important}
  & #loginHint {font:400 13px/1.85 'Noto Sans TC',sans-serif;color:var(--ui-muted)!important;margin:0;max-width:35em}
  & #loginForm {display:grid;gap:17px;margin:26px 0 0;min-width:0}
  & #loginForm>label:not(.password-visibility-toggle) {display:grid!important;gap:8px;font:600 12px/1.6 'Noto Sans TC',sans-serif;color:var(--ui-ink)!important}
  & #loginForm>label:before {display:none!important}
  & #loginForm input:not([type="checkbox"]) {
    display:block;width:100%;min-width:0;min-height:52px;margin:0!important;padding:13px 15px;
    border:1px solid var(--ui-control-line)!important;border-radius:10px!important;
    background:var(--ui-inset)!important;color:var(--ui-ink)!important;
    font:400 16px/1.5 'Noto Sans TC',sans-serif;box-shadow:inset 0 1px 3px #00000008!important;
  }
  & #loginForm input:not([type="checkbox"]):focus {border-color:var(--ui-accent)!important;outline:2px solid var(--ui-accent)!important;outline-offset:3px}
  & .password-visibility-toggle {min-height:44px;margin-top:-8px;margin-bottom:-7px;font-size:12px!important;color:var(--ui-muted)!important;gap:10px!important}
  & .password-visibility-toggle input {flex:0 0 auto}
  & #loginSubmit {
    position:relative;display:block;width:100%;min-height:54px;padding:14px 42px;margin:0;
    border:1px solid var(--ui-accent)!important;border-radius:10px!important;
    background:var(--ui-accent)!important;color:var(--ui-on-accent)!important;
    font:800 15px/1.5 'Noto Sans TC',sans-serif;letter-spacing:.1em;
    box-shadow:0 5px 14px #00000015!important;transition:filter .15s,transform .15s;
  }
  & #loginSubmit:before {display:none!important}
  & #loginSubmit:after {content:'→';position:absolute;inset:auto 18px auto auto;top:50%;transform:translateY(-50%);background:none!important;border:0!important;font-size:19px;pointer-events:none}
  & #loginSubmit:hover:not(:disabled) {filter:brightness(1.06);transform:translateY(-1px)}
  & #loginSubmit:active:not(:disabled) {transform:translateY(0)}
  & #loginState {min-height:0;margin:0;text-align:left;white-space:pre-wrap;overflow-wrap:anywhere}
  & #loginState:not(:empty) {margin-top:16px;padding:12px 14px;border-left:3px solid var(--ui-accent);border-radius:0 8px 8px 0;background:var(--ui-raised);color:var(--ui-ink)!important;font-size:13px;line-height:1.7}
  & .login-secondary-actions {display:flex;flex-direction:column;align-items:stretch;gap:14px;margin-top:12px}
  & .login-secondary-actions .text-button {margin:0;min-height:44px;font:600 12px/1.6 'Noto Sans TC',sans-serif;border-radius:10px!important;box-shadow:none!important;letter-spacing:0;white-space:normal}
  & .login-secondary-actions .text-button:before,& .login-secondary-actions .text-button:after {display:none!important}
  & #forgotPasswordButton {border:0!important;background:transparent!important;color:var(--ui-muted)!important;padding:8px;text-decoration:underline;text-underline-offset:4px;text-decoration-color:var(--ui-line)}
  & #signupButton {border:1px solid var(--ui-line)!important;background:transparent!important;color:var(--ui-ink)!important;padding:12px 10px}
  & #signupButton:hover:not(:disabled) {background:var(--ui-raised)!important;border-color:var(--ui-control-line)!important}
  & :is(#loginSubmit,#signupButton,#forgotPasswordButton):disabled {background:var(--ui-raised)!important;color:var(--ui-muted)!important;box-shadow:none!important;transform:none!important;filter:none!important;cursor:wait}
  & [hidden],& #loginForm>label[hidden],& :is(#signupButton,#forgotPasswordButton)[hidden] {display:none!important}
}
:root[data-appearance="cloud"] #loginModal .member-access-brand:before {background:linear-gradient(180deg,transparent,var(--access-brand) 100%),url('assets/cloud-island-v80.svg') center bottom/cover;opacity:.2}
@media(max-width:719px) {
  :root[data-appearance] #loginModal {
    & .member-access-dialog {width:min(470px,100%)!important;border-radius:18px!important}
    & .dialog-close-bar {padding-left:18px;min-height:60px}
    & .member-access-layout {grid-template-columns:minmax(0,1fr)}
    & .member-access-brand {align-items:flex-start;padding:18px 24px;gap:0;border-right:0;border-bottom:1px solid var(--ui-line);text-align:left}
    & .member-access-edition,& .member-access-welcome,& .member-access-trail {display:none}
    & .member-access-identity {flex-direction:row;gap:17px;align-items:center}
    & .member-access-emblem {width:68px;height:68px}
    & .member-access-wordmark {gap:6px}
    & .member-access-wordmark strong {font-size:31px;letter-spacing:.16em;padding:0}
    & .member-access-wordmark span {font-size:11px;letter-spacing:.09em}
    & .member-access-brand:after {width:240px;height:240px;left:78%;top:90%;opacity:.6}
    & .member-access-form {padding:25px 24px 24px}
    & #loginTitle {font-size:28px!important;margin:4px 0 7px!important}
    & #loginForm {margin-top:22px;gap:15px}
    & .login-secondary-actions {gap:8px}
  }
}
@media(max-width:359px) {
  :root[data-appearance] #loginModal {
    & .member-access-form {padding:22px 18px}
    & .member-access-brand {padding:16px 18px}
    & .member-access-wordmark span {letter-spacing:0}
    & #loginTitle {font-size:26px!important}
  }
}
:root[data-appearance] body.dialog-compact #loginModal {
  & .member-access-brand {padding-block:14px}
  & .member-access-welcome,& .member-access-trail {display:none}
  & .member-access-form {padding-block:22px}
  & .member-access-kicker {display:none}
  & #loginForm {gap:12px;margin-top:18px}
}
@media(max-width:719px) {
  :root[data-appearance] body.dialog-compact #loginModal {
    & .member-access-emblem {width:42px;height:42px}
    & .member-access-wordmark strong {font-size:25px}
    & .member-access-wordmark span {display:none}
    & .member-access-brand {padding-block:10px}
  }
}
@media(prefers-reduced-motion:reduce) {#loginModal .member-access-dialog,#loginModal #loginSubmit{animation:none!important;transition:none!important}}
@media(forced-colors:active) {
  #loginModal .member-access-brand:before,#loginModal .member-access-brand:after {display:none}
  #loginModal :is(.member-access-wordmark strong,.member-access-wordmark span,.member-access-edition,.member-access-welcome,.member-access-trail) {color:CanvasText!important}
  #loginModal #loginSubmit {border:1px solid ButtonText!important}
}