/* Shared visual layer for every admin surface. Business CSS stays page-owned;
   this file only normalizes typography, spacing, controls and responsive rules. */
:root {
  --ui-bg: #f5f6f8;
  --ui-surface: #ffffff;
  --ui-surface-muted: #f8fafc;
  --ui-ink: #28343e;
  --ui-ink-strong: #17212b;
  --ui-muted: #68737d;
  --ui-muted-light: #9aa7b8;
  --ui-line: #e5ebf2;
  --ui-line-soft: #edf1f5;
  --ui-brand: #087f5b;
  --ui-brand-deep: #066447;
  --ui-brand-soft: #eaf6ef;
  --ui-blue: #2563eb;
  --ui-blue-soft: #eff6ff;
  --ui-green: #15956b;
  --ui-green-soft: #e9f8f1;
  --ui-red: #dc4c5a;
  --ui-red-soft: #fff0f1;
  --ui-yellow: #c7800a;
  --ui-yellow-soft: #fff7e6;
  --ui-radius: 6px;
  --ui-shadow: none;
  --ui-shadow-hover: none;
}

html {
  background: var(--ui-bg);
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

body,
.risk-app,
.security-app {
  min-width: 0 !important;
  background: var(--ui-bg) !important;
  color: var(--ui-ink) !important;
  font-family: Inter, -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei", "Segoe UI", sans-serif !important;
  font-size: 13px;
}

button,
input,
textarea,
select {
  font-family: inherit !important;
}

button {
  transition: background-color .16s ease, border-color .16s ease, color .16s ease, box-shadow .16s ease, transform .16s ease;
}

button:focus-visible,
a:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible {
  outline: 3px solid rgba(249, 115, 22, .18);
  outline-offset: 1px;
}

/* Shared shell */
.topbar,
.globalbar,
.security-topbar {
  min-height: 68px !important;
  height: 68px;
  padding: 0 26px !important;
  background: rgba(255, 255, 255, .96) !important;
  border-bottom: 1px solid var(--ui-line) !important;
  box-shadow: 0 2px 10px rgba(30, 45, 75, .025);
  backdrop-filter: blur(12px);
}

.brand,
.top-brand,
.security-brand {
  color: var(--ui-ink-strong) !important;
}

.brand-mark,
.security-brand-mark,
.top-brand .brand-mark {
  width: 38px !important;
  height: 38px !important;
  border-radius: 11px !important;
  background: linear-gradient(135deg, #ffb21c, var(--ui-brand)) !important;
  color: #fff !important;
  box-shadow: 0 7px 16px rgba(249, 115, 22, .22) !important;
}

.brand span,
.top-brand > span {
  color: var(--ui-brand-deep) !important;
  background: var(--ui-brand-soft) !important;
  border: 1px solid #fed7aa;
}

.top-search,
.global-search,
.security-search {
  background: #f8fafc !important;
  border: 1px solid var(--ui-line) !important;
  border-radius: 10px !important;
  color: var(--ui-muted-light) !important;
}

.top-search:focus-within,
.global-search:focus-within,
.security-search:focus-within {
  border-color: #fdba74 !important;
  box-shadow: 0 0 0 3px rgba(249, 115, 22, .1);
}

.top-search input,
.global-search input,
.security-search input {
  color: var(--ui-ink) !important;
}

.top-actions,
.global-actions,
.security-top-actions {
  color: var(--ui-ink) !important;
}

.back-to-console {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  flex: 0 0 auto;
  min-height: 34px;
  padding: 0 11px;
  border: 1px solid var(--ui-line);
  border-radius: 8px;
  background: #fff;
  color: #52627a;
  text-decoration: none;
  font-size: 12px;
  font-weight: 700;
  white-space: nowrap;
  transition: background-color .16s ease, border-color .16s ease, color .16s ease, transform .16s ease;
}

.back-to-console:hover {
  border-color: #fdba74;
  background: #fffaf5;
  color: var(--ui-brand-deep);
  transform: translateX(-1px);
}

.back-to-console span:first-child {
  color: var(--ui-brand);
  font-size: 16px;
  line-height: 1;
}

.admin-avatar,
.avatar,
.security-avatar {
  background: var(--ui-brand-soft) !important;
  color: var(--ui-brand-deep) !important;
}

.shell,
.security-shell,
.risk-shell {
  min-height: calc(100vh - 68px) !important;
}

.side,
.sidebar,
.security-sidebar,
.risk-side {
  background: #fff !important;
  border-color: var(--ui-line) !important;
}

.side {
  width: 228px !important;
  flex-basis: 228px !important;
  padding: 24px 14px !important;
}

.side-kicker,
.security-sidebar .eyebrow,
.risk-side .eyebrow {
  color: #a0acbc !important;
  letter-spacing: .08em !important;
}

.side-main,
.security-sidebar a.active,
.risk-side nav a.active {
  background: var(--ui-brand-soft) !important;
  color: var(--ui-brand-deep) !important;
}

.side-main .mini-icon,
.tabs button.active span {
  background: linear-gradient(135deg, #ffb21c, var(--ui-brand)) !important;
  color: #fff !important;
}

.sub-nav a:hover,
.sub-nav a.active,
.security-sidebar a:hover,
.risk-side nav a:hover {
  background: #fff8f1 !important;
  color: var(--ui-brand-deep) !important;
}

.content,
.security-main,
.risk-content {
  padding: 28px 32px 48px !important;
}

.breadcrumb,
.security-breadcrumb,
.risk-breadcrumb {
  color: var(--ui-muted-light) !important;
  margin-bottom: 18px !important;
}

.breadcrumb strong,
.security-breadcrumb strong,
.risk-breadcrumb strong {
  color: var(--ui-ink) !important;
}

.page-head h1,
.security-heading h1,
.risk-head h1,
.page-heading h1 {
  color: var(--ui-ink-strong) !important;
  font-weight: 800 !important;
  letter-spacing: 0 !important;
}

.page-head p,
.security-heading p,
.risk-head p,
.page-heading p {
  color: var(--ui-muted) !important;
  line-height: 1.6;
}

/* Controls */
.btn,
.security-btn,
.risk-btn,
.login-panel button,
.heading-actions button {
  min-height: 36px;
  border-radius: 9px !important;
  border: 1px solid transparent;
  background: var(--ui-brand) !important;
  color: #fff !important;
  font-weight: 700;
  box-shadow: 0 5px 12px rgba(249, 115, 22, .14) !important;
}

.btn:hover,
.security-btn:hover,
.risk-btn:hover,
.login-panel button:hover,
.heading-actions button:hover {
  background: var(--ui-brand-deep) !important;
  box-shadow: 0 7px 16px rgba(249, 115, 22, .2) !important;
  transform: translateY(-1px);
}

.btn.secondary,
.btn.ghost,
.security-btn.secondary,
.risk-btn.secondary,
.icon-button,
.bell,
.close {
  background: #fff !important;
  color: #52627a !important;
  border: 1px solid var(--ui-line) !important;
  box-shadow: none !important;
}

.btn.secondary:hover,
.btn.ghost:hover,
.security-btn.secondary:hover,
.risk-btn.secondary:hover,
.icon-button:hover,
.bell:hover {
  color: var(--ui-brand-deep) !important;
  border-color: #fdba74 !important;
  background: #fffaf5 !important;
  box-shadow: none !important;
}

.btn.danger,
.security-btn.danger,
.risk-btn.danger,
.link-btn.danger {
  background: var(--ui-red-soft) !important;
  border-color: #ffd4d8 !important;
  color: var(--ui-red) !important;
  box-shadow: none !important;
}

.btn.success {
  background: var(--ui-green-soft) !important;
  border-color: #ccefe0 !important;
  color: var(--ui-green) !important;
  box-shadow: none !important;
}

input,
select,
textarea,
.filter-row input,
.filter-row select,
.modal-form input,
.modal-form select,
.modal-form textarea,
.risk-filters input,
.risk-filters select,
.risk-modal input,
.risk-modal select,
.risk-modal textarea,
.security-toolbar input,
.security-toolbar select,
.security-modal input,
.security-modal select {
  border-color: #dce5ef !important;
  border-radius: 8px !important;
  color: var(--ui-ink) !important;
  background: #fff !important;
}

input::placeholder,
textarea::placeholder {
  color: #a4afbd;
}

input:focus,
select:focus,
textarea:focus,
.filter-row input:focus,
.filter-row select:focus,
.modal-form input:focus,
.modal-form select:focus,
.modal-form textarea:focus,
.risk-filters input:focus,
.risk-filters select:focus,
.risk-modal input:focus,
.risk-modal select:focus,
.risk-modal textarea:focus,
.security-toolbar input:focus,
.security-toolbar select:focus,
.security-modal input:focus,
.security-modal select:focus {
  border-color: #fb923c !important;
  box-shadow: 0 0 0 3px rgba(249, 115, 22, .11) !important;
}

/* Cards, filters and tables */
.stat-card,
.panel,
.detail-main,
.detail-side,
.module-card,
.money-card,
.finance-panel,
.ledger-timeline,
.security-card,
.security-panel,
.risk-panel,
.risk-group,
.metric,
.panel-shell,
.panel-card,
.data-card,
.summary-card,
.rail-card,
.group-card {
  border-color: var(--ui-line) !important;
  border-radius: var(--ui-radius) !important;
  box-shadow: var(--ui-shadow) !important;
}

/* The ring represents the actual health ratio. An empty dataset must never
   look healthy, and a 100% dataset must not retain warning-color slices. */
.health-ring {
  background:
    radial-gradient(circle, #fff 0 48%, transparent 49%),
    conic-gradient(var(--ui-green) 0 var(--health-value, 0%), #e8edf3 var(--health-value, 0%) 100%) !important;
  color: var(--ui-green) !important;
  font-variant-numeric: tabular-nums;
}

.health-ring.is-empty {
  color: var(--ui-muted-light) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
}

.stat-card:hover,
.module-card:hover,
.security-card:hover,
.risk-group:hover {
  box-shadow: var(--ui-shadow-hover) !important;
}

.stat-card strong,
.metric strong,
.security-card strong,
.risk-stat strong,
.money-card strong {
  color: var(--ui-ink-strong) !important;
  font-variant-numeric: tabular-nums;
}

.filters,
.security-toolbar,
.risk-filters {
  background: var(--ui-surface-muted) !important;
  border-color: var(--ui-line) !important;
  border-radius: 10px !important;
}

.filter-label,
.security-toolbar,
.risk-filters label {
  color: var(--ui-muted) !important;
}

.quick button,
.risk-quick button,
.security-pill {
  border-color: var(--ui-line) !important;
  border-radius: 8px !important;
  background: #fff !important;
  color: var(--ui-muted) !important;
}

.quick button.active,
.risk-quick button.active,
.security-pill.active {
  background: var(--ui-brand-soft) !important;
  border-color: #fed7aa !important;
  color: var(--ui-brand-deep) !important;
}

.table-toolbar,
.panel-head,
.security-panel-head,
.risk-panel .panel-top {
  border-color: var(--ui-line-soft) !important;
}

.table-toolbar strong,
.panel-head h2,
.security-panel-head h2,
.risk-panel h2 {
  color: var(--ui-ink-strong) !important;
}

table,
.table,
.security-table,
.risk-table {
  color: var(--ui-ink) !important;
}

th,
.table th,
.security-table th,
.risk-table th {
  background: #f8fafc !important;
  color: #7b8798 !important;
  border-color: var(--ui-line-soft) !important;
  font-size: 11px !important;
  letter-spacing: .01em;
}

td,
.table td,
.security-table td,
.risk-table td {
  color: #52627a !important;
  border-color: var(--ui-line-soft) !important;
  font-variant-numeric: tabular-nums;
}

tbody tr:hover td,
.table tr:hover td {
  background: #fffaf5 !important;
}

td.primary,
.table td.primary,
.security-table td.primary,
.risk-table td.primary {
  color: var(--ui-ink-strong) !important;
  font-weight: 700;
}

.link-btn {
  color: var(--ui-blue) !important;
}

.link-btn:hover {
  color: var(--ui-brand-deep) !important;
}

.batch-toolbar {
  background: rgba(255, 250, 245, .96) !important;
  border-color: #f5dfca !important;
  box-shadow: 0 4px 12px rgba(80, 45, 16, .04);
}

.batch-toolbar strong {
  color: var(--ui-brand-deep) !important;
}

.status,
.security-status,
.risk-chip {
  border-radius: 999px !important;
  font-weight: 700;
}

.status.pending,
.status.pending_review,
.status.payment_pending,
.status.seller_pending,
.status.rejected,
.security-status.pending,
.risk-chip.pending,
.risk-chip.processing {
  color: var(--ui-yellow) !important;
  background: var(--ui-yellow-soft) !important;
}

.status.approved,
.status.completed,
.status.paid,
.security-status.active,
.security-status.success,
.risk-chip.resolved,
.risk-chip.active {
  color: var(--ui-green) !important;
  background: var(--ui-green-soft) !important;
}

.status.removed,
.status.sold,
.status.cancelled,
.status.rejected,
.security-status.disabled,
.security-status.failed,
.risk-chip.muted,
.risk-chip.banned {
  color: var(--ui-red) !important;
  background: var(--ui-red-soft) !important;
}

.status.paid_pickup,
.status.refund_requested,
.status.in_transit,
.status.ready_for_pickup {
  color: var(--ui-blue) !important;
  background: var(--ui-blue-soft) !important;
}

.pagination,
.security-pager,
.risk-pager {
  color: var(--ui-muted) !important;
}

.pages button,
.security-pager button,
.risk-pager button {
  border-color: var(--ui-line) !important;
  border-radius: 8px !important;
  background: #fff !important;
  color: #66758b !important;
}

.pages button.active {
  background: var(--ui-brand) !important;
  border-color: var(--ui-brand) !important;
}

.empty,
.security-empty,
.risk-empty {
  color: var(--ui-muted-light) !important;
}

.empty strong,
.security-empty strong,
.risk-empty strong {
  color: #607089 !important;
}

/* Dialogs and feedback */
.modal,
.security-modal,
.risk-modal,
.loading-box,
.loading-card,
.gate-card {
  border: 1px solid var(--ui-line) !important;
  border-radius: 14px !important;
  box-shadow: 0 22px 60px rgba(22, 36, 63, .18) !important;
}

.modal-head,
.security-modal header,
.risk-modal header,
.modal-footer,
.security-modal footer,
.risk-modal footer {
  border-color: var(--ui-line-soft) !important;
}

.modal-head h3,
.security-modal header h2,
.risk-modal header h2 {
  color: var(--ui-ink-strong) !important;
}

.toast,
.security-toast,
.risk-toast {
  border-radius: 10px !important;
  box-shadow: 0 12px 26px rgba(22, 36, 63, .16) !important;
}

.loading,
.loading-mask,
.risk-loading,
.security-loading {
  background: rgba(244, 247, 251, .68) !important;
  backdrop-filter: blur(2px);
}

/* Main login page */
.login-view {
  width: min(1180px, calc(100vw - 56px)) !important;
  gap: 54px !important;
}

.login-visual {
  border-radius: 22px !important;
  box-shadow: 0 18px 42px rgba(117, 66, 15, .12) !important;
}

.login-panel {
  border-radius: 16px !important;
  box-shadow: var(--ui-shadow) !important;
}

/* Narrow screens keep the shell usable without changing page IA. */
@media (max-width: 1100px) {
  .content,
  .security-main,
  .risk-content {
    padding-left: 22px !important;
    padding-right: 22px !important;
  }
  .stat-grid,
  .security-cards,
  .risk-stats {
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 760px) {
  .topbar,
  .globalbar,
  .security-topbar {
    height: auto !important;
    min-height: 64px !important;
    padding: 11px 14px !important;
    gap: 10px !important;
    flex-wrap: wrap;
  }

  .top-search,
  .global-search,
  .security-search {
    order: 3;
    width: 100% !important;
    max-width: none !important;
  }

  .back-to-console {
    order: 2;
  }

  .side,
  .security-sidebar,
  .risk-side {
    width: 100% !important;
    padding: 12px 14px 8px !important;
    border-right: 0 !important;
    border-bottom: 1px solid var(--ui-line) !important;
  }

  .sub-nav,
  .security-sidebar nav,
  .risk-side nav {
    display: flex !important;
    gap: 5px !important;
    overflow-x: auto;
    margin: 8px 0 0 !important;
    padding-bottom: 4px;
    border-left: 0 !important;
  }

  .sub-nav a,
  .security-sidebar a,
  .risk-side nav a {
    flex: 0 0 auto;
    white-space: nowrap;
  }

  .content,
  .security-main,
  .risk-content {
    width: 100%;
    padding: 20px 14px 36px !important;
  }

  .page-head,
  .security-heading,
  .risk-head {
    display: block !important;
  }

  .head-actions,
  .security-actions,
  .risk-head .risk-actions {
    justify-content: flex-start !important;
    margin-top: 13px;
  }

  .stat-grid,
  .security-cards,
  .risk-stats,
  .ledger-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 9px !important;
  }

  .filters,
  .security-toolbar,
  .risk-filters {
    padding: 12px !important;
  }

  .filter-row,
  .risk-filters {
    align-items: stretch !important;
  }

  .filter-row .keyword,
  .risk-filters input[type="search"],
  .security-toolbar input[type="search"] {
    flex-basis: 100%;
    min-width: 0 !important;
    width: 100%;
  }

  .filter-row select,
  .risk-filters > select {
    flex-basis: 100%;
    min-width: 0 !important;
    width: 100%;
  }

  .filter-actions {
    width: 100%;
    margin-left: 0 !important;
  }

  .filter-actions .btn {
    flex: 1;
  }

  .table-toolbar {
    align-items: flex-start !important;
    flex-direction: column;
    padding: 13px !important;
  }

  .batch-toolbar {
    align-items: stretch !important;
    flex-wrap: wrap;
    padding: 10px 12px !important;
  }

  .batch-toolbar > span {
    flex-basis: 100%;
  }

  .batch-toolbar .btn {
    flex: 1;
  }

  .field-grid {
    grid-template-columns: 1fr 1fr !important;
  }

  .login-view {
    display: block;
    width: min(480px, calc(100vw - 28px)) !important;
    padding: 22px 0;
  }

  .login-visual {
    min-height: 260px;
    margin-bottom: 16px;
  }

  .login-system {
    left: 28px;
    top: 34px;
    width: calc(100% - 56px);
  }

  .login-system strong {
    font-size: 30px;
  }

  .login-kpi {
    display: none;
  }
}

/* Compact operational theme. Status colors retain their business meaning. */
:root {
  --bg: #f5f6f8;
  --surface-soft: #f5f6f8;
  --text: #17212b;
  --muted: #68737d;
  --border: #e3e7eb;
  --orange: #087f5b;
  --orange-2: #087f5b;
  --orange-soft: #eaf6ef;
  --shadow: none;
  --sidebar: 192px;
}
* { letter-spacing: 0 !important; }
.topbar, .globalbar, .security-topbar {
  min-height: 56px !important; height: auto; padding: 10px 20px !important;
  gap: 16px; flex-wrap: wrap; box-shadow: none !important; backdrop-filter: none;
}
.brand-mark, .security-brand-mark, .top-brand .brand-mark {
  width: 32px !important; height: 32px !important; border-radius: 6px !important;
  background: #087f5b !important; box-shadow: none !important;
}
.brand span, .top-brand > span { border-color: #cce5d7; border-radius: 4px; }
.tool-icon { width: 18px; height: 18px; display: block; }
.global-search { gap: 8px; }
.environment-badge {
  display: inline-flex; align-items: center; gap: 6px; color: #68737d;
  font-size: 11px; line-height: 18px; flex-shrink: 0;
}
.environment-badge::before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: #88929b; }
.environment-badge.preview { color: #9b6808; }
.environment-badge.preview::before { background: #c7800a; }
.environment-badge.connected { color: #087f5b; }
.environment-badge.connected::before { background: #087f5b; }
.environment-badge.error { color: #dc4c5a; }
.environment-badge.error::before { background: #dc4c5a; }
.side { width: 192px !important; flex-basis: 192px !important; padding: 20px 12px !important; }
.dashboard-body { grid-template-columns: var(--sidebar) minmax(0, 1fr); }
.sidebar { padding: 18px 10px !important; }
.tabs button { padding: 9px 10px !important; border-radius: 4px !important; font-size: 13px; box-shadow: none !important; }
.tabs button span { background: transparent !important; color: #68737d !important; font-size: 11px; }
.tabs button.active { color: #087f5b !important; background: #eaf6ef !important; }
.tabs button.active span, .side-main .mini-icon { background: #087f5b !important; color: #fff !important; }
.sub-nav a:hover, .sub-nav a.active, .security-sidebar a:hover, .risk-side nav a:hover { background: #eaf6ef !important; }
.tabs .side-icon { width: 18px; height: 18px; flex-shrink: 0; opacity: .7; }
.tabs button.active .side-icon { opacity: 1; filter: invert(37%) sepia(51%) saturate(944%) hue-rotate(111deg) brightness(86%) contrast(96%); }
.workspace, .content, .security-main, .risk-content { min-width: 0; padding: 22px 24px 40px !important; }
.page-heading { margin-bottom: 18px; }
.page-heading h1, .page-head h1, .risk-head h1, .security-heading h1 { font-size: 24px !important; line-height: 1.4; }
.page-heading p { font-size: 12px; }
.metrics { gap: 0 !important; background: #fff; border: 1px solid #e3e7eb; margin-bottom: 22px; }
.metric { padding: 18px !important; border-radius: 0 !important; border: 0 !important; border-right: 1px solid #e3e7eb !important; background: #fff !important; }
.metric:last-child { border-right: 0 !important; }
.metric-icon { width: 30px; height: 30px; font-size: 12px; border-radius: 4px; color: #087f5b; background: #eaf6ef; }
.metric strong { font-size: 25px !important; }
.metric small { display: none; }
.ops-layout { grid-template-columns: minmax(0, 1fr) 260px !important; gap: 24px !important; }
.main-stack, .rail-stack { min-width: 0; }
.panel, .panel-shell, .security-panel, .risk-panel, .finance-panel {
  background: #fff !important; border-radius: 0 !important; box-shadow: none !important;
}
.workspace > .panel { border: 0 !important; background: transparent !important; padding: 0 !important; }
.rail-card { border: 0 !important; border-radius: 0 !important; padding: 18px !important; border-top: 2px solid #e3e7eb !important; }
.rail-card h3 { font-size: 14px; }
.health, .rail-list { width: 100%; }
.rail-row { gap: 12px; }
.rail-row span { min-width: 0; overflow-wrap: anywhere; }
.panel-head { padding: 18px 20px; }
.panel-head h2 { font-size: 16px; }
.panel-head p:empty { display: none; }
.queue-pools { display: flex; flex-wrap: wrap; gap: 20px; align-items: center; padding: 0 20px; border-bottom: 1px solid #e3e7eb; }
.queue-pools button { border-radius: 0 !important; box-shadow: none !important; background: transparent !important; color: #68737d; padding: 14px 0; border: 0; border-bottom: 2px solid transparent; font-size: 13px; }
.queue-pools button.active { color: #087f5b; border-bottom-color: #087f5b; }
.queue-pools small { color: #68737d; font-size: 11px; margin-left: auto; }
.queue-tabs { padding: 14px 20px; gap: 8px; flex-wrap: wrap; }
.queue-tabs > button { font-size: 12px; padding: 6px 9px; background: #f5f6f8; color: #68737d; border-radius: 4px !important; box-shadow: none; }
.queue-tabs > button.active { background: #eaf6ef; color: #087f5b; }
.queue-toolbar { display: flex; flex-wrap: wrap; width: 100%; flex-basis: 100%; min-width: 0; margin: 4px 0 0; }
.queue-toolbar input { min-width: 120px; flex: 1; width: auto; }
.queue-toolbar select { width: 150px; }
.queue-toolbar button { font-size: 12px; }
.table-wrap { overflow-x: auto; max-width: 100%; }
table { font-size: 12px; }
th { letter-spacing: 0; }
tbody tr:hover td { background: #f5faf7 !important; }
.actions button { font-size: 12px; padding: 6px 9px; white-space: nowrap; box-shadow: none; }
.entity { min-width: 150px; }
.entity strong { max-width: 240px; overflow-wrap: anywhere; }
.dashboard .health { display: block; }
.dashboard .rail-row { display: flex; align-items: center; gap: 12px; }
.dashboard .rail-row > span { flex: 1; min-width: 0; }
.dashboard .rail-row strong { flex-shrink: 0; white-space: nowrap; font-size: 16px; }
.dashboard .rail-row small { flex-shrink: 0; width: 78px; font-size: 10px; }
.ops-layout .table { min-width: 760px; table-layout: fixed; }
.ops-layout .table th:nth-child(1), .ops-layout .table td:nth-child(1) { width: 54px; }
.ops-layout .table th:nth-child(2), .ops-layout .table td:nth-child(2) { width: auto; }
.ops-layout .table th:nth-child(3), .ops-layout .table td:nth-child(3) { width: 180px; }
.ops-layout .table th:nth-child(4), .ops-layout .table td:nth-child(4) { width: 80px; }
.ops-layout .table th:nth-child(5), .ops-layout .table td:nth-child(5) { width: 76px; }
.ops-layout .table th:nth-child(6), .ops-layout .table td:nth-child(6) { width: 136px; }
.ops-layout .table td.actions { display: table-cell; overflow: visible; }
.ops-layout .table td.actions button { display: inline-flex; margin-right: 4px; }
.btn, .security-btn, .risk-btn, .login-panel button, .heading-actions button { border-radius: 6px !important; box-shadow: none !important; }
button:hover { transform: none !important; }
button:disabled { cursor: not-allowed; }
input:focus, select:focus, textarea:focus { border-color: #087f5b !important; box-shadow: 0 0 0 2px #eaf6ef !important; }
button:focus-visible, a:focus-visible { outline-color: #087f5b; }
.filters, .risk-filters, .security-toolbar { border-radius: 0 !important; }
.quick button.active, .risk-quick button.active, .security-pill.active { border-color: #a8d2bb !important; }
.batch-toolbar { background: #f5faf7 !important; border-color: #cce5d7 !important; box-shadow: none; }
.modal, .risk-modal, .security-modal { border-radius: 8px !important; }
.module-card, .stat-card, .data-card, .summary-card { border-radius: 6px !important; }
.risk-search.module-context { background: transparent; border: 0; color: #68737d; font-size: 12px; }
.login-visual { background: #087f5b !important; border-radius: 8px; }
.login-kpi { display: none; }
@media (max-width: 1100px) {
  .ops-layout { grid-template-columns: minmax(0, 1fr) !important; }
  .rail-stack { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
  .global-search { order: 4; flex: 1 1 100%; }
}
@media (max-width: 760px) {
  .topbar, .globalbar, .security-topbar { padding: 12px !important; gap: 10px; }
  .environment-badge { flex-basis: 100%; order: 9; }
  .dashboard-body { display: block; }
  .sidebar { width: 100%; position: static; }
  .sidebar .tabs { display: flex; overflow-x: auto; padding-bottom: 4px; }
  .sidebar .tabs button { flex: 0 0 auto; }
  .workspace, .content, .security-main, .risk-content { padding: 18px 12px 32px !important; }
  .metrics { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  .metric { border-bottom: 1px solid #e3e7eb !important; }
  .rail-stack { grid-template-columns: minmax(0, 1fr); }
  .queue-pools small { flex-basis: 100%; margin: -8px 0 10px; }
  .queue-toolbar select { width: 100%; }
  .page-heading { align-items: flex-start; gap: 12px; flex-wrap: wrap; }
}