:root {
  --bg: var(--tg-theme-bg-color, #f4f6fb);
  --card: var(--tg-theme-secondary-bg-color, #ffffff);
  --text: var(--tg-theme-text-color, #182033);
  --muted: var(--tg-theme-hint-color, #758095);
  --primary: var(--tg-theme-button-color, #3559d8);
  --line: rgba(74, 90, 120, .13);
  --shadow: 0 8px 26px rgba(28, 39, 67, .06);
}
* { box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
body {
  margin: 0; min-height: 100vh; color: var(--text);
  font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
  background: radial-gradient(circle at 94% -8%, rgba(84,111,226,.13), transparent 28%), var(--bg);
  padding: env(safe-area-inset-top) 0 calc(26px + env(safe-area-inset-bottom));
}
button, input { font: inherit; }
button { cursor: pointer; }
.hidden { display: none !important; }
.management-shell { width: min(100%, 1040px); margin: 0 auto; padding: 14px; }
.management-header { display: flex; align-items: center; gap: 13px; padding: 6px 2px 17px; }
.icon-button { width: 42px; height: 42px; border: 1px solid var(--line); border-radius: 14px; background: var(--card); color: var(--text); font-size: 20px; }
.header-copy { flex: 1; min-width: 0; }
.eyebrow { color: var(--primary); font-size: 10px; font-weight: 900; letter-spacing: .16em; }
h1, h2, p { margin: 0; }
h1 { margin-top: 2px; font-size: clamp(23px, 5vw, 31px); letter-spacing: -.035em; }
.header-copy p { margin-top: 4px; color: var(--muted); font-size: 12px; }
.secure-pill { flex: 0 0 auto; padding: 7px 9px; border-radius: 999px; color: #187a49; background: #eaf7ef; font-size: 10px; font-weight: 900; }
.header-session { display: flex; align-items: center; gap: 6px; }
.logout-button { border: 1px solid var(--line); border-radius: 999px; padding: 7px 9px; color: #a23f50; background: var(--card); font-size: 10px; font-weight: 850; }
.state-card { min-height: 180px; display: grid; place-items: center; align-content: center; gap: 11px; text-align: center; border: 1px solid var(--line); border-radius: 23px; background: var(--card); box-shadow: var(--shadow); }
.spinner { width: 30px; height: 30px; border-radius: 50%; border: 3px solid var(--line); border-top-color: var(--primary); animation: spin .8s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }
.error-card { color: #a63646; padding: 24px; }
.error-card p { color: var(--muted); font-size: 12px; }
.error-card .login-help { max-width: 430px; padding: 10px; border-radius: 12px; color: #34425d; background: var(--bg); line-height: 1.5; }
.primary-button { border: 0; border-radius: 13px; padding: 10px 16px; color: #fff; background: var(--primary); font-weight: 850; }
.foundation-note { display: flex; align-items: center; gap: 11px; padding: 13px; border: 1px solid rgba(37,167,93,.18); border-radius: 18px; background: linear-gradient(145deg,#f2fbf5,#eaf8ef); }
.note-icon { width: 34px; height: 34px; flex: 0 0 34px; display: grid; place-items: center; border-radius: 12px; color: #fff; background: #18a75a; font-weight: 900; }
.foundation-note > div:nth-child(2) { flex: 1; }
.foundation-note strong { font-size: 13px; }
.foundation-note p { margin-top: 3px; color: var(--muted); font-size: 10.5px; line-height: 1.4; }
.foundation-note > span { color: #168249; font-size: 9px; font-weight: 900; }
.stats-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 8px; margin: 12px 0; }
.stat-card { min-height: 90px; padding: 13px; display: flex; flex-direction: column; justify-content: space-between; border: 1px solid var(--line); border-radius: 18px; background: var(--card); box-shadow: var(--shadow); }
.stat-card strong { font-size: 25px; }
.stat-card span { color: var(--muted); font-size: 10px; font-weight: 750; }
.stat-card.blue strong { color: #317ed4; }.stat-card.green strong { color: #179451; }.stat-card.violet strong { color: #755ee8; }.stat-card.orange strong { color: #d88617; }
.directory-card { padding: 16px; border: 1px solid var(--line); border-radius: 23px; background: var(--card); box-shadow: var(--shadow); }
.directory-head { display: flex; align-items: end; justify-content: space-between; gap: 14px; }
.directory-head h2 { margin-top: 3px; font-size: 20px; }
.directory-controls { display:flex; align-items:center; gap:8px; }
.add-button { height:42px; border:0; border-radius:14px; padding:0 13px; color:#fff; background:#18a75a; font-size:11px; font-weight:900; white-space:nowrap; }
.search-box { width: min(300px,38vw); height: 42px; display: flex; align-items: center; gap: 8px; padding: 0 11px; border: 1px solid var(--line); border-radius: 14px; background: var(--bg); }
.search-box span { color: var(--muted); font-size: 21px; transform: rotate(-15deg); }
.search-box input { width: 100%; min-width: 0; border: 0; outline: 0; color: var(--text); background: transparent; }
.tab-list { display: flex; gap: 6px; margin: 15px 0 13px; padding: 4px; border-radius: 14px; background: var(--bg); }
.tab { flex: 1; border: 0; border-radius: 11px; padding: 9px 7px; color: var(--muted); background: transparent; font-size: 11px; font-weight: 850; }
.tab span { margin-left: 4px; padding: 2px 6px; border-radius: 999px; background: rgba(106,120,147,.1); }
.tab.active { color: var(--primary); background: var(--card); box-shadow: 0 3px 12px rgba(28,39,67,.08); }
.record-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
.record-card { min-width: 0; display: flex; gap: 10px; padding: 12px; border: 1px solid var(--line); border-radius: 17px; background: linear-gradient(145deg,#fff,#fafbfe); }
.record-avatar { width: 42px; height: 42px; flex: 0 0 42px; display: grid; place-items: center; border-radius: 15px; color: #3157c9; background: linear-gradient(145deg,#edf1ff,#dfe7ff); font-size: 14px; font-weight: 900; }
.record-main { min-width: 0; flex: 1; }
.record-title { display: flex; align-items: center; justify-content: space-between; gap: 7px; }
.record-title strong { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; }
.status-pill { padding: 3px 6px; border-radius: 999px; color: #187a49; background: #eaf7ef; font-size: 7.5px; font-weight: 900; text-transform: uppercase; }
.status-pill.inactive { color: #8c5960; background: #f7edef; }
.record-subtitle { margin-top: 2px; color: var(--muted); font-size: 9px; }
.tag-row { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 7px; }
.tag-row span, .permission-row span { padding: 4px 6px; border-radius: 7px; color: #526079; background: rgba(106,120,147,.08); font-size: 8px; font-weight: 750; }
.link-line { margin-top: 6px; color: #ad6c19; font-size: 8.5px; }.link-line.linked { color: #24765d; }
.record-footer { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-top:5px; }
.record-footer .link-line { min-width:0; margin-top:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.record-actions { display:flex; flex:0 0 auto; gap:4px; }
.edit-record-button,.move-record-button,.lifecycle-record-button { min-width:46px; min-height:28px; border:1px solid rgba(53,89,216,.16); border-radius:9px; padding:0 8px; color:var(--primary); background:#f3f6ff; font-size:9px; font-weight:900; }
.move-record-button { color:#187a49; border-color:rgba(24,122,73,.16); background:#eef9f2; }
.lifecycle-record-button.retire { color:#9b4655; border-color:rgba(155,70,85,.16); background:#fff3f5; }
.lifecycle-record-button.restore { color:#187a49; border-color:rgba(24,122,73,.16); background:#eef9f2; }
.edit-record-button:active,.move-record-button:active,.lifecycle-record-button:active { transform:translateY(1px); }
.group-heading { display: flex; align-items: center; justify-content: space-between; margin: 17px 2px 8px; }
.group-heading:first-child { margin-top: 2px; }
.group-heading > div { display: flex; flex-direction: column; gap: 2px; }.group-heading strong { font-size: 13px; }.group-heading span { color: var(--muted); font-size: 9px; }.group-heading b { color: var(--primary); }
.team-list { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 7px; }
.team-row { display: flex; align-items: center; gap: 9px; padding: 11px; border: 1px solid var(--line); border-radius: 16px; }
.team-symbol { width: 37px; height: 37px; flex: 0 0 37px; display: grid; place-items: center; border-radius: 13px; color: #fff; background: #317ed4; font-weight: 900; }.team-symbol.internal { background: #755ee8; }
.team-main { flex: 1; min-width: 0; }.team-main > div { display: flex; align-items: center; gap: 6px; }.team-main strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; }.team-main > span { display: block; margin-top: 3px; color: var(--muted); font-size: 8.5px; }
.team-count { text-align: right; }.team-count strong { display: block; font-size: 15px; }.team-count span { color: var(--muted); font-size: 8px; }
.manage-team-button { min-height:28px; border:1px solid rgba(53,89,216,.16); border-radius:9px; padding:0 8px; color:var(--primary); background:#f3f6ff; font-size:8.5px; font-weight:900; }
.access-list { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
.access-card { padding: 12px; border: 1px solid var(--line); border-radius: 17px; }
.access-head { display: flex; align-items: center; gap: 9px; margin-bottom: 9px; }.access-avatar { color: #6d56a4; background: linear-gradient(145deg,#f0eaff,#e3d8ff); }.access-head > div:nth-child(2) { display: flex; flex-direction: column; gap: 2px; }.access-head strong { font-size: 13px; }.access-head span { color: var(--muted); font-size: 9px; }
.assignment-list { display: grid; gap: 5px; }.assignment-row { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 8px; border-radius: 11px; background: var(--bg); }.assignment-row.disabled { opacity: .48; }.assignment-row > div:first-child { display: flex; flex-direction: column; gap: 2px; }.assignment-row strong { font-size: 10.5px; }.assignment-row > div:first-child span { color: var(--muted); font-size: 8px; }.permission-row { display: flex; flex-wrap: wrap; justify-content: end; gap: 3px; }.permission-row span { color: #24765d; background: #e5f7f1; }
.access-group-heading { padding-top:5px; border-top:1px solid var(--line); }
.access-group-heading:first-child { padding-top:0; border-top:0; }
.self-access-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px; }
.self-access-row { min-width:0; display:flex; align-items:center; gap:9px; padding:10px; border:1px solid var(--line); border-radius:16px; background:linear-gradient(145deg,#fff,#fbfcff); }
.self-access-main { min-width:0; flex:1; display:grid; gap:2px; }
.self-access-main strong,.self-access-main span,.self-access-main small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.self-access-main strong { font-size:11.5px; }.self-access-main span,.self-access-main small { color:var(--muted); font-size:8px; }
.self-access-action { flex:0 0 auto; display:grid; justify-items:end; gap:5px; }
.self-access-action button,.manage-access-button { min-height:27px; border:1px solid rgba(53,89,216,.16); border-radius:9px; padding:0 9px; color:var(--primary); background:#f3f6ff; font-size:8.5px; font-weight:900; }
.manage-access-button { margin-left:auto; }
.access-revoked { padding:10px; border-radius:10px; color:#8c5960; background:#f7edef; font-size:9px; font-weight:800; text-align:center; }
.access-revoked.prominent { padding:17px; font-size:11px; }
.empty-state { padding: 32px 12px; color: var(--muted); text-align: center; font-size: 12px; }.empty-state.compact { padding: 16px; }
.backdrop { position:fixed; inset:0; z-index:40; background:rgba(16,23,38,.45); backdrop-filter:blur(3px); }
.person-sheet { position:fixed; z-index:50; left:50%; bottom:0; width:min(620px,100%); max-height:94vh; overflow:auto; transform:translateX(-50%); padding:10px 17px max(20px,env(safe-area-inset-bottom)); border-radius:27px 27px 0 0; color:var(--text); background:var(--card); box-shadow:0 -22px 60px rgba(16,24,40,.22); }
.sheet-handle { width:42px; height:5px; margin:0 auto 13px; border-radius:999px; background:#c9ced8; }
.sheet-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; }.sheet-heading h2 { margin-top:3px; }
.sheet-intro { margin:7px 0 15px; color:var(--muted); font-size:11px; line-height:1.5; }
#personForm { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.field { display:grid; gap:5px; }.field-wide { grid-column:1 / -1; }.field > span { color:#59657a; font-size:10px; font-weight:850; }.field small { color:var(--muted); font-weight:650; }
.field input,.field select { width:100%; height:44px; border:1px solid var(--line); border-radius:13px; padding:0 11px; outline:0; color:var(--text); background:var(--bg); }.field input:focus,.field select:focus { border-color:var(--primary); box-shadow:0 0 0 3px rgba(53,89,216,.08); }
#previewPersonBtn { min-height:46px; margin-top:3px; }
.person-preview { display:grid; gap:12px; }
.preview-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:10px; }.preview-heading h3 { margin:3px 0 0; font-size:19px; }.preview-heading > span { padding:6px 8px; border-radius:999px; color:#996200; background:#fff5df; font-size:8px; font-weight:900; }
.preview-details { display:grid; grid-template-columns:1fr 1fr; gap:7px; margin:0; }.preview-details > div { padding:9px; border:1px solid var(--line); border-radius:12px; background:var(--bg); }.preview-details dt { color:var(--muted); font-size:8px; font-weight:800; }.preview-details dd { margin:3px 0 0; font-size:11px; font-weight:900; }
.preview-warning,.preview-ok { padding:11px; border-radius:13px; font-size:10px; line-height:1.45; }.preview-warning { color:#845700; background:#fff5df; }.preview-warning p { margin:4px 0 0; }.preview-ok { color:#187a49; background:#eaf7ef; font-weight:850; }
.change-list { display:grid; gap:7px; }
.change-row { display:grid; grid-template-columns:minmax(76px,.8fr) minmax(0,1fr) auto minmax(0,1fr); align-items:center; gap:7px; padding:10px; border:1px solid var(--line); border-radius:13px; background:var(--bg); }
.change-row strong { font-size:9px; }
.change-row span { min-width:0; overflow-wrap:anywhere; color:var(--muted); font-size:10px; }
.change-row b { color:var(--muted); font-size:11px; }
.change-row .change-after { color:var(--text); font-weight:850; }
.immutable-details { opacity:.82; }
.transfer-current { display:grid; gap:4px; padding:11px; border:1px solid var(--line); border-radius:13px; background:var(--bg); }
.transfer-current span,.transfer-rule span { color:var(--muted); font-size:9px; }
.transfer-current strong { font-size:12px; }
#transferForm { display:grid; gap:11px; }
.transfer-rule { display:grid; gap:4px; padding:11px; border-radius:13px; color:#6f5400; background:#fff7df; }
.transfer-rule strong { font-size:10px; }
#previewTransferBtn { min-height:46px; }
.transfer-path { display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:8px; }
.transfer-path > div { display:grid; gap:4px; min-height:66px; align-content:center; padding:11px; border:1px solid var(--line); border-radius:14px; background:var(--bg); }
.transfer-path span { color:var(--muted); font-size:8px; font-weight:850; text-transform:uppercase; }
.transfer-path strong { overflow-wrap:anywhere; font-size:12px; }
.transfer-path > b { color:#18a75a; font-size:18px; }
.preview-actions { display:grid; grid-template-columns:1fr 1.35fr; gap:8px; }.secondary-button,.confirm-button { min-height:45px; border-radius:13px; font-weight:900; }.secondary-button { border:1px solid var(--line); color:var(--text); background:var(--card); }.confirm-button { border:0; color:#fff; background:#18a75a; }
.access-summary { display:grid; gap:7px; margin-bottom:11px; }
.access-summary > div { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:10px; border:1px solid var(--line); border-radius:12px; background:var(--bg); }
.access-summary span { color:var(--muted); font-size:9px; }.access-summary strong { max-width:68%; overflow-wrap:anywhere; font-size:11px; text-align:right; }
#previewSelfAccessBtn { width:100%; min-height:46px; }
#delegateForm { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.delegate-sheet { width:min(700px,100%); }
.delegate-permission-key { grid-column:1 / -1; display:grid; grid-template-columns:minmax(140px,1fr) repeat(3,54px); gap:5px; padding:0 8px; color:var(--muted); font-size:8px; font-weight:900; text-align:center; text-transform:uppercase; }
.delegate-permission-key span:first-child { text-align:left; }
.delegate-team-list { display:grid; gap:6px; max-height:38vh; overflow:auto; padding-right:2px; }
.delegate-team-row { display:grid; grid-template-columns:minmax(140px,1fr) repeat(3,54px); align-items:center; gap:5px; padding:9px; border:1px solid var(--line); border-radius:13px; background:var(--bg); }
.delegate-team-row label { display:grid; justify-items:center; gap:3px; color:var(--muted); font-size:7.5px; font-weight:800; }
.delegate-team-row input { width:17px; height:17px; accent-color:var(--primary); }
.delegate-team-name { grid-template-columns:auto 1fr; justify-items:start !important; align-items:center; text-align:left; }
.delegate-team-name span { min-width:0; display:grid; gap:2px; }.delegate-team-name strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--text); font-size:10px; }.delegate-team-name small { color:var(--muted); font-size:7.5px; }
.danger-button { min-height:43px; border:1px solid rgba(180,71,89,.18); border-radius:13px; color:#a23f50; background:#fff2f4; font-weight:900; }
.team-extra-fields { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
#teamForm { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.switch-field { display:flex; align-items:center; gap:9px; min-height:44px; padding:0 11px; border:1px solid var(--line); border-radius:13px; color:#59657a; background:var(--bg); font-size:10px; font-weight:850; }
.switch-field input { width:19px; height:19px; accent-color:var(--primary); }
#previewLifecycleBtn { width:100%; }
.delegate-preview-list { display:grid; gap:6px; max-height:34vh; overflow:auto; }
.delegate-preview-row { display:flex; align-items:center; justify-content:space-between; gap:8px; padding:9px; border:1px solid var(--line); border-radius:12px; background:var(--bg); }
.delegate-preview-row > div:first-child { display:grid; gap:2px; }.delegate-preview-row strong { font-size:10.5px; }.delegate-preview-row > div:first-child span { color:var(--muted); font-size:8px; }
.status-toast { position:fixed; z-index:80; left:50%; bottom:24px; max-width:min(90%,500px); transform:translateX(-50%); padding:11px 15px; border-radius:13px; color:#fff; background:#172033; box-shadow:0 10px 30px rgba(17,24,39,.22); font-size:11px; text-align:center; }
@media (max-width: 700px) {
  .foundation-note > span { display:none; }
  .stats-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .directory-head { align-items: stretch; flex-direction: column; }
  .directory-controls { align-items:stretch; flex-direction:column; }
  .search-box { width: 100%; }
  .record-grid, .team-list, .access-list, .self-access-list { grid-template-columns: 1fr; }
}
@media (max-width: 420px) {
  .management-shell { padding: 11px; }
  .secure-pill { display: none; }
  .foundation-note > span { display: none; }
  .directory-card { padding: 12px; }
  #personForm { grid-template-columns:1fr; }
  #delegateForm { grid-template-columns:1fr; }
  #teamForm,.team-extra-fields { grid-template-columns:1fr; }
  .field-wide { grid-column:auto; }
  .delegate-permission-key,.delegate-team-row { grid-template-columns:minmax(112px,1fr) repeat(3,45px); }
  .change-row { grid-template-columns:1fr auto 1fr; }
  .change-row strong { grid-column:1 / -1; }
}