/* Shared operational vocabulary; brand and semantic status colors stay separate. */
:root {
  --ops-surface: #ffffff;
  --ops-canvas: #f6f8fb;
  --ops-text: #172033;
  --ops-muted: #526176;
  --ops-border: #cdd8e5;
  --ops-action: #243247;
  --ops-action-hover: #172033;
  --ops-focus: #2563eb;
  --ops-radius: 8px;
  --ops-font: Inter, "Segoe UI", system-ui, sans-serif;
  --crm-primary: var(--ops-action);
  --crm-primary-strong: var(--ops-action-hover);
  --crm-muted: var(--ops-muted);
  --crm-font: var(--ops-font);
}
:where(.hyperion-app-frame, .pm-portal-shell) :where(input, select, textarea, button) { font-family: inherit; }
:where(.hyperion-app-frame, .pm-portal-shell) :where(button, a, input, select, textarea):focus-visible { outline: 2px solid var(--ops-focus); outline-offset: 3px; }
:where(.hyperion-app-frame, .pm-portal-shell) :where(button, input, select, textarea):disabled { cursor: not-allowed; }
.pm-portal-shell { color: var(--ops-text); font-family: var(--ops-font); }
.pm-portal-shell .pm-kicker { color: var(--ops-muted); }
.radix-themes .rt-Button.rt-variant-solid:not([data-accent-color="red"]):not([data-accent-color="green"]):not([data-accent-color="amber"]) {
  background: var(--ops-action);
  color: #ffffff;
  box-shadow: none;
}
.radix-themes .rt-Button.rt-variant-solid:not([data-accent-color="red"]):not([data-accent-color="green"]):not([data-accent-color="amber"]):hover:not(:disabled) { background: var(--ops-action-hover); }
.pm-portal-shell input:not([type="checkbox"]):not([type="file"]),
.pm-portal-shell select,
.pm-portal-shell textarea { border-radius: var(--ops-radius); border-color: var(--ops-border); }

/* App-wide operational layout. Canvas geometry and semantic status styles are
   intentionally outside this layer. Keep this file independently reversible. */
body.hyperion-app-frame {
  --accent: var(--ops-action);
  --crm-primary: var(--ops-action);
  --crm-primary-strong: var(--ops-action-hover);
  --line: var(--ops-border);
  --muted: var(--ops-muted);
  --argus-ref-muted: var(--ops-muted);
  --argus-ref-line: var(--ops-border);
  color: var(--ops-text);
  font-family: var(--ops-font);
  background: var(--ops-canvas);
}
.hyperion-app-frame .pm-empty-layout { max-width: 1080px; grid-template-columns: minmax(220px, .8fr) minmax(320px, 1.2fr); gap: 32px; }
.hyperion-app-frame .pm-empty-layout .pm-panel { box-shadow: none; border-radius: var(--ops-radius); align-content: start; }
.hyperion-app-frame .pm-empty-layout .pm-empty-command { border: 0 !important; background: transparent; gap: 16px; }
.hyperion-app-frame .pm-empty-layout .pm-empty-command h2 { font-size: 28px; line-height: 1.25; }
.hyperion-app-frame .pm-empty-layout .pm-form { border: 0; background: transparent; padding: 0; }
.hyperion-app-frame .pm-empty-layout .rt-Button { background: var(--ops-action); color: white; box-shadow: none; }
@media (max-width: 640px) { .hyperion-app-frame .pm-empty-layout { grid-template-columns: minmax(0, 1fr); gap: 20px; } }
.hyperion-app-frame .argus-app-sidebar {
  background: var(--ops-surface);
  box-shadow: none;
}
.hyperion-app-frame .argus-reference-topbar {
  background: var(--ops-surface);
  backdrop-filter: none;
}
.hyperion-app-frame .argus-workspace-pill {
  border-color: var(--ops-border);
  border-radius: var(--ops-radius);
  box-shadow: none;
}
.hyperion-app-frame .argus-app-nav a { font-weight: 500; }
.hyperion-app-frame .argus-app-nav .argus-nav-label { font-weight: 650; line-height: 1.35; }
.hyperion-app-frame .argus-app-nav a.active {
  color: var(--ops-text);
  background: #edf2f8;
  border-color: #d3deeb;
}
.hyperion-app-frame .argus-app-nav a.active::before { background: var(--ops-action); }
.hyperion-app-frame .argus-app-nav a:hover { background: #f3f6fa; box-shadow: none; color: var(--ops-text); }
/* A schedule bar encodes Planned, not a neutral action. Match its legend even
   when legacy generic button rules have higher specificity. */
.hyperion-app-frame #pm-react-root button.pm-timeline-bar.planned {
  background: #6b5fc7 !important; color: #ffffff !important; box-shadow: none;
}
.hyperion-app-frame .server-nav-toggle,
.hyperion-app-frame .argus-nav-toggle { background: var(--ops-action); border-color: var(--ops-action); box-shadow: none; }
.hyperion-app-frame .server-app-content { background: var(--ops-canvas); }
.hyperion-app-frame [data-notification-bell] { position: relative; }
.hyperion-app-frame .opscentra-notifications { box-sizing: border-box; }
.hyperion-app-frame .notification-count { position: absolute; right: -6px; top: -6px; border-radius: 12px; padding: 2px 5px; background: #b42318; color: white; font-size: 11px; }
.hyperion-app-frame .opscentra-notifications { position: fixed; z-index: 2000; right: 20px; top: 82px; width: min(440px, calc(100vw - 24px)); max-height: calc(100dvh - 100px); overflow: auto; padding: 16px; background: white; color: var(--ops-text); border: 1px solid var(--ops-border); border-radius: 12px; box-shadow: 0 12px 36px #17203326; }
.hyperion-app-frame .opscentra-notifications[hidden], .notification-count[hidden] { display: none; }
.opscentra-notifications header { display: flex; align-items: center; gap: 8px; }
.opscentra-notifications h2 { margin: 0; font-size: 18px; flex: 1; }
.opscentra-notifications article { padding: 14px 10px; border-top: 1px solid #dce3ec; overflow-wrap: anywhere; }
.opscentra-notifications article.is-unread { background: #f1f5fb; border-left: 3px solid #334155; }
.opscentra-notifications article p { white-space: pre-wrap; margin: 8px 0; }
.opscentra-notifications time { display: block; color: #526175; font-size: 12px; margin-bottom: 10px; }
.opscentra-notifications article a { margin-right: 12px; text-decoration: underline; }
.hyperion-app-frame .opscentra-notifications button { background: #fff; color: var(--ops-action); border: 1px solid var(--ops-border); border-radius: 6px; padding: 8px 10px; min-height: 40px; font: inherit; cursor: pointer; box-shadow: none; }
.hyperion-app-frame .opscentra-notifications button:hover { background: #edf2f8; }
@media (max-width: 640px) { .hyperion-app-frame .opscentra-notifications { right: 12px; } }
/* Prevent short views from stretching the bottom-aligned project toolbar. */
.hyperion-app-frame .pm-workspace-panel {
  align-content: start;
  grid-auto-rows: max-content;
}

/* Comparable page headings, content groups and toolbars across all modules. */
.hyperion-app-frame :is(.pm-radix-header, .operations-view-intro, .sigmaseven-module-header, .opscentra-settings-header, .workspace-header) {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 16px;
  padding: 8px 0 20px;
  margin-bottom: 20px;
  border-bottom: 1px solid var(--ops-border);
  background: transparent;
  box-shadow: none;
}
.hyperion-app-frame :is(.pm-radix-header, .operations-view-intro, .sigmaseven-module-header, .opscentra-settings-header, .workspace-header) :is(h1, h2) {
  color: var(--ops-text);
  font-size: clamp(22px, 1.8vw, 28px);
  font-weight: 650;
  letter-spacing: -.025em;
  line-height: 1.25;
  margin: 0;
}
.hyperion-app-frame :is(.pm-radix-header, .operations-view-intro, .sigmaseven-module-header, .opscentra-settings-header, .workspace-header) p {
  color: var(--ops-muted); font-size: 14px; line-height: 1.5; margin: 6px 0 0;
}
.hyperion-app-frame :is(.pm-panel, .pm-radix-panel, .operations-panel, .argus-dashboard-panel, .opscentra-settings-accordion) {
  background: var(--ops-surface);
  border: 1px solid var(--ops-border);
  border-radius: var(--ops-radius);
  box-shadow: none;
  min-width: 0;
}
.hyperion-app-frame :is(.pm-overview-metric-card, .operations-metric-card) { box-shadow: none; border-radius: var(--ops-radius); }
.hyperion-app-frame :is(.pm-button-row, .operations-header-actions, .argus-toolbar-actions, .sigmaseven-module-actions) { flex-wrap: wrap; gap: 8px; }
.hyperion-app-frame :is(.opscentra-settings-page, .opscentra-account-page, .opscentra-support-page) { width: 100%; max-width: 1080px; margin-inline: auto; }
.hyperion-app-frame .opscentra-settings-item > summary { padding: 18px 20px; background: var(--ops-surface); }
.hyperion-app-frame .opscentra-settings-item[open] > summary { background: #f3f6fa; border-bottom: 1px solid var(--ops-border); }
.hyperion-app-frame #sigmaseven-native-root { color: var(--ops-text); font-family: var(--ops-font); }
.hyperion-app-frame #sigmaseven-native-root :is(.sigmaseven-module-tabs, .sigmaseven-workflow-progress) {
  border-radius: var(--ops-radius); border: 1px solid var(--ops-border); background: var(--ops-surface); box-shadow: none;
}
.hyperion-app-frame #sigmaseven-native-root .mode-tab.active { background: #edf2f8; color: var(--ops-text); box-shadow: inset 0 -2px var(--ops-action); }
.hyperion-app-frame #sigmaseven-native-root .upload-drop-zone { background: #f8fafc; border-color: #a7b7ca; border-radius: var(--ops-radius); }
.hyperion-app-frame :is(.opscentra-settings-page, .opscentra-account-page, .opscentra-support-page) :is(input:not([type=checkbox]):not([type=radio]), select, textarea) {
  border: 1px solid var(--ops-border); border-radius: var(--ops-radius); background: white; color: var(--ops-text); min-height: 40px;
}
.hyperion-app-frame :is(.opscentra-settings-page, .opscentra-account-page, .opscentra-support-page) button:not(.danger):not([class*=delete]):not([class*=close]) {
  background: var(--ops-action); color: white; border: 1px solid transparent; border-radius: var(--ops-radius); box-shadow: none;
}
@media (max-width: 640px) {
  .hyperion-app-frame :is(.pm-radix-header, .operations-view-intro, .sigmaseven-module-header, .opscentra-settings-header, .workspace-header) { gap: 12px; margin-bottom: 16px; }
  .hyperion-app-frame :is(.operations-header-actions, .sigmaseven-module-actions) { width: 100%; }
  .hyperion-app-frame .opscentra-settings-item > summary { padding: 16px 12px; }
}
@media (prefers-reduced-motion: reduce) {
  .hyperion-app-frame :is(.argus-app-nav a, .server-nav-toggle svg, .rt-Button) { transition: none; }
}