:root { --brand:#e02e24; --ink:#252525; --muted:#7d7d7d; --line:#e9e9e9; --green:#168454; }
* { box-sizing:border-box; }
body { margin:0; color:var(--ink); background:#f4f4f4; font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif; }
button,input { font:inherit; }
.identity-header {
    position:sticky; top:0; z-index:20; display:grid; grid-template-columns:48px 1fr 48px;
    width:min(900px,100%); min-height:56px; margin:auto; align-items:center;
    color:white; background:var(--brand);
}
.identity-header a { display:grid; height:48px; place-items:center; color:white; text-decoration:none; font-size:27px; }
.identity-header div { text-align:center; }
.identity-header strong { display:block; font-size:16px; }
.identity-header span { display:block; margin-top:2px; color:#ffd8d4; font-size:10px; }
.identity-page { display:grid; width:min(900px,100%); margin:auto; background:white; }
.register-panel,.user-panel { padding:28px 22px; }
.register-panel { border-bottom:8px solid #f4f4f4; }
.section-kicker { color:var(--brand); font-size:10px; font-weight:800; }
h1,h2 { margin:5px 0 22px; letter-spacing:0; }
h1 { font-size:25px; }
h2 { font-size:20px; }
form { display:grid; gap:15px; }
label span { display:block; margin-bottom:7px; color:#555; font-size:12px; font-weight:700; }
input { width:100%; height:46px; padding:0 13px; border:1px solid #dcdcdc; border-radius:6px; outline:0; }
input:focus { border-color:var(--brand); box-shadow:0 0 0 3px #ffe8e5; }
form button { height:46px; color:white; border:0; border-radius:6px; background:var(--brand); font-weight:800; }
.form-error { min-height:18px; margin:0; color:var(--brand); font-size:12px; }
.section-title { display:flex; align-items:start; justify-content:space-between; }
.section-title > span { padding:5px 8px; color:#666; border-radius:4px; background:#f2f2f2; font-size:11px; }
.user-list { display:grid; gap:9px; }
.user-item {
    position:relative; display:grid; grid-template-columns:44px 1fr auto 28px; gap:10px;
    min-height:64px; padding:10px; align-items:center; border:1px solid var(--line); border-radius:8px;
}
.user-item.active { border-color:#9bd1b8; background:#f2fbf6; }
.user-avatar { display:grid; width:42px; height:42px; place-items:center; color:#84261f; border-radius:50%; background:#ffe0d7; font-weight:900; }
.user-copy { min-width:0; }
.user-copy strong,.user-copy code { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.user-copy strong { font-size:14px; }
.user-copy code { margin-top:4px; color:var(--muted); font-size:11px; }
.user-item > button[data-switch] { padding:7px 12px; color:white; border:0; border-radius:5px; background:var(--brand); }
.active-mark { color:var(--green); font-size:12px; font-weight:800; }
.remove-user { width:28px; height:28px; color:#999; border:0; background:transparent; font-size:20px; }
.empty-users { padding:55px 20px; color:#999; text-align:center; border:1px dashed #ddd; border-radius:8px; }
.empty-users b,.empty-users span { display:block; }
.empty-users b { color:#555; }
.empty-users span { margin-top:6px; font-size:12px; }
.toast { display:none; }
@media (min-width:720px) {
    body { padding:24px; }
    .identity-header { border-radius:8px 8px 0 0; }
    .identity-page { grid-template-columns:340px 1fr; min-height:570px; box-shadow:0 14px 36px rgba(0,0,0,.08); }
    .register-panel { border-right:8px solid #f4f4f4; border-bottom:0; }
}