.m5-system {
  color: var(--m5-text);
  margin: 0 auto 3rem;
  padding: 0 clamp(.7rem, 2vw, 1.5rem);
  max-width: 1500px;
  min-width: 0;
  text-align: left;
}
.m5-system h1, .m5-system h2 { color: var(--m5-ink); }
.admin-shell > .admin-workspace:has(.m5-system) { padding-top: 8px; }
.m5-system-nav { display: flex; flex-wrap: wrap; gap: .25rem; padding-bottom: .35rem; margin-bottom: .5rem; border-bottom: 1px solid var(--m5-border); }
.m5-system-nav a { color: var(--m5-link); padding: .5rem .85rem; border-radius: .5rem; text-decoration: none; }
.m5-system-nav a.active { background: var(--m5-selected-bg); color: var(--m5-selected-ink); font-weight: 700; }
.m5-system-kicker { color: var(--m5-muted); font-weight: 700; }
.m5-system-cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1rem; margin: 1.5rem 0; }
.m5-system-cards a { display: block; color: var(--m5-text); background: var(--m5-surface); padding: 1.4rem; border: 1px solid var(--m5-border); border-radius: .8rem; text-decoration: none; }
.m5-system-cards a:hover { border-color: var(--m5-accent); background: var(--m5-surface-soft); }
.m5-system-cards h2 { font-size: 1.35rem; }
.m5-pipeline { container: pipeline / inline-size; margin: 1.25rem 0; padding: clamp(.8rem, 2vw, 1.3rem); border: 1px solid var(--m5-border); border-radius: .8rem; background: var(--m5-surface); }
.m5-pipeline-header { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .7rem; }
.m5-pipeline-header h2 { margin: 0; font-size: 1.3rem; }
.m5-pipeline-header p, .m5-pipeline-caption { font-size: .85rem; color: var(--m5-muted); margin: .4rem 0; }
.m5-pipeline-lane { margin-top: .7rem; padding-top: .7rem; border-top: 1px solid var(--m5-border); }
.m5-pipeline-lane h3 { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: .5rem; margin: 0 0 .4rem; font-size: 1rem; color: var(--m5-ink); }
.m5-pipeline-lane h3 small { color: var(--m5-muted); font-size: .8rem; font-weight: 400; }
.m5-pipeline-lane > p { font-size: .85rem; }
.m5-pipeline-scroll { overflow-x: auto; overscroll-behavior-x: contain; padding: .2rem 0 .5rem; }
.m5-pipeline-scroll:focus-visible { outline: 3px solid var(--m5-focus); outline-offset: 2px; }
.m5-pipeline-row, .m5-pipeline-branch { display: flex; align-items: center; width: 100%; min-width: 0; gap: .4rem; }
.m5-pipeline-stage { display: grid; flex: 1 1 130px; gap: .15rem; min-width: 0; padding: .4rem .6rem; border: 1px solid var(--m5-border-strong); border-radius: .55rem; background: var(--m5-surface-soft); }
.m5-pipeline-label { font-size: .85rem; font-weight: 650; color: var(--m5-ink); }
.m5-pipeline-stage strong { font-size: 1.35rem; line-height: 1.15; font-variant-numeric: tabular-nums; color: var(--m5-ink); }
.m5-pipeline-stage small { font-size: .72rem; line-height: 1.2; color: var(--m5-muted); }
.m5-pipeline-stage.working { border-top: 3px solid var(--m5-blue); }
.m5-pipeline-stage.complete { border-top: 3px solid var(--m5-success); }
.m5-pipeline-stage.attention { background: var(--m5-error-bg); border-color: var(--m5-error); }
.m5-pipeline-arrow { flex: 0 0 68px; display: grid; justify-items: center; align-content: center; color: var(--m5-link); }
.m5-pipeline-arrow small { font-size: .7rem; text-align: center; line-height: 1.25; }
.m5-pipeline-arrow svg { display: block; max-width: 100%; }
.m5-pipeline-branch { margin: .3rem 0 0; width: 100%; min-width: 0; font-size: .8rem; }
.m5-pipeline-branch > span { flex: 1 1 100px; text-align: center; color: var(--m5-muted); }
.m5-pipeline-branch .m5-pipeline-stage { grid-template-columns: 1fr auto; gap: .1rem .5rem; padding: .2rem .5rem; }
.m5-pipeline-branch .m5-pipeline-stage strong { grid-column: 2; grid-row: 1 / span 2; align-self: center; font-size: 1.3rem; }
.m5-pipeline-branch .m5-pipeline-stage small { display: none; }
.m5-pipeline-transport { margin-top: .9rem; padding-top: .8rem; border-top: 1px solid var(--m5-border); font-size: .85rem; }
.m5-pipeline-transport summary { color: var(--m5-link); cursor: pointer; font-weight: 650; }
.m5-pipeline-transport p { margin: .6rem 0 0; }
.m5-settings-form { display: grid; gap: 1.2rem; max-width: 760px; }
.m5-settings-form fieldset { display: grid; gap: .5rem; border: 1px solid var(--m5-border); background: var(--m5-surface); border-radius: .7rem; padding: 1.3rem; min-width: 0; }
.m5-settings-form legend {
  float: none;
  width: auto;
  max-width: 100%;
  padding: .25rem .7rem;
  border: 1px solid var(--m5-border);
  border-radius: .6rem;
  background: var(--m5-surface);
  color: var(--m5-text);
  font-size: .875rem;
  font-weight: 500;
  line-height: 1.4;
  overflow-wrap: anywhere;
}
.m5-settings-form input { min-width: 0; width: 100%; padding: .7rem; border: 1px solid var(--m5-border-strong); border-radius: .4rem; color: var(--m5-ink); background: var(--m5-surface); }
.m5-settings-form label { font-weight: 650; margin-top: .4rem; }
.m5-settings-form small { color: var(--m5-muted); }
.m5-bandwidth-rule { display: grid; grid-template-columns: minmax(160px, 1fr) minmax(0, 2fr); align-items: center; gap: .75rem; padding: .6rem 0; border-bottom: 1px solid var(--m5-border); }
.m5-bandwidth-audiences { display: flex; flex-wrap: wrap; gap: .25rem .8rem; }
.m5-playback-settings { max-width: none; }
.m5-system:has(.m5-playback-settings) { max-width: none; }
.m5-settings-form .m5-hard-cap-rule { display: flex; align-items: center; flex-wrap: wrap; gap: .75rem; }
.m5-settings-form .m5-hard-cap-rule input { width: 125px; }
.m5-bandwidth-table-scroll { overflow-x: auto; }
.m5-bandwidth-table { width: 100%; border-collapse: collapse; font-size: .85rem; }
.m5-bandwidth-table th, .m5-bandwidth-table td { padding: .45rem .5rem; text-align: left; border-bottom: 1px solid var(--m5-border); }
.m5-bandwidth-table td:nth-child(1) { width: 170px; }
.m5-bandwidth-table td:nth-child(2) { width: 125px; }
.m5-bandwidth-table select { width: 100%; padding: .6rem; color: var(--m5-ink); background: var(--m5-surface); border: 1px solid var(--m5-border-strong); border-radius: .4rem; }
.m5-bandwidth-table .m5-bandwidth-audiences { flex-wrap: nowrap; white-space: nowrap; }
.m5-bandwidth-table .m5-bandwidth-audiences label { margin: 0; }
.m5-add-bandwidth-rule { justify-self: start; }
.m5-settings-form .m5-bandwidth-audiences input { width: 1.3rem; padding: 0; }
@media (max-width: 600px) {
  .m5-bandwidth-rule { grid-template-columns: 1fr; }
}
.m5-settings-actions { display: flex; flex-wrap: wrap; gap: .6rem; }
.m5-system-button { padding: .65rem 1rem; color: var(--m5-on-accent); background: var(--m5-accent); border: 1px solid var(--m5-accent); border-radius: .5rem; }
.m5-system-button.secondary { color: var(--m5-ink); background: var(--m5-surface); border-color: var(--m5-border-strong); }
.m5-system button:disabled { opacity: .65; cursor: wait; }
.m5-system :is(a, button, input, select):focus-visible { outline: 3px solid var(--m5-focus); outline-offset: 3px; }
.m5-system-error, .m5-system .validation-message, .m5-system .validation-errors { color: var(--m5-error); }
.m5-error-boundary > section[role="alert"] { background: var(--m5-surface) !important; color: var(--m5-ink); border: 1px solid var(--m5-border); }
.m5-error-page { max-width: 680px; margin: 2rem auto; padding: 1.5rem; color: var(--m5-text); }
/* Core currently supplies a light palette; contain it so all controls remain legible. */
.m5-system > :is(.request-protection-page, .activity-dashboard, .error-management-page) {
  color-scheme: light;
  background: #fff;
  border: 1px solid var(--m5-border);
  border-radius: .75rem;
  padding: clamp(.75rem, 2vw, 1.5rem);
}
.m5-system > :is(.request-protection-page, .activity-dashboard, .error-management-page) :is(h1, h2) { color: #1d2939; }
@media (max-width: 640px) {
  .m5-system-cards { grid-template-columns: 1fr; }
  .m5-system-nav { gap: .15rem; }
  .m5-system-nav a { padding: .5rem .6rem; }
}

/* Shared email library, also linked into the separate administration host. */
.m5-email-header, .m5-email-title, .m5-email-preview-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: .6rem;
}
.m5-email-header { margin: 1.4rem 0 1.8rem; }
.m5-email-header h1 { margin: .2rem 0 .6rem; }
.m5-email-header p { margin-bottom: .4rem; }
.m5-email-count { border: 1px solid var(--m5-border); border-radius: 2rem; padding: .5rem .9rem; font-size: .875rem; }
.m5-email-workspace { display: grid; grid-template-columns: 190px minmax(300px, 1fr) minmax(320px, 1.1fr); gap: 1.5rem; align-items: start; }
.m5-email-library { position: sticky; top: 1rem; }
.m5-email-library h2 { font-size: .875rem; margin: 1.4rem .7rem .5rem; color: var(--m5-muted); }
.m5-email-library h2:first-child { margin-top: .6rem; }
.m5-email-library button { display: block; width: 100%; padding: .8rem .7rem; margin: .2rem 0; border: 1px solid transparent; border-radius: .5rem; text-align: left; background: transparent; color: var(--m5-text); font-size: .9375rem; }
.m5-email-library button:hover { background: var(--m5-surface-soft); }
.m5-email-library button.selected { border-color: var(--m5-border); background: var(--m5-surface); color: var(--m5-ink); font-weight: 700; box-shadow: inset 3px 0 var(--m5-accent); }
.m5-email-edit { min-width: 0; padding: 1.3rem; border: 1px solid var(--m5-border); border-radius: .8rem; background: var(--m5-surface); }
.m5-email-title h2, .m5-email-preview h2 { font-size: 1.25rem; margin: 0; }
.m5-email-title span, .m5-email-preview-top span { font-size: .8125rem; color: var(--m5-muted); }
.m5-email-edit > p { margin: .7rem 0 1.2rem; line-height: 1.6; }
.m5-email-fields { border: 0; margin: 0; padding: 0; min-width: 0; }
.m5-email-fields label { display: block; margin: 1.15rem 0 .4rem; font-weight: 650; font-size: .9375rem; }
.m5-email-fields input, .m5-email-fields textarea { box-sizing: border-box; display: block; width: 100%; border: 1px solid var(--m5-border-strong); border-radius: .4rem; padding: .65rem .75rem; background: var(--m5-surface); color: var(--m5-text); font: inherit; line-height: 1.5; }
.m5-email-fields textarea { resize: vertical; }
.m5-email-fields small { display: block; color: var(--m5-muted); font-size: .875rem; line-height: 1.5; margin-top: .45rem; }
.m5-email-tokens { padding: 1rem; margin-top: 1.4rem; background: var(--m5-surface-soft); border-radius: .5rem; }
.m5-email-tokens h3 { font-size: .9375rem; margin: 0 0 .5rem; }
.m5-email-tokens p { font-size: .875rem; line-height: 1.5; }
.m5-email-tokens code { display: inline-block; margin: .2rem .3rem .2rem 0; padding: .2rem .4rem; color: var(--m5-link); border: 1px solid var(--m5-border); border-radius: .25rem; background: var(--m5-surface); font-size: .875rem; user-select: all; }
.m5-email-actions { display: flex; flex-wrap: wrap; gap: .6rem; margin-top: 1.4rem; }
.m5-email-save-note { font-size: .875rem; color: var(--m5-muted); }
.m5-email-success { color: var(--m5-success); }
.m5-email-pending { padding: 1rem; border: 1px solid var(--m5-warning); border-radius: .5rem; background: var(--m5-warning-bg); }
.m5-email-preview { min-width: 0; position: sticky; top: 1rem; }
.m5-email-preview-top { padding: .4rem 0 1rem; }
.m5-email-preview-options { display: flex; gap: .3rem; flex-wrap: wrap; margin-bottom: 1rem; }
.m5-email-preview-options button { background: var(--m5-surface); color: var(--m5-text); border: 1px solid var(--m5-border); border-radius: .4rem; padding: .5rem .8rem; font-size: .875rem; }
.m5-email-preview-options button[aria-pressed="true"] { color: var(--m5-selected-ink); background: var(--m5-selected-bg); font-weight: 650; }
.m5-email-envelope { display: grid; gap: .4rem; padding: 1rem; background: var(--m5-surface); border: 1px solid var(--m5-border); border-bottom: 0; border-radius: .7rem .7rem 0 0; overflow-wrap: anywhere; }
.m5-email-envelope span { font-size: .875rem; color: var(--m5-muted); }
.m5-email-frame { display: block; width: 100%; height: 820px; border: 1px solid var(--m5-border); background: #f3f1ed; border-radius: 0 0 .7rem .7rem; margin: 0 auto; }
.m5-email-frame.mobile { max-width: 375px; }
.m5-email-plain { padding: 1.3rem; border: 1px solid var(--m5-border); background: var(--m5-surface); color: var(--m5-text); font-size: .9375rem; white-space: pre-wrap; overflow-wrap: anywhere; line-height: 1.65; }
.m5-email-workspace :is(button, input, textarea):focus-visible { outline: 3px solid var(--m5-focus); outline-offset: 3px; }
@media (max-width: 1200px) {
  .m5-email-workspace { grid-template-columns: minmax(280px, 1fr) minmax(300px, 1fr); }
  .m5-email-library { grid-column: 1 / -1; position: static; display: flex; flex-wrap: wrap; align-items: center; gap: .3rem; }
  .m5-email-library h2 { display: none; }
  .m5-email-library button { width: auto; padding: .65rem .8rem; }
}
@media (max-width: 760px) {
  .m5-email-workspace { grid-template-columns: minmax(0, 1fr); gap: 1rem; }
  .m5-email-preview { position: static; }
  .m5-email-edit { padding: 1rem; }
}

.m5-settings-form .m5-settings-check { display: flex; align-items: start; gap: .75rem; }
.m5-settings-form .m5-settings-check input { width: auto; margin-top: .3rem; }

.m5-system { container: system / inline-size; }
.m5-email-workspace > *, .m5-email-title > *, .m5-system-cards > * { min-width: 0; }
@container system (max-width: 1100px) {
  .m5-email-workspace { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .m5-email-library { grid-column: 1 / -1; }
  .m5-email-library nav { display: flex; flex-wrap: wrap; gap: .3rem; }
  .m5-email-library button { width: auto; }
}
@container system (max-width: 700px) {
  .m5-email-workspace, .m5-system-cards { grid-template-columns: minmax(0, 1fr); }
  .m5-email-preview { position: static; }
}
@container pipeline (max-width: 700px) {
  .m5-pipeline-row, .m5-pipeline-branch { flex-direction: column; align-items: stretch; }
  .m5-pipeline-stage, .m5-pipeline-branch > span, .m5-pipeline-arrow { flex: none; }
  .m5-pipeline-arrow { gap: .4rem; padding: .4rem 0; }
  .m5-pipeline-arrow svg { transform: rotate(90deg); width: 24px; height: 24px; }
}
/* Shared Branches dashboards sit inside this host's sidebar, so use their
   container width when choosing the compact layout. */
.m5-system :is(.request-protection-page, .activity-dashboard, .error-management-page) {
  min-width: 0;
}
.m5-system :is(.source-row, .actor-row summary, .filter-panel, .reports) > * {
  min-width: 0;
}
@container system (max-width: 1000px) {
  .m5-system .activity-dashboard .reports,
  .m5-system .error-management-page .review-layout {
    grid-template-columns: minmax(0, 1fr);
  }
  .m5-system .request-protection-page .actor-row summary {
    grid-template-columns: auto minmax(0, 1fr) 4rem 4rem auto;
  }
  .m5-system .request-protection-page .actor-target { grid-column: 2 / -1; grid-row: 2; }
  .m5-system .request-protection-page .source-row { grid-template-columns: minmax(0, 1fr) 5rem 7rem; }
  .m5-system .request-protection-page .source-paths { grid-column: 1 / -1; grid-row: 2; }
  .m5-system .request-protection-page .source-actions { grid-column: 1 / -1; }
  .m5-system .error-management-page .filter-panel { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .m5-system .error-management-page .search-filter { grid-column: 1 / -1; }
  .m5-system .protection-table { min-width: 0; table-layout: fixed; }
  .m5-system .protection-table :is(th, td) { padding-inline: .4rem; overflow-wrap: anywhere; }
}
@container system (max-width: 600px) {
  .m5-system :is(.summary-grid, .coverage-grid, .edge-layout, .filter-panel, .diagnostic-grid, .page-grid, .insight-grid) {
    grid-template-columns: minmax(0, 1fr);
  }
  .m5-system .request-protection-page .source-row { grid-template-columns: minmax(0, 1fr) auto; }
  .m5-system .request-protection-page .actor-row summary { grid-template-columns: auto minmax(0, 1fr) auto; }
  .m5-system .request-protection-page .actor-metric { display: none; }
  .m5-system .request-protection-page .actor-target-row { grid-template-columns: minmax(0, 1fr) 3rem 3rem; }
  .m5-system .request-protection-page .actor-target-row > span:last-child { display: none; }
}

/* Search administration is shared by the Web and Admin hosts. */
.m5-search-heading { display:flex; align-items:flex-start; justify-content:space-between; gap:1rem; }
.m5-search-heading h1 { margin:.2rem 0 .65rem; letter-spacing:-.04em; }
.m5-search-summary { display:flex; flex-wrap:wrap; gap:1.5rem; padding:1.2rem; margin:1.5rem 0; border:1px solid #d6e4e0; border-radius:1rem; background:#f4f9f7; color:#203b35; }
.m5-search-summary div { flex:1; min-width:135px; }
.m5-search-summary span { display:block; font-size:.74rem; color:#58726a; margin-bottom:.4rem; }
.m5-search-summary strong { font-size:1rem; }
.m5-search-note { color:#61756e; font-size:.8rem; line-height:1.6; }
.m5-search-providers { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem; margin:1.5rem 0; }
.m5-search-provider { border:1px solid #d6e4e0; border-radius:1rem; padding:1.25rem; background:var(--bs-body-bg,#fff); }
.m5-search-provider-title { display:flex; gap:1rem; align-items:flex-start; justify-content:space-between; margin-bottom:1rem; }
.m5-search-provider h2 { font-size:1.1rem; margin:0 0 .45rem; }
.m5-search-provider code { font-size:.75rem; color:#54736a; overflow-wrap:anywhere; }
.m5-search-provider p { font-size:.85rem; line-height:1.6; }
.m5-search-badge { padding:.25rem .6rem; border-radius:99px; background:#eef1ef; color:#586861; font-size:.68rem; white-space:nowrap; }
.m5-search-badge.ready { background:#e0f1e9; color:#246844; }
.m5-search-metrics { display:flex; flex-wrap:wrap; gap:1rem; border-top:1px solid #e0e9e5; padding-top:.8rem; }
.m5-search-metrics div { flex:1; min-width:90px; }
.m5-search-metrics dt { font-size:.68rem; font-weight:500; color:#61756e; }
.m5-search-metrics dd { margin:.25rem 0; font-size:.95rem; font-weight:650; }
.m5-search-actions { display:flex; flex-wrap:wrap; gap:.5rem; margin-top:1rem; }
.m5-search-admin button, .m5-search-test-body button { border:1px solid #27675c; background:#27675c; color:white; border-radius:.5rem; padding:.5rem .75rem; font-size:.78rem; }
.m5-search-admin button.m5-search-secondary, .m5-search-test-body button.m5-search-secondary { background:transparent; color:#27675c; border-color:#bfd3ca; }
.m5-search-admin button:disabled, .m5-search-test-body button:disabled { opacity:.4; cursor:not-allowed; }
.m5-search-error { color:#984635; }
.m5-search-progress { margin-top:1rem; padding:.8rem; background:#f2f7f5; border-radius:.5rem; color:#203b35; }
.admin-dialog.search-test { width:min(1080px,94vw); max-width:94vw; max-height:90vh; border:1px solid #cadbd4; border-radius:1.1rem; padding:0; background:var(--bs-body-bg,#fff); color:var(--bs-body-color,#233c33); box-shadow:0 25px 90px #12372a40; }
.admin-dialog.search-test::backdrop { background:#132c2466; }
.admin-dialog.search-test .admin-dialog-heading { display:flex; justify-content:space-between; align-items:flex-start; gap:1rem; padding:1.3rem 1.5rem; border-bottom:1px solid #dce6e1; }
.admin-dialog.search-test .admin-dialog-heading h2 { margin:0; font-size:1.5rem; }
.admin-dialog.search-test .admin-eyebrow { margin:0 0 .5rem; font-size:.7rem; text-transform:uppercase; letter-spacing:.12em; }
.admin-dialog.search-test .admin-icon-button { background:transparent; border:0; font-size:1.6rem; color:inherit; }
.m5-search-test-body { padding:1.5rem; }
.m5-search-test-form { display:grid; gap:.75rem; }
.m5-search-test-form input[type=search] { width:100%; padding:.75rem; border:1px solid #bcd1c6; border-radius:.6rem; background:var(--bs-body-bg,#fff); color:inherit; }
.admin-dialog.search-test .m5-search-checkbox { display:flex; align-items:center; gap:.5rem; font-size:.85rem; }
.admin-dialog.search-test .m5-search-checkbox input[type=checkbox] { display:inline-block; width:auto; margin:0; flex:none; }
.m5-search-table-wrap { overflow:auto; margin:1.2rem 0; }
.m5-search-table-wrap table { width:100%; min-width:600px; border-collapse:collapse; font-size:.8rem; }
.m5-search-table-wrap th, .m5-search-table-wrap td { text-align:left; padding:.7rem; vertical-align:top; border-bottom:1px solid #dce7e0; }
.m5-search-table-wrap th { font-size:.7rem; color:#547264; }
.m5-search-table-wrap a, .m5-search-test-body details a { color:#27675c; text-decoration:none; }
.m5-search-table-wrap a:hover, .m5-search-test-body details a:hover { text-decoration:underline; }
.m5-search-test-body pre { max-height:350px; overflow:auto; font-size:.75rem; padding:1rem; background:#f1f6f3; color:#203b35; border-radius:.6rem; margin-top:.7rem; white-space:pre-wrap; overflow-wrap:anywhere; }
.m5-search-test-body details { margin:1rem 0; }
.m5-search-test-body summary { font-weight:650; cursor:pointer; margin-bottom:.7rem; }
@media(max-width:900px) { .m5-search-providers { grid-template-columns:1fr; } }
@media(max-width:500px) { .m5-search-heading { flex-direction:column; } .m5-search-test-body { padding:1rem; } }

