:root{color-scheme:light;--brand:#0b7f79;--brand-strong:#075f5b;--brand-soft:#e5f3f2;--ink:#1e2a32;--muted:#667784;--line:#dbe4e9;--bg:#f5f8fa;--panel:#fff;--danger:#b42318;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif}*{box-sizing:border-box}body{margin:0;background:radial-gradient(circle at 8% 8%,rgba(11,127,121,.11),transparent 28%),var(--bg);color:var(--ink)}button,input,select{font:inherit}.topbar{height:76px;display:flex;align-items:center;gap:14px;padding:0 max(24px,calc((100vw - 1240px)/2));background:#fff;border-bottom:1px solid var(--line);position:sticky;top:0;z-index:10}.topbar strong{display:block;font-size:18px}.topbar small{display:block;color:var(--muted);margin-top:3px}.brand-mark{width:42px;height:42px;border-radius:11px;display:grid;place-items:center;background:linear-gradient(135deg,var(--brand),var(--brand-strong));color:#fff;font-weight:800;box-shadow:0 8px 20px rgba(11,127,121,.24)}.top-actions{margin-left:auto;display:flex;align-items:center;gap:12px}.primary,.ghost,.tabs button{border:0;border-radius:8px;padding:10px 17px;font-weight:700;cursor:pointer}.primary{background:var(--brand);color:#fff}.primary:hover{background:var(--brand-strong)}.ghost{background:var(--brand-soft);color:var(--brand-strong)}main{max-width:1240px;margin:0 auto;padding:34px 24px 70px}.hero{display:grid;grid-template-columns:1fr 280px;gap:40px;align-items:end;padding:24px 4px 34px}.eyebrow{color:var(--brand);font-size:12px;font-weight:800;letter-spacing:.15em}.hero h1{font-size:clamp(30px,4vw,44px);margin:8px 0 12px;letter-spacing:-.04em}.hero p:not(.eyebrow){color:var(--muted);font-size:16px;line-height:1.8;max-width:760px}.status-card{background:#fff;border:1px solid var(--line);border-radius:14px;padding:20px;box-shadow:0 16px 36px rgba(25,52,69,.08)}.status-card span{display:inline-block;width:10px;height:10px;border-radius:50%;background:#a9b4bb;margin-right:8px}.status-card span.online{background:#16a56f}.status-card strong{display:inline}.status-card small{display:block;color:var(--muted);margin:10px 0 0 18px}.workspace{background:#fff;border:1px solid var(--line);border-radius:16px;box-shadow:0 18px 46px rgba(25,52,69,.08);overflow:hidden}.tabs{display:flex;gap:4px;background:#f7fafb;border-bottom:1px solid var(--line);padding:12px 16px}.tabs button{background:transparent;color:var(--muted)}.tabs button.active{background:#fff;color:var(--brand-strong);box-shadow:0 1px 5px rgba(20,45,63,.1)}.panel{padding:26px}.panel-head{display:flex;justify-content:space-between;align-items:end;gap:24px;margin-bottom:22px}.panel h2{margin:0 0 7px}.panel h3{margin-top:28px}.panel p{margin:0;color:var(--muted)}label{display:grid;gap:7px;color:#41515c;font-weight:700;font-size:14px}input,select{min-height:42px;border:1px solid var(--line);border-radius:8px;background:#fff;padding:8px 11px;color:var(--ink);min-width:190px}input:focus,select:focus{outline:3px solid rgba(11,127,121,.12);border-color:var(--brand)}.form-grid{display:grid;grid-template-columns:repeat(4,minmax(150px,1fr));gap:16px;padding:20px;background:#f8fbfb;border:1px solid #deeceb;border-radius:12px;margin-bottom:24px}.check{display:flex;align-items:center;gap:9px}.check input{min-width:auto;min-height:auto}.form-actions{grid-column:1/-1;display:flex;justify-content:flex-end;gap:10px}.table-wrap{overflow:auto;border:1px solid var(--line);border-radius:10px}table{border-collapse:collapse;width:100%;min-width:680px}th,td{text-align:left;padding:14px 16px;border-bottom:1px solid #edf1f3;vertical-align:top}th{background:#f8fafb;color:#536570;font-size:13px}td small{display:block;color:var(--muted);margin-top:4px}.pill{display:inline-block;border-radius:999px;padding:4px 9px;background:var(--brand-soft);color:var(--brand-strong);font-size:12px;font-weight:800}.pill.off{background:#f2f3f4;color:#6f7a81}.row-actions{display:flex;gap:8px}.row-actions button{border:0;background:none;color:var(--brand);font-weight:700;cursor:pointer;padding:0}#toast{position:fixed;right:24px;bottom:24px;max-width:420px;background:#26333b;color:#fff;padding:14px 18px;border-radius:9px;box-shadow:0 12px 30px rgba(0,0,0,.2);opacity:0;transform:translateY(12px);pointer-events:none;transition:.2s}#toast.show{opacity:1;transform:none}@media(max-width:900px){.hero{grid-template-columns:1fr}.status-card{display:none}.form-grid{grid-template-columns:1fr 1fr}.panel-head{align-items:stretch;flex-direction:column}}@media(max-width:600px){.topbar small{display:none}.top-actions #current-user{display:none}main{padding:20px 12px 50px}.form-grid{grid-template-columns:1fr}.panel{padding:18px}.tabs{overflow:auto}.hero{padding-top:8px}.hero h1{font-size:30px}}
#roles-modal.modal { position: fixed; z-index: 20; inset: 0; display: grid; place-items: center; padding: 24px; background: #081f2db8; backdrop-filter: blur(5px); }
#roles-modal[hidden] { display: none; }
.modal { position: fixed; z-index: 20; inset: 0; display: grid; place-items: center; padding: 24px; background: #081f2db8; backdrop-filter: blur(5px); }
.modal[hidden] { display: none; }
.modal-card { width: min(680px, 100%); padding: 24px; border-radius: 18px; background: white; box-shadow: 0 28px 80px #06182388; }
.modal-card > header, .modal-card > footer { display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.modal-card h2 { margin: 5px 0; }
.modal-card header small, .modal-card footer span { color: #6d8088; font-size: 12px; }
.modal-card header p:not(.eyebrow) { margin: 0; color: var(--muted); line-height: 1.5; }
.modal-card header p strong { color: var(--ink); }
.password-reset-fields { display: grid; gap: 16px; margin: 22px 0 0; }
.password-reset-fields label { display: grid; gap: 7px; color: #536a73; font-size: 13px; }
.password-reset-fields input, .password-reset-fields textarea { width: 100%; min-width: 0; padding: 10px; border: 1px solid #cfdddf; border-radius: 8px; resize: vertical; }
.password-reset-status { margin: 14px 0 0; color: var(--danger); line-height: 1.5; font-size: 13px; font-weight: 700; }
.password-reset-status[hidden] { display: none; }
.modal-actions { display: flex; align-items: center; gap: 10px; }
.modal-card button:disabled { cursor: not-allowed; opacity: .62; }
.role-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin: 20px 0; }
.role-options label { display: flex; align-items: center; gap: 10px; padding: 13px; border: 1px solid #d9e5e7; border-radius: 10px; background: #f8fbfb; }
.role-options input { width: 17px; height: 17px; accent-color: #0e7490; }
.role-options strong, .role-options small { display: block; }
.role-options small { margin-top: 3px; color: #73878e; font-size: 10px; }
.profile-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; margin: 0 0 18px; }
.profile-options label { display: grid; gap: 6px; color: #536a73; font-size: 12px; }
.profile-options input { padding: 10px; border: 1px solid #cfdddf; border-radius: 8px; }
.modal-card > label { display: grid; gap: 6px; color: #536a73; font-size: 12px; }
.modal-card > label input { padding: 10px; border: 1px solid #cfdddf; border-radius: 8px; }
.modal-card > footer { margin-top: 18px; padding-top: 17px; border-top: 1px solid #e5eded; }
.panel-head { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-bottom: 18px; padding-bottom: 14px; border-bottom: 1px solid var(--line); }
.org-selector-box { display: flex; align-items: center; gap: 10px; font-weight: 700; color: #41515c; font-size: 14px; }
.action-toolbar { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 22px; background: #f8fafb; padding: 12px 16px; border-radius: 12px; border: 1px solid #e7eff2; flex-wrap: wrap; }
.toolbar-left, .toolbar-right { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.form-grid[hidden] { display: none !important; }
.form-grid { display: grid; grid-template-columns: repeat(4, minmax(150px, 1fr)); gap: 16px; padding: 22px; background: #ffffff; border: 1.5px solid rgba(11,127,121,0.25); border-radius: 14px; margin-bottom: 24px; box-shadow: 0 12px 30px rgba(11,127,121,0.08); transition: all 0.2s ease; }
.user-workspace .panel { padding-bottom: 34px; }
.tenant-apps { padding: 20px 0 8px; border-top: 1px solid var(--line); }
.tenant-apps:first-child { border-top: 0; padding-top: 0; }
.tenant-apps-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 16px; }
.tenant-apps-head h3 { margin: 2px 0 0; }
.app-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 14px; }
.app-card { display: flex; gap: 14px; align-items: flex-start; min-height: 158px; padding: 18px; border: 1px solid #dce9ea; border-radius: 14px; background: linear-gradient(145deg, #fff, #f7fbfb); box-shadow: 0 10px 22px rgba(25,52,69,.06); }
.app-card-mark { flex: 0 0 42px; width: 42px; height: 42px; display: grid; place-items: center; border-radius: 11px; color: #fff; background: linear-gradient(135deg, var(--brand), var(--brand-strong)); font-weight: 800; font-size: 18px; }
.app-card-body { min-width: 0; flex: 1; }
.app-card h3 { margin: 1px 0 5px; font-size: 17px; }
.app-card small, .app-card p { display: block; color: var(--muted); line-height: 1.5; }
.app-card p { margin: 8px 0 14px; font-size: 13px; }
.app-launch { display: inline-block; text-decoration: none; padding: 8px 13px; }
.empty-state { padding: 18px; border: 1px dashed #cbdadd; border-radius: 10px; color: var(--muted); background: #fbfdfd; }
@media(max-width:600px){.tenant-apps-head{align-items:flex-start;flex-direction:column}.app-grid{grid-template-columns:1fr}}
@media(max-width:600px){.modal{padding:12px}.modal-card{padding:18px}.modal-card > header,.modal-card > footer{align-items:flex-start;flex-direction:column}.modal-actions{width:100%;justify-content:flex-end}}

.batch-import-hint { margin: -10px 0 18px; color: var(--muted); font-size: 13px; }
.batch-import-password { margin: -8px 0 18px; padding: 14px 16px; border: 1px solid #d9ebe9; border-radius: 12px; background: #f8fbfb; }
.batch-import-password label { max-width: 460px; }
.batch-import-password small { display: block; margin-top: 8px; color: var(--muted); line-height: 1.6; font-weight: 400; }
.batch-import-password-error { margin: 8px 0 0; color: var(--danger); line-height: 1.5; font-size: 13px; font-weight: 700; }
.batch-import-results { margin: 0 0 24px; padding: 18px 20px; border: 1px solid #cce7df; border-radius: 12px; background: #f4fbf8; }
.batch-import-results.has-errors { border-color: #f1c7c2; background: #fff8f7; }
.batch-import-results-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.batch-import-results h3 { margin: 0 0 6px; }
.batch-import-results p { color: var(--muted); line-height: 1.6; }
.batch-import-errors { margin-top: 12px; }
.batch-import-errors ul { margin: 0; padding-left: 22px; color: #71362e; line-height: 1.7; }
.batch-import-errors code { padding: 2px 5px; border-radius: 4px; background: rgba(180,35,24,.08); color: #8b2d24; font-family: ui-monospace,SFMono-Regular,Menlo,monospace; }
.batch-import-ok { margin: 0; color: #176b58 !important; font-weight: 700; }

/* Keep personnel actions usable at narrow table widths without splitting a
   single action label across lines. */
.row-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; min-width: 0; }
.row-actions button { white-space: nowrap; }
.selection-col, .selection-cell { width: 48px; min-width: 48px; text-align: center; }
.selection-col input, .selection-cell input { width: 17px; height: 17px; min-width: 17px; min-height: 17px; padding: 0; accent-color: var(--brand); cursor: pointer; }
.selection-count { color: var(--muted); font-size: 13px; font-weight: 700; white-space: nowrap; }
.danger { border: 1px solid #f0c8c3; border-radius: 8px; padding: 10px 15px; background: #fff3f1; color: var(--danger); font-weight: 800; cursor: pointer; white-space: nowrap; }
.danger:hover { background: #ffe5e1; }
.danger:disabled { cursor: not-allowed; opacity: .52; }
.session-status { display: block; margin-top: 6px; line-height: 1.45; }
.person-department { color: var(--brand-strong); font-weight: 700; }
.person-profile { color: #536a73; }
.session-revoked { color: var(--brand-strong); font-weight: 700; }
.session-not-recorded { color: var(--muted); }
.batch-remove-results { margin: 0 0 24px; padding: 18px 20px; border: 1px solid #cce7df; border-radius: 12px; background: #f4fbf8; }
.batch-remove-results.has-errors { border-color: #f1c7c2; background: #fff8f7; }
.batch-remove-results-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.batch-remove-results h3 { margin: 0 0 6px; }
.batch-remove-results p { color: var(--muted); line-height: 1.6; }
.batch-remove-errors { margin-top: 12px; }
.batch-remove-errors p { margin: 0 0 6px; color: #71362e; font-weight: 700; }
.batch-remove-errors ul { margin: 0; padding-left: 22px; color: #71362e; line-height: 1.7; }
.batch-remove-errors small { color: #8b2d24; }
.batch-remove-ok { margin: 0; color: #176b58 !important; font-weight: 700; }
.batch-remove-fields { display: grid; gap: 16px; margin: 22px 0 0; }
.batch-remove-fields label { display: grid; gap: 7px; color: #536a73; font-size: 13px; }
.batch-remove-fields textarea { width: 100%; min-width: 0; padding: 10px; border: 1px solid #cfdddf; border-radius: 8px; resize: vertical; }
.batch-remove-status { margin: 14px 0 0; color: var(--danger); line-height: 1.5; font-size: 13px; font-weight: 700; }
.batch-remove-status[hidden] { display: none; }
table { min-width: 820px; }
@media(max-width:600px){.action-toolbar{align-items:stretch}.toolbar-left,.toolbar-right{width:100%}.toolbar-left > *, .toolbar-right > *{max-width:100%}.selection-count{align-self:center}.batch-remove-results{padding:15px}.batch-remove-results-head{display:block}}
.logout-session-fields { display: grid; gap: 16px; margin: 22px 0 0; }
.logout-session-fields label { display: grid; gap: 7px; color: #536a73; font-size: 13px; }
.logout-session-fields textarea { width: 100%; min-width: 0; padding: 10px; border: 1px solid #cfdddf; border-radius: 8px; resize: vertical; }
.logout-session-status { margin: 14px 0 0; color: var(--danger); line-height: 1.5; font-size: 13px; font-weight: 700; }
.logout-session-status[hidden] { display: none; }