:root {
  color-scheme: dark;
  --page: #040d1a;
  --nav: #061327;
  --panel: #07172b;
  --panel-deep: #061325;
  --panel-raised: #0a1b32;
  --panel-hover: #0d2240;
  --line: #17314e;
  --line-soft: rgba(58, 94, 134, 0.26);
  --text: #e9f0fa;
  --soft: #a8b9cd;
  --muted: #667b94;
  --blue: #2a9dff;
  --cyan: #32d5ff;
  --violet: #8c5cff;
  --green: #55d98d;
  --amber: #f4bd4f;
  --red: #ff647a;
  --radius: 5px;
  --sans: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --mono: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
}

* { box-sizing: border-box; }
html, body { width: 100%; min-width: 320px; min-height: 100%; margin: 0; }
body { overflow: hidden; background: var(--page); color: var(--text); font: 12px/1.45 var(--sans); }
button, input, select, textarea { color: inherit; font: inherit; }
button, select { cursor: pointer; }
button:disabled { cursor: not-allowed; opacity: .42; }
button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 2px solid var(--blue); outline-offset: -2px; }
a { color: inherit; text-decoration: none; }
img { display: block; }
h1, h2, h3, p, pre, dl, dd { margin: 0; }
[hidden] { display: none !important; }
[data-admin-disabled="true"] [data-route="admin"],
[data-admin-disabled="true"] #admin-view,
[data-admin-disabled="true"] #admin-action-modal { display: none !important; }

.app-shell { height: 100vh; min-height: 680px; display: grid; grid-template: 56px minmax(0, 1fr) / 160px minmax(0, 1fr); background: var(--page); }
.topbar { z-index: 20; grid-column: 1 / -1; display: grid; grid-template-columns: 182px minmax(0, 1fr) auto; align-items: center; gap: 12px; padding: 0 14px 0 11px; border-bottom: 1px solid var(--line-soft); background: #051224; box-shadow: 0 2px 18px rgba(0,0,0,.18); }
.app-brand { display: flex; align-items: center; gap: 9px; color: #f6f8ff; font-size: 14px; white-space: nowrap; }
.app-brand img { width: 30px; height: 30px; border-radius: 50%; }
.topbar-context { min-width: 0; height: 100%; display: grid; grid-template-columns: minmax(132px, 180px) minmax(154px, 210px) minmax(132px, 168px) minmax(130px, 164px) 120px; align-items: center; gap: 9px; }
.context-select, .context-button, .revision-chip { height: 43px; min-width: 0; display: grid; align-content: center; padding: 5px 11px; border: 1px solid var(--line-soft); border-radius: var(--radius); background: #091a30; text-align: left; }
.context-select span, .context-button span, .revision-chip span { color: var(--muted); font-size: 8px; line-height: 1.15; }
.context-select select { width: 100%; min-width: 0; margin-top: 1px; padding: 0 20px 0 0; border: 0; background: transparent; color: var(--text); font-size: 11px; appearance: auto; }
.context-button strong, .revision-chip strong { overflow: hidden; margin-top: 1px; color: var(--text); font-size: 11px; font-weight: 500; text-overflow: ellipsis; white-space: nowrap; }
.context-button, .revision-chip { cursor: pointer; }
.revision-chip strong { width: max-content; padding: 1px 4px; border-radius: 2px; background: rgba(38, 139, 255, .12); color: #5eb3ff; font-family: var(--mono); }
.topbar-actions { display: flex; align-items: center; justify-content: flex-end; gap: 9px; }
.icon-button, .bare-icon { display: inline-grid; place-items: center; padding: 0; border: 0; background: transparent; color: var(--soft); }
.icon-button { width: 30px; height: 30px; border-radius: 50%; font-size: 15px; }
.icon-button:hover, .bare-icon:hover { color: #fff; background: rgba(255,255,255,.055); }
.notification-button { position: relative; font-size: 18px; }
.notification-button i { position: absolute; top: 5px; right: 4px; width: 6px; height: 6px; border: 1px solid #051224; border-radius: 50%; background: var(--blue); box-shadow: 0 0 6px rgba(42,157,255,.72); }
.notification-button i[data-state="attention"] { background: var(--amber); box-shadow: 0 0 6px rgba(244,189,79,.72); }
.connection-badge { position: relative; display: flex; align-items: center; gap: 6px; padding: 0; border: 0; background: transparent; }
.avatar { width: 37px; height: 37px; display: grid; place-items: center; border: 1px solid var(--line-soft); border-radius: 50%; background: #172a43; color: var(--soft); font-size: 11px; }
.connection-dot { position: absolute; z-index: 2; right: 0; bottom: 2px; width: 9px; height: 9px; border: 2px solid #051224; border-radius: 50%; background: var(--amber); }
.connection-badge[data-state="ok"] .connection-dot { background: var(--green); }
.connection-badge[data-state="error"] .connection-dot { background: var(--red); }

.primary-nav { min-height: 0; display: flex; flex-direction: column; border-right: 1px solid var(--line-soft); background: linear-gradient(180deg, #07162b, #051123); }
.product-switcher { border-bottom: 1px solid var(--line-soft); }
.product-switcher button { width: 100%; height: 51px; display: grid; grid-template-columns: 25px 1fr auto; align-items: center; gap: 7px; padding: 0 14px; border: 0; background: transparent; color: var(--soft); text-align: left; }
.product-switcher button:hover { background: rgba(38, 92, 160, .1); color: #fff; }
.product-switcher .active-context { background: linear-gradient(90deg, rgba(61, 42, 143, .42), rgba(21, 81, 151, .16)); color: #88b6ff; }
.product-switcher img { width: 23px; height: 23px; border-radius: 50%; }
.nav-glyph { width: 20px; color: #92a9c2; font-size: 15px; text-align: center; }
.primary-nav nav { min-height: 0; flex: 1; overflow-y: auto; padding: 5px 0 8px; scrollbar-width: thin; scrollbar-color: var(--line) transparent; }
.nav-group-label { display: block; padding: 9px 14px 3px 17px; color: #49617d; font-size: 7px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.nav-item { position: relative; width: 100%; height: 40px; display: flex; align-items: center; gap: 7px; padding: 0 14px 0 17px; border: 0; background: transparent; color: var(--soft); font-size: 11px; text-align: left; }
.nav-item:hover { color: #fff; background: rgba(31, 96, 173, .1); }
.nav-item.active { color: #8ab9ff; background: linear-gradient(90deg, rgba(42, 82, 184, .28), rgba(29, 103, 178, .09)); }
.nav-item.active::before { content: ""; position: absolute; inset: 5px auto 5px 0; width: 2px; background: linear-gradient(var(--violet), var(--blue)); box-shadow: 0 0 10px var(--blue); }
.nav-footer { margin-top: auto; padding: 15px 12px 13px; border-top: 1px solid var(--line-soft); color: var(--muted); }
.mini-brand { display: flex; align-items: center; gap: 7px; margin-bottom: 10px; color: var(--soft); font-size: 10px; }
.mini-brand img { width: 27px; height: 27px; border-radius: 50%; }
.nav-footer small { font-size: 9px; }

.app-main { min-width: 0; min-height: 0; overflow: hidden; }
.app-view { display: none; width: 100%; height: 100%; min-height: 0; }
.app-view.active { display: block; }
.panel-surface, .ops-panel, .ops-detail-card { border: 1px solid var(--line-soft); background: var(--panel); }
.query-view.active { display: grid; grid-template-columns: 212px minmax(440px, 1fr) 310px; min-height: 0; }

.schema-panel { min-height: 0; overflow: hidden; border-width: 0 1px 0 0; }
.panel-tabs { height: 38px; display: flex; align-items: end; gap: 18px; padding: 0 12px; border-bottom: 1px solid var(--line-soft); }
.panel-tabs button, .result-tabs button { position: relative; height: 100%; padding: 0 2px; border: 0; background: transparent; color: var(--muted); font-size: 10px; }
.panel-tabs button.active, .result-tabs button.active { color: #75b9ff; }
.panel-tabs button.active::after, .result-tabs button.active::after { content: ""; position: absolute; right: 0; bottom: 0; left: 0; height: 1px; background: var(--blue); box-shadow: 0 0 7px rgba(42,157,255,.7); }
.schema-tab { display: none; height: calc(100% - 38px); overflow-y: auto; scrollbar-width: thin; scrollbar-color: var(--line) transparent; }
.schema-tab.active { display: block; }
.schema-section { padding: 9px 9px 8px; border-bottom: 1px solid var(--line-soft); }
.section-label { display: flex; align-items: center; justify-content: space-between; margin-bottom: 7px; color: var(--soft); font-size: 9px; font-weight: 650; letter-spacing: .02em; text-transform: uppercase; }
.section-label > span:last-child { display: flex; gap: 3px; }
.section-label strong { min-width: 24px; padding: 2px 5px; border: 1px solid var(--line-soft); border-radius: 3px; color: var(--muted); font-size: 8px; text-align: center; }
.bare-icon { min-width: 22px; height: 22px; border-radius: 3px; }
.schema-list { display: grid; gap: 1px; }
.schema-row { min-height: 25px; display: grid; grid-template-columns: 17px minmax(0, 1fr) auto; align-items: center; gap: 5px; padding: 0 6px; border: 0; border-radius: 3px; background: transparent; color: var(--soft); font-size: 10px; text-align: left; }
.schema-row:hover { background: rgba(49, 106, 169, .13); color: #fff; }
.schema-row.active { background: rgba(40, 91, 180, .27); color: #a4c8ff; }
.schema-row small { color: var(--muted); font-size: 8px; }
.schema-row b { color: var(--blue); font-weight: 500; }
.type-icon { width: 14px; height: 14px; display: grid; place-items: center; border-radius: 3px; background: rgba(252, 168, 77, .19); color: #f3ae59; font-size: 8px; }
.edge-type { background: rgba(85, 217, 141, .17); color: var(--green); }
.graph-type { background: rgba(80, 139, 255, .18); color: #7fb3ff; }
.schema-loading { padding: 10px 5px; color: var(--muted); font-size: 9px; text-align: center; }
.property-section { min-height: 135px; }
.search-field { height: 27px; display: flex; align-items: center; gap: 5px; padding: 0 7px; border: 1px solid var(--line-soft); border-radius: 3px; background: #08182b; color: var(--muted); }
.search-field input { min-width: 0; flex: 1; border: 0; outline: 0; background: transparent; color: var(--text); font-size: 9px; }
.property-list { max-height: 135px; overflow-y: auto; margin-top: 6px; }
.property-row { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 7px; padding: 3px 4px; color: var(--soft); font-family: var(--mono); font-size: 8px; }
.property-row span:last-child { color: var(--muted); font-family: var(--sans); }
.saved-section { min-height: 140px; }
.saved-empty { display: grid; gap: 5px; padding: 17px 12px; color: var(--muted); font-size: 9px; text-align: center; }
.saved-empty strong { color: var(--soft); font-weight: 500; }
.saved-query { width: 100%; display: grid; gap: 2px; padding: 7px 8px; border: 0; border-radius: 3px; background: transparent; color: var(--soft); text-align: left; }
.saved-query:hover { background: rgba(49,106,169,.13); }
.saved-query strong { overflow: hidden; font-size: 10px; font-weight: 500; text-overflow: ellipsis; white-space: nowrap; }
.saved-query small { color: var(--muted); font-size: 8px; }
.explorer-tab { padding: 10px; }
.explorer-search { display: grid; grid-template-columns: 1fr auto; gap: 5px; }
.explorer-result { min-height: 180px; display: grid; place-content: center; gap: 4px; padding: 14px; color: var(--muted); text-align: center; }
.explorer-result pre { max-width: 100%; overflow: auto; color: var(--soft); font: 9px/1.55 var(--mono); text-align: left; white-space: pre-wrap; }

.query-workspace { min-width: 0; min-height: 0; display: grid; grid-template-rows: minmax(270px, 1.155fr) 136px 58px minmax(235px, 1fr); gap: 6px; padding: 6px; overflow: hidden; background: #04101f; }
.query-workspace.has-results { grid-template-rows: minmax(220px,1.05fr) minmax(90px,.42fr) 48px minmax(260px,1.3fr); }
.editor-card, .parameters-card, .results-card { min-width: 0; min-height: 0; overflow: hidden; }
.card-header { height: 34px; display: flex; align-items: center; justify-content: space-between; padding: 0 10px; border-bottom: 1px solid var(--line-soft); color: var(--soft); font-size: 10px; }
.card-header > div { display: flex; align-items: center; gap: 6px; }
.inline-select select { padding: 0 2px; border: 0; background: transparent; color: var(--soft); font-size: 9px; }
.text-action { padding: 3px 5px; border: 0; border-radius: 3px; background: transparent; color: var(--muted); font-size: 8px; }
.text-action:hover { color: #fff; background: rgba(255,255,255,.04); }
.code-editor { height: calc(100% - 34px); display: grid; grid-template-columns: 36px minmax(0,1fr); background: #061326; }
.line-numbers { overflow: hidden; padding: 9px 8px 9px 0; border-right: 1px solid var(--line-soft); background: #061224; color: #556c86; font: 10px/1.65 var(--mono); text-align: right; user-select: none; }
.code-editor textarea { width: 100%; height: 100%; resize: none; padding: 9px 10px; border: 0; outline: 0; background: transparent; color: #c9d8e9; caret-color: var(--cyan); font: 10px/1.65 var(--mono); tab-size: 2; white-space: pre; }
.code-editor textarea::selection { background: rgba(62,132,255,.28); }
.parameters-editor textarea, .parameters-editor .line-numbers { padding-top: 8px; color: #9bbfe3; }
.editor-card.expanded, .parameters-card.expanded { position: fixed; z-index: 60; inset: 20px; box-shadow: 0 24px 70px rgba(0,0,0,.72); }

.query-actions { min-width: 0; display: grid; grid-template-columns: minmax(0,1fr) repeat(5, minmax(90px, 1fr)); align-items: center; gap: 8px; padding: 8px 10px; }
.query-workspace.has-results .query-actions { padding-block: 6px; }
.action-status { min-width: 0; display: grid; grid-template-columns: auto auto minmax(0,1fr); align-items: center; gap: 5px; color: var(--muted); white-space: nowrap; }
.action-status .status-icon { color: var(--blue); font-size: 8px; }
.action-status strong { color: var(--soft); font-size: 9px; }
.action-status span:last-child { overflow: hidden; font-size: 8px; text-overflow: ellipsis; }
.action-status[data-state="success"] .status-icon, .action-status[data-state="success"] strong { color: var(--green); }
.action-status[data-state="error"] .status-icon, .action-status[data-state="error"] strong { color: var(--red); }
.action-status[data-state="working"] .status-icon { color: var(--amber); animation: pulse 1s infinite; }
.action-button { height: 38px; display: flex; align-items: center; justify-content: center; gap: 7px; border: 1px solid #355278; border-radius: 4px; background: #07172b; color: #d2dfef; font-size: 10px; white-space: nowrap; }
.action-button:hover:not(:disabled) { border-color: #5d82b0; background: #0a1d36; }
.primary-action { border-color: #328feb; background: linear-gradient(106deg, #4b62e7, #1baeed); box-shadow: 0 0 18px rgba(32,151,255,.18); color: #fff; }
.mutation-action { border-color: #7651b9; color: #b895ff; }
.commit-action { border-color: rgba(85,217,141,.5); color: #81e7ab; }

.results-card { display: grid; grid-template-rows: 35px minmax(0,1fr); }
.result-tabs { display: flex; align-items: end; gap: 23px; padding: 0 12px; border-bottom: 1px solid var(--line-soft); }
.result-panel { display: none; min-width: 0; min-height: 0; overflow: hidden; }
.result-panel.active { display: block; }
.results-empty { height: 100%; display: grid; place-content: center; justify-items: center; gap: 6px; color: var(--muted); text-align: center; }
.empty-symbol { color: #91a2b8; font-size: 34px; line-height: 1; }
.results-empty strong { color: #d7e0ec; font-size: 14px; font-weight: 500; }
.results-empty p { font-size: 9px; }
.secondary-button, .primary-button, .danger-confirm-button { min-height: 32px; display: inline-flex; align-items: center; justify-content: center; padding: 0 14px; border: 1px solid #355278; border-radius: 4px; background: #08172a; color: var(--soft); font-size: 10px; }
.secondary-button:hover { border-color: #6d88aa; color: #fff; }
.results-empty .secondary-button { margin-top: 8px; }
.primary-button { border-color: #3388e6; background: linear-gradient(100deg, #2459dd, #1c9de8); color: #fff; }
.danger-confirm-button { border-color: rgba(85,217,141,.52); background: linear-gradient(100deg, #287748, #57b85f); color: #fff; }
.result-state { height: 100%; padding: 7px; overflow: hidden; }
.result-banner { min-height: 45px; display: grid; grid-template-columns: auto minmax(0,1fr) auto; align-items: center; gap: 10px; padding: 7px 10px; border: 1px solid rgba(85,217,141,.28); background: rgba(20,91,59,.12); }
.result-banner[data-state="error"] { border-color: rgba(255,100,122,.32); background: rgba(120,30,51,.16); }
.result-banner[data-state="warning"] { border-color: rgba(244,189,79,.3); background: rgba(130,85,20,.13); }
.banner-icon { width: 24px; height: 24px; display: grid; place-items: center; border-radius: 50%; background: rgba(85,217,141,.12); color: var(--green); font-size: 13px; }
.result-banner[data-state="error"] .banner-icon { background: rgba(255,100,122,.12); color: var(--red); }
.result-banner[data-state="warning"] .banner-icon { background: rgba(244,189,79,.12); color: var(--amber); }
.result-banner strong { color: var(--text); font-size: 11px; }
.result-banner p { margin-top: 2px; color: var(--muted); font-size: 8px; }
.banner-tag { padding: 2px 5px; border: 1px solid currentColor; border-radius: 2px; color: var(--green); font-size: 7px; }
.result-content-grid { height: calc(100% - 52px); display: grid; grid-template-columns: minmax(0,1fr) 220px; gap: 7px; margin-top: 7px; }
.table-result, .result-evidence { min-width: 0; min-height: 0; overflow: hidden; border: 1px solid var(--line-soft); background: #061326; }
.table-result { display: grid; grid-template-rows: 30px minmax(0,1fr) 29px; }
.table-result > header { display: flex; align-items: center; justify-content: space-between; padding: 0 8px; border-bottom: 1px solid var(--line-soft); color: var(--soft); font-size: 9px; }
.table-scroll { overflow: auto; scrollbar-width: thin; scrollbar-color: var(--line) transparent; }
table { width: 100%; border-collapse: collapse; font-size: 8px; white-space: nowrap; }
th, td { max-width: 190px; overflow: hidden; padding: 6px 8px; border-right: 1px solid var(--line-soft); border-bottom: 1px solid var(--line-soft); color: #aabbd0; text-align: left; text-overflow: ellipsis; }
th { position: sticky; z-index: 2; top: 0; background: #09192d; color: #8094ab; font-size: 7px; font-weight: 600; }
tr:hover td { background: rgba(40,91,180,.08); color: #dce6f3; }
.table-result > footer { display: flex; align-items: center; justify-content: space-between; padding: 0 8px; color: var(--muted); font-size: 8px; }
.table-result > footer > div { display: flex; }
.result-evidence { padding: 9px; }
.result-evidence h3 { padding-bottom: 7px; border-bottom: 1px solid var(--line-soft); color: var(--soft); font-size: 9px; font-weight: 600; }
.result-evidence dl, .commit-context, .ops-detail-card dl { display: grid; gap: 7px; margin-top: 8px; }
.result-evidence dl div, .commit-context div, .ops-detail-card dl div { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 7px; }
dt { color: var(--muted); }
dd { overflow: hidden; color: var(--soft); text-align: right; text-overflow: ellipsis; }
.graph-result-shell { height: 100%; min-height: 0; display: grid; grid-template-rows: auto minmax(0,1fr); }
.ego-network-toolbar { min-height: 42px; display: grid; grid-template-columns: minmax(135px,1.2fr) 75px 75px 65px 95px 74px; align-items: end; gap: 4px; padding: 6px 7px 0; border-bottom: 1px solid var(--line-soft); background: #071529; }
.ego-network-toolbar label { min-width: 0; display: grid; gap: 3px; color: var(--muted); font-size: 6px; text-transform: uppercase; }
.ego-network-toolbar select, .ego-network-toolbar input[type="number"] { min-width: 0; height: 27px; padding: 0 7px; border: 1px solid #223c59; border-radius: 2px; outline: 0; background: #061326; color: var(--soft); font-size: 8px; }
.ego-network-toolbar select:focus, .ego-network-toolbar input[type="number"]:focus { border-color: var(--blue); }
.ego-network-toolbar .ego-toggle { height: 27px; display: flex; align-items: center; gap: 4px; padding: 0 5px; border: 1px solid #223c59; border-radius: 2px; background: #061326; color: #9eb3ca; font-size: 6px; text-transform: none; white-space: nowrap; }
.ego-toggle input { accent-color: var(--violet); }
.ego-network-toolbar > button { height: 27px; white-space: nowrap; }
.graph-result-layout { min-height: 0; display: grid; grid-template-columns: minmax(0,1fr) 215px; gap: 7px; padding: 7px; }
.graph-canvas { position: relative; min-height: 0; overflow: hidden; border: 1px solid var(--line-soft); background: radial-gradient(circle at 50% 52%, rgba(68,55,171,.13), transparent 38%), #061326; }
.graph-canvas::before { content: ""; position: absolute; inset: 0; opacity: .13; background-image: linear-gradient(var(--line) 1px, transparent 1px), linear-gradient(90deg, var(--line) 1px, transparent 1px); background-size: 32px 32px; }
.graph-empty-state { position: absolute; z-index: 3; inset: 0; display: grid; place-content: center; justify-items: center; gap: 5px; padding: 24px; color: var(--muted); text-align: center; }
.graph-empty-state > span { color: #557798; font-size: 28px; }
.graph-empty-state strong { color: var(--soft); font-size: 10px; font-weight: 500; }
.graph-empty-state p { max-width: 360px; font-size: 8px; line-height: 1.5; }
.ego-ring { position: absolute; z-index: 0; left: 50%; top: 50%; width: var(--ring-width); height: var(--ring-height); border: 1px dashed rgba(99,128,162,.24); border-radius: 50%; transform: translate(-50%,-50%); pointer-events: none; }
.ego-ring > span { position: absolute; left: 50%; top: -7px; padding: 1px 5px; border: 1px solid rgba(70,95,125,.35); border-radius: 8px; background: #07162a; color: #66809c; font: 6px var(--mono); white-space: nowrap; transform: translateX(-50%); }
.ego-cluster { position: absolute; z-index: 0; left: var(--cluster-x); top: var(--cluster-y); width: 34%; height: 43%; border: 1px dashed rgba(99,128,162,.21); border-radius: 46%; transform: translate(-50%,-50%); pointer-events: none; }
.ego-cluster > span { position: absolute; left: 50%; top: 4px; color: #66809c; font: 6px var(--mono); white-space: nowrap; transform: translateX(-50%); }
.ego-mode-badge { position: absolute; z-index: 7; left: 8px; top: 8px; display: flex; align-items: center; gap: 5px; padding: 4px 7px; border: 1px solid rgba(75,111,151,.45); border-radius: 10px; background: rgba(5,17,33,.9); color: #8fa9c3; font: 6px var(--mono); pointer-events: none; }
.ego-mode-badge i { width: 5px; height: 5px; border-radius: 50%; background: var(--green); box-shadow: 0 0 7px rgba(85,217,141,.65); }
.query-graph-node { position: absolute; z-index: 4; left: var(--graph-x); top: var(--graph-y); width: var(--node-size, 54px); height: var(--node-size, 54px); display: grid; place-items: center; align-content: center; gap: 1px; padding: 4px; border: 1px solid var(--node-accent); border-radius: 50%; outline: 0; background: radial-gradient(circle, var(--node-fill), #07172b 70%); box-shadow: 0 0 20px color-mix(in srgb, var(--node-accent) 20%, transparent); color: #d6ebff; text-align: center; transform: translate(-50%,-50%); transition: opacity .15s ease, filter .15s ease, box-shadow .15s ease, transform .15s ease; }
.query-graph-node.graph-shape-order { border-radius: 15px; }
.query-graph-node.graph-shape-product { border-radius: 9px; transform: translate(-50%,-50%) rotate(45deg); }
.query-graph-node.graph-shape-product > * { transform: rotate(-45deg); }
.query-graph-node.graph-shape-account { border-radius: 50% 50% 16% 16%; }
.query-graph-node.graph-shape-device { border-radius: 13px 13px 24px 24px; }
.query-graph-node.is-ego { z-index: 6; border-width: 2px; box-shadow: 0 0 0 5px color-mix(in srgb, var(--node-accent) 9%, transparent), 0 0 30px color-mix(in srgb, var(--node-accent) 38%, transparent); }
.query-graph-node:hover, .query-graph-node:focus-visible, .query-graph-node.is-focused { z-index: 8; border-color: #e5f3ff; box-shadow: 0 0 0 4px rgba(223,240,255,.08), 0 0 28px color-mix(in srgb, var(--node-accent) 48%, transparent); }
.query-graph-node.is-muted { opacity: .18; filter: saturate(.35); }
.query-graph-node > span { color: var(--node-accent); font-size: 14px; line-height: 1; }
.query-graph-node strong { max-width: 52px; overflow: hidden; font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }
.query-graph-node small { max-width: 52px; overflow: hidden; color: #8ba5c0; font: 6px var(--mono); text-overflow: ellipsis; white-space: nowrap; }
.graph-canvas[data-density="high"] .query-graph-node > span { font-size: 10px; }
.graph-canvas[data-density="high"] .query-graph-node strong { max-width: 41px; font-size: 7px; }
.graph-canvas[data-density="high"] .query-graph-node small { max-width: 41px; font-size: 5px; }
.graph-canvas[data-mode="cluster"] .query-graph-node:not(.is-ego) { padding: 2px; }
.graph-canvas[data-mode="cluster"] .query-graph-node:not(.is-ego) > span, .graph-canvas[data-mode="cluster"] .query-graph-node:not(.is-ego) small { display: none; }
.graph-canvas[data-mode="cluster"] .query-graph-node:not(.is-ego) strong { max-width: 27px; font-size: 5.5px; }
.query-graph-edge { position: absolute; z-index: 1; left: var(--edge-x); top: var(--edge-y); width: var(--edge-width); height: var(--edge-thickness, 1px); border-radius: 2px; background: linear-gradient(90deg, color-mix(in srgb, var(--edge-color) 30%, transparent), var(--edge-color), color-mix(in srgb, var(--edge-color) 30%, transparent)); opacity: .78; transform: rotate(var(--edge-angle)); transform-origin: left center; transition: opacity .15s ease, filter .15s ease; }
.query-graph-edge::after { content: ""; position: absolute; right: -1px; top: calc((var(--edge-thickness, 1px) - 7px) / 2); border-top: 3.5px solid transparent; border-bottom: 3.5px solid transparent; border-left: 6px solid var(--edge-color); }
.query-graph-edge[data-direction="undirected"]::after { display: none; }
.query-graph-edge.is-highlighted { z-index: 2; opacity: 1; filter: brightness(1.35); box-shadow: 0 0 8px color-mix(in srgb, var(--edge-color) 45%, transparent); }
.query-graph-edge.is-muted { opacity: .09; filter: saturate(.25); }
.query-graph-edge-label { position: absolute; z-index: 3; left: var(--edge-label-x); top: var(--edge-label-y); max-width: 92px; overflow: hidden; padding: 2px 4px; border: 1px solid rgba(68,96,128,.38); border-radius: 2px; background: rgba(6,19,38,.92); color: #7f9cba; font: 6px var(--mono); opacity: 0; pointer-events: none; text-overflow: ellipsis; white-space: nowrap; transform: translate(-50%,-50%); transition: opacity .12s ease; }
.query-graph-edge:hover + .query-graph-edge-label, .query-graph-edge-label.is-highlighted { opacity: 1; }
.query-graph-edge-label.is-muted { display: none; }
.graph-tone-0 { --node-accent: #4db7ff; --node-fill: #0d345a; }.graph-tone-1 { --node-accent: #a276ff; --node-fill: #2a1761; }.graph-tone-2 { --node-accent: #55d98d; --node-fill: #103e32; }.graph-tone-3 { --node-accent: #f4bd4f; --node-fill: #493413; }.graph-tone-4 { --node-accent: #ff7186; --node-fill: #491b2a; }.graph-tone-5 { --node-accent: #55d7da; --node-fill: #0c3b45; }
.graph-result-evidence { overflow-y: auto; }
.graph-visualization-summary { display: grid; gap: 3px; padding: 9px 0; border-bottom: 1px solid var(--line-soft); }
.graph-visualization-summary strong { color: #bcd0e5; font-size: 9px; font-weight: 500; }
.graph-visualization-summary p { color: var(--muted); font-size: 7px; line-height: 1.45; }
.query-graph-legend { display: grid; gap: 5px; padding: 8px 0; border-bottom: 1px solid var(--line-soft); }
.query-graph-legend:empty { display: none; }
.query-graph-legend button { width: 100%; display: grid; grid-template-columns: 8px minmax(0,1fr) auto; align-items: center; gap: 6px; padding: 2px 0; border: 0; background: transparent; color: #9eb3ca; font-size: 7px; text-align: left; cursor: pointer; }
.query-graph-legend button:hover b { color: #e0ebf7; }
.query-graph-legend button[aria-pressed="true"] { opacity: .35; text-decoration: line-through; }
.query-graph-legend i { width: 7px; height: 7px; border-radius: 50%; background: var(--node-accent); }
.query-graph-legend i.legend-shape-order { border-radius: 2px; }
.query-graph-legend i.legend-shape-product { border-radius: 1px; transform: rotate(45deg); }
.query-graph-legend i.legend-shape-account { border-radius: 50% 50% 15% 15%; }
.query-graph-legend i.legend-shape-device { border-radius: 2px 2px 4px 4px; }
.query-graph-legend b { color: var(--soft); font-weight: 500; }
.query-graph-legend span { color: var(--muted); }
.graph-selection-detail { display: grid; gap: 4px; padding: 8px 0; border-bottom: 1px solid var(--line-soft); color: var(--muted); font-size: 7px; }
.graph-selection-detail strong { color: var(--soft); font-size: 9px; font-weight: 500; }
.graph-selection-detail dl { display: grid; gap: 4px; margin: 0; }
.graph-selection-detail dl div { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 6px; }
.graph-open-entity { width: 100%; height: 28px; margin: 7px 0 0; }
.json-panel { height: 100%; display: grid; grid-template-rows: 32px minmax(0,1fr); padding: 7px; }
.json-panel header { display: flex; align-items: center; justify-content: space-between; padding: 0 9px; border: 1px solid var(--line-soft); border-bottom: 0; background: #08182c; color: var(--soft); font-size: 9px; }
.json-panel pre { overflow: auto; padding: 11px; border: 1px solid var(--line-soft); background: #051225; color: #9cb7d5; font: 9px/1.55 var(--mono); white-space: pre-wrap; }
.evidence-grid { height: 100%; display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 7px; padding: 7px; overflow: auto; }
.evidence-card { padding: 10px; border: 1px solid var(--line-soft); background: #061326; }
.evidence-card h3 { margin-bottom: 9px; color: #7fb8f5; font-size: 9px; }
.evidence-card dl { display: grid; gap: 6px; }
.evidence-card dl div { display: grid; grid-template-columns: 1fr auto; gap: 7px; font-size: 8px; }
.evidence-empty { grid-column: 1 / -1; display: grid; place-items: center; color: var(--muted); }

.budget-panel { min-height: 0; overflow-y: auto; border-width: 0 0 0 1px; scrollbar-width: thin; scrollbar-color: var(--line) transparent; }
.budget-header { height: 39px; display: flex; align-items: center; justify-content: space-between; padding: 0 12px; border-bottom: 1px solid var(--line-soft); color: var(--soft); font-size: 10px; }
.budget-header span { color: var(--muted); font-size: 8px; font-weight: 400; }
.budget-controls { display: grid; gap: 2px; padding: 8px 10px; }
.budget-control { min-height: 52px; display: grid; grid-template-columns: 28px minmax(0,1fr) 126px; align-items: center; gap: 7px; padding: 4px 0; }
.budget-icon { width: 24px; height: 24px; display: grid; place-items: center; border-radius: 50%; background: linear-gradient(135deg, rgba(44,171,255,.22), rgba(140,92,255,.23)); color: #77c2ff; font-size: 12px; box-shadow: inset 0 0 0 1px rgba(91,127,229,.16); }
.budget-control > span:nth-child(2) { min-width: 0; display: grid; gap: 1px; }
.budget-control strong { color: #bac9db; font-size: 9px; font-weight: 550; }
.budget-control small { color: var(--muted); font-size: 7px; }
.number-unit { height: 34px; display: grid; grid-template-columns: minmax(0,1fr) 45px; overflow: hidden; border: 1px solid var(--line-soft); border-radius: 3px; background: #091a30; }
.number-unit input { min-width: 0; padding: 0 8px; border: 0; outline: 0; background: transparent; color: #a9b9cc; font-size: 10px; }
.number-unit b { display: grid; place-items: center; border-left: 1px solid var(--line-soft); color: var(--muted); font-size: 8px; font-weight: 400; }
.budget-profile-row { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 8px; padding: 8px 10px; border-top: 1px solid var(--line-soft); }
.budget-profile-row label { min-width: 0; display: grid; grid-template-columns: auto minmax(0,1fr); align-items: center; gap: 8px; color: var(--muted); font-size: 8px; }
.budget-profile-row select { min-width: 0; height: 30px; padding: 0 7px; border: 1px solid var(--line-soft); border-radius: 3px; background: #091a30; color: var(--soft); font-size: 8px; }
.profile-save-button { height: 30px; padding: 0 10px; border: 1px solid #4649a7; border-radius: 3px; background: linear-gradient(110deg, #25256d, #403ca1); color: #bfc5ff; font-size: 8px; }
.budget-note { display: flex; gap: 8px; margin: 4px 10px 10px; padding: 9px; border: 1px solid rgba(42,157,255,.13); background: rgba(30,97,163,.06); color: var(--muted); font-size: 8px; }

.operations-view { overflow: hidden; background: #051225; }
.operations-scroll { height: 100%; overflow-y: auto; padding: 10px 10px 14px; scrollbar-width: thin; scrollbar-color: var(--line) transparent; }
.operations-heading { min-height: 49px; display: flex; align-items: start; justify-content: space-between; padding: 0 3px 8px; }
.operations-heading h1 { display: flex; align-items: center; gap: 9px; color: #e5ecf5; font-size: 17px; font-weight: 550; }
.operations-heading p { margin-top: 2px; color: var(--muted); font-size: 9px; }
.health-pill { padding: 2px 6px; border: 1px solid rgba(85,217,141,.26); border-radius: 3px; background: rgba(85,217,141,.08); color: var(--green); font-size: 8px; font-weight: 500; }
.health-pill[data-state="error"] { border-color: rgba(255,100,122,.3); background: rgba(255,100,122,.08); color: var(--red); }
.health-pill[data-state="loading"] { color: var(--amber); }
.refresh-block { display: flex; align-items: center; gap: 8px; color: var(--muted); font-size: 8px; }
.health-card-grid { display: grid; grid-template-columns: repeat(8, minmax(0,1fr)); gap: 7px; }
.health-card-grid article, .metrics-grid article { min-width: 0; min-height: 91px; display: grid; align-content: start; gap: 5px; padding: 10px; border: 1px solid var(--line-soft); background: #08172b; }
.health-card-grid small, .metrics-grid small { overflow: hidden; color: var(--muted); font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }
.health-card-grid strong { overflow: hidden; color: var(--green); font-size: 13px; font-weight: 500; text-overflow: ellipsis; white-space: nowrap; }
.health-card-grid span { color: var(--muted); font-size: 8px; }
.operations-main-grid { display: grid; grid-template-columns: minmax(0,1.65fr) minmax(330px,1fr); gap: 7px; margin-top: 7px; }
.ops-panel { min-width: 0; }
.ops-panel > header { min-height: 42px; display: flex; align-items: center; justify-content: space-between; padding: 0 11px; border-bottom: 1px solid var(--line-soft); }
.ops-panel > header > div { display: grid; gap: 1px; }
.ops-panel > header strong { color: var(--soft); font-size: 9px; }
.ops-panel > header span { color: var(--muted); font-size: 8px; }
.status-label { color: var(--green) !important; }
.topology-regions { min-height: 270px; padding: 8px 11px; }
.ops-loading { min-height: 235px; display: grid; place-items: center; color: var(--muted); }
.region-group + .region-group { margin-top: 8px; padding-top: 8px; border-top: 1px solid var(--line-soft); }
.region-heading { display: flex; align-items: center; justify-content: space-between; margin-bottom: 6px; color: var(--soft); font-size: 8px; }
.region-heading span { color: var(--muted); }
.zone-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 5px; }
.zone-card { padding: 7px 8px; border: 1px solid var(--line-soft); background: #071529; }
.zone-card header { display: flex; justify-content: space-between; margin-bottom: 4px; color: #85b7e9; font-size: 8px; }
.zone-card header span { color: var(--muted); }
.worker-row { display: grid; grid-template-columns: minmax(0,1fr) auto auto; align-items: center; gap: 5px; padding: 4px 2px; border-top: 1px solid rgba(54,88,124,.13); color: var(--soft); font-size: 8px; }
.worker-role { padding: 1px 4px; border-radius: 2px; background: rgba(140,92,255,.12); color: #ac8bff; font-size: 6px; text-transform: capitalize; }
.worker-health { width: 7px; height: 7px; border-radius: 50%; background: var(--green); box-shadow: 0 0 5px rgba(85,217,141,.55); }
.worker-health.unhealthy { background: var(--red); box-shadow: 0 0 5px rgba(255,100,122,.55); }
.topology-panel > footer { min-height: 34px; display: flex; align-items: center; gap: 16px; padding: 0 11px; border-top: 1px solid var(--line-soft); color: var(--muted); font-size: 8px; }
.topology-panel > footer strong { margin-left: auto; color: #87b5e5; font-weight: 500; }
.legend-dot { width: 7px; height: 7px; display: inline-block; margin-right: 4px; border-radius: 50%; background: var(--blue); }.legend-dot.follower { background: var(--violet); }.legend-dot.healthy { background: var(--green); }
.actions-panel { min-height: 356px; }
.ops-action-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 16px; padding: 22px 19px; }
.ops-action-grid button { min-height: 56px; display: grid; grid-template-columns: 30px minmax(0,1fr); align-items: center; gap: 8px; padding: 8px 11px; border: 1px solid #3b4e82; border-radius: 3px; background: #08172b; color: #9b85f2; text-align: left; }
.ops-action-grid button:hover:not(:disabled) { border-color: #6867b6; background: #0b1b32; }
.ops-action-icon { color: #aa8dff; font-size: 18px; }
.ops-action-grid button span:last-child { display: grid; gap: 1px; }
.ops-action-grid strong { color: #baaaf4; font-size: 9px; font-weight: 500; }
.ops-action-grid small { color: var(--muted); font-size: 7px; }
.operations-detail-grid { display: grid; grid-template-columns: repeat(5, minmax(0,1fr)); gap: 7px; margin-top: 7px; }
.ops-detail-card { min-height: 193px; display: grid; grid-template-rows: 35px minmax(0,1fr) 27px; padding: 0 10px; }
.ops-detail-card > header { display: flex; align-items: center; border-bottom: 1px solid var(--line-soft); color: var(--soft); font-size: 8px; }
.ops-detail-card dl { align-content: start; font-size: 7px; }
.ops-detail-card > button { border-top: 1px solid var(--line-soft); color: #6c8fb7; }
.errors-card { text-align: center; }
#readiness-errors { display: grid; place-content: center; justify-items: center; gap: 2px; color: var(--muted); font-size: 7px; }
.success-check { width: 36px; height: 36px; display: grid; place-items: center; margin-bottom: 5px; border-radius: 50%; background: var(--green); color: #0a3b28; font-size: 22px; }
#readiness-errors strong { color: var(--soft); font-size: 8px; }
.operational-metrics { margin-top: 7px; }
.operational-metrics > header { min-height: 30px; }
.metrics-grid { display: grid; grid-template-columns: repeat(6, minmax(0,1fr)); gap: 7px; padding: 6px 10px 8px; }
.metrics-grid article { height: 58px; min-height: 58px; gap: 1px; padding: 6px 10px; }
.metrics-grid strong { color: #d4deeb; font-size: 17px; font-weight: 500; }
.metrics-grid span { color: var(--muted); font-size: 7px; }

.management-view { overflow: hidden; background: #051225; }
.management-view.active { display: block; }
.management-scroll { height: 100%; overflow-y: auto; padding: 10px 10px 16px; scrollbar-width: thin; scrollbar-color: var(--line) transparent; }
.management-heading { min-height: 56px; display: flex; align-items: start; justify-content: space-between; gap: 18px; padding: 1px 3px 10px; }
.management-heading h1 { display: flex; align-items: center; gap: 9px; color: #e5ecf5; font-size: 17px; font-weight: 550; }
.management-heading p { margin-top: 3px; color: var(--muted); font-size: 9px; }
.page-actions { display: flex; align-items: center; justify-content: flex-end; gap: 8px; color: var(--muted); font-size: 8px; white-space: nowrap; }
.page-actions strong { color: #7ebaff; font-family: var(--mono); font-weight: 500; }
.page-actions .secondary-button { min-height: 30px; }
.management-stat-grid { display: grid; grid-template-columns: repeat(6, minmax(0,1fr)); gap: 7px; }
.management-stat-grid article { min-width: 0; min-height: 86px; display: grid; align-content: start; gap: 5px; padding: 10px; border: 1px solid var(--line-soft); background: #08172b; }
.management-stat-grid small { overflow: hidden; color: var(--muted); font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }
.management-stat-grid strong { overflow: hidden; color: #d9e5f4; font-size: 18px; font-weight: 500; text-overflow: ellipsis; white-space: nowrap; }
.management-stat-grid span { color: var(--muted); font-size: 7px; }
.catalog-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 7px; margin-top: 7px; }
.catalog-detail-grid { display: grid; grid-template-columns: minmax(0,1.35fr) minmax(300px,.65fr); gap: 7px; margin-top: 7px; }
.management-panel { min-width: 0; overflow: hidden; border: 1px solid var(--line-soft); background: var(--panel); }
.management-panel > header { min-height: 41px; display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 0 11px; border-bottom: 1px solid var(--line-soft); }
.management-panel > header > div { min-width: 0; display: grid; gap: 1px; }
.management-panel > header strong { color: var(--soft); font-size: 9px; }
.management-panel > header span { overflow: hidden; color: var(--muted); font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }
.management-table-scroll { height: 245px; overflow: auto; scrollbar-width: thin; scrollbar-color: var(--line) transparent; }
.management-table th, .management-table td { height: 34px; padding: 7px 10px; font-size: 8px; }
.management-table .catalog-name { display: flex; align-items: center; gap: 7px; color: #c7d6e8; font-weight: 550; }
.management-table .catalog-status { color: var(--green); }
.management-table .row-action { min-height: 22px; padding: 0 7px; border: 1px solid #2c4d71; border-radius: 3px; background: #08192e; color: #7fb8f5; font-size: 7px; }
.management-table .row-action:hover { border-color: #5080b3; color: #d5e9ff; }
.management-loading { min-height: 100px; display: grid; place-items: center; color: var(--muted); font-size: 9px; }
.index-card-grid { min-height: 182px; display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 7px; padding: 9px; }
.index-card { min-width: 0; display: grid; align-content: start; gap: 6px; padding: 10px; border: 1px solid var(--line-soft); background: #071529; }
.index-card > span { width: 26px; height: 26px; display: grid; place-items: center; border-radius: 50%; background: rgba(42,157,255,.12); color: #70baff; }
.index-card strong { overflow: hidden; color: #c7d6e8; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.index-card p { min-height: 26px; color: var(--muted); font-size: 7px; }
.index-card b { color: var(--green); font-size: 7px; font-weight: 500; text-transform: uppercase; }
.catalog-history { height: 182px; overflow-y: auto; padding: 5px 10px; scrollbar-width: thin; scrollbar-color: var(--line) transparent; }
.history-row { display: grid; grid-template-columns: auto minmax(0,1fr) auto; align-items: center; gap: 8px; padding: 8px 2px; border-bottom: 1px solid var(--line-soft); }
.history-row > span:first-child { width: 22px; height: 22px; display: grid; place-items: center; border-radius: 50%; background: rgba(140,92,255,.12); color: #a987ff; font-size: 8px; }
.history-row div { min-width: 0; display: grid; gap: 1px; }
.history-row strong { overflow: hidden; color: var(--soft); font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }
.history-row small, .history-row time { color: var(--muted); font-size: 7px; }

.governance-context { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 7px; }
.governance-context article { min-width: 0; min-height: 72px; display: grid; grid-template-columns: 30px minmax(0,1fr) auto; align-items: center; gap: 8px; padding: 10px; border: 1px solid var(--line-soft); background: #08172b; }
.context-glyph { width: 28px; height: 28px; display: grid; place-items: center; border-radius: 50%; background: linear-gradient(135deg, rgba(42,157,255,.19), rgba(140,92,255,.19)); color: #82bfff; font: 10px var(--mono); }
.governance-context article div { min-width: 0; display: grid; gap: 2px; }
.governance-context small { color: var(--muted); font-size: 7px; text-transform: uppercase; }
.governance-context strong { overflow: hidden; color: #d2deec; font-size: 9px; font-weight: 500; text-overflow: ellipsis; white-space: nowrap; }
.governance-context b { color: var(--green); font-size: 7px; font-weight: 500; }
.governance-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 7px; margin-top: 7px; }
.governance-card { min-height: 270px; display: grid; grid-template-rows: 48px minmax(0,1fr) 45px; }
.governance-card dl { display: grid; align-content: start; gap: 9px; padding: 12px; }
.governance-card dl div { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 10px; padding-bottom: 7px; border-bottom: 1px solid var(--line-soft); font-size: 8px; }
.governance-card dt { color: var(--muted); }
.governance-card dd { color: #c6d7e9; }
.governance-card > footer { display: flex; align-items: center; justify-content: flex-end; padding: 0 11px; border-top: 1px solid var(--line-soft); }
.governance-card > footer .secondary-button { min-height: 29px; }
.governance-detail-grid { display: grid; grid-template-columns: minmax(0,1.2fr) minmax(340px,.8fr); gap: 7px; margin-top: 7px; }
.safety-steps { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; padding: 11px; }
.safety-steps article { min-width: 0; display: grid; grid-template-columns: 29px minmax(0,1fr); gap: 8px; padding: 10px; border: 1px solid var(--line-soft); background: #071529; }
.safety-steps article > span { width: 27px; height: 27px; display: grid; place-items: center; border: 1px solid #3c5f85; border-radius: 50%; color: #79b9fa; font-size: 9px; }
.safety-steps article div { min-width: 0; }
.safety-steps strong { color: var(--soft); font-size: 8px; }
.safety-steps p { margin-top: 4px; color: var(--muted); font-size: 7px; }
.safety-steps b { grid-column: 2; color: var(--green); font-size: 7px; font-weight: 500; text-transform: uppercase; }
.evidence-checks { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 7px; padding: 11px; }
.evidence-check { display: grid; grid-template-columns: 20px minmax(0,1fr); align-items: center; gap: 7px; padding: 8px; border: 1px solid var(--line-soft); background: #071529; }
.evidence-check > span { width: 18px; height: 18px; display: grid; place-items: center; border-radius: 50%; background: rgba(85,217,141,.12); color: var(--green); font-size: 8px; }
.evidence-check strong { color: var(--soft); font-size: 8px; font-weight: 500; }
.evidence-check small { display: block; color: var(--muted); font-size: 7px; }
.notification-list { max-height: 370px; display: grid; gap: 7px; overflow-y: auto; }
.notification-item { display: grid; grid-template-columns: 28px minmax(0,1fr) auto; align-items: start; gap: 9px; padding: 10px; border: 1px solid var(--line-soft); background: #061326; }
.notification-item > span { width: 26px; height: 26px; display: grid; place-items: center; border-radius: 50%; background: rgba(85,217,141,.12); color: var(--green); }
.notification-item[data-state="attention"] > span { background: rgba(244,189,79,.12); color: var(--amber); }
.notification-item div { min-width: 0; }
.notification-item strong { color: var(--soft); font-size: 9px; }
.notification-item p { margin-top: 2px; color: var(--muted); font-size: 8px; }
.notification-item time { color: var(--muted); font-size: 7px; white-space: nowrap; }

.ops-toolbar { display: grid; grid-template-columns: repeat(4,minmax(110px,1fr)) auto; align-items: end; gap: 8px; margin-bottom: 7px; padding: 10px; border: 1px solid var(--line-soft); background: #07172b; }
.ops-toolbar label { min-width: 0; display: grid; gap: 4px; color: var(--muted); font-size: 7px; text-transform: uppercase; }
.ops-toolbar input, .ops-toolbar select { width: 100%; min-width: 0; height: 34px; padding: 0 9px; border: 1px solid #29435f; border-radius: 3px; outline: 0; background: #061225; color: #cbd8e8; font-size: 9px; text-transform: none; }
.ops-toolbar .ops-search.wide { grid-column: span 2; }
.ops-toolbar button { min-height: 34px; white-space: nowrap; }
.graph-toolbar-controls { grid-template-columns: 1.2fr repeat(5,minmax(86px,.7fr)) auto; }
.entity-toolbar { grid-template-columns: minmax(260px,2fr) repeat(2,minmax(120px,1fr)) auto; }
.path-toolbar { grid-template-columns: repeat(5,minmax(110px,1fr)) auto; }
.metrics-toolbar { grid-template-columns: minmax(320px,2fr) minmax(160px,1fr) auto; }
.tall-table { height: 360px; }
.management-panel > footer { min-height: 45px; display: flex; align-items: center; justify-content: flex-end; padding: 0 11px; border-top: 1px solid var(--line-soft); }
.detail-content { min-height: 0; padding: 11px; overflow: auto; color: var(--soft); }
.detail-content dl, .management-panel > dl { display: grid; gap: 8px; }
.detail-content dl div, .management-panel > dl div { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 9px; padding-bottom: 7px; border-bottom: 1px solid var(--line-soft); font-size: 8px; }
.detail-content p { color: var(--muted); font-size: 8px; line-height: 1.55; }
.empty-panel { min-height: 110px; display: grid; place-content: center; justify-items: center; gap: 5px; padding: 20px; color: var(--muted); text-align: center; }
.empty-panel strong { color: var(--soft); font-size: 10px; font-weight: 500; }
.empty-panel p { max-width: 320px; font-size: 8px; }
.status-chip { padding: 2px 5px; border: 1px solid rgba(85,217,141,.25); border-radius: 2px; background: rgba(85,217,141,.07); color: var(--green); font-size: 7px; text-transform: uppercase; }
.status-chip.warn { border-color: rgba(244,189,79,.28); background: rgba(244,189,79,.07); color: var(--amber); }
.status-chip.error { border-color: rgba(255,100,122,.3); background: rgba(255,100,122,.07); color: var(--red); }

.discover-grid { display: grid; grid-template-columns: 220px minmax(480px,1fr) 260px; gap: 7px; margin-top: 7px; }
.facet-panel, .detail-panel { min-height: 402px; }
.facet-list { height: 360px; overflow-y: auto; padding: 8px 10px; }
.facet-item { display: grid; gap: 5px; padding: 9px 2px; border-bottom: 1px solid var(--line-soft); }
.facet-item header, .facet-item > div { display: flex; justify-content: space-between; gap: 8px; color: var(--soft); font-size: 8px; }
.facet-item > div span { color: var(--blue); font-size: 7px; text-transform: uppercase; }
.facet-item p { color: var(--muted); font-size: 7px; }
.facet-buckets { display: flex; flex-wrap: wrap; gap: 4px; }
.facet-buckets span { padding: 2px 5px; border-radius: 2px; background: rgba(42,157,255,.08); color: #78b8fa; font-size: 7px; }
.catalog-browse-panel { margin-top: 7px; }
.catalog-browser { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 7px; padding: 9px; }
.catalog-collection { min-width: 0; display: flex; flex-wrap: wrap; align-content: start; gap: 6px; padding: 9px; border: 1px solid var(--line-soft); background: #071529; text-align: left; }
.catalog-collection h3 { flex-basis: 100%; margin-bottom: 3px; color: var(--muted); font-size: 7px; font-weight: 500; text-transform: uppercase; }
.catalog-collection button { min-width: 105px; display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 7px 8px; border: 1px solid #223b57; border-radius: 2px; background: #08192e; }
.catalog-collection button:hover { border-color: #3b69a0; background: #0a203a; }
.catalog-collection strong { display: block; color: var(--soft); font-size: 8px; }
.catalog-collection span, .catalog-collection p { color: var(--muted); font-size: 7px; }

.explorer-workspace-grid { display: grid; grid-template-columns: 230px minmax(500px,1fr) 260px; gap: 7px; margin-bottom: 7px; }
.explorer-evidence-panel, .graph-workspace-panel, .explorer-workspace-grid > .detail-panel { height: 470px; }
.explorer-evidence-panel > dl { padding: 11px; overflow: auto; }
.network-workspace { position: relative; min-height: 300px; display: grid; grid-template-columns: repeat(5,minmax(72px,1fr)); grid-auto-rows: 112px; place-items: center; align-content: center; gap: 8px; overflow: auto; padding: 18px; background: radial-gradient(circle at 50% 50%,rgba(80,61,188,.14),transparent 42%), linear-gradient(rgba(38,65,96,.08) 1px,transparent 1px), linear-gradient(90deg,rgba(38,65,96,.08) 1px,transparent 1px), #061326; background-size: auto,32px 32px,32px 32px,auto; }
.graph-workspace-panel .network-workspace { height: 383px; }
.network-node-card { position: relative; z-index: 2; width: 74px; height: 74px; display: grid; place-content: center; justify-items: center; gap: 2px; border: 1px solid #2a89de; border-radius: 50%; background: radial-gradient(circle,#0d345a,#07172b 68%); box-shadow: 0 0 20px rgba(42,157,255,.14); color: #d6ebff; text-align: center; }
.network-node-card:hover, .network-node-card.selected { border-color: #76c8ff; box-shadow: 0 0 24px rgba(42,157,255,.3); }
.network-node-card.violet { border-color: var(--violet); background: radial-gradient(circle,#2a1761,#0a1730 68%); }
.network-node-card.green { border-color: var(--green); background: radial-gradient(circle,#103e32,#071c25 68%); }
.network-node-card.amber { border-color: var(--amber); background: radial-gradient(circle,#453317,#171a20 68%); }
.network-node-card strong { max-width: 62px; overflow: hidden; font-size: 8px; text-overflow: ellipsis; white-space: nowrap; }
.network-node-card small { color: var(--muted); font-size: 6px; }
.network-node-card:nth-child(3n+2) { transform: translateY(-24px); }
.network-node-card:nth-child(3n) { transform: translateY(24px); }
.network-legend { min-height: 43px; display: flex; align-items: center; gap: 15px; padding: 0 11px; border-top: 1px solid var(--line-soft); color: var(--muted); font-size: 7px; }
.node-tone { width: 7px; height: 7px; display: inline-block; margin-right: 4px; border-radius: 50%; background: var(--blue); }.node-tone.violet { background: var(--violet); }.node-tone.green { background: var(--green); }
.compact-network { min-height: 330px; height: 330px; grid-template-columns: repeat(4,minmax(72px,1fr)); }

.entity-network-panel { display: grid; grid-template-rows: 41px 39px minmax(0,1fr) 31px; }
.entity-ego-toolbar { display: grid; grid-template-columns: minmax(90px,.8fr) minmax(120px,1.2fr) auto; align-items: end; gap: 5px; padding: 5px 7px 4px; border-bottom: 1px solid var(--line-soft); background: #071529; }
.entity-ego-toolbar label { min-width: 0; display: grid; gap: 2px; color: var(--muted); font-size: 6px; text-transform: uppercase; }
.entity-ego-toolbar select { min-width: 0; height: 25px; padding: 0 6px; border: 1px solid #223c59; border-radius: 2px; outline: 0; background: #061326; color: var(--soft); font-size: 7px; }
.entity-ego-toolbar select:focus { border-color: var(--blue); }
.entity-ego-toolbar button { height: 25px; white-space: nowrap; }
.entity-ego-canvas { position: relative; min-height: 0; overflow: hidden; background: radial-gradient(circle at 50% 50%,rgba(57,54,171,.18),transparent 31%), linear-gradient(rgba(38,65,96,.08) 1px,transparent 1px), linear-gradient(90deg,rgba(38,65,96,.08) 1px,transparent 1px), #061326; background-size: auto,32px 32px,32px 32px,auto; }
.entity-ego-ring { position: absolute; z-index: 0; left: 50%; top: 50%; width: 84%; height: 78%; border: 1px dashed rgba(92,120,153,.23); border-radius: 50%; transform: translate(-50%,-50%); pointer-events: none; }
.entity-ego-ring span { position: absolute; left: 50%; top: -7px; padding: 1px 5px; border: 1px solid rgba(70,95,125,.38); border-radius: 8px; background: #07162a; color: #6f89a5; font: 6px var(--mono); white-space: nowrap; transform: translateX(-50%); }
.entity-ego-badge { position: absolute; z-index: 7; left: 7px; top: 7px; display: flex; align-items: center; gap: 4px; padding: 3px 6px; border: 1px solid rgba(75,111,151,.42); border-radius: 9px; background: rgba(5,17,33,.9); color: #8fa9c3; font: 6px var(--mono); }
.entity-ego-badge i { width: 5px; height: 5px; border-radius: 50%; background: var(--green); }
.entity-ego-edge { position: absolute; z-index: 1; left: var(--entity-edge-x); top: var(--entity-edge-y); width: var(--entity-edge-width); height: var(--entity-edge-thickness,1px); border-radius: 2px; background: linear-gradient(90deg,color-mix(in srgb,var(--entity-edge-color) 28%,transparent),var(--entity-edge-color),color-mix(in srgb,var(--entity-edge-color) 30%,transparent)); opacity: .72; transform: rotate(var(--entity-edge-angle)); transform-origin: left center; transition: opacity .15s ease,filter .15s ease; }
.entity-ego-edge::after { content: ""; position: absolute; right: -1px; top: calc((var(--entity-edge-thickness,1px) - 7px)/2); border-top: 3.5px solid transparent; border-bottom: 3.5px solid transparent; border-left: 6px solid var(--entity-edge-color); }
.entity-ego-edge.is-focused { z-index: 2; opacity: 1; filter: brightness(1.4); box-shadow: 0 0 8px color-mix(in srgb,var(--entity-edge-color) 48%,transparent); }
.entity-ego-edge.is-muted { opacity: .08; filter: saturate(.25); }
.entity-ego-edge-label { position: absolute; z-index: 3; left: var(--entity-label-x); top: var(--entity-label-y); max-width: 92px; overflow: hidden; padding: 2px 4px; border: 1px solid rgba(68,96,128,.38); border-radius: 2px; background: rgba(6,19,38,.94); color: #88a3be; font: 6px var(--mono); opacity: 0; pointer-events: none; text-overflow: ellipsis; white-space: nowrap; transform: translate(-50%,-50%); transition: opacity .12s ease; }
.entity-ego-edge:hover + .entity-ego-edge-label,.entity-ego-edge-label.is-focused { opacity: 1; }
.entity-ego-node { position: absolute; z-index: 4; left: var(--entity-node-x); top: var(--entity-node-y); width: var(--entity-node-size,42px); height: var(--entity-node-size,42px); display: grid; place-items: center; align-content: center; gap: 1px; padding: 3px; border: 1px solid var(--node-accent); border-radius: 50%; outline: 0; background: radial-gradient(circle,var(--node-fill),#07172b 70%); box-shadow: 0 0 16px color-mix(in srgb,var(--node-accent) 18%,transparent); color: #d7e6f5; cursor: pointer; text-align: center; transform: translate(-50%,-50%); transition: opacity .15s ease,filter .15s ease,box-shadow .15s ease; }
.entity-ego-node.graph-shape-order { border-radius: 12px; }
.entity-ego-node.graph-shape-product { border-radius: 8px; transform: translate(-50%,-50%) rotate(45deg); }
.entity-ego-node.graph-shape-product > * { transform: rotate(-45deg); }
.entity-ego-node.graph-shape-account { border-radius: 50% 50% 16% 16%; }
.entity-ego-node.graph-shape-device { border-radius: 11px 11px 20px 20px; }
.entity-ego-node.is-center { z-index: 6; border-width: 2px; box-shadow: 0 0 0 6px color-mix(in srgb,var(--node-accent) 10%,transparent),0 0 30px color-mix(in srgb,var(--node-accent) 42%,transparent); }
.entity-ego-node:hover,.entity-ego-node:focus-visible,.entity-ego-node.is-focused { z-index: 8; border-color: #e3f3ff; box-shadow: 0 0 0 4px rgba(223,240,255,.08),0 0 25px color-mix(in srgb,var(--node-accent) 48%,transparent); }
.entity-ego-node.is-muted { opacity: .17; filter: saturate(.3); }
.entity-ego-node > span { color: var(--node-accent); font-size: 9px; line-height: 1; }
.entity-ego-node strong { max-width: calc(var(--entity-node-size,42px) - 7px); overflow: hidden; font-size: 6px; text-overflow: ellipsis; white-space: nowrap; }
.entity-ego-node small { max-width: calc(var(--entity-node-size,42px) - 7px); overflow: hidden; color: #8ba5c0; font: 5px var(--mono); text-overflow: ellipsis; white-space: nowrap; }
.entity-ego-selection { position: absolute; z-index: 10; right: 7px; bottom: 7px; width: min(155px,46%); display: grid; gap: 3px; padding: 7px; border: 1px solid rgba(74,112,153,.58); border-radius: 3px; background: rgba(6,19,38,.96); box-shadow: 0 10px 26px rgba(0,0,0,.38); }
.entity-ego-selection strong { color: var(--soft); font-size: 8px; }
.entity-ego-selection span { color: var(--muted); font-size: 6px; line-height: 1.4; }
.entity-ego-selection button { min-height: 23px; margin-top: 2px; padding: 0 7px; font-size: 7px; }
.entity-ego-legend { min-width: 0; display: flex; align-items: center; gap: 10px; overflow-x: auto; padding: 0 8px; border-top: 1px solid var(--line-soft); color: var(--muted); font-size: 6px; scrollbar-width: none; }
.entity-ego-legend button { display: inline-flex; align-items: center; gap: 4px; border: 0; background: transparent; color: #91a7bf; font-size: 6px; white-space: nowrap; }
.entity-ego-legend button:hover,.entity-ego-legend button[aria-pressed="true"] { color: #e1edf8; }
.entity-ego-legend i { width: 6px; height: 6px; border-radius: 1px; background: var(--legend-color); }
.entity-ego-direction-key { padding-right: 9px; border-right: 1px solid var(--line-soft); color: #718ca8; font-family: var(--mono); white-space: pre; }
.entity-neighbor-row-focused td { background: rgba(45,113,187,.15); color: #e1edf8; }

.entity-profile-hero { min-height: 94px; display: grid; grid-template-columns: auto minmax(0,1fr) repeat(4,minmax(110px,.4fr)); align-items: center; gap: 14px; margin-bottom: 7px; padding: 12px 15px; }
.entity-avatar { width: 50px; height: 50px; display: grid; place-items: center; border-radius: 50%; background: linear-gradient(135deg,#173b6b,#32246e); color: #99caff; font-size: 16px; }
.entity-identity { min-width: 0; }
.entity-identity h2 { color: #e4edf8; font-size: 15px; font-weight: 500; }
.entity-identity p { margin-top: 3px; color: var(--muted); font-size: 8px; }
.entity-hero-metrics { display: contents; }
.entity-hero-metrics > span { min-width: 0; display: grid; gap: 3px; padding-left: 12px; border-left: 1px solid var(--line-soft); }
.entity-hero-metrics small { color: var(--muted); font-size: 7px; text-transform: uppercase; }
.entity-hero-metrics strong { overflow: hidden; color: var(--soft); font-size: 9px; font-weight: 500; text-overflow: ellipsis; white-space: nowrap; }
.entity-hero-metric { display: grid; gap: 3px; padding-left: 12px; border-left: 1px solid var(--line-soft); }
.entity-hero-metric small { color: var(--muted); font-size: 7px; text-transform: uppercase; }.entity-hero-metric strong { color: var(--soft); font-size: 10px; font-weight: 500; }
.entity-detail-grid { display: grid; grid-template-columns: minmax(330px,.85fr) minmax(500px,1.35fr) 260px; gap: 7px; margin-top: 7px; }
.entity-detail-grid > * { height: 410px; }

.path-result-grid { display: grid; grid-template-columns: minmax(0,1.5fr) minmax(280px,.5fr); gap: 7px; margin: 7px 0; }
.path-visual-panel, .path-result-grid > .detail-panel { min-height: 275px; }
.path-chain { min-height: 230px; display: flex; align-items: center; justify-content: center; gap: 7px; overflow-x: auto; padding: 18px; background: radial-gradient(circle at 50% 50%,rgba(80,61,188,.12),transparent 45%),#061326; }
.path-node { min-width: 76px; height: 76px; display: grid; place-content: center; justify-items: center; gap: 2px; border: 1px solid #2a89de; border-radius: 50%; background: #09213d; color: #d7e8f7; }
.path-node strong { font-size: 8px; }.path-node small { color: var(--muted); font-size: 6px; }
.path-edge-arrow { min-width: 70px; display: grid; justify-items: center; gap: 3px; color: #5e91c8; font-size: 16px; }
.path-edge-arrow small { color: var(--muted); font-size: 6px; }

.pipelines-grid { display: grid; grid-template-columns: minmax(0,1.5fr) minmax(280px,.5fr); gap: 7px; margin: 7px 0; }
.pipeline-list-panel, .pipelines-grid > .detail-panel { min-height: 400px; }

.cluster-page-grid { display: grid; grid-template-columns: minmax(0,1.5fr) minmax(300px,.5fr); gap: 7px; margin: 7px 0; }
.cluster-topology-panel, .cluster-page-grid > .detail-panel { min-height: 330px; }
.cluster-map { min-height: 287px; display: grid; align-content: start; gap: 8px; padding: 10px; }
.cluster-region { display: grid; gap: 6px; }
.cluster-region > header { display: flex; justify-content: space-between; color: var(--soft); font-size: 8px; }
.cluster-worker-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 6px; }
.cluster-worker-card { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 3px; padding: 9px; border: 1px solid var(--line-soft); background: #071529; }
.cluster-worker-card strong { color: var(--soft); font-size: 8px; }.cluster-worker-card span { color: var(--muted); font-size: 7px; }.cluster-worker-card b { grid-row: span 2; align-self: center; width: 8px; height: 8px; border-radius: 50%; background: var(--green); }
.cluster-detail-grid, .storage-detail-grid, .admin-detail-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 7px; }
.cluster-detail-grid > *, .storage-detail-grid > *, .admin-detail-grid > * { min-height: 230px; }

.storage-grid { display: grid; grid-template-columns: minmax(0,1.45fr) minmax(300px,.55fr); gap: 7px; margin: 7px 0; }
.durability-panel, .storage-grid > .detail-panel { min-height: 230px; }
.durability-flow { min-height: 185px; display: flex; align-items: center; justify-content: center; gap: 14px; padding: 15px; }
.durability-flow article { min-width: 150px; display: grid; justify-items: center; gap: 5px; padding: 14px; border: 1px solid var(--line-soft); background: #071529; text-align: center; }
.durability-flow article span { width: 26px; height: 26px; display: grid; place-items: center; border-radius: 50%; background: rgba(42,157,255,.12); color: #75bcff; }
.durability-flow article strong { color: var(--soft); font-size: 9px; }.durability-flow article p { color: var(--muted); font-size: 7px; }
.durability-flow > i { color: #406387; font-style: normal; }

.metrics-page-grid { display: grid; grid-template-columns: minmax(0,1.5fr) minmax(300px,.5fr); gap: 7px; margin: 7px 0; }
.metric-catalog-panel, .metrics-page-grid > .detail-panel { min-height: 420px; }
.raw-metrics-panel { margin-top: 7px; }
.ops-code { max-height: 280px; overflow: auto; padding: 12px; background: #04101f; color: #8fabc8; font: 8px/1.55 var(--mono); white-space: pre-wrap; }

.admin-page-grid { display: grid; grid-template-columns: minmax(0,1.35fr) minmax(300px,.65fr); gap: 7px; margin: 7px 0; }
.admin-actions-panel, .admin-guardrail-panel { min-height: 300px; }
.admin-action-cards { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; padding: 12px; }
.admin-action-cards button { min-height: 96px; display: grid; grid-template-columns: 36px minmax(0,1fr); align-content: center; align-items: center; gap: 3px 9px; padding: 10px; border: 1px solid #3b4e82; border-radius: 3px; background: #08172b; text-align: left; }
.admin-action-cards button:hover { border-color: #6867b6; background: #0b1b32; }
.admin-action-cards button > span { grid-row: span 2; color: #a88fff; font-size: 22px; text-align: center; }
.admin-action-cards strong { color: #c8bafb; font-size: 9px; font-weight: 500; }.admin-action-cards small { color: var(--muted); font-size: 7px; }
.admin-tool-links { min-height: 185px; display: grid; align-content: center; gap: 8px; padding: 14px; }

.modal-backdrop { position: fixed; z-index: 100; inset: 0; display: grid; place-items: center; padding: 20px; background: rgba(1,6,14,.76); backdrop-filter: blur(5px); }
.modal-card { width: min(480px, 100%); overflow: hidden; border: 1px solid #38516e; border-radius: 7px; background: #07172b; box-shadow: 0 26px 80px rgba(0,0,0,.64); }
.modal-card > header { min-height: 65px; display: flex; align-items: center; justify-content: space-between; padding: 10px 12px; border-bottom: 1px solid var(--line-soft); }
.modal-card > header > div { display: flex; align-items: center; gap: 9px; }
.modal-icon { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 50%; background: rgba(63,139,239,.12); color: #78b9ff; font-size: 16px; }
.shield-icon { color: var(--green); }
.modal-card h2 { color: var(--text); font-size: 14px; font-weight: 500; text-transform: capitalize; }
.modal-card header p { margin-top: 2px; color: var(--muted); font-size: 8px; }
.modal-body { padding: 14px; }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 11px; }
.form-grid label, .confirm-field, .admin-field { display: grid; gap: 4px; color: var(--soft); font-size: 8px; }
.form-grid label:first-child, .full-field { grid-column: 1 / -1; }
.form-grid input, .confirm-field input, .admin-field input { height: 34px; padding: 0 9px; border: 1px solid #29435f; border-radius: 3px; outline: 0; background: #061225; color: var(--text); }
.modal-card > footer { min-height: 54px; display: flex; align-items: center; justify-content: flex-end; gap: 8px; padding: 0 14px; border-top: 1px solid var(--line-soft); }
.commit-summary { display: grid; grid-template-columns: repeat(3, 1fr); gap: 7px; }
.commit-stat { display: grid; gap: 3px; padding: 9px; border: 1px solid var(--line-soft); background: #061326; }
.commit-stat strong { color: var(--green); font-size: 14px; }.commit-stat span { color: var(--muted); font-size: 7px; }
.commit-context { padding: 10px; border: 1px solid var(--line-soft); font-size: 8px; }
.confirm-field { margin-top: 12px; }
.confirm-field input { font-family: var(--mono); }
.irreversible-note { padding: 9px; border-top: 1px solid var(--line-soft); color: var(--muted); font-size: 8px; text-align: center; }
.shortcut-list { display: grid; gap: 8px; }
.shortcut-list div { display: grid; grid-template-columns: 1fr auto; gap: 20px; padding-bottom: 8px; border-bottom: 1px solid var(--line-soft); }
.shortcut-list dd { color: #9cb7d5; font-family: var(--mono); }
#admin-action-fields { display: grid; gap: 10px; color: var(--soft); }

.toast-region { position: fixed; z-index: 150; right: 16px; bottom: 16px; width: min(330px, calc(100vw - 32px)); display: grid; gap: 7px; pointer-events: none; }
.toast { display: grid; grid-template-columns: auto 1fr; gap: 9px; padding: 10px 12px; border: 1px solid #355278; border-radius: 4px; background: #0a1b31; box-shadow: 0 12px 34px rgba(0,0,0,.45); color: var(--soft); animation: toast-in .18s ease-out; }
.toast strong { color: var(--text); font-size: 9px; }.toast p { margin-top: 2px; color: var(--muted); font-size: 8px; }
.toast[data-state="error"] { border-color: rgba(255,100,122,.5); }.toast[data-state="success"] { border-color: rgba(85,217,141,.45); }

@keyframes pulse { 50% { opacity: .35; } }
@keyframes toast-in { from { opacity: 0; transform: translateY(8px); } }

@media (max-height: 760px) and (min-width: 901px) {
  .query-workspace.has-results { grid-template-rows: 165px 76px 44px minmax(330px,1fr); }
  .query-workspace.has-results .query-actions { padding-block: 4px; }
  .query-workspace.has-results .action-button { height: 34px; }
}

@media (max-width: 1180px) {
  .app-shell { grid-template-columns: 58px minmax(0,1fr); }
  .topbar { grid-template-columns: 150px minmax(0,1fr) auto; }
  .primary-nav { overflow: hidden; }
  .product-switcher button { grid-template-columns: 28px; padding: 0 15px; }
  .product-switcher button span:not(.nav-glyph), .primary-nav nav .nav-item span:last-child, .nav-footer, .nav-group-label { display: none; }
  .nav-item { justify-content: center; padding: 0; }
  .query-view.active { grid-template-columns: 190px minmax(430px,1fr) 270px; }
  .topbar-context { grid-template-columns: repeat(4,minmax(115px,1fr)) 105px; }
  .ego-network-toolbar { grid-template-columns: minmax(150px,1.2fr) repeat(3,minmax(78px,.6fr)); }
  .ego-network-toolbar .ego-toggle, .ego-network-toolbar > button { display: none; }
  .action-status { display: none; }
  .query-actions { grid-template-columns: repeat(5,1fr); }
  .health-card-grid { grid-template-columns: repeat(4,1fr); }
  .management-stat-grid { grid-template-columns: repeat(3,1fr); }
  .discover-grid, .explorer-workspace-grid { grid-template-columns: 210px minmax(430px,1fr); }
  .entity-detail-grid { grid-template-columns: minmax(300px,.8fr) minmax(430px,1.2fr); }
  .discover-grid > .detail-panel, .explorer-workspace-grid > .detail-panel, .entity-detail-grid > .detail-panel { grid-column: 1 / -1; height: auto; min-height: 180px; }
}

@media (max-width: 900px) {
  body { overflow: auto; }
  .app-shell { height: auto; min-height: 100vh; grid-template: auto 1fr / 1fr; }
  .topbar { position: sticky; top: 0; grid-column: 1; grid-template-columns: 1fr auto; min-height: 58px; }
  .topbar-context { grid-column: 1 / -1; order: 3; display: flex; overflow-x: auto; padding-bottom: 7px; }
  .context-select, .context-button, .revision-chip { min-width: 145px; }
  .primary-nav { position: sticky; z-index: 15; top: 102px; flex-direction: row; border-right: 0; border-bottom: 1px solid var(--line-soft); }
  .product-switcher, .nav-footer { display: none; }
  .primary-nav nav { width: 100%; display: flex; padding: 0; overflow-x: auto; }
  .nav-item { min-width: 55px; flex: 1; }
  .app-main { min-height: 900px; }
  .query-view.active { height: auto; grid-template-columns: 1fr; }
  .schema-panel { display: none; }
  .budget-panel { order: 1; display: block; overflow: visible; border-width: 0 0 1px; }
  .budget-controls { grid-template-columns: 1fr 1fr; }
  .query-workspace { order: 2; height: 920px; }
  .ego-network-toolbar { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .ego-network-toolbar label:first-child { grid-column: span 2; }
  .ego-network-toolbar .ego-toggle, .ego-network-toolbar > button { display: flex; }
  .operations-view { height: auto; }
  .management-view { height: auto; }
  .operations-scroll { overflow: visible; }
  .management-scroll { overflow: visible; }
  .operations-main-grid { grid-template-columns: 1fr; }
  .operations-detail-grid { grid-template-columns: repeat(2,1fr); }
  .metrics-grid { grid-template-columns: repeat(3,1fr); }
  .catalog-grid, .catalog-detail-grid, .governance-detail-grid { grid-template-columns: 1fr; }
  .governance-context { grid-template-columns: repeat(3,1fr); }
  .ops-toolbar, .graph-toolbar-controls, .entity-toolbar, .path-toolbar, .metrics-toolbar { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .ops-toolbar .ops-search.wide { grid-column: span 2; }
  .discover-grid, .explorer-workspace-grid, .entity-detail-grid, .path-result-grid, .pipelines-grid, .cluster-page-grid, .storage-grid, .metrics-page-grid, .admin-page-grid { grid-template-columns: 1fr; }
  .discover-grid > .detail-panel, .explorer-workspace-grid > .detail-panel, .entity-detail-grid > .detail-panel { grid-column: auto; }
  .cluster-detail-grid, .storage-detail-grid, .admin-detail-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .entity-profile-hero { grid-template-columns: auto minmax(0,1fr); }
  .entity-hero-metrics { display: grid; grid-column: 1 / -1; grid-template-columns: repeat(3,minmax(0,1fr)); }
  .durability-flow { flex-wrap: wrap; }
}

@media (max-width: 600px) {
  .topbar { padding: 7px 10px; }
  .topbar-actions .notification-button { display: none; }
  .primary-nav { top: 103px; }
  .budget-controls { grid-template-columns: 1fr; }
  .budget-control { grid-template-columns: 28px minmax(0,1fr) 118px; }
  .query-actions { grid-template-columns: repeat(2,1fr); height: auto; }
  .query-workspace, .query-workspace.has-results { height: 1080px; grid-template-rows: 320px 170px auto 460px; }
  .ego-network-toolbar { grid-template-columns: 1fr 1fr; }
  .ego-network-toolbar label:first-child { grid-column: 1 / -1; }
  .ego-network-toolbar > button { display: none; }
  .action-button { min-width: 0; }
  .result-content-grid, .graph-result-layout { grid-template-columns: 1fr; }
  .result-evidence { display: none; }
  .health-card-grid, .operations-detail-grid, .metrics-grid { grid-template-columns: 1fr 1fr; }
  .management-heading { display: grid; }
  .page-actions { justify-content: start; flex-wrap: wrap; }
  .management-stat-grid, .governance-context, .governance-grid { grid-template-columns: 1fr 1fr; }
  .index-card-grid, .safety-steps { grid-template-columns: 1fr; }
  .zone-grid { grid-template-columns: 1fr; }
  .ops-action-grid { grid-template-columns: 1fr; }
  .form-grid { grid-template-columns: 1fr; }
  .form-grid label { grid-column: 1; }
  .ops-toolbar, .graph-toolbar-controls, .entity-toolbar, .path-toolbar, .metrics-toolbar { grid-template-columns: 1fr; }
  .ops-toolbar .ops-search.wide { grid-column: auto; }
  .catalog-browser, .cluster-detail-grid, .storage-detail-grid, .admin-detail-grid { grid-template-columns: 1fr; }
  .network-workspace, .compact-network { grid-template-columns: repeat(3,minmax(70px,1fr)); }
  .entity-ego-toolbar { grid-template-columns: 1fr 1fr; }
  .entity-ego-toolbar button { grid-column: 1 / -1; }
  .admin-action-cards { grid-template-columns: 1fr; }
  .durability-flow > i { transform: rotate(90deg); }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}