/*
 * Office Unbound — organization administration concepts.
 *
 * Loaded after concepts.css and concepts-admin.css; every rule is scoped
 * under `.ux`. Built on the shared admin frame (oa- navigation, the mg- page
 * head and content grid, ux-card, ux-rows, ux-table, ux-chip). One prefix,
 * og-, for the admin home, groups and roles, mail settings, audit log,
 * organization updates and admin on a phone (og-am, reusing the mo- phone
 * frames from concepts-user.css).
 */

/* ============================================================ shared · og- == */

.ux .og-hsub { display: inline-flex; align-items: center; gap: 6px; margin-right: 6px; font-size: 12px; color: var(--ux-muted); white-space: nowrap; }
.ux.og .mg-content .ux-card__h > .ux-i { color: var(--ux-muted); }
.ux .og-col { display: flex; flex-direction: column; gap: 14px; min-width: 0; }
.ux .og-g2 { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(0, 1fr); gap: 14px; align-items: start; }
.ux .og-g3 { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr) minmax(0, 1fr); gap: 14px; align-items: start; }
.ux .og-sub { padding: 10px 14px 4px; font-size: 11px; font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase; color: var(--ux-faint); }
.ux .og-sub--in { border-top: 1px solid var(--ux-line); }
.ux .og-msp { display: inline-flex; align-items: center; height: 17px; margin-left: 5px; padding: 0 5px; border-radius: 3px; background: var(--ux-teal-soft); color: var(--ux-teal); font: 500 10.5px/1 var(--ux-sans); font-style: normal; vertical-align: 1px; white-space: nowrap; }
.ux .og-note { display: flex; gap: 8px; padding: 9px 14px; border-top: 1px solid var(--ux-line); background: var(--ux-bg); font-size: 12px; line-height: 1.45; color: var(--ux-muted); }
.ux .og-note > .ux-i { flex: none; margin-top: 2px; }
.ux .og-note b { color: var(--ux-ink); font-weight: 600; }
.ux .og-link { color: var(--ux-teal); font-weight: 500; white-space: nowrap; }
.ux .og-mono { font-family: var(--ux-mono); font-size: 11.5px; }
.ux .ux-dot--off { background: var(--ux-line-2); }

/* Summary strip. */
.ux .og-stats { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); border: 1px solid var(--ux-line); border-radius: 7px; background: var(--ux-surface); overflow: hidden; }
.ux .og-stat { display: flex; flex-direction: column; gap: 3px; padding: 11px 14px; min-width: 0; border-left: 1px solid var(--ux-line); }
.ux .og-stat:first-child { border-left: 0; }
.ux .og-stat__l { display: flex; align-items: center; gap: 6px; font-size: 11.5px; color: var(--ux-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ux .og-stat__l .ux-i { width: 13px; height: 13px; }
.ux .og-stat__v { font-size: 20px; font-weight: 600; color: var(--ux-ink); letter-spacing: -0.01em; font-variant-numeric: tabular-nums; white-space: nowrap; line-height: 1.2; }
.ux .og-stat__v small { font-size: 12.5px; font-weight: 500; color: var(--ux-muted); letter-spacing: 0; }
.ux .og-stat__s { font-size: 11.5px; color: var(--ux-faint); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ux .og-stat__s.ux-warn { color: var(--ux-warn); font-weight: 500; }

/* ============================================================ admin home == */

.ux .og-att > li { position: relative; display: flex; align-items: center; gap: 11px; padding: 9px 14px 9px 16px; border-top: 1px solid var(--ux-line); font-size: 12.5px; }
.ux .og-att > li:first-child { border-top: 0; }
.ux .og-att > li::before { content: ""; position: absolute; left: 0; top: 9px; bottom: 9px; width: 3px; border-radius: 0 2px 2px 0; background: #4F6E95; }
.ux .og-att__i { display: grid; place-items: center; width: 28px; height: 28px; flex: none; border-radius: 6px; background: var(--ux-info-bg); color: var(--ux-info); }
.ux .og-att--bad::before { background: #B8443A !important; }
.ux .og-att--bad .og-att__i { background: var(--ux-bad-bg); color: var(--ux-bad); }
.ux .og-att--warn::before { background: #C8902A !important; }
.ux .og-att--warn .og-att__i { background: var(--ux-warn-bg); color: var(--ux-warn); }
.ux .og-setup { display: grid; grid-template-columns: auto minmax(80px, 1fr); align-items: center; gap: 6px 14px; padding: 10px 14px 11px; border-top: 1px solid var(--ux-line); background: var(--ux-bg); }
.ux .og-setup__t { display: flex; align-items: baseline; gap: 8px; font-size: 12.5px; white-space: nowrap; }
.ux .og-setup__t b { color: var(--ux-ink); }
.ux .og-setup__t span { color: var(--ux-muted); font-size: 12px; }
.ux .og-setup__n { grid-column: 1 / -1; font-size: 12px; color: var(--ux-muted); }

.ux .og-qa { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; padding: 12px 14px; }
.ux .og-qa__b { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 5px; height: 58px; padding: 0 6px; text-align: center; border: 1px solid var(--ux-line-2); border-radius: 6px; background: var(--ux-surface); color: var(--ux-ink); font-size: 12.5px; font-weight: 500; min-width: 0; }
.ux .og-qa__b > span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ux .og-qa__b .ux-i { color: var(--ux-teal); width: 18px; height: 18px; }
.ux .og-qa__b > span { max-width: 100%; font-size: 12px; }
.ux .og-recent { border-top: 1px solid var(--ux-line); }
.ux .og-recent .og-sub { padding-top: 9px; padding-bottom: 0; }
.ux .og-recent .ux-rows > li { border-top: 0; padding-top: 7px; padding-bottom: 7px; }

.ux .og-health > li { padding: 7px 14px; align-items: center; font-size: 12.5px; }
.ux .og-health > li > .ux-dot { margin-top: 0; }
.ux .og-health__s { font-size: 12px; font-weight: 500; }
.ux .og-health__s--ok { color: var(--ux-ok); }
.ux .og-health__s--warn { color: var(--ux-warn); }
.ux .og-health__s--off { color: var(--ux-faint); font-weight: 400; }

.ux .og-from { flex: 1; min-width: 0; font-size: 12px; color: var(--ux-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ux .og-msg > li { display: flex; flex-direction: column; gap: 4px; padding: 10px 14px 11px; border-top: 1px solid var(--ux-line); min-width: 0; }
.ux .og-msg > li:first-child { border-top: 0; }
.ux .og-msg__h { display: flex; align-items: center; gap: 8px; }
.ux .og-msg__w { margin-left: auto; font-size: 11.5px; color: var(--ux-faint); }
.ux .og-msg__t { font-weight: 600; color: var(--ux-ink); line-height: 1.35; }
.ux .og-msg__d { font-size: 12px; color: var(--ux-muted); line-height: 1.45; }
.ux .og-msg__a { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 3px; }
.ux .og-kind { display: inline-flex; align-items: center; gap: 6px; font-size: 10.5px; font-weight: 600; letter-spacing: 0.05em; text-transform: uppercase; color: var(--ux-muted); }
.ux .og-kind::before { content: ""; width: 7px; height: 7px; border-radius: 2px; background: var(--ux-line-2); }
.ux .og-kind--accent { color: var(--ux-accent-ink); } .ux .og-kind--accent::before { background: var(--ux-accent); }
.ux .og-kind--info { color: var(--ux-info); } .ux .og-kind--info::before { background: #4F6E95; }
.ux .og-kind--ok { color: var(--ux-ok); } .ux .og-kind--ok::before { background: #3C8A55; }
.ux .og-kind--bad { color: var(--ux-bad); } .ux .og-kind--bad::before { background: #B8443A; }
.ux .og-kind--warn { color: var(--ux-warn); } .ux .og-kind--warn::before { background: #C8902A; }

.ux .og-sto { display: flex; flex-direction: column; gap: 9px; }
.ux .og-sto__h { display: flex; align-items: baseline; gap: 8px; font-size: 12px; color: var(--ux-muted); }
.ux .og-sto__h b { font-size: 18px; color: var(--ux-ink); letter-spacing: -0.01em; }
.ux .og-sto__bar { display: flex; gap: 2px; height: 10px; border-radius: 3px; background: var(--ux-sunken); overflow: hidden; }
.ux .og-sto__bar > i { display: block; height: 100%; }
.ux .og-sto--a { background: var(--ux-teal); }
.ux .og-sto--b { background: var(--ux-navy-2); }
.ux .og-sto--c { background: #C8902A; }
.ux .og-sto--d { background: #8E7B9C; }
.ux .og-sto__k { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 5px 14px; font-size: 12px; }
.ux .og-sto__k > li { display: flex; align-items: center; gap: 6px; min-width: 0; color: var(--ux-muted); }
.ux .og-sto__k > li > i { width: 8px; height: 8px; border-radius: 2px; flex: none; }
.ux .og-sto__k > li > span { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ux .og-sto__k b { color: var(--ux-ink); font-weight: 500; white-space: nowrap; }
.ux .og-sto__n { display: flex; align-items: center; gap: 6px; font-size: 12px; color: var(--ux-muted); }
.ux .og-top > li { display: grid; grid-template-columns: minmax(0, 1fr) 70px 92px; align-items: center; gap: 10px; padding: 7px 14px; font-size: 12.5px; }
.ux .og-top > li > .ux-num { font-size: 11.5px; color: var(--ux-muted); text-align: right; white-space: nowrap; }
.ux .og-top .ux-rows__t > span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.ux .og-act > li { display: flex; align-items: flex-start; gap: 9px; padding: 8px 14px; border-top: 1px solid var(--ux-line); font-size: 12.5px; min-width: 0; }
.ux .og-act > li:first-child { border-top: 0; }
.ux .og-act > li > .ux-av, .ux .og-act__sys { margin-top: 1px; }
.ux .og-act__t { flex: none; width: 36px; margin-top: 4px; font-size: 11.5px; color: var(--ux-muted); }
.ux .og-act__sys { display: grid; place-items: center; width: 24px; height: 24px; flex: none; border-radius: 50%; background: var(--ux-sunken); color: var(--ux-muted); }
.ux .og-act .ux-rows__t > span + span { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.ux .og-hg { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr) minmax(0, 1fr); gap: 14px; align-items: start; }

@container ux (max-width: 1500px) {
  .ux .og-hg { grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); }
  .ux .og-hg__b { grid-column: 1 / -1; grid-row: 2; }
  .ux .og-msg { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ux .og-msg > li:nth-child(2) { border-top: 0; }
  .ux .og-msg > li:nth-child(even) { border-left: 1px solid var(--ux-line); }
}
@container ux (max-width: 1250px) {
  .ux .og-stats { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .ux .og-stat:nth-child(4) { border-left: 0; }
  .ux .og-stat:nth-child(n+4) { border-top: 1px solid var(--ux-line); }
}
@container ux (max-width: 1100px) {
  .ux .og-hsub { display: none; }
  .ux .og-hg { grid-template-columns: minmax(0, 1fr); }
  .ux .og-hg__b { grid-row: auto; }
  .ux .og-hg__c { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; }
  .ux .og-hg__c > .ux-card:last-child { grid-column: 2; grid-row: 1 / span 2; }
}
@container ux (max-width: 900px) {
  .ux .og-msg { display: block; }
  .ux .og-msg > li:nth-child(2) { border-top: 1px solid var(--ux-line); }
  .ux .og-msg > li:nth-child(even) { border-left: 0; }
}
@container ux (max-width: 760px) {
  .ux .og-hg__c { grid-template-columns: minmax(0, 1fr); }
  .ux .og-hg__c > .ux-card:last-child { grid-column: auto; grid-row: auto; }
  .ux .og-from { display: none; }
}
@container ux (max-width: 640px) {
  .ux .og-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ux .og-stat:nth-child(n) { border-left: 1px solid var(--ux-line); border-top: 1px solid var(--ux-line); }
  .ux .og-stat:nth-child(odd) { border-left: 0; }
  .ux .og-stat:nth-child(-n+2) { border-top: 0; }
  .ux .og-att > li { flex-wrap: wrap; }
  .ux .og-att > li > .ux-rows__t { flex: 1 1 200px; }
  .ux .og-att > li > .ux-btn { margin-left: 39px; }
  .ux .og-setup { grid-template-columns: minmax(0, 1fr); }
  .ux .og-qa { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@container ux (max-width: 1100px) { .ux .og-hg__c .og-qa { grid-template-columns: repeat(2, minmax(0, 1fr)); } .ux .og-sto__k { grid-template-columns: minmax(0, 1fr); } }
@container ux (max-width: 640px) { .ux .og-stat__s { white-space: normal; } }

/* ================================================= groups and permissions == */

.ux .og-gx { display: grid; grid-template-columns: minmax(0, 1fr) minmax(340px, 400px); gap: 14px; align-items: start; }
.ux .og-filt { display: flex; align-items: center; gap: 6px; padding: 10px 14px; border-bottom: 1px solid var(--ux-line); flex-wrap: wrap; }
.ux .og-filt__s { width: 240px; margin-right: 4px; }
.ux .og-filt__n { font-size: 12px; color: var(--ux-muted); }
.ux .og-gt .og-gt__n { width: 42%; max-width: 0; }
.ux .ux-table.og-gt td { padding-top: 7px; padding-bottom: 7px; }
.ux .og-gi { display: grid; place-items: center; width: 28px; height: 28px; flex: none; border-radius: 6px; background: var(--ux-sunken); color: var(--ux-muted); }
.ux .og-gi--team { background: var(--ux-teal-soft); color: var(--ux-teal); }
.ux .og-gi--mail { background: var(--ux-info-bg); color: var(--ux-info); }
.ux .og-gi--lg { width: 38px; height: 38px; border-radius: 8px; }
.ux .og-inl { display: inline-block; vertical-align: -2px; margin-right: 5px; }

.ux .og-det__h { display: flex; align-items: center; gap: 11px; padding: 12px 14px 8px; }
.ux .og-det__t { font-size: 15px; font-weight: 600 !important; }
.ux .og-det__d { display: flex; flex-wrap: wrap; align-items: center; gap: 5px; padding: 0 14px 12px; border-bottom: 1px solid var(--ux-line); }
.ux .og-det__m { flex: 1 1 100%; margin-top: 3px; font-size: 11.5px; color: var(--ux-muted); }
.ux .og-det__s + .og-det__s { border-top: 1px solid var(--ux-line); }
.ux .og-sub--row { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; }
.ux .og-sub--row .og-link { text-transform: none; letter-spacing: 0; font-size: 12px; }
.ux .og-res > li, .ux .og-mem > li { display: flex; align-items: center; gap: 10px; padding: 6px 14px; font-size: 12.5px; min-width: 0; }
.ux .og-res > li > .ux-num { font-size: 11.5px; white-space: nowrap; }
.ux .og-res .ux-rows__t > span + span, .ux .og-mem .ux-rows__t > span + span { font-size: 11.5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ux .og-res__i { display: grid; place-items: center; width: 24px; height: 24px; flex: none; border-radius: 5px; background: var(--ux-sunken); color: var(--ux-muted); }
.ux .og-res, .ux .og-mem { padding-bottom: 6px; }
.ux .og-mem__r { font-size: 12px; }
.ux .og-mem__more { color: var(--ux-teal); font-weight: 500; padding-left: 48px !important; }

.ux .og-hint { flex: 1; min-width: 0; font-size: 12px; color: var(--ux-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ux .og-rt .og-rt__r .ux-cell__t > span:first-child { font-weight: 600; }
.ux .og-rt__can2 { display: none; }
.ux .ux-table.og-rt td.og-c-can { white-space: normal; font-size: 12px; line-height: 1.4; min-width: 220px; }
.ux .og-rt .og-c-who .ux-cell { max-width: 300px; }
.ux .og-rt__n { font-weight: 600; color: var(--ux-ink); }
.ux .og-scope { display: inline-flex; align-items: center; gap: 6px; padding: 3px 8px 3px 6px; border-radius: 4px; font-size: 12px; font-weight: 500; white-space: normal; line-height: 1.3; }
.ux .og-scope .ux-i { flex: none; width: 13px; height: 13px; }
.ux .og-scope--bad { background: var(--ux-bad-bg); color: var(--ux-bad); }
.ux .og-scope--warn { background: var(--ux-warn-bg); color: var(--ux-warn); }
.ux .og-scope--info { background: var(--ux-info-bg); color: var(--ux-info); }
.ux .og-scope--teal { background: var(--ux-teal-soft); color: var(--ux-teal); }
.ux .og-scope--plain { background: var(--ux-sunken); color: var(--ux-text); }
.ux .ux-table.og-rt td.og-rt__s { white-space: normal; max-width: 300px; }

@container ux (max-width: 1500px) { .ux .og-rt .og-c-who .ux-tr { display: none; } }
@container ux (max-width: 1250px) {
  .ux .og-c-can { display: none; }
  .ux .og-rt__can2 { display: block; white-space: normal; }
  .ux .og-x1 { display: none; }
}
@container ux (max-width: 1100px) {
  .ux .og-gx { grid-template-columns: minmax(0, 1fr); }
  .ux .og-det { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ux .og-det > .og-det__h, .ux .og-det > .og-det__d, .ux .og-det > .og-note { grid-column: 1 / -1; }
  .ux .og-det__s + .og-det__s { border-top: 0; border-left: 1px solid var(--ux-line); }
}
@container ux (max-width: 900px) { .ux .og-c-src, .ux .og-hint { display: none; } }
@container ux (max-width: 640px) {
  .ux .og-det { display: block; }
  .ux .og-det__s + .og-det__s { border-left: 0; border-top: 1px solid var(--ux-line); }
  .ux .og-c-own, .ux .og-c-who { display: none; }
  .ux .og-filt__s { width: 100%; margin: 0 0 4px; }
  .ux .og-gt .og-gt__n { width: 60%; }
  .ux .ux-table.og-gt td, .ux .ux-table.og-gt th, .ux .ux-table.og-rt td, .ux .ux-table.og-rt th { padding-left: 8px; padding-right: 8px; }
  .ux .ux-table.og-gt td:first-child, .ux .ux-table.og-gt th:first-child, .ux .ux-table.og-rt td:first-child, .ux .ux-table.og-rt th:first-child { padding-left: 12px; }
  .ux .ux-table.og-rt td { vertical-align: top; }
  .ux .ux-table.og-rt td.og-rt__r { white-space: normal; }
}
.ux.og .ux-stack > .ux-av + .ux-av { margin-left: -2px; }
.ux.og .ux-table .is-sel .ux-stack > .ux-av { box-shadow: 0 0 0 2px var(--ux-sel); }

/* ========================================================== mail settings == */

.ux .og-mg { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: 14px; align-items: start; }
.ux .og-dom > li { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 16px; padding: 11px 14px; border-top: 1px solid var(--ux-line); }
.ux .og-dom > li:first-child { border-top: 0; }
.ux .og-dom__n { flex: 1 1 220px; }
.ux .og-dom__n > span:first-child { font-family: var(--ux-mono); font-size: 12.5px; }
.ux .og-pt .ux-cell__t > span:first-child { font-weight: 600; }
.ux .og-pt__d { white-space: nowrap; }
.ux .og-on { display: inline-flex; align-items: center; gap: 7px; font-size: 12px; font-weight: 500; color: var(--ux-ink); }
.ux .og-pt__off td { background: var(--ux-bg); }
.ux .og-pt__off .og-on { color: var(--ux-muted); }
.ux .og-auth { display: inline-flex; flex-wrap: wrap; gap: 4px; }
.ux .og-legacy { display: grid; grid-template-columns: auto minmax(0, 1fr) 170px; gap: 12px; align-items: center; margin: 12px 14px; padding: 12px 14px; border: 1px solid var(--ux-ok); border-left-width: 4px; border-radius: 6px; background: var(--ux-ok-bg); }
.ux .og-legacy__i { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 8px; background: var(--ux-surface); color: var(--ux-ok); }
.ux .og-legacy__i .ux-i { width: 19px; height: 19px; }
.ux .og-legacy__t { display: flex; flex-direction: column; gap: 4px; min-width: 0; font-size: 12px; line-height: 1.45; color: var(--ux-text); }
.ux .og-legacy__t > span:first-child { display: flex; align-items: center; flex-wrap: wrap; gap: 6px 10px; font-size: 13px; color: var(--ux-ink); }
.ux .og-legacy__s { display: flex; flex-direction: column; gap: 1px; padding-left: 12px; border-left: 1px solid rgba(47, 110, 71, 0.25); font-size: 11.5px; color: var(--ux-muted); line-height: 1.35; }
.ux .og-legacy__s b { font-size: 18px; color: var(--ux-ink); }
.ux .og-tok { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0; border-top: 1px solid var(--ux-line); }
.ux .og-tok__kv { padding: 10px 14px; align-items: center; }
.ux .og-tok__kv + .og-tok__kv { border-left: 1px solid var(--ux-line); }
.ux .og-tok__kv > :nth-child(even) { display: flex; justify-content: flex-end; }
.ux .og-kv { grid-template-columns: auto minmax(0, 1fr); }
.ux .og-shm > li { align-items: center; padding: 8px 14px; font-size: 12.5px; }
.ux .og-shm > li > .ux-num { font-size: 12px; white-space: nowrap; }
.ux .og-shm .og-mono { font-weight: 400; }
.ux .og-int { display: flex; align-items: center; gap: 12px; margin: 0 14px 14px; padding: 11px 12px; border: 1px dashed var(--ux-line-2); border-radius: 7px; background: var(--ux-bg); }
.ux .og-int .sp-int__i { width: 34px; height: 34px; }
.ux .og-rules .og-rules__n .ux-cell__t > span:first-child { font-weight: 500; }
.ux .og-rules__s { display: none; }
.ux .ux-table.og-rules td.og-c-when, .ux .ux-table.og-rules td.og-c-then { white-space: normal; }
.ux .og-rules th:first-child, .ux .og-rules td:first-child { width: 28px; }

@container ux (max-width: 1500px) { .ux .og-c-port { display: none; } .ux .og-legacy { grid-template-columns: auto minmax(0, 1fr); } .ux .og-legacy__s { grid-column: 2; flex-direction: row; flex-wrap: wrap; align-items: baseline; gap: 4px 6px; padding: 8px 0 0; border-left: 0; border-top: 1px solid rgba(47, 110, 71, 0.25); } .ux .og-legacy__s b { font-size: 13px; } }
@container ux (max-width: 1250px) { .ux .og-mg { grid-template-columns: minmax(0, 1fr); } .ux .og-mg > .og-col:last-child { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; } .ux .og-mg > .og-col:last-child > .ux-card:nth-child(2) { grid-row: span 2; grid-column: 2; } }
@container ux (max-width: 900px) { .ux .og-pt__d { display: none; } .ux .og-c-when { display: none; } }
@container ux (max-width: 760px) {
  .ux .og-mg > .og-col:last-child { grid-template-columns: minmax(0, 1fr); }
  .ux .og-mg > .og-col:last-child > .ux-card:nth-child(2) { grid-row: auto; grid-column: auto; }
  .ux .og-c-then { display: none; }
  .ux .og-rules__s { display: block; white-space: normal; }
  .ux .ux-table.og-rules td.og-rules__n { white-space: normal; }
}
@container ux (max-width: 640px) {
  .ux .og-tok { grid-template-columns: minmax(0, 1fr); }
  .ux .og-tok__kv + .og-tok__kv { border-left: 0; border-top: 1px solid var(--ux-line); }
  .ux .og-legacy { grid-template-columns: minmax(0, 1fr); margin: 10px; }
  .ux .og-legacy__i { display: none; }
  .ux .og-legacy__s { grid-column: auto; }
  .ux .og-int { flex-wrap: wrap; }
  .ux .og-int .sp-int__t { flex: 1 1 180px; }
  .ux .og-int > .ux-btn { margin-left: 46px; }
  .ux .ux-table.og-pt td, .ux .ux-table.og-pt th { padding-left: 8px; padding-right: 8px; white-space: normal; }
  .ux .ux-table.og-pt td:first-child, .ux .ux-table.og-pt th:first-child { padding-left: 12px; }
  .ux .og-pt .og-res__i { display: none; }
}

/* ============================================================== audit log == */

.ux .og-af { display: flex; align-items: center; gap: 8px; padding: 4px 16px 10px; background: var(--ux-surface); flex-wrap: wrap; }
.ux .og-af__s { width: 280px; }
.ux .og-dd { display: inline-flex; align-items: center; gap: 7px; height: 30px; padding: 0 9px; border: 1px solid var(--ux-line-2); border-radius: 5px; background: var(--ux-surface); font-size: 12.5px; color: var(--ux-ink); white-space: nowrap; }
.ux .og-dd > span:nth-child(2) { display: inline-flex; align-items: center; gap: 6px; font-weight: 500; }
.ux .og-dd .ux-i { color: var(--ux-muted); }
.ux .og-dd__l { color: var(--ux-muted); font-size: 12px; }
.ux .og-dd.is-on { border-color: var(--ux-sel-line); background: var(--ux-sel); }
.ux .og-af2 { display: flex; align-items: center; gap: 8px; padding: 8px 16px; border-top: 1px solid var(--ux-line); border-bottom: 1px solid var(--ux-line); background: var(--ux-bg); flex-wrap: wrap; font-size: 12px; }
.ux .og-af2 .ux-chip .ux-i { width: 11px; height: 11px; }
.ux .og-af2__n { color: var(--ux-muted); }
.ux .og-af2__n b { color: var(--ux-ink); }
.ux .og-ax { display: grid; grid-template-columns: minmax(0, 1fr) 380px; background: var(--ux-surface); }
.ux .og-at { min-width: 0; border-right: 1px solid var(--ux-line); }
.ux .ux-table.og-et td { padding-top: 6px; padding-bottom: 6px; }
.ux .og-et .og-mono { font-size: 11.5px; }
.ux .og-et__a { max-width: 180px; }
.ux .og-et__m { font-size: 10.5px !important; color: var(--ux-teal) !important; font-weight: 500; }
.ux .og-et__x .ux-cell__t > span:first-child { font-weight: 500; }
.ux .og-et__t2 { display: none; }
.ux .og-et__g { max-width: 260px; color: var(--ux-text); }
.ux .og-et .og-c-ip .ux-cell__t > span:first-child { color: var(--ux-text); font-weight: 400; }
.ux .og-et tr.is-sel td:first-child { box-shadow: inset 3px 0 0 var(--ux-navy); }
.ux .og-pg { display: flex; align-items: center; gap: 8px; padding: 10px 16px; font-size: 12px; color: var(--ux-muted); }
.ux .og-pg__n { color: var(--ux-ink); }

.ux .og-ed { display: flex; flex-direction: column; min-width: 0; background: var(--ux-surface); }
.ux .og-ed__h { display: flex; align-items: flex-start; gap: 10px; padding: 14px 14px 12px; border-bottom: 1px solid var(--ux-line); }
.ux .og-ed__h .ux-cell__t { flex: 1; }
.ux .og-ed__h .ux-cell__t > span:first-child { font-size: 15px; font-weight: 600; }
.ux .og-ed__h .og-mono { font-size: 11px !important; margin-top: 2px; }
.ux .og-ed__kv { padding: 12px 14px; }
.ux .og-ed__kv > :nth-child(even) { text-align: right; }
.ux .og-diff { font-size: 12px; }
.ux .ux-table.og-diff td, .ux .ux-table.og-diff th { padding: 6px 10px; white-space: normal; vertical-align: top; }
.ux .ux-table.og-diff td:first-child, .ux .ux-table.og-diff th:first-child { padding-left: 14px; color: var(--ux-muted); width: 96px; }
.ux .og-diff del { text-decoration: none; display: inline-block; padding: 1px 5px; border-radius: 3px; background: var(--ux-bad-bg); color: var(--ux-bad); }
.ux .og-diff ins { text-decoration: none; display: inline-block; padding: 1px 5px; border-radius: 3px; background: var(--ux-ok-bg); color: var(--ux-ok); font-weight: 500; }
.ux .og-diff__same td { color: var(--ux-faint); }
.ux .og-rel { padding: 2px 0 8px; }
.ux .og-rel > li { display: flex; gap: 10px; padding: 4px 14px; font-size: 12.5px; }
.ux .og-rel > li > .og-mono { color: var(--ux-muted); width: 36px; flex: none; }
.ux .og-ed__f { display: flex; gap: 8px; padding: 10px 14px; border-top: 1px solid var(--ux-line); }

@container ux (max-width: 1600px) { .ux .og-c-svc { display: none; } }
@container ux (max-width: 1450px) { .ux .og-c-tgt { display: none; } .ux .og-et__t2 { display: block; } .ux .og-et__x { max-width: 260px; } }
@container ux (max-width: 1250px) {
  .ux .og-ax { grid-template-columns: minmax(0, 1fr); }
  .ux .og-at { border-right: 0; border-bottom: 1px solid var(--ux-line); }
  .ux .og-ed { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ux .og-ed > .og-ed__h, .ux .og-ed > .og-note, .ux .og-ed > .og-ed__f { grid-column: 1 / -1; }
  .ux .og-ed > .og-ed__kv { grid-row: 2 / span 4; border-right: 1px solid var(--ux-line); }
  .ux .og-ed > .og-sub--in:first-of-type { border-top: 0; }
  .ux .og-x1 { display: none; }
}
@container ux (max-width: 900px) { .ux .og-c-ip { display: none; } .ux .og-af__s { width: 100%; } }
@container ux (max-width: 640px) {
  .ux .og-ed { display: flex; }
  .ux .og-ed > .og-ed__kv { border-right: 0; }
  .ux .og-ed > .og-sub--in:first-of-type { border-top: 1px solid var(--ux-line); }
  .ux .og-af { padding: 4px 12px 10px; }
  .ux .og-af2 { padding: 8px 12px; }
  .ux .og-dd__l { display: none; }
  .ux .ux-table.og-et td, .ux .ux-table.og-et th { padding-left: 6px; padding-right: 6px; }
  .ux .ux-table.og-et td:first-child, .ux .ux-table.og-et th:first-child { padding-left: 12px; }
  .ux .og-et .og-et__a .ux-av, .ux .og-et .og-et__a .og-act__sys { display: none; }
  .ux .og-et__a { max-width: 96px; }
  .ux .og-et__x { max-width: 130px; }
  .ux .og-et .og-mono { font-size: 10.5px; }
}
.ux .og-et__w { display: none; }
.ux .og-ed__kv { align-content: start; }
@container ux (max-width: 1250px) { .ux .og-af__s { width: 220px; } .ux .og-af .og-dd__l { display: none; } }
@container ux (max-width: 640px) {
  .ux .og-c-act { display: none; }
  .ux .og-et__w { display: block; }
  .ux .og-et__x { max-width: 0; width: 100%; }
  .ux .og-af__s { width: 100%; }
}

/* ================================================== organization updates == */

.ux .og-pol { display: grid; grid-template-columns: 1.1fr 1fr 1.1fr 1.25fr 1.1fr; border: 1px solid var(--ux-line); border-radius: 7px; background: var(--ux-surface); overflow: hidden; }
.ux .og-pol__c { display: flex; flex-direction: column; gap: 3px; padding: 11px 14px; min-width: 0; border-left: 1px solid var(--ux-line); }
.ux .og-pol__c:first-child { border-left: 0; }
.ux .og-pol__l { font-size: 11px; font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase; color: var(--ux-faint); }
.ux .og-pol__v { display: flex; align-items: center; gap: 7px; font-size: 14px; font-weight: 600; color: var(--ux-ink); }
.ux .og-pol__s { font-size: 11.5px; color: var(--ux-muted); line-height: 1.35; }
.ux .og-prov { width: 22px; height: 22px; border-radius: 5px; font-size: 9.5px; flex: none; }

.ux .og-ut .ux-cell__t > span:first-child { font-weight: 600; }
.ux .og-ut .ux-cell__t .og-mono { font-weight: 400; color: var(--ux-muted); }
.ux .og-ut__w2 { display: none; }
.ux .og-ring { display: inline-flex; align-items: center; gap: 4px; }
.ux .og-ring__s { display: inline-flex; align-items: center; gap: 4px; height: 22px; padding: 0 7px; border-radius: 4px; font-size: 11.5px; font-weight: 500; background: var(--ux-sunken); color: var(--ux-muted); }
.ux .og-ring__s .ux-i { width: 12px; height: 12px; }
.ux .og-ring__s--ok { background: var(--ux-ok-bg); color: var(--ux-ok); }
.ux .og-ring__s--warn { background: var(--ux-warn-bg); color: var(--ux-warn); }
.ux .og-ring__s--you { background: transparent; box-shadow: inset 0 0 0 1px var(--ux-navy); color: var(--ux-navy); }
.ux .og-ring__a { width: 11px !important; height: 11px !important; color: var(--ux-faint); }
.ux .og-dec { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 500; color: var(--ux-text); }
.ux .og-dec::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--ux-line-2); flex: none; }
.ux .og-dec--ok::before { background: #3C8A55; } .ux .og-dec--warn::before { background: #C8902A; } .ux .og-dec--bad::before { background: #B8443A; } .ux .og-dec--info::before { background: #4F6E95; }
.ux .og-dec--bad { color: var(--ux-bad); } .ux .og-dec--info { color: var(--ux-info); }

.ux .og-ud { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; align-items: start; }
.ux .og-ud > .ux-card:first-child { grid-column: 1 / -1; }
.ux .og-ud__rn { margin-left: auto; display: inline-flex; align-items: center; gap: 5px; font-size: 12px; }
.ux .og-ud > .ux-card:first-child .ux-card__h .ux-chip { margin-left: 0; }
.ux .og-ud__b { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); }
.ux .og-ud__sec + .og-ud__sec { border-left: 1px solid var(--ux-line); }
.ux .og-chg { display: flex; flex-direction: column; gap: 8px; padding: 6px 14px 14px; }
.ux .og-chg > li { display: flex; gap: 8px; font-size: 12.5px; line-height: 1.45; }
.ux .og-chg > li > .ux-i { flex: none; margin-top: 2px; color: var(--ux-teal); }
.ux .og-ud__kv { padding: 6px 14px 14px; font-size: 12px; }
.ux .og-ud__kv > :nth-child(even) { white-space: normal; }
.ux .og-ver > li { align-items: center; padding: 8px 14px; font-size: 12.5px; }
.ux .og-ver > li > .og-link { font-size: 12px; }
.ux .og-def__b { display: flex; flex-direction: column; gap: 8px; padding: 12px 14px; }
.ux .og-def__q { font-size: 12.5px; line-height: 1.45; }
.ux .og-def__q b { color: var(--ux-ink); }
.ux .og-opt { display: flex; align-items: center; gap: 10px; padding: 9px 11px; border: 1px solid var(--ux-line-2); border-radius: 6px; }
.ux .og-opt.is-on { border-color: var(--ux-navy); box-shadow: inset 0 0 0 1px var(--ux-navy); }
.ux .og-def__n { display: flex; gap: 7px; padding: 8px 10px; border-radius: 6px; background: var(--ux-warn-bg); color: var(--ux-warn); font-size: 12px; line-height: 1.45; }
.ux .og-def__n > .ux-i { flex: none; margin-top: 2px; }
.ux .og-def__n > span { color: var(--ux-text); }
.ux .og-hist__u { font-weight: 500; color: var(--ux-ink); }

@container ux (max-width: 1450px) { .ux .og-pol { grid-template-columns: repeat(3, minmax(0, 1fr)); } .ux .og-pol__c:nth-child(4) { border-left: 0; } .ux .og-pol__c:nth-child(n+4) { border-top: 1px solid var(--ux-line); } .ux .og-pol__c:nth-child(5) { grid-column: span 2; } }
@container ux (max-width: 1250px) { .ux .og-c-ring, .ux .og-c-dur { display: none; } }
@container ux (max-width: 1000px) { .ux .og-c-win { display: none; } .ux .og-ut__w2 { display: inline; } .ux .og-c-ver { display: none; } }
@container ux (max-width: 760px) {
  .ux .og-ud, .ux .og-ud__b { grid-template-columns: minmax(0, 1fr); }
  .ux .og-ud__sec + .og-ud__sec { border-left: 0; border-top: 1px solid var(--ux-line); }
  .ux .og-c-act2, .ux .og-c-kind { display: none; }
  .ux .og-pol { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .ux .og-pol__c:nth-child(n) { border-left: 1px solid var(--ux-line); border-top: 1px solid var(--ux-line); }
  .ux .og-pol__c:nth-child(odd) { border-left: 0; }
  .ux .og-pol__c:nth-child(-n+2) { border-top: 0; }
  .ux .og-pol__c:last-child { grid-column: 1 / -1; }
}
@container ux (max-width: 640px) {
  .ux .ux-table.og-ut td, .ux .ux-table.og-ut th, .ux .ux-table.og-hist td, .ux .ux-table.og-hist th { padding-left: 8px; padding-right: 8px; white-space: normal; vertical-align: top; }
  .ux .ux-table.og-ut td:first-child, .ux .ux-table.og-ut th:first-child, .ux .ux-table.og-hist td:first-child, .ux .ux-table.og-hist th:first-child { padding-left: 12px; }
  .ux .og-ut .ux-chip--sq { height: auto; min-height: 19px; padding: 3px 5px; white-space: normal; line-height: 1.2; }
  .ux .og-dec { align-items: flex-start; }
  .ux .og-dec::before { margin-top: 4px; }
  .ux .og-ud .ux-card__h { flex-wrap: wrap; }
}
.ux .ux-table.og-hist td:first-child { white-space: nowrap; }

/* ===================================================== admin on a phone == */

.ux.og-am .mo-row { --mo-w: clamp(272px, calc((100cqw - 120px) / 3), 320px); gap: 28px; padding: 28px 24px 20px; }
.ux.og-am .mo-scr { font-size: 11.5px; }
.ux .og-am__h { gap: 9px; padding: 6px 14px 10px; border-bottom: 1px solid var(--ux-line); }
.ux .og-am__ht { display: flex; flex-direction: column; min-width: 0; line-height: 1.25; }
.ux .og-am__ht > span:first-child { font-size: 15px; font-weight: 600; color: var(--ux-ink); }
.ux .og-am__ht > span + span { font-size: 10.5px; color: var(--ux-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ux .og-am__who { display: flex; align-items: center; gap: 11px; padding: 14px 14px 10px; }
.ux .og-am__wt { display: flex; flex-direction: column; min-width: 0; line-height: 1.35; }
.ux .og-am__wt b { font-size: 14px; color: var(--ux-ink); }
.ux .og-am__wt > span { font-size: 10.5px; color: var(--ux-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ux .og-am__sub { margin: 4px 14px 4px; font-size: 10px; font-weight: 600; letter-spacing: 0.05em; text-transform: uppercase; color: var(--ux-faint); }
.ux .og-am__list > li { display: flex; align-items: center; gap: 9px; padding: 7px 14px; border-top: 1px solid var(--ux-line); min-width: 0; }
.ux .og-am__i { display: grid; place-items: center; width: 26px; height: 26px; flex: none; border-radius: 7px; background: var(--ux-sunken); color: var(--ux-muted); }
.ux .og-am__i--warn { background: var(--ux-warn-bg); color: var(--ux-warn); }
.ux .og-am__t { flex: 1; min-width: 0; display: flex; flex-direction: column; line-height: 1.3; }
.ux .og-am__t b { color: var(--ux-ink); font-weight: 600; }
.ux .og-am__t > span { font-size: 10.5px; color: var(--ux-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ux .og-am__tag { display: inline-flex; align-items: center; height: 18px; padding: 0 6px; border-radius: 9px; font-size: 10px; font-weight: 600; white-space: nowrap; background: var(--ux-sunken); color: var(--ux-text); }
.ux .og-am__tag--warn { background: var(--ux-warn-bg); color: var(--ux-warn); }
.ux .og-am__tag--bad { background: var(--ux-bad-bg); color: var(--ux-bad); }
.ux .og-am__dim { position: absolute; inset: 0; background: rgba(20, 36, 58, 0.38); }
.ux .og-am__sheet { position: absolute; left: 0; right: 0; bottom: 0; display: flex; flex-direction: column; gap: 8px; padding: 8px 16px 16px; border-radius: 16px 16px 0 0; background: var(--ux-surface); box-shadow: 0 -6px 18px rgba(20, 36, 58, 0.18); }
.ux .og-am__grab { align-self: center; width: 36px; height: 4px; margin-bottom: 4px; border-radius: 2px; background: var(--ux-line-2); }
.ux .og-am__st { font-size: 14px; color: var(--ux-ink); }
.ux .og-am__bul { display: flex; flex-direction: column; gap: 5px; }
.ux .og-am__bul > li { display: flex; gap: 7px; font-size: 11px; line-height: 1.4; color: var(--ux-text); }
.ux .og-am__bul .ux-i { flex: none; width: 13px; height: 13px; margin-top: 1px; color: var(--ux-muted); }
.ux .og-am__tg { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 8px 0; border-top: 1px solid var(--ux-line); border-bottom: 1px solid var(--ux-line); font-weight: 500; color: var(--ux-ink); }
.ux .og-am__btn { display: flex; align-items: center; justify-content: center; gap: 6px; height: 38px; border-radius: 9px; border: 1px solid var(--ux-line-2); background: var(--ux-surface); font-size: 12.5px; font-weight: 600; color: var(--ux-ink); }
.ux .og-am__btn--pri { background: var(--ux-accent); border-color: var(--ux-accent); color: #fff; }
.ux .og-am__fine { display: flex; align-items: center; justify-content: center; gap: 5px; font-size: 10px; color: var(--ux-muted); text-align: center; }
.ux .og-am__fine .ux-i { width: 12px; height: 12px; flex: none; color: var(--ux-ok); }

.ux .og-am__tabs { padding-top: 8px; }
.ux .og-am__tabs > span { font-size: 11px; }
.ux .og-al { flex: 1; min-height: 0; overflow: hidden; }
.ux .og-al > li { position: relative; display: flex; flex-direction: column; gap: 2px; padding: 8px 14px 8px 17px; border-bottom: 1px solid var(--ux-line); min-width: 0; }
.ux .og-al > li::before { content: ""; position: absolute; left: 0; top: 8px; bottom: 8px; width: 3px; border-radius: 0 2px 2px 0; background: var(--ux-line-2); }
.ux .og-al--bad::before { background: #B8443A !important; }
.ux .og-al--warn::before { background: #C8902A !important; }
.ux .og-al--info::before { background: #4F6E95 !important; }
.ux .og-al__r { display: flex; justify-content: space-between; gap: 8px; font-size: 10px; }
.ux .og-al__c { font-weight: 600; color: var(--ux-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-transform: uppercase; letter-spacing: 0.03em; }
.ux .og-al__s { flex: none; font-weight: 600; color: var(--ux-muted); }
.ux .og-al--bad .og-al__s { color: var(--ux-bad); }
.ux .og-al--warn .og-al__s { color: var(--ux-warn); }
.ux .og-al__t { color: var(--ux-ink); font-weight: 600; line-height: 1.3; }
.ux .og-al__m { display: flex; align-items: center; gap: 4px; font-size: 10.5px; color: var(--ux-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ux .og-al__m .ux-i { width: 11px; height: 11px; color: var(--ux-teal); flex: none; }

.ux .og-inc { flex: 1; min-height: 0; overflow: hidden; display: flex; flex-direction: column; gap: 9px; padding: 12px 14px; }
.ux .og-inc__tags { display: flex; flex-wrap: wrap; gap: 5px; }
.ux .og-inc__t { font-size: 15px; line-height: 1.3; color: var(--ux-ink); letter-spacing: -0.01em; }
.ux .og-inc__kv { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 5px 10px; padding: 9px 10px; border-radius: 8px; background: var(--ux-bg); border: 1px solid var(--ux-line); font-size: 11px; }
.ux .og-inc__kv > :nth-child(odd) { color: var(--ux-muted); }
.ux .og-inc__kv > :nth-child(even) { color: var(--ux-ink); font-weight: 500; }
.ux .og-inc__tl { display: flex; flex-direction: column; gap: 5px; font-size: 11px; color: var(--ux-text); }
.ux .og-inc__tl > li { position: relative; padding-left: 14px; line-height: 1.35; }
.ux .og-inc__tl > li::before { content: ""; position: absolute; left: 0; top: 5px; width: 6px; height: 6px; border-radius: 50%; background: var(--ux-line-2); }
.ux .og-inc__tl > li.is-bad::before { background: #B8443A; }
.ux .og-inc__tl > li.is-warn::before { background: #C8902A; }
.ux .og-inc__tl > li > span { display: inline-block; width: 36px; font-family: var(--ux-mono); font-size: 10px; color: var(--ux-muted); }
.ux .og-inc__a { display: flex; flex-direction: column; gap: 7px; padding: 10px 14px 12px; border-top: 1px solid var(--ux-line); flex: none; }
.ux .og-inc__a .og-am__btn--pri { background: var(--ux-navy); border-color: var(--ux-navy); }
.ux .og-inc__a + .mo-nav { margin-top: 0; }

@container ux (max-width: 640px) {
  .ux.og-am .mo-row { --mo-w: 276px; gap: 14px; padding: 18px 14px 14px; scroll-padding-inline: 14px; }
}
.ux .og-inc__fix { display: flex; gap: 8px; padding: 9px 10px; border-radius: 8px; background: var(--ux-teal-soft); color: var(--ux-teal); font-size: 11px; line-height: 1.4; }
.ux .og-inc__fix .ux-i { flex: none; margin-top: 1px; }
.ux .og-inc__fix > span { color: var(--ux-text); }
.ux .og-inc__fix b { display: block; color: var(--ux-ink); }

/* ========================================== users screen (admin.php) polish == */

.ux .ad-foot { display: flex; align-items: center; gap: 8px; margin-top: auto; padding: 10px 16px; border-top: 1px solid var(--ux-line); font-size: 12px; color: var(--ux-muted); }
.ux .ad-table tbody tr:last-child td { border-bottom: 0; }
.ux .ad-foot__p { white-space: nowrap; }
