:root{color-scheme:light;--auth-ink:#243b59;--auth-blue:#386fa4;--auth-muted:#677689;--auth-line:#dae3ec}
*{box-sizing:border-box}body.auth-page{margin:0;background:#edf2f7;color:var(--auth-ink);font-family:"Malgun Gothic",Arial,sans-serif;font-size:14px;min-height:100vh}
.auth-page button,.auth-page input,.auth-page select{font:inherit}.auth-page button{cursor:pointer}.auth-page button:disabled{cursor:wait;opacity:.6}
.auth-shell{min-height:100vh;display:grid;place-items:center;padding:32px 18px}.auth-card{width:min(430px,100%);background:#fff;border:1px solid var(--auth-line);border-radius:18px;padding:34px 38px;box-shadow:0 14px 45px #243b590b}
.auth-brand{display:block;width:245px;max-width:100%;margin:0 auto 28px;aspect-ratio:2.8;object-fit:cover;object-position:center;border-radius:4px}.auth-card h1{font-size:23px;letter-spacing:-.7px;margin:0 0 8px}.auth-description{color:var(--auth-muted);line-height:1.7;margin:0 0 26px}
.auth-form{display:grid;gap:18px}.auth-form label{display:grid;gap:8px;font-weight:600}.auth-form input,.auth-form select{width:100%;padding:11px 12px;color:var(--auth-ink);background:white;border:1px solid #cbd7e3;border-radius:7px;min-height:44px}.auth-form input:focus,.auth-form select:focus{outline:2px solid #90b5dc;outline-offset:1px}.auth-primary{background:var(--auth-ink);color:white;border:0;border-radius:7px;padding:13px 18px;font-weight:700}.auth-secondary{background:white;color:var(--auth-ink);border:1px solid #bbcbdc;border-radius:7px;padding:11px 18px}.auth-message{min-height:22px;line-height:1.6;overflow-wrap:anywhere;color:#a22c36}.auth-footer{margin:24px 0 0;font-size:12px;color:var(--auth-muted);text-align:center}.auth-note{font-size:12px;font-weight:400;color:var(--auth-muted);line-height:1.6}.auth-page a{color:var(--auth-blue)}
.account-actions{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-top:10px}.account-actions a,.account-actions button{color:inherit;font-size:12px}.account-actions button{padding:0;border:0;background:transparent;text-decoration:underline;cursor:pointer}.app-sidebar .user{white-space:normal;line-height:1.6}
.users-shell{max-width:1240px;margin:0 auto;padding:32px 24px}.users-header{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:24px}.users-title{margin:0;font-size:26px}.users-header .user{text-align:right}.users-header a{color:var(--auth-blue)}
.users-grid{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(300px,1fr);gap:22px;align-items:start}.users-panel{background:#fff;border:1px solid var(--auth-line);border-radius:12px;padding:24px;min-width:0}.users-panel h2{font-size:18px;margin:0 0 20px}.users-toolbar{display:flex;justify-content:space-between;align-items:center;gap:10px}.users-table-wrap{overflow-x:auto}.users-table{border-collapse:collapse;width:100%;font-size:13px}.users-table th,.users-table td{border-bottom:1px solid #e7edf3;padding:13px 10px;text-align:left;white-space:nowrap}.users-table th{color:#647487;font-weight:600;background:#f7f9fc}.users-open{border:0;padding:0;background:transparent;color:var(--auth-blue);font-weight:600;text-align:left}.users-table tr.selected{background:#edf4fb}.users-form-actions{display:flex;gap:10px}.users-form-actions>*{flex:1}.users-meta{font-size:12px;color:var(--auth-muted);line-height:1.9;margin:18px 0 0}.auth-form .check-row{display:flex;align-items:center;gap:8px}.auth-form .check-row input{width:18px;min-height:18px}
@media(max-width:850px){.users-grid{grid-template-columns:1fr}.users-header{align-items:flex-start}.users-shell{padding:22px 14px}}@media(max-width:450px){.auth-card{padding:28px 24px}.users-header{flex-direction:column}.users-header .user{text-align:left}}

/* Login-only styles. Existing authentication behavior remains in login.js. */
body.auth-page:is([data-mode=login],[data-mode=password]){background:#fff;color:#343b40;font-family:'Malgun Gothic','Apple SD Gothic Neo',Arial,sans-serif}
:is([data-mode=login],[data-mode=password]) .auth-shell{min-height:100vh;min-height:100svh;padding:40px 24px;display:grid;place-items:center}
:is([data-mode=login],[data-mode=password]) .auth-card{width:min(340px,100%);background:#fff;border:0;border-radius:0;box-shadow:none;padding:0;transform:translateY(-20px)}
:is([data-mode=login],[data-mode=password]) .auth-brand{width:320px;max-width:100%;height:auto;aspect-ratio:auto;object-fit:contain;border-radius:0;margin:0 auto 25px;display:block}
:is([data-mode=login],[data-mode=password]) .login-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
:is([data-mode=login],[data-mode=password]) .auth-description{text-align:center;font-size:13px;font-weight:400;color:#767c81;margin:0 0 28px;line-height:1.6}
:is([data-mode=login],[data-mode=password]) .auth-form{gap:20px}
:is([data-mode=login],[data-mode=password]) .auth-form label{font-size:13px;font-weight:400;gap:9px}
:is([data-mode=login],[data-mode=password]) .auth-form input{height:44px;min-height:44px;padding:10px 13px;background:#fff;color:#343b40;border:1px solid #d7dce0;border-radius:5px;box-shadow:none;font-size:14px}
:is([data-mode=login],[data-mode=password]) .auth-form input::placeholder{color:#a1a6aa}
:is([data-mode=login],[data-mode=password]) .auth-form input:focus{outline:2px solid #8baebe;outline-offset:2px;border-color:#8baebe}
:is([data-mode=login],[data-mode=password]) .auth-note{font-size:11px;color:#92979b;margin-top:-9px;line-height:1.5}
:is([data-mode=login],[data-mode=password]) .auth-primary{min-height:44px;padding:11px 16px;background:#454a4e;color:#fff;border-radius:5px;font-size:14px;font-weight:500}
:is([data-mode=login],[data-mode=password]) .auth-primary:hover:not(:disabled){background:#343a3e}
:is([data-mode=login],[data-mode=password]) .auth-primary:focus-visible{outline:2px solid #078bac;outline-offset:3px}
:is([data-mode=login],[data-mode=password]) .auth-message{font-size:12px;line-height:1.6;color:#a22c36}
:is([data-mode=login],[data-mode=password]) .auth-message:empty{display:none}
@media(max-width:450px){:is([data-mode=login],[data-mode=password]) .auth-shell{padding:28px 24px}:is([data-mode=login],[data-mode=password]) .auth-card{padding:0;transform:none}}
@media(max-height:560px){:is([data-mode=login],[data-mode=password]) .auth-shell{padding:24px}:is([data-mode=login],[data-mode=password]) .auth-card{transform:none}}

/* 007: restore the framed login panel and footer, with readable desktop sizing. */
body.auth-page:is([data-mode=login],[data-mode=password]){background:#f2f5f8}
:is([data-mode=login],[data-mode=password]) .auth-card{width:min(480px,100%);padding:38px 44px 28px;border:1px solid #d3dce5;border-radius:16px;background:#fff;box-shadow:0 8px 28px #243b5906;transform:none}
:is([data-mode=login],[data-mode=password]) .auth-brand{width:370px;max-width:100%;margin:0 auto 24px}
:is([data-mode=login],[data-mode=password]) .auth-description{font-size:14px;margin-bottom:28px}
:is([data-mode=login],[data-mode=password]) .auth-form{gap:20px}
:is([data-mode=login],[data-mode=password]) .auth-form label{font-size:14px;gap:9px}
:is([data-mode=login],[data-mode=password]) .auth-form input{height:48px;min-height:48px;font-size:15px}
:is([data-mode=login],[data-mode=password]) .auth-primary{min-height:48px;font-size:15px}
:is([data-mode=login],[data-mode=password]) .auth-note{font-size:12px}
:is([data-mode=login],[data-mode=password]) .auth-footer{display:block;margin:28px 0 0;padding-top:18px;border-top:1px solid #edf0f3;text-align:center;font-size:12px;font-weight:400;letter-spacing:.5px;color:#7c8792}
@media(max-width:520px){:is([data-mode=login],[data-mode=password]) .auth-shell{padding:20px 16px}:is([data-mode=login],[data-mode=password]) .auth-card{padding:28px 24px 24px}:is([data-mode=login],[data-mode=password]) .auth-brand{width:100%;margin-bottom:20px}}
@media(max-height:650px){:is([data-mode=login],[data-mode=password]) .auth-shell{padding-top:16px;padding-bottom:16px}}

/* 012: cancel sign-in / switch account. */
:is([data-mode=login],[data-mode=password]) .auth-cancel{min-height:44px;border-color:#d3dce5;color:#667581;background:#fff;font-weight:400;font-size:14px}
:is([data-mode=login],[data-mode=password]) .auth-cancel:hover:not(:disabled){background:#f5f7f9}
:is([data-mode=login],[data-mode=password]) .auth-cancel:focus-visible{outline:2px solid #8baebe;outline-offset:2px}
