:root { color: #172033; background: #eef2f7; font-family: Inter, ui-sans-serif, system-ui, -apple-system, "Microsoft YaHei", sans-serif; }
      * { box-sizing: border-box; }
      body { display: grid; min-height: 100vh; margin: 0; padding: 24px; place-items: center; background: radial-gradient(circle at 10% 0%, #dbeafe 0, transparent 34%), linear-gradient(135deg, #f8fafc 0%, #eef2f7 100%); }
      main { width: min(420px, 100%); padding: 30px; border: 1px solid #dbe3ee; border-radius: 20px; background: rgba(255,255,255,.95); box-shadow: 0 22px 60px #0f172a18; }
      .eyebrow { margin-bottom: 12px; color: #2563eb; font-size: 12px; font-weight: 800; letter-spacing: .14em; }
      h1 { margin: 0; color: #0f172a; font-size: 30px; letter-spacing: -.04em; }
      p { color: #64748b; font-size: 14px; line-height: 1.7; }
      label { display: block; margin-top: 22px; color: #334155; font-size: 13px; font-weight: 700; }
      input { display: block; width: 100%; min-height: 46px; margin-top: 8px; padding: 11px 13px; border: 1px solid #cbd5e1; border-radius: 9px; font: inherit; }
      .access-password-field { position: relative; display: block; }
      .access-password-field input { margin-top: 8px; padding-right: 72px; }
      .access-password-toggle { position: absolute; top: 14px; right: 6px; width: auto; min-width: 52px; min-height: 34px; margin: 0; padding: 7px 8px; color: #2563eb; border: 0; background: transparent; font-size: 12px; }
      .access-password-toggle:hover { color: #1d4ed8; background: #eff6ff; }
      input:focus-visible, button:focus-visible { outline: 3px solid #93c5fd; outline-offset: 2px; }
      button { width: 100%; min-height: 46px; margin-top: 16px; padding: 11px 14px; border: 0; border-radius: 9px; color: white; background: #2563eb; cursor: pointer; font: inherit; font-weight: 800; }
      button:hover { background: #1d4ed8; }
      button:disabled { opacity: .6; cursor: not-allowed; }
      button:disabled[aria-busy="true"] { cursor: wait; }
      .status { min-height: 22px; margin: 12px 0 0; color: #b91c1c; font-size: 13px; }
      .status.success { color: #15803d; }
      .hidden { display: none; }
      @media (prefers-color-scheme: dark) {
        :root { color-scheme: dark; color: #e5edf8; background: #0f172a; }
        body { background: radial-gradient(circle at 10% 0%, #172554 0, transparent 34%), linear-gradient(135deg, #0f172a 0%, #111c2e 100%); }
        main { border-color: #334155; background: rgba(22, 31, 48, .96); box-shadow: 0 22px 60px #02061766; }
        h1 { color: #f8fafc; }
        p, label { color: #a9b8cc; }
        input { color: #e5edf8; border-color: #475569; background: #172033; }
        input::placeholder { color: #94a3b8; }
        .access-password-toggle { color: #bfdbfe; }
        .access-password-toggle:hover { color: #eff6ff; background: #172554; }
        input:focus-visible, button:focus-visible { outline-color: #60a5fa; }
        button { background: #2563eb; }
        button:hover { background: #3b82f6; }
        .status { color: #fca5a5; }
        .status.success { color: #86efac; }
      }
      :root[data-theme="dark"] { color-scheme: dark; color: #e5edf8; background: #0f172a; }
      :root[data-theme="dark"] body { background: radial-gradient(circle at 10% 0%, #172554 0, transparent 34%), linear-gradient(135deg, #0f172a 0%, #111c2e 100%); }
      :root[data-theme="dark"] main { border-color: #334155; background: rgba(22, 31, 48, .96); box-shadow: 0 22px 60px #02061766; }
      :root[data-theme="dark"] h1 { color: #f8fafc; }
      :root[data-theme="dark"] p, :root[data-theme="dark"] label { color: #a9b8cc; }
      :root[data-theme="dark"] input { color: #e5edf8; border-color: #475569; background: #172033; }
      :root[data-theme="dark"] input::placeholder { color: #94a3b8; }
      :root[data-theme="dark"] .access-password-toggle { color: #bfdbfe; }
      :root[data-theme="dark"] .access-password-toggle:hover { color: #eff6ff; background: #172554; }
      :root[data-theme="dark"] input:focus-visible, :root[data-theme="dark"] button:focus-visible { outline-color: #60a5fa; }
      :root[data-theme="dark"] button { background: #2563eb; }
      :root[data-theme="dark"] button:hover { background: #3b82f6; }
      :root[data-theme="dark"] .status { color: #fca5a5; }
      :root[data-theme="dark"] .status.success { color: #86efac; }
      @media (max-width: 520px) { body { padding: 14px; } main { padding: 24px 20px; } }