:root {
  --mg-bg: #f4f7fb;
  --mg-surface: #ffffff;
  --mg-surface-2: #f8fafc;
  --mg-sidebar: #172231;
  --mg-sidebar-hover: #223247;
  --mg-sidebar-text: #c7d2e0;
  --mg-text: #172033;
  --mg-muted: #66758a;
  --mg-border: #dbe3ed;
  --mg-border-strong: #c5d0dd;
  --mg-blue: #3277df;
  --mg-blue-soft: #eaf2ff;
  --mg-green: #168a60;
  --mg-green-soft: #e3f5ed;
  --mg-red: #cc3f4a;
  --mg-red-soft: #fdebed;
  --mg-amber: #a96800;
  --mg-amber-soft: #fff2d6;
  --mg-cyan: #147a8d;
  --mg-cyan-soft: #e4f5f8;
  --mg-shadow: 0 8px 28px rgba(31, 49, 74, .08);
  --mg-radius: 6px;
}

.theme-dark {
  --mg-bg: #1c2835;
  --mg-surface: #253343;
  --mg-surface-2: #202d3b;
  --mg-sidebar: #16212d;
  --mg-sidebar-hover: #25364a;
  --mg-sidebar-text: #bac7d7;
  --mg-text: #f1f5fb;
  --mg-muted: #aab7c8;
  --mg-border: #3c4c5e;
  --mg-border-strong: #506278;
  --mg-blue: #74adff;
  --mg-blue-soft: #304864;
  --mg-green: #73d6ad;
  --mg-green-soft: #294c42;
  --mg-red: #ff9ca3;
  --mg-red-soft: #57373d;
  --mg-amber: #f6c66f;
  --mg-amber-soft: #55482e;
  --mg-cyan: #77ccda;
  --mg-cyan-soft: #294d55;
  --mg-shadow: none;
}

* { box-sizing: border-box; }
html, body { min-height: 100%; }
body { margin: 0; color: var(--mg-text); background: var(--mg-bg); font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; letter-spacing: 0; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; letter-spacing: 0; }

.management-shell { min-height: 100vh; display: grid; grid-template-columns: 268px minmax(0, 1fr); }
.management-sidebar { position: sticky; top: 0; z-index: 1040; height: 100vh; display: flex; flex-direction: column; overflow-y: auto; color: var(--mg-sidebar-text); background: var(--mg-sidebar); border-right: 1px solid rgba(255,255,255,.07); }
.management-brand-row { min-height: 72px; padding: 12px 16px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid rgba(255,255,255,.08); }
.management-brand { min-width: 0; display: flex; align-items: center; gap: 11px; color: #fff; }
.management-brand:hover { color: #fff; }
.management-brand-logo { width: 42px; height: 42px; object-fit: contain; flex: 0 0 auto; }
.management-brand span { min-width: 0; display: flex; flex-direction: column; line-height: 1.2; }
.management-brand strong { font-size: 15px; }
.management-brand small { margin-top: 3px; color: #8fa0b5; font-size: 11px; }
.management-nav { flex: 1; padding: 13px 10px; }
.management-nav-group { margin-top: 18px; }
.management-nav-label { padding: 0 11px 7px; color: #71839a; font-size: 10px; font-weight: 800; text-transform: uppercase; }
.management-nav-link { min-height: 40px; padding: 8px 11px; display: flex; align-items: center; gap: 11px; color: var(--mg-sidebar-text); border: 1px solid transparent; border-radius: var(--mg-radius); font-size: 13px; font-weight: 650; transition: background-color .16s ease, color .16s ease, border-color .16s ease; }
.management-nav-link + .management-nav-link { margin-top: 3px; }
.management-nav-link i { width: 18px; color: #8193aa; text-align: center; }
.management-nav-link:hover { color: #fff; background: var(--mg-sidebar-hover); }
.management-nav-link.active { color: #fff; background: #2d4d72; border-color: #41658e; }
.management-nav-link.active i { color: #82b8ff; }
.management-sidebar-footer { padding: 10px; border-top: 1px solid rgba(255,255,255,.08); }
.management-sidebar-backdrop { display: none; }

.management-main-column { min-width: 0; }
.management-topbar { position: sticky; top: 0; z-index: 1025; min-height: 72px; padding: 10px 24px; display: flex; align-items: center; gap: 16px; background: color-mix(in srgb, var(--mg-surface) 94%, transparent); border-bottom: 1px solid var(--mg-border); backdrop-filter: blur(12px); }
.management-global-search { position: relative; width: min(620px, 52vw); }
.management-global-search > i { position: absolute; left: 14px; top: 50%; color: var(--mg-muted); transform: translateY(-50%); pointer-events: none; }
.management-global-search input { width: 100%; height: 42px; padding: 0 14px 0 40px; color: var(--mg-text); background: var(--mg-surface-2); border: 1px solid var(--mg-border); border-radius: var(--mg-radius); outline: none; }
.management-global-search input:focus { border-color: var(--mg-blue); box-shadow: 0 0 0 3px color-mix(in srgb, var(--mg-blue) 18%, transparent); }
.management-global-results { position: absolute; top: calc(100% + 7px); left: 0; right: 0; z-index: 1080; }
.management-search-menu, .management-search-empty { padding: 7px; background: var(--mg-surface); border: 1px solid var(--mg-border); border-radius: var(--mg-radius); box-shadow: var(--mg-shadow); }
.management-search-menu a { padding: 8px; display: flex; align-items: center; gap: 10px; border-radius: 4px; }
.management-search-menu a:hover { background: var(--mg-surface-2); }
.management-search-menu a > span:last-child { min-width: 0; display: flex; flex-direction: column; }
.management-search-menu strong, .management-search-menu small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.management-search-menu strong { font-size: 13px; }
.management-search-menu small { color: var(--mg-muted); font-size: 11px; }
.management-search-empty { color: var(--mg-muted); font-size: 13px; }
.management-topbar-actions { margin-left: auto; display: flex; align-items: center; gap: 9px; }
.management-icon-btn { width: 40px; height: 40px; padding: 0; display: inline-flex; align-items: center; justify-content: center; color: var(--mg-muted); background: var(--mg-surface); border: 1px solid var(--mg-border); border-radius: var(--mg-radius); transition: color .16s ease, background-color .16s ease, border-color .16s ease; }
.management-icon-btn:hover { color: var(--mg-blue); background: var(--mg-blue-soft); border-color: color-mix(in srgb, var(--mg-blue) 50%, var(--mg-border)); }
.management-icon-btn.small { width: 30px; height: 30px; font-size: 11px; }
.management-icon-btn.danger:hover { color: var(--mg-red); background: var(--mg-red-soft); border-color: var(--mg-red); }
.management-icon-btn .material-icons { font-size: 21px; }
.management-user-button { min-height: 44px; padding: 4px 8px 4px 5px; display: flex; align-items: center; gap: 9px; color: var(--mg-text); background: var(--mg-surface); border: 1px solid var(--mg-border); border-radius: var(--mg-radius); }
.management-avatar { width: 34px; height: 34px; display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; color: #fff; background: #4b78b5; border-radius: 50%; font-weight: 800; }
.management-avatar.small { width: 32px; height: 32px; font-size: 12px; }
.management-user-copy { min-width: 0; flex-direction: column; align-items: flex-start; line-height: 1.15; }
.management-user-copy strong { max-width: 160px; overflow: hidden; text-overflow: ellipsis; font-size: 12px; }
.management-user-copy small { margin-top: 3px; color: var(--mg-muted); font-size: 10px; }
.management-user-button > i { color: var(--mg-muted); font-size: 10px; }
.management-dropdown { min-width: 220px; padding: 6px; color: var(--mg-text); background: var(--mg-surface); border-color: var(--mg-border); box-shadow: var(--mg-shadow); }
.management-dropdown .dropdown-item { padding: 9px 10px; display: flex; align-items: center; gap: 9px; color: var(--mg-text); border-radius: 4px; font-size: 13px; }
.management-dropdown .dropdown-item:hover { background: var(--mg-surface-2); }
.management-dropdown-danger { color: var(--mg-red) !important; }

.management-content { width: 100%; max-width: 1680px; margin: 0 auto; padding: 28px; }
.management-page-head { min-height: 70px; margin-bottom: 20px; display: flex; align-items: flex-end; justify-content: space-between; gap: 18px; }
.management-page-head h1 { margin: 2px 0 4px; font-size: 28px; line-height: 1.2; font-weight: 780; }
.management-page-head p { margin: 0; color: var(--mg-muted); font-size: 13px; }
.management-eyebrow { color: var(--mg-blue); font-size: 10px; font-weight: 800; text-transform: uppercase; }
.management-updated { display: flex; align-items: center; gap: 7px; color: var(--mg-muted); font-size: 11px; }
.management-back-link { margin-bottom: 9px; display: inline-flex; align-items: center; gap: 7px; color: var(--mg-muted); font-size: 12px; font-weight: 650; }
.management-back-link:hover, .management-text-link:hover { color: var(--mg-blue); }
.management-head-actions, .management-form-actions, .management-confirm-actions { display: flex; align-items: center; gap: 9px; }
.management-btn { min-height: 40px; padding: 8px 14px; display: inline-flex; align-items: center; justify-content: center; gap: 8px; border: 1px solid transparent; border-radius: var(--mg-radius); font-size: 12px; font-weight: 750; cursor: pointer; transition: background-color .16s ease, border-color .16s ease; }
.management-btn.primary { color: #fff; background: #397bdc; border-color: #397bdc; }
.management-btn.primary:hover { color: #fff; background: #2d68bd; border-color: #2d68bd; }
.management-btn.secondary { color: var(--mg-text); background: var(--mg-surface); border-color: var(--mg-border-strong); }
.management-btn.secondary:hover { color: var(--mg-blue); background: var(--mg-blue-soft); border-color: var(--mg-blue); }
.management-btn.danger { color: #fff; background: #c8434d; border-color: #c8434d; }

.management-kpi-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 13px; }
.management-kpi { min-width: 0; min-height: 118px; padding: 17px; display: flex; align-items: flex-start; gap: 13px; background: var(--mg-surface); border: 1px solid var(--mg-border); border-radius: var(--mg-radius); box-shadow: var(--mg-shadow); }
.management-kpi:hover { border-color: var(--mg-border-strong); }
.management-kpi-icon { width: 39px; height: 39px; display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; border-radius: var(--mg-radius); }
.management-kpi-icon.blue { color: var(--mg-blue); background: var(--mg-blue-soft); }
.management-kpi-icon.green { color: var(--mg-green); background: var(--mg-green-soft); }
.management-kpi-icon.amber { color: var(--mg-amber); background: var(--mg-amber-soft); }
.management-kpi-icon.cyan { color: var(--mg-cyan); background: var(--mg-cyan-soft); }
.management-kpi > span:last-child { min-width: 0; display: flex; flex-direction: column; }
.management-kpi small { color: var(--mg-muted); font-size: 11px; font-weight: 650; }
.management-kpi strong { margin-top: 4px; overflow-wrap: anywhere; font-size: 23px; line-height: 1.15; }
.management-kpi em { margin-top: 7px; color: var(--mg-muted); font-size: 10px; font-style: normal; }
.management-dashboard-grid { margin-top: 13px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 13px; }
.management-panel { min-width: 0; background: var(--mg-surface); border: 1px solid var(--mg-border); border-radius: var(--mg-radius); box-shadow: var(--mg-shadow); }
.management-panel-head { min-height: 66px; padding: 15px 17px; display: flex; align-items: center; justify-content: space-between; gap: 12px; border-bottom: 1px solid var(--mg-border); }
.management-panel-head h2 { margin: 0; font-size: 15px; font-weight: 760; }
.management-panel-head p { margin: 3px 0 0; color: var(--mg-muted); font-size: 11px; }
.management-text-link { display: inline-flex; align-items: center; gap: 7px; color: var(--mg-blue); font-size: 11px; font-weight: 720; white-space: nowrap; }
.management-activity-row { min-height: 60px; padding: 10px 16px; display: flex; align-items: center; gap: 11px; border-bottom: 1px solid var(--mg-border); }
.management-activity-row:last-child { border-bottom: 0; }
.management-activity-row:hover { background: var(--mg-surface-2); }
.management-row-icon { width: 32px; height: 32px; display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; color: var(--mg-blue); background: var(--mg-blue-soft); border-radius: var(--mg-radius); }
.management-row-main, .management-row-value { min-width: 0; display: flex; flex-direction: column; }
.management-row-main { flex: 1; }
.management-row-value { align-items: flex-end; text-align: right; }
.management-row-main strong, .management-row-value strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; }
.management-row-main small, .management-row-value small { margin-top: 3px; color: var(--mg-muted); font-size: 10px; }
.management-audit-grid { padding: 8px; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 7px; }
.management-audit-item { min-width: 0; padding: 9px; display: flex; align-items: center; gap: 9px; background: var(--mg-surface-2); border: 1px solid var(--mg-border); border-radius: var(--mg-radius); }
.management-audit-item > span:last-child { min-width: 0; display: flex; flex-direction: column; }
.management-audit-item strong, .management-audit-item small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.management-audit-item strong { font-size: 11px; }
.management-audit-item small { margin-top: 3px; color: var(--mg-muted); font-size: 9px; }

.management-filterbar { margin-bottom: 12px; padding: 10px; display: flex; align-items: flex-end; gap: 9px; background: var(--mg-surface); border: 1px solid var(--mg-border); border-radius: var(--mg-radius); box-shadow: var(--mg-shadow); }
.management-search-field { position: relative; min-width: 230px; flex: 1; }
.management-search-field i { position: absolute; left: 12px; top: 50%; color: var(--mg-muted); transform: translateY(-50%); }
.management-search-field input, .management-filter-field select { width: 100%; height: 38px; color: var(--mg-text); background: var(--mg-surface-2); border: 1px solid var(--mg-border); border-radius: var(--mg-radius); outline: none; }
.management-search-field input { padding: 0 12px 0 35px; }
.management-filter-field { min-width: 130px; display: flex; flex-direction: column; gap: 4px; }
.management-filter-field > span { color: var(--mg-muted); font-size: 9px; font-weight: 750; }
.management-filter-field select { padding: 0 28px 0 9px; font-size: 11px; }
.management-table-panel { overflow: hidden; }
.management-bulkbar { padding: 9px 12px; display: flex; align-items: center; gap: 8px; background: var(--mg-surface-2); border-bottom: 1px solid var(--mg-border); }
.management-bulkbar .form-select { width: 240px; height: 38px; color: var(--mg-text); background-color: var(--mg-surface); border-color: var(--mg-border); font-size: 11px; }
.management-table-wrap { overflow-x: auto; }
.management-table { width: 100%; min-width: 860px; border-collapse: collapse; }
.management-table th { height: 42px; padding: 8px 12px; color: var(--mg-muted); background: var(--mg-surface-2); border-bottom: 1px solid var(--mg-border); font-size: 9px; font-weight: 800; text-align: left; text-transform: uppercase; white-space: nowrap; }
.management-sort-link { display: inline-flex; align-items: center; gap: 6px; color: inherit; }
.management-sort-link i { color: color-mix(in srgb, var(--mg-muted) 68%, transparent); font-size: 8px; }
.management-sort-link:hover, .management-sort-link.active { color: var(--mg-blue); }
.management-sort-link:hover i, .management-sort-link.active i { color: currentColor; }
.management-table td { height: 50px; max-width: 300px; padding: 8px 12px; overflow: hidden; color: var(--mg-text); border-bottom: 1px solid var(--mg-border); font-size: 11px; text-overflow: ellipsis; white-space: nowrap; vertical-align: middle; }
.management-table tbody tr:last-child td { border-bottom: 0; }
.management-table tbody tr:hover td { background: var(--mg-surface-2); }
.management-primary-link { color: var(--mg-text); font-weight: 720; }
.management-primary-link:hover { color: var(--mg-blue); }
.management-select-cell { width: 40px; text-align: center !important; }
.management-actions-cell { width: 44px; text-align: right !important; }
.cell-muted { color: var(--mg-muted) !important; }
.cell-code span { padding: 3px 5px; background: var(--mg-surface-2); border: 1px solid var(--mg-border); border-radius: 3px; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; }
.cell-money, .cell-number { font-variant-numeric: tabular-nums; }
.management-badge { padding: 4px 7px; display: inline-flex; align-items: center; border-radius: 999px; font-size: 9px; font-weight: 800; }
.management-badge.positive { color: var(--mg-green); background: var(--mg-green-soft); }
.management-badge.negative { color: var(--mg-red); background: var(--mg-red-soft); }
.management-badge.warning { color: var(--mg-amber); background: var(--mg-amber-soft); }
.management-badge.neutral { color: var(--mg-muted); background: var(--mg-surface-2); border: 1px solid var(--mg-border); }
.text-positive, .status-succeeded { color: var(--mg-green) !important; }
.text-negative, .status-canceled { color: var(--mg-red) !important; }
.management-pagination { min-height: 55px; padding: 9px 12px; display: flex; align-items: center; justify-content: space-between; gap: 12px; color: var(--mg-muted); border-top: 1px solid var(--mg-border); font-size: 10px; }
.management-pagination > div { display: flex; gap: 6px; }
.management-empty { min-height: 150px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; color: var(--mg-muted); text-align: center; }
.management-empty i { font-size: 24px; }
.management-empty strong { color: var(--mg-text); font-size: 13px; }
.management-empty span { font-size: 10px; }
.management-empty.compact { min-height: 70px; font-size: 11px; }

.management-detail-grid { margin: 0; padding: 16px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1px; background: var(--mg-border); }
.management-detail-grid > div { min-width: 0; padding: 12px; background: var(--mg-surface); }
.management-detail-grid > div.wide { grid-column: 1 / -1; }
.management-detail-grid dt { margin-bottom: 5px; color: var(--mg-muted); font-size: 9px; font-weight: 800; text-transform: uppercase; }
.management-detail-grid dd { margin: 0; overflow-wrap: anywhere; font-size: 12px; }
.management-detail-grid pre { max-height: 420px; margin: 0; padding: 10px; overflow: auto; color: var(--mg-text); background: var(--mg-surface-2); border: 1px solid var(--mg-border); border-radius: 4px; font-size: 10px; }
.management-more-note { padding: 10px 15px; color: var(--mg-muted); border-top: 1px solid var(--mg-border); font-size: 10px; }

.management-form-page { max-width: 1120px; margin: 0 auto; }
.management-form-page.narrow { max-width: 700px; }
.management-form { padding: 18px; }
.management-form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 15px; }
.management-field { min-width: 0; display: flex; flex-direction: column; gap: 6px; }
.management-field.wide { grid-column: 1 / -1; }
.management-field > label:not(.management-check-row) { color: var(--mg-text); font-size: 11px; font-weight: 720; }
.management-form .form-control, .management-form .form-select { min-height: 40px; color: var(--mg-text); background-color: var(--mg-surface-2); border-color: var(--mg-border); border-radius: var(--mg-radius); font-size: 12px; }
.management-form textarea.form-control { min-height: 104px; }
.management-form .form-control:focus, .management-form .form-select:focus { border-color: var(--mg-blue); box-shadow: 0 0 0 3px color-mix(in srgb, var(--mg-blue) 18%, transparent); }
.management-check-row { min-height: 40px; padding: 8px 10px; display: flex; align-items: center; gap: 9px; background: var(--mg-surface-2); border: 1px solid var(--mg-border); border-radius: var(--mg-radius); font-size: 11px; font-weight: 700; }
.management-check-list { margin: 0; padding: 10px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; list-style: none; background: var(--mg-surface-2); border: 1px solid var(--mg-border); border-radius: var(--mg-radius); }
.management-check-list label { display: flex; align-items: flex-start; gap: 7px; font-size: 11px; }
.management-help { color: var(--mg-muted); font-size: 9px; line-height: 1.45; }
.management-field-error { color: var(--mg-red); font-size: 10px; }
.management-field--markdown { width: 100%; overflow: hidden; }
.management-field--markdown .main-martor,
.management-field--markdown .section-martor,
.management-field--markdown .tab-martor-menu,
.management-field--markdown .tab-content,
.management-field--markdown .tab-pane { width: 100%; max-width: 100%; min-width: 0; }
.management-field--markdown .main-martor { margin: 0; }
.management-field--markdown .section-martor { overflow: hidden; background: var(--mg-surface-2); border: 1px solid var(--mg-border); border-radius: var(--mg-radius); }
.management-field--markdown .nav-tabs { display: flex; flex-wrap: wrap; background: var(--mg-surface); border-color: var(--mg-border); }
.management-field--markdown .nav-tabs .nav-link { color: var(--mg-muted); border: 0; border-radius: 0; }
.management-field--markdown .nav-tabs .nav-link.active { color: var(--mg-text); background: var(--mg-surface-2); border-bottom-color: var(--mg-blue); }
.management-field--markdown .martor-toolbar { max-width: 100%; margin-left: auto !important; float: none !important; }
.management-field--markdown .martor-toolbar > .btn-group { display: flex; flex-wrap: wrap; }
.management-field--markdown .martor-toolbar .btn { color: var(--mg-text); background: var(--mg-surface); border-color: var(--mg-border); }
.management-field--markdown .martor-toolbar .btn:hover { color: var(--mg-blue); background: var(--mg-blue-soft); }
.management-field--markdown .martor-field,
.management-field--markdown .ace_editor { width: 100% !important; max-width: 100%; color: var(--mg-text); background: var(--mg-surface-2); border-color: var(--mg-border); }
.management-field--markdown .martor-preview { max-width: 100%; color: var(--mg-text); background: var(--mg-surface-2); }
.management-field--email-template textarea,
.management-email-template-editor {
    min-height: 35rem;
    font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
    font-size: 0.84rem;
    line-height: 1.55;
    resize: vertical;
    tab-size: 2;
}
.management-email-preview-panel {
  margin-top: 22px;
  padding-top: 20px;
  border-top: 1px solid var(--mg-border);
}
.management-email-preview-toolbar {
  margin-bottom: 14px;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 18px;
}
.management-email-preview-kicker {
  color: var(--mg-blue);
  font-size: 10px;
  font-weight: 800;
  text-transform: uppercase;
}
.management-email-preview-toolbar h2 {
  margin: 3px 0 4px;
  color: var(--mg-text);
  font-size: 19px;
  line-height: 1.25;
}
.management-email-preview-toolbar p {
  max-width: 720px;
  margin: 0;
  color: var(--mg-muted);
  font-size: 11px;
  line-height: 1.5;
}
.management-email-preview-action { flex: 0 0 auto; }
.management-email-preview-loading {
  margin-bottom: 12px;
  color: var(--mg-muted);
  font-size: 11px;
}
.management-email-preview-loading i { margin-right: 6px; color: var(--mg-blue); }
.management-email-preview-subject {
  min-height: 58px;
  padding: 10px 13px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 4px;
  background: var(--mg-surface-2);
  border: 1px solid var(--mg-border);
  border-radius: var(--mg-radius) var(--mg-radius) 0 0;
}
.management-email-preview-subject span {
  color: var(--mg-muted);
  font-size: 9px;
  font-weight: 800;
  text-transform: uppercase;
}
.management-email-preview-subject strong {
  overflow-wrap: anywhere;
  color: var(--mg-text);
  font-size: 13px;
}
.management-email-preview-canvas {
  min-height: 420px;
  padding: 24px;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  overflow: auto;
  background: #e8edf3;
  border: 1px solid var(--mg-border);
  border-top: 0;
  border-radius: 0 0 var(--mg-radius) var(--mg-radius);
}
.management-email-preview-frame {
  width: min(100%, 720px);
  height: 900px;
  display: block;
  flex: 0 0 auto;
  background: #ffffff;
  border: 0;
  border-radius: var(--mg-radius);
  box-shadow: 0 10px 32px rgba(20, 33, 48, .14);
}
.management-email-preview-error { margin-top: 8px; }
.management-form-actions { margin-top: 20px; padding-top: 15px; justify-content: flex-end; border-top: 1px solid var(--mg-border); }
.management-alert { padding: 11px 13px; display: flex; align-items: flex-start; gap: 9px; border: 1px solid; border-radius: var(--mg-radius); font-size: 11px; }
.management-alert + .management-alert { margin-top: 8px; }
.management-alert.success { color: var(--mg-green); background: var(--mg-green-soft); border-color: color-mix(in srgb, var(--mg-green) 50%, transparent); }
.management-alert.warning { color: var(--mg-amber); background: var(--mg-amber-soft); border-color: color-mix(in srgb, var(--mg-amber) 50%, transparent); }
.management-alert.danger { color: var(--mg-red); background: var(--mg-red-soft); border-color: color-mix(in srgb, var(--mg-red) 50%, transparent); }
.management-messages { margin-bottom: 14px; }

.management-confirm-wrap { min-height: calc(100vh - 160px); display: flex; align-items: center; justify-content: center; }
.management-confirm-panel { width: min(520px, 100%); padding: 28px; text-align: center; }
.management-confirm-icon { width: 54px; height: 54px; margin: 0 auto 15px; display: flex; align-items: center; justify-content: center; color: var(--mg-red); background: var(--mg-red-soft); border-radius: 50%; font-size: 20px; }
.management-confirm-panel h1 { font-size: 21px; }
.management-confirm-panel p { color: var(--mg-muted); font-size: 12px; }
.management-confirm-actions { margin-top: 20px; justify-content: center; }

.management-login-body { min-height: 100vh; background: var(--mg-bg); }
.management-login-theme { position: fixed; top: 18px; right: 18px; z-index: 2; }
.management-login-wrap { min-height: 100vh; padding: 30px 16px; display: flex; align-items: center; justify-content: center; }
.management-login-panel { width: min(430px, 100%); padding: 28px; background: var(--mg-surface); border: 1px solid var(--mg-border); border-radius: var(--mg-radius); box-shadow: var(--mg-shadow); }
.management-login-brand { display: flex; align-items: center; gap: 11px; }
.management-login-brand img { width: 48px; height: 48px; object-fit: contain; }
.management-login-brand div { display: flex; flex-direction: column; }
.management-login-brand strong { font-size: 16px; }
.management-login-brand span { color: var(--mg-muted); font-size: 11px; }
.management-login-heading { margin: 28px 0 18px; }
.management-login-heading h1 { margin: 0 0 5px; font-size: 22px; }
.management-login-heading p { margin: 0; color: var(--mg-muted); font-size: 11px; }

@media (max-width: 1199.98px) {
  .management-kpi-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .management-audit-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .management-filterbar { flex-wrap: wrap; }
  .management-search-field { flex-basis: 100%; }
  .management-filter-field { flex: 1; }
}

@media (max-width: 991.98px) {
  .management-shell { display: block; }
  .management-sidebar { position: fixed; left: 0; transform: translateX(-100%); width: 268px; transition: transform .2s ease; }
  .management-body.sidebar-open { overflow: hidden; }
  .management-body.sidebar-open .management-sidebar { transform: translateX(0); }
  .management-sidebar-backdrop { position: fixed; inset: 0; z-index: 1030; background: rgba(8, 15, 24, .56); }
  .management-body.sidebar-open .management-sidebar-backdrop { display: block; }
  .management-topbar { padding-inline: 15px; }
  .management-global-search { width: auto; flex: 1; }
  .management-content { padding: 20px 16px; }
}

@media (max-width: 767.98px) {
  .management-dashboard-grid, .management-kpi-grid { grid-template-columns: 1fr; }
  .management-audit-grid { grid-template-columns: 1fr; }
  .management-page-head { align-items: flex-start; flex-direction: column; }
  .management-head-actions { width: 100%; flex-wrap: wrap; }
  .management-head-actions .management-btn { flex: 1; }
  .management-detail-grid, .management-form-grid { grid-template-columns: 1fr; }
  .management-detail-grid > div.wide, .management-field.wide { grid-column: auto; }
  .management-check-list { grid-template-columns: 1fr; }
  .management-filter-field { min-width: calc(50% - 5px); flex-basis: calc(50% - 5px); }
  .management-email-preview-toolbar { align-items: stretch; flex-direction: column; }
  .management-email-preview-action { width: 100%; }
  .management-email-preview-canvas { padding: 10px; }
  .management-email-preview-frame { height: 760px; }
}

@media (max-width: 575.98px) {
  .management-topbar { gap: 8px; }
  .management-global-search input { padding-left: 34px; font-size: 11px; }
  .management-global-search > i { left: 11px; }
  .management-user-button { padding-right: 5px; }
  .management-user-button > i { display: none; }
  .management-content { padding: 16px 10px; }
  .management-page-head h1 { font-size: 23px; }
  .management-filter-field { min-width: 100%; flex-basis: 100%; }
  .management-bulkbar { align-items: stretch; flex-direction: column; }
  .management-bulkbar .form-select { width: 100%; }
  .management-login-panel { padding: 22px; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; }
}
