/* PhantomForce 2040 Command OS
   This is the final shell layer. Existing workspace styles remain the source
   of truth; this sheet turns their navigation and dashboard into one spatial
   operating surface without replacing routes or data. */

html[data-command-os="2040"] {
  color-scheme: dark;
  background: #03070c;
}

html[data-command-os="2040"] body {
  background: #03070c !important;
  color: #eef4f7;
}

html[data-command-os="2040"] body::before,
html[data-command-os="2040"] .bg-grid,
html[data-command-os="2040"] .bg-glow {
  display: none !important;
}

.phantom.command-os-enabled {
  --neon: #7c6cff;
  --neon-2: #4f8dff;
  --risk: #ff5f72;
  --warn: #e8b85a;
  --ink: #eef4f7;
  --dim: #8f9ca8;
  --dim-2: #64717d;
  --bg: #03070c;
  --glass: rgba(9, 16, 24, 0.92);
  --glass-2: rgba(13, 21, 31, 0.88);
  --line: rgba(156, 184, 204, 0.14);
  --line-strong: rgba(111, 157, 194, 0.34);
  position: relative;
  display: block;
  min-height: 100dvh;
  padding-bottom: 36px;
  overflow: hidden;
  background: #03070c;
  color: var(--ink);
}

.command-os-enabled button,
.command-os-enabled input,
.command-os-enabled select,
.command-os-enabled textarea {
  font-family: "Instrument Sans", system-ui, sans-serif;
}

.command-os-enabled :focus-visible {
  outline: 1px solid #74a9ff;
  outline-offset: 3px;
}

html[data-command-os="2040"] .cmdk-open {
  border-color: rgba(133, 171, 198, 0.2);
  border-radius: 7px;
  background:
    radial-gradient(circle at 14% 8%, rgba(124, 108, 255, 0.08), transparent 36%),
    linear-gradient(180deg, rgba(12, 20, 30, 0.96), rgba(4, 9, 15, 0.94));
  color: #aebbc5;
  box-shadow: inset 0 1px rgba(255, 255, 255, 0.035), 0 12px 34px rgba(0, 0, 0, 0.22);
}

html[data-command-os="2040"] .cmdk-open:hover {
  border-color: rgba(124, 108, 255, 0.42);
  background:
    radial-gradient(circle at 14% 8%, rgba(124, 108, 255, 0.13), transparent 38%),
    linear-gradient(180deg, rgba(14, 25, 36, 0.98), rgba(5, 11, 18, 0.96));
  color: #edf6f1;
}

html[data-command-os="2040"] .cmdk-open-label {
  color: inherit;
  font-weight: 600;
}

html[data-command-os="2040"] .cmdk-open-kbd {
  border-color: rgba(133, 171, 198, 0.2);
  background: rgba(255, 255, 255, 0.035);
  color: #8fa0ad;
}

html[data-command-os="2040"] .workspace-page input,
html[data-command-os="2040"] .workspace-page textarea,
html[data-command-os="2040"] .workspace-page select {
  background-color: rgba(5, 9, 16, 0.92);
}

html[data-command-os="2040"] .workspace-page input:not([type="checkbox"]):not([type="radio"]),
html[data-command-os="2040"] .workspace-page textarea,
html[data-command-os="2040"] .workspace-page select {
  border-color: rgba(133, 171, 198, 0.18);
  color: #eef4f7;
  box-shadow: inset 0 1px rgba(255, 255, 255, 0.025);
}

html[data-command-os="2040"] .workspace-page input::placeholder,
html[data-command-os="2040"] .workspace-page textarea::placeholder {
  color: rgba(143, 156, 168, 0.72);
  opacity: 1;
}

/* Global command rail */
.os-command-rail {
  position: sticky;
  top: 0;
  z-index: 80;
  display: grid;
  grid-template-columns: 196px minmax(0, 1fr) auto;
  align-items: stretch;
  min-height: 70px;
  padding: 0 clamp(18px, 2.3vw, 38px);
  border-bottom: 1px solid rgba(132, 169, 196, 0.16);
  background: rgba(3, 7, 12, 0.94);
  box-shadow: inset 0 -1px rgba(255, 255, 255, 0.015), 0 18px 44px rgba(0, 0, 0, 0.22);
  backdrop-filter: blur(22px) saturate(1.1);
}

.os-identity {
  display: grid;
  align-content: center;
  justify-items: start;
  gap: 4px;
  padding: 0 24px 0 0;
  border: 0;
  border-right: 1px solid rgba(132, 169, 196, 0.12);
  background: transparent;
  color: #f8fbfd;
  text-align: left;
  cursor: pointer;
}

.os-identity-name {
  font: 600 14px "Instrument Sans", sans-serif;
  letter-spacing: 0.17em;
}

.os-identity-sub {
  color: #788794;
  font: 500 8px "Spline Sans Mono", monospace;
  letter-spacing: 0.18em;
}

.os-primary-nav {
  display: flex;
  align-items: stretch;
  min-width: 0;
  padding-inline: clamp(8px, 1.3vw, 22px);
  overflow-x: auto;
  overscroll-behavior-inline: contain;
  scroll-behavior: smooth;
  scrollbar-width: none;
}

/* Final PhantomBot containment: the companion is a docked tool, not a giant
   orbital overlay. Single-click is handled in JS as a hint; double-click opens. */
.phantompet-real {
  z-index: 132 !important;
  width: var(--pet-width, clamp(82px, 5.7vw, 118px)) !important;
  height: var(--pet-height, clamp(94px, 6.8vw, 136px)) !important;
  pointer-events: none;
}

.phantompet-stage {
  pointer-events: auto;
}

.phantompet-orbit,
.phantompet-orbit::before,
.phantompet-orbit::after {
  display: none !important;
}

.phantompet-shadow {
  opacity: .42;
}

body:has(.console-workspace) .phantompet-real {
  width: var(--pet-width, clamp(72px, 4.8vw, 104px)) !important;
  height: var(--pet-height, clamp(84px, 5.8vw, 120px)) !important;
  opacity: .72;
}

body:has(.console-workspace) .phantompet-real:hover,
body:has(.console-workspace) .phantompet-real.is-dragging,
body:has(.console-workspace) .phantompet-real.is-talking {
  opacity: 1;
}

html[data-command-os="2040"] .phantombot-stage {
  background:
    linear-gradient(rgba(112, 153, 132, .018) 1px, transparent 1px),
    linear-gradient(90deg, rgba(112, 153, 132, .014) 1px, transparent 1px),
    #050806 !important;
  background-size: 44px 44px !important;
}

html[data-command-os="2040"] .phantombot-stage::before,
html[data-command-os="2040"] .phantombot-stage::after,
.phantombot-stage::before,
.phantombot-stage::after {
  display: none !important;
  opacity: 0 !important;
  background: none !important;
}

.phantombot-presence {
  width: min(126px, 24vw) !important;
  height: min(118px, 16vh) !important;
  min-height: 96px !important;
}

.phantombot-presence::before,
.phantombot-presence-ring {
  display: none !important;
}

.os-primary-nav::-webkit-scrollbar { display: none; }

.os-primary-nav button {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  min-width: max-content;
  padding: 0 clamp(9px, 0.85vw, 15px);
  border: 0;
  background: transparent;
  color: #75828e;
  cursor: pointer;
  font-size: 10.5px;
  font-weight: 600;
  letter-spacing: 0.035em;
  transition: color 180ms ease, background 180ms ease;
}

.os-primary-nav button.is-disabled {
  opacity: 0.44;
}

.os-primary-nav button::after {
  content: "";
  position: absolute;
  right: 22%;
  bottom: 0;
  left: 22%;
  height: 1px;
  background: #6da4ff;
  opacity: 0;
  transform: scaleX(0.3);
  transition: opacity 180ms ease, transform 180ms ease;
}

.os-primary-nav button:hover,
.os-primary-nav button.is-active {
  color: #eef4f7;
  background: rgba(255, 255, 255, 0.018);
}

.os-primary-nav button.is-active::after {
  opacity: 1;
  transform: scaleX(1);
  box-shadow: 0 0 12px rgba(80, 143, 255, 0.72);
}

.os-rail-actions {
  display: flex;
  align-items: center;
  gap: 2px;
  min-width: 0;
  border-left: 1px solid rgba(132, 169, 196, 0.12);
  padding-left: 10px;
}

.os-rail-action,
.os-more {
  min-height: 38px;
  padding: 0 10px;
  border: 0;
  background: transparent;
  color: #83919d;
  cursor: pointer;
  font-size: 10.5px;
  font-weight: 600;
  white-space: nowrap;
}

.os-rail-action:hover,
.os-rail-action.is-active,
.os-more:hover {
  color: #f5f8fa;
}

.os-rail-actions .notif-wrap,
.os-rail-actions .user-menu-wrap {
  position: relative;
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
}

.os-rail-actions .notif-btn {
  width: 38px;
  height: 38px;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.02);
  border-color: rgba(132, 169, 196, 0.14);
}

.os-rail-actions .topbar-user {
  min-height: 38px;
  max-width: 148px;
  padding: 3px 10px 3px 4px;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.02);
  border-color: rgba(132, 169, 196, 0.14);
  box-shadow: none;
}

.os-rail-actions .user-avatar {
  width: 30px;
  height: 30px;
  border-radius: 9px;
}

.os-rail-actions .user-meta {
  min-width: 0;
}

.os-rail-actions .user-meta b,
.os-rail-actions .user-meta i {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.os-rail-actions .user-meta i {
  display: none;
}

.os-rail-actions .notif-menu,
.os-rail-actions .user-menu {
  z-index: 150;
  background: rgba(5, 10, 16, 0.98);
  border-color: rgba(133, 171, 198, 0.24);
  border-radius: 8px;
  box-shadow: 0 24px 80px rgba(0, 0, 0, 0.52), inset 0 1px rgba(255, 255, 255, 0.025);
}
.os-more.is-open {
  color: #eef4f7;
  background: rgba(124, 108, 255, 0.06);
}
.os-menu-wrap {
  position: relative;
  display: inline-flex;
  align-items: center;
}
.os-menu-popover {
  position: absolute;
  top: calc(100% + 10px);
  right: 0;
  z-index: 140;
  width: min(330px, calc(100vw - 24px));
  max-height: min(72vh, 620px);
  overflow-y: auto;
  padding: 10px;
  border: 1px solid rgba(133, 171, 198, 0.24);
  border-radius: 8px;
  background: rgba(5, 10, 16, 0.98);
  box-shadow: 0 24px 80px rgba(0, 0, 0, 0.52), inset 0 1px rgba(255, 255, 255, 0.025);
}
.os-menu-popover[hidden] { display: none; }
.os-menu-head {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  gap: 3px 10px;
  align-items: center;
  padding: 6px 6px 10px;
  border-bottom: 1px solid rgba(133, 171, 198, 0.14);
}
.os-menu-head span {
  grid-row: span 2;
  display: grid;
  width: 34px;
  height: 34px;
  place-items: center;
  border: 1px solid rgba(124, 108, 255, 0.34);
  border-radius: 50%;
  color: #83f5bf;
  background: rgba(124, 108, 255, 0.07);
  font: 700 10px "Spline Sans Mono", monospace;
}
.os-menu-head b { overflow: hidden; color: #eef4f7; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.os-menu-head i { color: #778591; font: 600 9px "Spline Sans Mono", monospace; font-style: normal; letter-spacing: 0.08em; text-transform: uppercase; }
.os-menu-list {
  display: grid;
  gap: 2px;
  padding: 8px 0;
}
.os-menu-list button,
.os-menu-actions button {
  display: flex;
  align-items: center;
  gap: 9px;
  width: 100%;
  min-height: 38px;
  padding: 9px 10px;
  border: 1px solid transparent;
  border-radius: 5px;
  background: transparent;
  color: #93a1ac;
  cursor: pointer;
  text-align: left;
  font: 600 12px "Instrument Sans", sans-serif;
}
.os-menu-list button:hover,
.os-menu-actions button:hover {
  color: #eef4f7;
  background: rgba(255, 255, 255, 0.035);
}
.os-menu-list button.is-active {
  color: #f6f9fb;
  background: rgba(73, 131, 218, 0.12);
  box-shadow: inset 2px 0 #68a3ff;
}
.os-menu-list .ic {
  width: 15px;
  height: 15px;
  flex: 0 0 15px;
}
.os-menu-actions {
  display: grid;
  gap: 5px;
  padding-top: 8px;
  border-top: 1px solid rgba(133, 171, 198, 0.14);
}
.os-menu-actions button {
  justify-content: space-between;
  border-color: rgba(133, 171, 198, 0.12);
  background: rgba(255, 255, 255, 0.018);
}
.os-menu-actions button.is-danger {
  color: #ff9aa7;
  background: rgba(255, 95, 114, 0.08);
}

.os-ai-action { color: #bca7ff; }

.os-profile {
  display: grid;
  grid-template-columns: 30px auto;
  align-items: center;
  gap: 8px;
  min-height: 42px;
  margin-left: 4px;
  padding: 4px 10px 4px 4px;
  border: 1px solid rgba(132, 169, 196, 0.15);
  border-radius: 5px;
  background: rgba(255, 255, 255, 0.018);
  color: #eef4f7;
  cursor: pointer;
}

.os-profile > span {
  display: grid;
  width: 30px;
  height: 30px;
  place-items: center;
  border: 1px solid rgba(124, 108, 255, 0.34);
  border-radius: 50%;
  background: rgba(124, 108, 255, 0.07);
  color: #83f5bf;
  font: 600 10px "Spline Sans Mono", monospace;
}

.os-profile b { font-size: 11px; font-weight: 600; }

.mobile-admin-homebar,
.command-os-enabled > .sidebar:not(.is-expanded),
.command-os-enabled .topbar2 {
  display: none !important;
}

/* Existing navigation becomes an on-demand control drawer. */
.command-os-enabled > .sidebar {
  position: fixed !important;
  top: 78px !important;
  right: 16px !important;
  bottom: 48px !important;
  left: auto !important;
  z-index: 110 !important;
  display: flex !important;
  width: min(326px, calc(100vw - 24px)) !important;
  height: auto !important;
  padding: 14px !important;
  border: 1px solid rgba(133, 171, 198, 0.24) !important;
  border-radius: 8px !important;
  background: rgba(5, 10, 16, 0.98) !important;
  box-shadow: 0 28px 90px rgba(0, 0, 0, 0.58), inset 0 1px rgba(255, 255, 255, 0.025) !important;
  transform: translateX(calc(100% + 32px));
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: transform 220ms ease, opacity 160ms ease, visibility 0s linear 220ms;
}

.command-os-enabled > .sidebar.is-expanded {
  transform: translateX(0);
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transition-delay: 0s;
}

.command-os-enabled .sidebar .side-brand {
  padding: 8px 8px 14px;
  border-color: rgba(133, 171, 198, 0.14);
}

.command-os-enabled .sidebar .brand-ghost { display: none; }
.command-os-enabled .sidebar .side-brand-text b { color: #eef4f7; }
.command-os-enabled .sidebar .side-brand-text i { color: #778591; }
.command-os-enabled .sidebar .side-nav { overflow-y: auto; }
.command-os-enabled .sidebar .side-plan {
  display: flex;
  flex: 0 0 auto;
  margin-top: 12px;
  border-color: rgba(133, 171, 198, 0.18);
  border-radius: 6px;
  background: rgba(255, 255, 255, 0.018);
}
.command-os-enabled .sidebar .side-plan-btn {
  border-radius: 4px;
  border-color: rgba(133, 171, 198, 0.18);
  background: rgba(124, 108, 255, 0.055);
  color: #eef4f7;
}
.command-os-enabled .sidebar .side-plan-signout {
  background: rgba(255, 95, 114, 0.08);
  color: #ff9aa7;
}
.command-os-enabled .sidebar .nav-item {
  min-height: 40px;
  border-radius: 4px;
  color: #8f9da8;
  background: transparent;
  box-shadow: none;
}

.command-os-enabled .sidebar .nav-item:hover { color: #eef4f7; background: rgba(255, 255, 255, 0.035); }
.command-os-enabled .sidebar .nav-item.is-active {
  color: #f6f9fb;
  background: rgba(73, 131, 218, 0.12);
  box-shadow: inset 2px 0 #68a3ff;
}

.command-os-enabled .sidebar .nav-item[data-nav-id="adminos"] { color: #e5bf73; }
.command-os-enabled .sidebar .nav-item[data-nav-id="adminos"].is-active {
  color: #ffe1a3;
  background: rgba(208, 151, 54, 0.1);
  box-shadow: inset 2px 0 #dda94d;
}

/* Shell geometry */
.command-os-enabled .app-main {
  width: 100%;
  min-height: 0;
  max-width: none;
  overflow: hidden;
  background: #03070c;
}

.command-os-enabled .phantomwire {
  position: sticky;
  top: 70px;
  z-index: 65;
  min-height: 30px;
  border-color: rgba(133, 171, 198, 0.12);
  background: rgba(4, 9, 14, 0.9);
  color: #72808c;
  backdrop-filter: blur(18px);
}

.command-os-enabled .atk-label {
  padding-inline: 18px;
  clip-path: none;
  color: #7e91a0;
  background: rgba(255, 255, 255, 0.02);
  border-right: 1px solid rgba(133, 171, 198, 0.12);
}

.command-os-enabled .atk-view::before { background: linear-gradient(90deg, #04090e, transparent); }
.command-os-enabled .atk-view::after { background: linear-gradient(270deg, #04090e, transparent); }

.command-os-enabled .console:not(.console-workspace) {
  position: relative;
  flex: 1 1 auto;
  display: grid;
  grid-template-columns: minmax(0, 1fr) 292px;
  gap: 0;
  width: 100%;
  min-height: 0;
  height: calc(100dvh - 136px);
  padding: 0;
  overflow: hidden;
  background: #03070c;
}

.command-os-enabled .console-center {
  position: relative;
  display: grid;
  grid-template-rows: minmax(520px, 1fr) 150px;
  min-width: 0;
  min-height: 0;
  gap: 0;
  overflow: hidden;
  border-right: 1px solid rgba(133, 171, 198, 0.12);
}

.command-os-enabled .dashboard-brief {
  position: absolute;
  top: clamp(40px, 5vh, 72px);
  left: clamp(26px, 3vw, 52px);
  z-index: 20;
  display: block;
  width: min(230px, 23%);
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
  pointer-events: none;
}

.command-os-enabled .dashboard-brief-kicker {
  margin: 0 0 12px;
  color: #7f8d99;
  font: 500 10px "Spline Sans Mono", monospace;
  letter-spacing: 0.24em;
  text-transform: uppercase;
}

.command-os-enabled .dashboard-brief h1 {
  margin: 0 0 12px;
  color: #f5f8fa;
  font: 500 clamp(27px, 2.35vw, 40px) "Instrument Sans", sans-serif;
  letter-spacing: 0;
  line-height: 1.02;
}

.command-os-enabled .dashboard-brief-copy > p:last-child {
  margin: 0;
  color: #9aa7b2;
  font-size: 13px;
  line-height: 1.58;
}

.command-os-enabled .dashboard-brief-metrics { display: none; }

.command-os-enabled .decision-deck {
  position: absolute;
  /* --os-decision-top is measured live off .dashboard-brief's real rendered
     height (command-os.js) — the greeting wraps to 2-3 lines depending on
     name length, so a fixed offset here reliably overlapped it for longer
     names ("Decisions" printing over "...next outcome."). 188px is only the
     pre-JS fallback for the first paint. */
  top: var(--os-decision-top, 188px);
  left: clamp(26px, 3vw, 52px);
  z-index: 21;
  width: min(280px, 28%);
  /* also measured live — a fixed 220px reliably ran into the division strip
     below once --os-decision-top grew to clear a taller greeting above. */
  max-height: var(--os-decision-max-height, 220px);
  overflow: auto;
}

.command-os-enabled .decision-card {
  border: 0;
  border-left: 1px solid var(--warn);
  border-radius: 0;
  background: rgba(5, 11, 17, 0.74);
  box-shadow: none;
}

/* Central command field */
.command-os-enabled .hero2 {
  position: relative;
  grid-row: 1;
  display: block;
  width: 100%;
  min-height: 0;
  height: 100%;
  padding: 0;
  overflow: hidden;
  border: 0;
  border-radius: 0;
  background: #040910;
  box-shadow: none;
}

.command-os-enabled .hero2::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
  background: linear-gradient(180deg, rgba(3, 7, 12, 0.52) 0%, transparent 25%, transparent 68%, rgba(3, 7, 12, 0.82) 100%);
}

.command-os-enabled .hero2-stage {
  position: absolute;
  inset: 0;
  z-index: 1;
  display: block;
  width: 100%;
  height: 100%;
  min-height: 0;
  max-height: none;
  overflow: hidden;
  transform: none;
}

.os-earth-horizon {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 56%;
  opacity: 0.84;
  filter: saturate(0.82) brightness(0.74) contrast(1.08);
}

.command-os-enabled .phantom-webgl,
.command-os-enabled .phantom-mode-stage,
.command-os-enabled .ghost-canvas {
  display: none !important;
}

.os-gravity-map {
  position: absolute;
  inset: 0;
  z-index: 5;
}

.os-orbit {
  position: absolute;
  left: 58%;
  top: 58%;
  border: 1px solid rgba(103, 157, 235, 0.2);
  border-radius: 50%;
  pointer-events: none;
  transform: translate(-50%, -50%) rotate(-7deg);
  box-shadow: 0 0 30px rgba(61, 116, 196, 0.04);
}

.os-orbit-a { width: 30%; aspect-ratio: 3 / 1; }
.os-orbit-b { width: 52%; aspect-ratio: 4 / 1; opacity: 0.72; }
.os-orbit-c { width: 72%; aspect-ratio: 5 / 1; opacity: 0.42; }

.os-node {
  position: absolute;
  display: grid;
  min-width: 92px;
  padding: 0 0 0 15px;
  border: 0;
  background: transparent;
  color: #f1f5f7;
  text-align: left;
  cursor: pointer;
  transform: translate(-50%, -50%);
  transition: transform 180ms ease, opacity 180ms ease, filter 180ms ease;
}

.os-node::before {
  content: "";
  position: absolute;
  top: 4px;
  left: 0;
  width: 6px;
  height: 6px;
  border: 1px solid rgba(126, 176, 255, 0.9);
  border-radius: 50%;
  background: #0a1521;
  box-shadow: 0 0 12px rgba(76, 140, 255, 0.7);
}

.os-node span {
  color: #8d9aa6;
  font: 500 8px "Spline Sans Mono", monospace;
  letter-spacing: 0.13em;
  text-transform: uppercase;
}

.os-node b {
  margin-top: 4px;
  color: #f7fafb;
  font: 500 14px "Spline Sans Mono", monospace;
  font-variant-numeric: tabular-nums;
}

.os-node i {
  margin-top: 2px;
  color: #687783;
  font-size: 9px;
  font-style: normal;
  white-space: nowrap;
}

.os-node:hover,
.os-node:focus-visible {
  z-index: 8;
  transform: translate(-50%, -50%) scale(1.07);
  filter: brightness(1.22);
}

.os-node[data-os-node="revenue"] { left: 33%; top: 38%; }
.os-node[data-os-node="clients"] { left: 45%; top: 30%; }
.os-node[data-os-node="missions"] { left: 58%; top: 27%; }
.os-node[data-os-node="approvals"] { left: 71%; top: 35%; }
.os-node[data-os-node="risk"] { left: 81%; top: 48%; }
.os-node[data-os-node="health"] { left: 72%; top: 56%; }

.os-node-core {
  left: 58%;
  top: 58%;
  min-width: 112px;
  padding: 12px 16px;
  place-items: center;
  border: 1px solid rgba(105, 161, 250, 0.28);
  border-radius: 50%;
  aspect-ratio: 1;
  background: rgba(5, 13, 23, 0.76);
  text-align: center;
  box-shadow: 0 0 44px rgba(48, 112, 220, 0.2), inset 0 0 24px rgba(46, 111, 218, 0.08);
}

.os-node-core::before { display: none; }
.os-node-core span { color: #8eb8ff; }
.os-node-core b { color: #eaf2ff; font-size: 13px; }
.os-node-core i { white-space: normal; }

.os-gravity-map[data-mode="growth"] .os-node:not([data-os-node="clients"]):not([data-os-node="revenue"]),
.os-gravity-map[data-mode="operations"] .os-node:not([data-os-node="missions"]):not([data-os-node="approvals"]):not([data-os-node="health"]),
.os-gravity-map[data-mode="threat"] .os-node:not([data-os-node="risk"]):not([data-os-node="health"]) {
  opacity: 0.3;
}

.os-field-modes {
  position: absolute;
  top: 18px;
  left: 50%;
  z-index: 12;
  display: flex;
  gap: 2px;
  padding: 3px;
  border: 1px solid rgba(133, 171, 198, 0.13);
  border-radius: 4px;
  background: rgba(3, 8, 13, 0.58);
  transform: translateX(-50%);
  backdrop-filter: blur(14px);
}

.os-field-modes button {
  padding: 6px 10px;
  border: 0;
  border-radius: 2px;
  background: transparent;
  color: #6f7d88;
  cursor: pointer;
  font-size: 9px;
  font-weight: 600;
}

.os-field-modes button:hover { color: #d8e1e6; }
.os-field-modes button.is-active { color: #dce9ff; background: rgba(75, 133, 219, 0.15); }
.os-access-version {
  position: absolute;
  top: 18px;
  left: 50%;
  z-index: 12;
  display: grid;
  min-width: 190px;
  gap: 2px;
  padding: 8px 12px;
  border: 1px solid rgba(133, 171, 198, 0.16);
  border-radius: 5px;
  background: rgba(3, 8, 13, 0.66);
  transform: translateX(-50%);
  backdrop-filter: blur(14px);
  box-shadow: 0 0 24px rgba(124, 108, 255, 0.08);
}
.os-access-version::before {
  content: "";
  position: absolute;
  left: 8px;
  top: 8px;
  bottom: 8px;
  width: 2px;
  background: linear-gradient(180deg, #7c6cff, #4f8dff);
  opacity: 0.78;
}
.os-access-version span {
  padding-left: 8px;
  color: #5f7180;
  font: 700 7px "Spline Sans Mono", monospace;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}
.os-access-version b {
  padding-left: 8px;
  color: #eaf2ff;
  font-size: 12px;
  line-height: 1.1;
}
.os-access-version i {
  padding-left: 8px;
  overflow: hidden;
  color: #7e909e;
  font-size: 9px;
  font-style: normal;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.os-access-version[data-tone="limited"] { border-color: rgba(255, 199, 94, 0.24); box-shadow: 0 0 20px rgba(255, 199, 94, 0.06); }
.os-access-version[data-tone="limited"]::before { background: linear-gradient(180deg, #ffc75e, #4f8dff); }

/* Phantom execution surface */
.command-os-enabled .hero2-copy {
  position: absolute;
  right: clamp(22px, 3vw, 48px);
  bottom: 22px;
  left: clamp(260px, 26vw, 340px);
  z-index: 24;
  width: auto;
  max-width: none;
  padding: 0;
}

.command-os-enabled .hero2-title,
.command-os-enabled .hero2-sub,
.command-os-enabled .cmd-chips {
  display: none !important;
}

.os-command-state {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  min-height: 39px;
  border: 1px solid rgba(133, 171, 198, 0.14);
  border-bottom: 0;
  background: rgba(4, 10, 16, 0.84);
  backdrop-filter: blur(18px);
}

.os-command-state > span {
  display: grid;
  align-content: center;
  gap: 2px;
  min-width: 0;
  padding: 7px 11px;
  border-right: 1px solid rgba(133, 171, 198, 0.1);
}

.os-command-state > span:last-child { border-right: 0; }
.os-command-state b { color: #71808c; font: 500 7px "Spline Sans Mono", monospace; letter-spacing: 0.13em; }
.os-command-state i { overflow: hidden; color: #b5c1c9; font-size: 9px; font-style: normal; text-overflow: ellipsis; white-space: nowrap; }

.os-execution-modes {
  position: absolute;
  right: 10px;
  bottom: 17px;
  z-index: 9;
  display: flex;
  gap: 2px;
}

.os-execution-modes button {
  padding: 6px 9px;
  border: 0;
  border-radius: 3px;
  background: transparent;
  color: #64727e;
  cursor: pointer;
  font-size: 9px;
  font-weight: 600;
}

.os-execution-modes button:hover { color: #dce4e8; }
.os-execution-modes button.is-active { color: #a9c8ff; background: rgba(72, 129, 211, 0.13); }

.command-os-enabled .chatbox {
  height: auto;
  min-height: 104px;
  border: 1px solid rgba(133, 171, 198, 0.22);
  border-radius: 0 0 7px 7px;
  background: rgba(3, 8, 13, 0.94);
  box-shadow: 0 22px 70px rgba(0, 0, 0, 0.34), inset 0 1px rgba(255, 255, 255, 0.02);
  backdrop-filter: blur(22px);
}

.command-os-enabled .chatbox-head { min-height: 0; padding: 0; border: 0; }
.command-os-enabled .chatbox-head .pc { display: none !important; }
.command-os-enabled .chatbox-log {
  max-height: 50px;
  min-height: 0;
  padding: 9px 14px 0;
  overflow: auto;
  color: #c5d0d7;
  font-size: 11px;
}

.command-os-enabled .chatbox-log:empty { display: none; }
.command-os-enabled .chatbox-composer {
  display: flex;
  align-items: center;
  min-height: 62px;
  padding: 8px 200px 8px 16px;
  border-top: 1px solid rgba(133, 171, 198, 0.1);
}

.command-os-enabled .chatbox-composer input {
  width: 100%;
  min-width: 0;
  height: 42px;
  border: 0;
  background: transparent;
  color: #eef4f7;
  caret-color: #69a8ff;
  font-size: 15px;
  outline: none;
}

.command-os-enabled .chatbox-composer input::placeholder { color: #697783; opacity: 1; }
.command-os-enabled .cmd-send {
  position: absolute;
  right: 12px;
  bottom: 11px;
  width: 40px;
  height: 40px;
  border-radius: 4px;
  color: #06110d;
  background: #7c6cff;
  box-shadow: 0 0 24px rgba(124, 108, 255, 0.18);
}

/* Division deck: the bottom row is NOT a second navigation — it's a band of
   live instruments. Each tile reads its module's real metric + a micro-viz;
   clicking one flies you there. (Same destinations as the top command rail,
   but here they're widgets, so there's still only one thing that *is* nav.) */
.os-division-strip {
  grid-row: 2;
  display: flex;
  min-width: 0;
  overflow-x: auto;
  border-top: 1px solid rgba(133, 171, 198, 0.16);
  border-bottom: 1px solid rgba(133, 171, 198, 0.1);
  background: linear-gradient(180deg, #070d15, #04080e);
  scrollbar-width: thin;
}

.os-division-strip button {
  position: relative;
  display: grid;
  grid-template-columns: 1fr auto;
  align-content: center;
  gap: 5px 10px;
  flex: 1 0 152px;
  min-width: 0;
  padding: 15px 16px 14px;
  border: 0;
  border-right: 1px solid rgba(133, 171, 198, 0.08);
  background: transparent;
  color: #eef4f7;
  text-align: left;
  cursor: pointer;
  overflow: hidden;
  transition: flex-grow 260ms cubic-bezier(0.22, 1, 0.36, 1), background 200ms ease;
  animation: osDeckRise 520ms cubic-bezier(0.22, 1, 0.36, 1) backwards;
}
.os-division-strip button:nth-child(1) { animation-delay: 30ms; }
.os-division-strip button:nth-child(2) { animation-delay: 75ms; }
.os-division-strip button:nth-child(3) { animation-delay: 120ms; }
.os-division-strip button:nth-child(4) { animation-delay: 165ms; }
.os-division-strip button:nth-child(5) { animation-delay: 210ms; }
.os-division-strip button:nth-child(6) { animation-delay: 255ms; }
.os-division-strip button:nth-child(7) { animation-delay: 300ms; }

.os-division-strip button:last-child { border-right: 0; }
/* top ignition bar — lights on hover / active */
.os-division-strip button::before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  height: 2px;
  background: linear-gradient(90deg, #7c6cff, #4f8dff);
  transform: scaleX(0);
  transform-origin: left;
  opacity: 0;
  transition: transform 300ms cubic-bezier(0.22, 1, 0.36, 1), opacity 200ms ease;
}
.os-division-strip button:hover,
.os-division-strip button.is-active {
  flex-grow: 1.35;
  background: linear-gradient(180deg, rgba(124, 108, 255, 0.05), rgba(255, 255, 255, 0.015));
}
.os-division-strip button:hover::before,
.os-division-strip button.is-active::before { transform: scaleX(1); opacity: 1; }

.os-division-tag { grid-column: 1; color: #56646f; font: 700 8px "Spline Sans Mono", monospace; letter-spacing: 0.14em; align-self: center; }
.os-division-metric { grid-column: 2; justify-self: end; align-self: center; color: #63e2a9; font: 600 13px "Spline Sans Mono", monospace; font-style: normal; letter-spacing: 0.01em; font-variant-numeric: tabular-nums; }
.os-division-metric[data-empty="true"] { color: #4a5863; }
.os-division-strip b { grid-column: 1 / -1; margin-top: 2px; color: #dfe7eb; font-size: 12.5px; font-weight: 600; }
.os-division-strip i { grid-column: 1 / -1; overflow: hidden; color: #6f7e8a; font-size: 9px; font-style: normal; line-height: 1.35; text-overflow: ellipsis; white-space: nowrap; }
.os-division-viz { grid-column: 1 / -1; margin-top: 6px; display: flex; align-items: flex-end; height: 20px; }
.dashboard-intel-band {
  grid-row: 2;
  display: grid;
  grid-template-columns: minmax(180px, 0.42fr) minmax(0, 1.58fr);
  min-width: 0;
  border-top: 1px solid rgba(133, 171, 198, 0.16);
  border-bottom: 1px solid rgba(133, 171, 198, 0.1);
  background: linear-gradient(180deg, #070d15, #04080e);
}
.dashboard-intel-head {
  display: grid;
  align-content: center;
  gap: 5px;
  padding: 16px 18px;
  border-right: 1px solid rgba(133, 171, 198, 0.1);
}
.dashboard-intel-head span {
  color: #7c6cff;
  font: 700 8px "Spline Sans Mono", monospace;
  letter-spacing: 0.16em;
  text-transform: uppercase;
}
.dashboard-intel-head b {
  color: #eaf2ff;
  font-size: 13px;
}
.dashboard-intel-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  min-width: 0;
}
.dashboard-intel-card {
  position: relative;
  display: grid;
  align-content: center;
  gap: 5px;
  min-width: 0;
  padding: 15px 16px 14px;
  border: 0;
  border-right: 1px solid rgba(133, 171, 198, 0.08);
  background: transparent;
  color: #eef4f7;
  text-align: left;
  cursor: pointer;
  overflow: hidden;
}
.dashboard-intel-card:last-child { border-right: 0; }
.dashboard-intel-card::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 2px;
  background: linear-gradient(90deg, #7c6cff, #4f8dff);
  transform: scaleX(0);
  transform-origin: left;
  opacity: 0;
  transition: transform 220ms ease, opacity 180ms ease;
}
.dashboard-intel-card:hover,
.dashboard-intel-card:focus-visible {
  outline: none;
  background: linear-gradient(180deg, rgba(124, 108, 255, 0.055), rgba(255, 255, 255, 0.012));
}
.dashboard-intel-card:hover::before,
.dashboard-intel-card:focus-visible::before { transform: scaleX(1); opacity: 1; }
.dashboard-intel-card span {
  color: #60717f;
  font: 700 8px "Spline Sans Mono", monospace;
  letter-spacing: 0.14em;
  text-transform: uppercase;
}
.dashboard-intel-card b {
  min-width: 0;
  overflow: hidden;
  color: #dfe7eb;
  font-size: 13px;
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.dashboard-intel-card i {
  min-width: 0;
  overflow: hidden;
  color: #6f7e8a;
  font-size: 9px;
  font-style: normal;
  line-height: 1.35;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.dashboard-intel-card.is-warn b { color: #ffd58a; }
.dashboard-intel-card.is-idle b { color: #8aa0ae; }
.dashboard-intel-scan {
  grid-column: 1 / -1; display: block; width: 100%; padding: 8px 18px; border: 0;
  border-top: 1px solid rgba(133, 171, 198, 0.08);
  background: transparent; color: #7c6cff; font: 700 9px "Spline Sans Mono", monospace; letter-spacing: 0.14em;
  text-transform: uppercase; text-align: left; cursor: pointer;
}
.dashboard-intel-scan:hover, .dashboard-intel-scan:focus-visible { color: #a79bff; outline: none; }
.dashboard-intel-scan:disabled { color: #55606a; cursor: default; }

/* Context stream */
.command-os-enabled .console-rail {
  display: flex;
  flex-direction: column;
  gap: 0;
  width: 292px;
  height: 100%;
  max-height: none !important;
  padding: 20px 20px 56px;
  overflow-y: auto !important;
  border: 0;
  background: #060b11;
}

.os-mission-head {
  display: grid;
  gap: 4px;
  padding: 4px 0 18px;
  border-bottom: 1px solid rgba(133, 171, 198, 0.12);
}

.os-mission-head span { color: #687783; font: 500 8px "Spline Sans Mono", monospace; letter-spacing: 0.17em; }
.os-mission-head b { color: #dfe7eb; font-size: 13px; font-weight: 600; }

.command-os-enabled .plan-card,
.command-os-enabled .queue-card {
  padding: 18px 0;
  border: 0;
  border-bottom: 1px solid rgba(133, 171, 198, 0.12);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.command-os-enabled .section-head { margin-bottom: 10px; }
.command-os-enabled .section-head h2 { color: #71808c; font: 500 9px "Spline Sans Mono", monospace; letter-spacing: 0.14em; }
.command-os-enabled .plan-inner { padding: 8px 0; border: 0; background: transparent; }
.command-os-enabled .plan-track { stroke: rgba(133, 171, 198, 0.12); }
.command-os-enabled .plan-pct { fill: #e8eef1; }
.command-os-enabled .plan-copy b { color: #e7edf0; font-size: 12px; }
.command-os-enabled .plan-copy i { color: #75838e; font-size: 10px; }
.command-os-enabled .queue-list { display: grid; gap: 0; }
.command-os-enabled .queue-item {
  min-height: 52px;
  padding: 9px 0;
  border: 0;
  border-bottom: 1px solid rgba(133, 171, 198, 0.08);
  border-radius: 0;
  background: transparent;
}

.command-os-enabled .queue-item:hover { background: rgba(255, 255, 255, 0.018); }
.command-os-enabled .queue-ic { display: none; }
.command-os-enabled .queue-meta b { color: #dce4e8; font-size: 11px; }
.command-os-enabled .queue-meta i { color: #6e7d88; font-size: 9px; }
.command-os-enabled .queue-badge { border-radius: 3px; }
.command-os-enabled .empty-line { padding: 18px 0; color: #677681; }
.command-os-enabled .rail-foot-btn { margin-top: 12px; border-radius: 4px; background: transparent; color: #91a0ab; }

.os-mission-peek { display: none; }

/* Thin physical status edge */
.os-system-line {
  position: fixed;
  right: 0;
  bottom: 1px;
  left: 0;
  z-index: 79;
  display: flex;
  align-items: stretch;
  height: 36px;
  border-top: 1px solid rgba(133, 171, 198, 0.14);
  background: rgba(3, 7, 12, 0.97);
  backdrop-filter: blur(18px);
}

.os-system-line > span, .os-system-line > button {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  padding: 0 clamp(12px, 1.4vw, 24px);
  border-right: 1px solid rgba(133, 171, 198, 0.1);
  border-left: 0; border-top: 0; border-bottom: 0;
  background: none;
  font-family: inherit;
}
.os-system-line > button { cursor: pointer; transition: background 0.15s; }
.os-system-line > button:hover, .os-system-line > button:focus-visible { background: rgba(133, 171, 198, 0.08); outline: none; }
.os-system-line > button[aria-expanded="true"] { background: rgba(124, 108, 255, 0.14); }

.os-system-line b { color: #586772; font: 500 7px "Spline Sans Mono", monospace; letter-spacing: 0.12em; }
.os-system-line i { overflow: hidden; color: #9babb6; font-size: 9px; font-style: normal; text-overflow: ellipsis; white-space: nowrap; }
.os-system-line > [data-os-model-status] { min-width: min(290px, 28vw); }
.os-system-line > [data-os-model-status]::before,
.os-system-line > [data-os-security-status]::before {
  content: "";
  width: 7px;
  height: 7px;
  flex: 0 0 auto;
  border-radius: 999px;
  background: #e8b85a;
  box-shadow: 0 0 12px rgba(232, 184, 90, 0.65);
}
.os-system-line > [data-os-tone="ok"]::before { background: #65e6a7; box-shadow: 0 0 12px rgba(101, 230, 167, 0.68); }
.os-system-line > [data-os-tone="warn"]::before { background: #e8b85a; box-shadow: 0 0 12px rgba(232, 184, 90, 0.65); }
.os-system-line > [data-os-tone="error"]::before { background: #ff5964; box-shadow: 0 0 12px rgba(255, 89, 100, 0.72); }
.os-system-line > [data-os-tone="ok"] i { color: #65e6a7; }
.os-system-line > [data-os-tone="warn"] i { color: #e8b85a; }
.os-system-line > [data-os-tone="error"] i { color: #ff7f8a; }
.os-system-line .os-system-time { margin-left: auto; border-right: 0; }

.os-model-popover {
  position: fixed;
  left: 12px;
  bottom: 48px;
  z-index: 80;
  width: min(360px, calc(100vw - 24px));
  max-height: min(72vh, 620px);
  overflow-y: auto;
  padding: 14px;
  border-radius: 16px;
  border: 1px solid rgba(133, 171, 198, 0.18);
  background: rgba(8, 12, 18, 0.98);
  backdrop-filter: blur(20px);
  box-shadow: 0 -12px 40px rgba(0, 0, 0, 0.5), 0 12px 40px rgba(0, 0, 0, 0.4);
  animation: osPopoverIn 0.16s ease-out;
}
.os-model-popover[hidden] { display: none; }
@keyframes osPopoverIn {
  from { opacity: 0; transform: translateY(6px); }
  to { opacity: 1; transform: translateY(0); }
}
.os-system-time b { color: #e5ecef; font-size: 10px; letter-spacing: 0; }

/* Workspaces inherit the same command shell and material palette. */
.command-os-enabled .console.console-workspace {
  min-height: calc(100dvh - 136px);
  padding: 16px 18px 54px;
  background: #03070c;
}

.command-os-enabled .workspace-page,
.command-os-enabled .overlay-panel {
  border-color: rgba(133, 171, 198, 0.16);
  background: #070d14;
  color: #edf3f6;
  box-shadow: 0 28px 90px rgba(0, 0, 0, 0.4);
}

.command-os-enabled .workspace-page-head { border-color: rgba(133, 171, 198, 0.13); }
.command-os-enabled .workspace-page h1,
.command-os-enabled .workspace-page h2,
.command-os-enabled .workspace-page h3 { color: #eef4f7; }

/* Laptop: mission stream becomes an explicit edge surface. */
@media (max-width: 1280px) {
  .os-command-rail { grid-template-columns: 174px minmax(0, 1fr) auto; padding-inline: 18px; }
  .os-primary-nav button { padding-inline: 9px; font-size: 9.5px; }
  .os-rail-action:not(.os-ai-action) { display: none; }
  .os-profile b { display: none; }
  .os-profile { grid-template-columns: 30px; padding-right: 4px; }
  .command-os-enabled .console:not(.console-workspace) { grid-template-columns: minmax(0, 1fr); }
  .command-os-enabled .console-center { border-right: 0; }
  .command-os-enabled .console-rail {
    position: absolute;
    top: 14px;
    right: 14px;
    bottom: 14px;
    z-index: 55;
    width: min(320px, calc(100vw - 28px));
    height: auto;
    border: 1px solid rgba(133, 171, 198, 0.2);
    box-shadow: 0 30px 90px rgba(0, 0, 0, 0.55);
    transform: translateX(calc(100% + 28px));
    opacity: 0;
    pointer-events: none;
    transition: transform 220ms ease, opacity 180ms ease;
  }
  .command-os-enabled.os-mission-open .console-rail { transform: translateX(0); opacity: 1; pointer-events: auto; }
  .os-mission-peek {
    position: absolute;
    top: 16px;
    right: 18px;
    z-index: 54;
    display: block;
    padding: 8px 11px;
    border: 1px solid rgba(133, 171, 198, 0.16);
    border-radius: 4px;
    background: rgba(4, 9, 14, 0.75);
    color: #8d9ba6;
    cursor: pointer;
    font-size: 9px;
    backdrop-filter: blur(16px);
  }
  .command-os-enabled.os-mission-open .os-mission-peek { color: #dfe8ed; border-color: rgba(105, 165, 255, 0.35); }
  .command-os-enabled .hero2-copy { right: 28px; left: 280px; }
}

/* Tablet: a two-level command rail, spatial center, no permanent sidebar. */
@media (max-width: 900px) {
  .phantom.command-os-enabled { padding-bottom: calc(74px + env(safe-area-inset-bottom)); overflow: visible; }
  .os-command-rail {
    position: sticky;
    grid-template-columns: minmax(140px, 1fr) auto;
    grid-template-rows: 58px 42px;
    min-height: 100px;
    padding: 0 14px;
  }
  .os-identity { grid-column: 1; grid-row: 1; border-right: 0; }
  .os-identity-name { font-size: 12px; }
  .os-primary-nav {
    grid-column: 1 / -1;
    grid-row: 2;
    margin-inline: -14px;
    padding-inline: 8px;
    border-top: 1px solid rgba(133, 171, 198, 0.1);
  }
  .os-primary-nav button { padding-inline: 12px; }
  .os-rail-actions { grid-column: 2; grid-row: 1; border-left: 0; }
  .os-ai-action { display: block !important; }
  .os-ai-action { font-size: 0; width: 38px; }
  .os-ai-action::after { content: "AI"; font-size: 9px; }
  .os-more { padding-inline: 8px; }
  .command-os-enabled .phantomwire { top: 100px; }
  .command-os-enabled .console:not(.console-workspace) {
    height: auto;
    min-height: calc(100dvh - 130px);
    overflow: visible;
    padding: 0 0 68px;
  }
  .command-os-enabled .console-center {
    grid-template-rows: 650px 132px;
    overflow: hidden;
  }
  .command-os-enabled .dashboard-brief {
    top: 30px;
    left: 22px;
    width: min(250px, 42%);
  }
  .command-os-enabled .dashboard-brief h1 { font-size: 26px; }
  .command-os-enabled .hero2-copy { right: 18px; bottom: 18px; left: 18px; }
  .os-field-modes,
  .os-access-version { top: 20px; left: auto; right: 18px; transform: none; }
  .os-node[data-os-node="revenue"] { left: 26%; top: 39%; }
  .os-node[data-os-node="clients"] { left: 41%; top: 31%; }
  .os-node[data-os-node="missions"] { left: 58%; top: 29%; }
  .os-node[data-os-node="approvals"] { left: 73%; top: 38%; }
  .os-node[data-os-node="risk"] { left: 84%; top: 51%; }
  .os-node[data-os-node="health"] { left: 73%; top: 59%; }
  .os-node-core { left: 57%; top: 57%; }
  .os-division-strip button { flex-basis: 148px; }
  .dashboard-intel-band { grid-template-columns: 1fr; }
  .dashboard-intel-head { display: none; }
  .os-system-line { display: none; }
  .mobile-bottom-nav { z-index: 85; background: rgba(4, 9, 14, 0.97) !important; border-color: rgba(133, 171, 198, 0.18) !important; }
  .mobile-bottom-item { color: #71808b !important; }
  .mobile-bottom-item.is-active { color: #dfe9ef !important; background: rgba(71, 129, 214, 0.13) !important; box-shadow: inset 0 1px rgba(103, 165, 255, 0.45) !important; }
  .command-os-enabled > .sidebar { top: 108px !important; bottom: 82px !important; }
}

/* Phone: the same command field condenses instead of becoming a dashboard. */
@media (max-width: 680px) {
  .os-command-rail { grid-template-columns: minmax(116px, 1fr) auto; }
  .os-identity-sub { font-size: 6.5px; }
  .os-rail-action.os-ai-action,
  .os-profile { display: none !important; }
  .os-primary-nav button { font-size: 9px; }
  .command-os-enabled .console-center { grid-template-rows: 700px 118px; }
  .command-os-enabled .dashboard-brief {
    top: 22px;
    left: 16px;
    width: calc(100% - 96px);
  }
  .command-os-enabled .dashboard-brief-kicker { margin-bottom: 7px; font-size: 8px; }
  .command-os-enabled .dashboard-brief h1 { margin-bottom: 7px; font-size: 23px; }
  .command-os-enabled .dashboard-brief-copy > p:last-child { max-width: 290px; font-size: 11px; }
  .os-field-modes,
  .os-access-version { top: 16px; right: 12px; }
  .os-field-modes button:not(.is-active) { display: none; }
  .os-field-modes button { padding: 5px 8px; }
  .os-access-version { min-width: 154px; padding: 7px 10px; }
  .os-access-version i { max-width: 150px; }
  .dashboard-intel-band { grid-template-columns: 1fr; overflow-x: auto; scrollbar-width: thin; }
  .dashboard-intel-grid { display: flex; min-width: max-content; }
  .dashboard-intel-card { flex: 0 0 154px; padding: 13px 12px; }
  .os-earth-horizon { object-position: 50% 54%; opacity: 0.68; }
  .os-orbit,
  .os-node-core { display: none; }
  .os-gravity-map {
    top: 130px;
    right: 0;
    bottom: auto;
    left: 0;
    display: flex;
    gap: 22px;
    height: 76px;
    padding: 9px 16px;
    overflow-x: auto;
  }
  .os-node,
  .os-node[data-os-node] {
    position: relative;
    top: auto;
    left: auto;
    flex: 0 0 104px;
    min-width: 104px;
    transform: none;
  }
  .os-node:hover,
  .os-node:focus-visible { transform: scale(1.02); }
  .os-node i { max-width: 104px; overflow: hidden; text-overflow: ellipsis; }
  .command-os-enabled .hero2-copy { right: 12px; bottom: 12px; left: 12px; }
  .os-command-state { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .os-command-state > span:nth-child(2) { border-right: 0; }
  .os-command-state > span:nth-child(-n + 2) { border-bottom: 1px solid rgba(133, 171, 198, 0.1); }
  .os-execution-modes {
    position: static;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    padding: 3px;
    border-right: 1px solid rgba(133, 171, 198, 0.18);
    border-left: 1px solid rgba(133, 171, 198, 0.18);
    background: rgba(4, 10, 16, 0.88);
  }
  .os-execution-modes button { padding-block: 7px; }
  .command-os-enabled .chatbox { min-height: 118px; }
  .command-os-enabled .chatbox-log { max-height: 46px; padding-inline: 12px; }
  .command-os-enabled .chatbox-composer { padding: 8px 58px 8px 12px; }
  .command-os-enabled .chatbox-composer input { font-size: 16px; }
  .os-division-strip button { flex-basis: 136px; padding: 14px 12px; }
  .os-division-strip b { margin-top: 7px; }
  .os-division-strip i { margin-top: 4px; }
  .os-mission-peek { top: 8px; right: 8px; }
  .command-os-enabled .console-rail { top: 8px; right: 8px; bottom: 78px; width: calc(100vw - 16px); }
}

@media (prefers-reduced-motion: reduce) {
  .os-primary-nav button::after,
  .os-node,
  .os-division-strip button,
  .command-os-enabled .console-rail,
  .command-os-enabled > .sidebar {
    transition: none !important;
  }
}

/* Final command OS ownership layer. The legacy dashboard stylesheet has later,
   highly specific hero/chat selectors; these keep the 2040 shell authoritative. */
html[data-command-os="2040"] .phantom.command-os-enabled .app-main > .console:not(.console-workspace) {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 360px !important;
  gap: 0 !important;
  height: calc(100dvh - 108px) !important;
  min-height: 680px !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: #03070c !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled {
  height: 100dvh !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .app-main {
  flex: 0 0 auto !important;
  height: calc(100dvh - 70px) !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .app-main > .console:not(.console-workspace) {
  height: calc(100dvh - 108px) !important;
  min-height: 0 !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .console-center {
  display: grid !important;
  grid-template-rows: minmax(430px, 1fr) 150px !important;
  gap: 0 !important;
  min-width: 0 !important;
  height: 100% !important;
  padding: 0 !important;
  overflow: hidden !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .hero2 {
  position: relative !important;
  display: block !important;
  grid-row: 1 !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: #040910 !important;
  box-shadow: none !important;
  transform: none !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .hero2::before {
  content: "" !important;
  position: absolute !important;
  inset: 0 !important;
  z-index: 4 !important;
  display: block !important;
  pointer-events: none !important;
  background:
    linear-gradient(180deg, rgba(3, 7, 12, 0.3) 0%, rgba(3, 7, 12, 0.02) 34%, rgba(3, 7, 12, 0.05) 62%, rgba(3, 7, 12, 0.72) 100%),
    radial-gradient(circle at 58% 61%, rgba(88, 139, 255, 0.2), transparent 24%) !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .hero2-stage {
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  min-width: 0 !important;
  min-height: 0 !important;
  max-width: none !important;
  max-height: none !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  opacity: 1 !important;
  transform: none !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .os-earth-horizon {
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  object-position: center 56% !important;
  opacity: 1 !important;
  filter: saturate(0.98) brightness(1.05) contrast(1.08) !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .os-gravity-map {
  position: absolute !important;
  inset: 0 !important;
  z-index: 6 !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  overflow: visible !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .phantom-webgl,
html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .phantom-mode-stage,
html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .phantom-mode-pose,
html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .ghost-canvas {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .hero2-copy {
  position: absolute !important;
  right: clamp(22px, 3vw, 48px) !important;
  bottom: 22px !important;
  left: clamp(260px, 26vw, 340px) !important;
  z-index: 24 !important;
  display: block !important;
  width: auto !important;
  max-width: none !important;
  height: auto !important;
  padding: 0 !important;
  overflow: visible !important;
  opacity: 1 !important;
  transform: none !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .chatbox {
  position: relative !important;
  display: block !important;
  width: 100% !important;
  height: auto !important;
  min-height: 104px !important;
  max-height: none !important;
  overflow: hidden !important;
  border: 1px solid rgba(133, 171, 198, 0.22) !important;
  border-radius: 0 0 7px 7px !important;
  background: rgba(3, 8, 13, 0.94) !important;
  box-shadow: 0 22px 70px rgba(0, 0, 0, 0.34), inset 0 1px rgba(255, 255, 255, 0.02) !important;
  backdrop-filter: blur(22px);
}

html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .chatbox-head,
html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .chat-start {
  display: none !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .chatbox-log {
  display: block !important;
  max-height: 42px !important;
  min-height: 0 !important;
  padding: 8px 14px 0 !important;
  overflow: hidden !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .chatbox-log:empty {
  display: none !important;
  padding: 0 !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .chatbox-composer {
  display: flex !important;
  align-items: center !important;
  min-height: 62px !important;
  padding: 8px 200px 8px 16px !important;
  border-top: 1px solid rgba(133, 171, 198, 0.1) !important;
  background: transparent !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .chatbox-composer input {
  width: 100% !important;
  height: 42px !important;
  color: #eef4f7 !important;
  background: transparent !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .console-rail {
  position: static !important;
  z-index: auto !important;
  display: flex !important;
  width: auto !important;
  height: 100% !important;
  padding: 22px 20px !important;
  overflow: hidden auto !important;
  opacity: 1 !important;
  transform: none !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .dashboard-brief {
  opacity: 1 !important;
  filter: none !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .dashboard-brief h1 {
  color: #f4f7f8 !important;
  text-shadow: 0 10px 34px rgba(0, 0, 0, 0.48) !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .dashboard-brief p {
  color: rgba(210, 221, 228, 0.82) !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .dashboard-brief-kicker {
  color: rgba(161, 178, 191, 0.86) !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .os-node {
  opacity: 1 !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .phantomwire {
  position: relative !important;
  top: auto !important;
  z-index: 65 !important;
  flex: 0 0 38px !important;
}

@media (max-width: 1180px) {
  html[data-command-os="2040"] .phantom.command-os-enabled .app-main > .console:not(.console-workspace) {
    grid-template-columns: minmax(0, 1fr) !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .console-rail {
    position: fixed !important;
    top: 86px !important;
    right: 16px !important;
    bottom: 16px !important;
    width: min(360px, calc(100vw - 32px)) !important;
    height: auto !important;
    opacity: 0 !important;
    pointer-events: none !important;
    transform: translateX(calc(100% + 24px)) !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled.os-mission-open .console:not(.console-workspace) .console-rail {
    opacity: 1 !important;
    pointer-events: auto !important;
    transform: translateX(0) !important;
  }
}

@media (max-width: 900px) {
  html[data-command-os="2040"] .phantom.command-os-enabled .app-main > .console:not(.console-workspace) {
    height: auto !important;
    min-height: calc(100dvh - 130px) !important;
    padding-bottom: 68px !important;
    overflow: visible !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .console-center {
    grid-template-rows: 650px 132px !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .hero2-copy {
    right: 18px !important;
    bottom: 18px !important;
    left: 18px !important;
  }
}

@media (max-width: 680px) {
  html[data-command-os="2040"] .phantom.command-os-enabled .console-center {
    grid-template-rows: calc(100dvh - 175px) !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .hero2-copy {
    right: 12px !important;
    bottom: calc(88px + env(safe-area-inset-bottom, 0px)) !important;
    left: 12px !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .chatbox-composer {
    padding: 8px 58px 8px 12px !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .chatbox {
    min-height: 104px !important;
    border-color: rgba(106, 165, 255, 0.34) !important;
    background: rgba(4, 9, 15, 0.98) !important;
    box-shadow: 0 0 0 1px rgba(103, 165, 255, 0.1), 0 18px 48px rgba(0, 0, 0, 0.48) !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .os-earth-horizon {
    object-position: 50% 72% !important;
    filter: saturate(1.05) brightness(1.22) contrast(1.12) !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .os-gravity-map,
  html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .os-field-modes {
    display: none !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .dashboard-brief {
    top: 24px !important;
    left: 18px !important;
    width: calc(100% - 36px) !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .dashboard-brief h1 {
    max-width: 340px !important;
    font-size: 30px !important;
    line-height: 0.96 !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .dashboard-brief p {
    max-width: 310px !important;
    font-size: 12px !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .os-division-strip {
    display: none !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .mobile-bottom-nav {
    background: #050a10 !important;
    border-color: rgba(133, 171, 198, 0.2) !important;
    box-shadow: 0 -18px 50px rgba(0, 0, 0, 0.45) !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .mobile-bottom-nav::before,
  html[data-command-os="2040"] .phantom.command-os-enabled .mobile-bottom-nav::after {
    content: none !important;
    display: none !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .mobile-bottom-item {
    background: transparent !important;
    color: #71808b !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .mobile-bottom-item.is-active {
    background: rgba(71, 129, 214, 0.16) !important;
    color: #dfe9ef !important;
  }
}

/* Compact shell: the fixed bottom dock is the only mobile navigation bar.
   The desktop Command OS rail and the old phone homebar both duplicate it on
   small screens, so content starts at the top and navigation lives below. */
@media (max-width: 900px) {
  html[data-command-os="2040"] .phantom.command-os-enabled {
    --mobile-admin-topbar: 0px !important;
    height: auto !important;
    min-height: 100dvh !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .os-command-rail {
    display: none !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .mobile-admin-homebar {
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled > .sidebar:not(.is-expanded) {
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled > .sidebar.is-expanded {
    display: flex !important;
    opacity: 1 !important;
    visibility: visible !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .mobile-bottom-nav {
    display: grid !important;
    position: fixed !important;
    left: 10px !important;
    right: 10px !important;
    bottom: calc(8px + env(safe-area-inset-bottom, 0px)) !important;
    grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
    gap: 2px !important;
    min-height: 64px !important;
    padding: 7px 10px !important;
    overflow: hidden !important;
    border-radius: 22px !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .mobile-bottom-item {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    min-height: 50px !important;
    flex: none !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .mobile-bottom-item span {
    max-width: 100% !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .app-main {
    height: auto !important;
    min-height: calc(100dvh - var(--mobile-admin-topbar, 64px)) !important;
    overflow: visible !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .phantomwire {
    top: var(--mobile-admin-topbar, 64px) !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .app-main > .console:not(.console-workspace) {
    height: auto !important;
    min-height: calc(100dvh - var(--mobile-admin-topbar, 64px)) !important;
    padding-bottom: calc(var(--mobile-admin-taskbar, 80px) + env(safe-area-inset-bottom, 0px)) !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled > .sidebar {
    top: calc(var(--mobile-admin-topbar, 64px) + 10px) !important;
    bottom: calc(var(--mobile-admin-taskbar, 80px) + 10px + env(safe-area-inset-bottom, 0px)) !important;
  }
}

/* ============================================================= */
/* ==== LIVE SIGNALS — instruments, not shortcuts ============== */
/* ============================================================= */
/* The rail's third panel and the division strip stopped being a second
   navigation and became telemetry: every number here is real store/ledger/
   analytics data or a truthful empty state — never a prop. */

.command-os-enabled .signals-card {
  padding: 18px 0 6px;
  border: 0;
  background: transparent;
}

.signals-grid { display: grid; gap: 4px; }

.os-signal {
  position: relative;
  display: grid;
  gap: 5px;
  padding: 12px 10px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: inherit;
  text-align: left;
  cursor: pointer;
  transition: background 180ms ease, transform 180ms ease;
}
.os-signal:hover { background: rgba(255, 255, 255, 0.025); transform: translateY(-1px); }
.os-signal:active { transform: translateY(0); }

.os-signal-k {
  display: flex;
  align-items: center;
  gap: 7px;
  color: #687783;
  font: 500 8px "Spline Sans Mono", monospace;
  letter-spacing: 0.17em;
  text-transform: uppercase;
}
.os-signal-led {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: rgba(133, 171, 198, 0.3);
  text-decoration: none;
}
.os-signal-led.is-on {
  background: #7c6cff;
  box-shadow: 0 0 9px rgba(124, 108, 255, 0.75);
  animation: osLedPulse 2.6s ease-in-out infinite;
}
@keyframes osLedPulse {
  50% { box-shadow: 0 0 3px rgba(124, 108, 255, 0.35); }
}

.os-signal-v {
  color: #eef4f7;
  font: 600 21px "Spline Sans Mono", monospace;
  letter-spacing: -0.01em;
  line-height: 1;
  font-variant-numeric: tabular-nums;
}
.os-signal-v.is-empty { color: #4d5b66; }
.os-signal-d {
  overflow: hidden;
  color: #75838e;
  font-size: 9.5px;
  font-style: normal;
  line-height: 1.4;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* spark bars: series drawn as growing columns, newest on the right */
.os-signal-spark {
  display: flex;
  align-items: flex-end;
  gap: 2px;
  height: 26px;
  margin-top: 3px;
  overflow: hidden;
}
.os-signal-spark i {
  flex: 1 1 auto;
  min-width: 2px;
  height: var(--h, 4%);
  border-radius: 1px 1px 0 0;
  background: linear-gradient(180deg, #7c6cff, rgba(79, 141, 255, 0.55));
  opacity: 0.85;
  transform-origin: bottom;
  animation: osSparkGrow 640ms cubic-bezier(0.22, 1, 0.36, 1) backwards;
}
.os-signal-spark i:nth-child(-n + 30) { animation-delay: calc(var(--d, 0) * 1ms); }
.os-signal-spark.is-ghost {
  border-bottom: 1px dashed rgba(133, 171, 198, 0.25);
}
@keyframes osSparkGrow {
  from { transform: scaleY(0); }
}

/* force-load meter: five cells that light with real activity */
.os-signal-load { display: inline-flex; gap: 3px; margin-top: 4px; }
.os-signal-load i {
  width: 16px;
  height: 4px;
  border-radius: 1px;
  background: rgba(133, 171, 198, 0.16);
}
.os-signal-load.is-on i:first-child,
.os-signal-load.is-on i:nth-child(2) {
  background: #7c6cff;
  box-shadow: 0 0 7px rgba(124, 108, 255, 0.5);
  animation: osLedPulse 2.2s ease-in-out infinite;
}

/* division strip instruments: real metric riding each plate */
.os-division-metric {
  position: absolute;
  top: 15px;
  right: 16px;
  color: #63e2a9;
  font: 600 11px "Spline Sans Mono", monospace;
  font-style: normal;
  letter-spacing: 0.02em;
  font-variant-numeric: tabular-nums;
}
.os-division-metric[data-empty="true"] { color: #4a5863; }

/* The execution-mode tabs float over the chat card's bottom-right corner —
   reserve that band inside the card so the send button never sits underneath
   the Monitor tab (it was click-blocked there before this rule). */
.command-os-enabled .hero2-copy .chatbox { padding-bottom: 38px; }

/* The gravity map is an instrument, not a poster. phantom.css still carries
   the legacy `.hero2-stage { pointer-events: none }` from when the stage was
   pure decoration — the stage stays click-through, but the nodes and the
   field-mode tabs inside it take the pointer back so every metric is a real
   control (they were unclickable before this rule). */
.command-os-enabled .hero2-stage .os-gravity-map .os-node,
.command-os-enabled .hero2-stage .os-field-modes,
.command-os-enabled .hero2-stage .os-field-modes button,
.command-os-enabled .hero2-stage .os-access-version {
  pointer-events: auto;
}

/* the gravity core now charges the chat instead of leaving the room */
.os-node-core { cursor: pointer; }
.os-chat-charged {
  animation: osChatCharge 900ms cubic-bezier(0.22, 1, 0.36, 1);
}
@keyframes osChatCharge {
  0% { box-shadow: 0 0 0 0 rgba(124, 108, 255, 0.55); }
  100% { box-shadow: 0 0 0 26px rgba(124, 108, 255, 0); }
}

@media (prefers-reduced-motion: reduce) {
  .os-signal-spark i { animation: none; }
  .os-signal-led.is-on,
  .os-signal-load.is-on i { animation: none; }
  .os-chat-charged { animation: none; }
}

/* ============================================================= */
/* ==== GRAVITY MAP — a living instrument, not a poster ======== */
/* ============================================================= */

/* energy conduits: node -> PHANTOM core, drawn in the map's own %-space */
.os-gravity-beams {
  position: absolute;
  inset: 0;
  z-index: 1;
  width: 100%;
  height: 100%;
  overflow: visible;
  pointer-events: none;
}
.os-beam {
  fill: none;
  stroke: rgba(111, 168, 235, 0.15);
  stroke-width: 1;
  stroke-dasharray: 1 4;
  vector-effect: non-scaling-stroke;
  animation: osBeamDrift 3.4s linear infinite;
}
.os-beam.is-live {
  stroke: rgba(122, 198, 255, 0.5);
  filter: drop-shadow(0 0 2px rgba(96, 172, 255, 0.7));
}
@keyframes osBeamDrift { to { stroke-dashoffset: -10; } }

/* data packets riding a live conduit into the core (the brain ingesting) */
.os-flow {
  position: absolute;
  z-index: 3;
  width: 5px;
  height: 5px;
  margin: -2.5px 0 0 -2.5px;
  border-radius: 50%;
  background: #aeddff;
  box-shadow: 0 0 9px 1px rgba(130, 195, 255, 0.9);
  opacity: 0;
  pointer-events: none;
}
.os-flow.is-live[data-flow="revenue"] { animation: osFlowRevenue 3.6s linear infinite; }
.os-flow.is-live[data-flow="clients"] { animation: osFlowClients 4s linear infinite 0.4s; }
.os-flow.is-live[data-flow="missions"] { animation: osFlowMissions 3.2s linear infinite 0.9s; }
.os-flow.is-live[data-flow="approvals"] { animation: osFlowApprovals 3.9s linear infinite 0.2s; }
.os-flow.is-live[data-flow="risk"] { animation: osFlowRisk 4.4s linear infinite 1.1s; }
.os-flow.is-live[data-flow="health"] { animation: osFlowHealth 3.4s linear infinite 0.6s; }
@keyframes osFlowRevenue { 0% { left: 33%; top: 38%; opacity: 0; } 14% { opacity: 1; } 86% { opacity: 1; } 100% { left: 58%; top: 58%; opacity: 0; } }
@keyframes osFlowClients { 0% { left: 45%; top: 30%; opacity: 0; } 14% { opacity: 1; } 86% { opacity: 1; } 100% { left: 58%; top: 58%; opacity: 0; } }
@keyframes osFlowMissions { 0% { left: 58%; top: 27%; opacity: 0; } 14% { opacity: 1; } 86% { opacity: 1; } 100% { left: 58%; top: 58%; opacity: 0; } }
@keyframes osFlowApprovals { 0% { left: 71%; top: 35%; opacity: 0; } 14% { opacity: 1; } 86% { opacity: 1; } 100% { left: 58%; top: 58%; opacity: 0; } }
@keyframes osFlowRisk { 0% { left: 81%; top: 48%; opacity: 0; } 14% { opacity: 1; } 86% { opacity: 1; } 100% { left: 58%; top: 58%; opacity: 0; } }
@keyframes osFlowHealth { 0% { left: 72%; top: 56%; opacity: 0; } 14% { opacity: 1; } 86% { opacity: 1; } 100% { left: 58%; top: 58%; opacity: 0; } }

/* slow radar sweep across the field */
.os-radar {
  position: absolute;
  left: 58%;
  top: 58%;
  z-index: 0;
  height: 150%;
  aspect-ratio: 1;
  transform: translate(-50%, -50%);
  border-radius: 50%;
  pointer-events: none;
  background: conic-gradient(from 0deg, transparent 0deg, rgba(94, 164, 255, 0.09) 24deg, rgba(94, 164, 255, 0.02) 40deg, transparent 52deg);
  -webkit-mask: radial-gradient(circle, #000 40%, transparent 72%);
  mask: radial-gradient(circle, #000 40%, transparent 72%);
  opacity: 0.75;
  animation: osRadar 8s linear infinite;
}
@keyframes osRadar { to { transform: translate(-50%, -50%) rotate(360deg); } }

/* metric nodes react when their number is real */
.os-node.is-live::before {
  border-color: rgba(160, 220, 255, 1);
  background: #16304d;
  box-shadow: 0 0 14px rgba(112, 182, 255, 0.95);
}
.os-node.is-live::after {
  content: "";
  position: absolute;
  top: 4px;
  left: 0;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  border: 1px solid rgba(140, 205, 255, 0.75);
  pointer-events: none;
  animation: osNodePing 2.4s ease-out infinite;
}
@keyframes osNodePing {
  0% { transform: scale(1); opacity: 0.85; }
  100% { transform: scale(3.6); opacity: 0; }
}

/* the core is a reactor: a spinning arc + a breathing halo */
.os-core-ring {
  position: absolute;
  inset: -7px;
  border-radius: 50%;
  border: 1px solid rgba(120, 190, 255, 0.22);
  border-top-color: rgba(158, 222, 255, 0.9);
  border-right-color: rgba(120, 200, 255, 0.55);
  pointer-events: none;
  animation: osSpin 5.5s linear infinite;
}
.os-node-core::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 50%;
  pointer-events: none;
  animation: osCorePulse 3.2s ease-in-out infinite;
}
@keyframes osSpin { to { transform: rotate(360deg); } }
@keyframes osCorePulse {
  0%, 100% { box-shadow: 0 0 30px 2px rgba(80, 150, 255, 0.16); }
  50% { box-shadow: 0 0 48px 7px rgba(92, 172, 255, 0.32); }
}

/* ============================================================= */
/* ==== DIVISION MICRO-VIZ + PIPELINE PROPORTION ============== */
/* ============================================================= */
.os-mini-spark { display: flex; align-items: flex-end; gap: 2px; width: 100%; height: 20px; }
.os-mini-spark i {
  flex: 1 1 auto;
  min-width: 2px;
  height: var(--h, 8%);
  border-radius: 1px 1px 0 0;
  background: linear-gradient(180deg, #63e2a9, rgba(79, 141, 255, 0.5));
  opacity: 0.88;
  animation: osSparkGrow 560ms cubic-bezier(0.22, 1, 0.36, 1) backwards;
}
.os-mini-spark.is-ghost { border-bottom: 1px dashed rgba(133, 171, 198, 0.22); }

.os-cells { display: flex; align-items: center; gap: 3px; height: 20px; }
.os-cells i {
  width: 9px;
  height: 9px;
  border-radius: 2px;
  background: rgba(133, 171, 198, 0.14);
  transition: background 200ms ease;
}
.os-cells i.is-on {
  background: #7c6cff;
  box-shadow: 0 0 7px rgba(124, 108, 255, 0.5);
  animation: osCellIn 380ms cubic-bezier(0.22, 1, 0.36, 1) backwards;
}
.os-cells i.is-on:nth-child(2) { animation-delay: 40ms; }
.os-cells i.is-on:nth-child(3) { animation-delay: 80ms; }
.os-cells i.is-on:nth-child(4) { animation-delay: 120ms; }
.os-cells i.is-on:nth-child(5) { animation-delay: 160ms; }
.os-cells i.is-on:nth-child(n+6) { animation-delay: 200ms; }
@keyframes osCellIn { from { transform: scale(0.2); opacity: 0; } }

.os-eq { display: flex; align-items: flex-end; gap: 3px; height: 20px; }
.os-eq i {
  width: 4px;
  border-radius: 1px;
  background: linear-gradient(180deg, #8a6bff, #7c6cff);
  animation: osEq 1.05s ease-in-out infinite;
}
.os-eq i:nth-child(1) { animation-delay: 0ms; }
.os-eq i:nth-child(2) { animation-delay: 130ms; }
.os-eq i:nth-child(3) { animation-delay: 260ms; }
.os-eq i:nth-child(4) { animation-delay: 90ms; }
.os-eq i:nth-child(5) { animation-delay: 200ms; }
@keyframes osEq { 0%, 100% { height: 5px; } 50% { height: 19px; } }

.os-ping { position: relative; width: 20px; height: 20px; }
.os-ping::before,
.os-ping::after {
  content: "";
  position: absolute;
  left: 3px;
  top: 50%;
  width: 5px;
  height: 5px;
  border-radius: 50%;
  transform: translateY(-50%);
}
.os-ping::before { background: #4f8dff; box-shadow: 0 0 8px #4f8dff; }
.os-ping::after { border: 1px solid rgba(79, 141, 255, 0.7); animation: osPingOut 2s ease-out infinite; }
@keyframes osPingOut {
  0% { transform: translateY(-50%) scale(1); opacity: 0.85; }
  100% { transform: translateY(-50%) scale(4.2); opacity: 0; }
}

.os-signal-prop {
  position: relative;
  display: block;
  height: 5px;
  margin-top: 7px;
  border-radius: 3px;
  background: rgba(133, 171, 198, 0.16);
  overflow: hidden;
}
.os-signal-prop::before {
  content: "";
  position: absolute;
  inset: 0;
  width: var(--won, 0%);
  border-radius: 3px;
  background: linear-gradient(90deg, #7c6cff, #4f8dff);
  box-shadow: 0 0 8px rgba(124, 108, 255, 0.4);
  animation: osPropGrow 720ms cubic-bezier(0.22, 1, 0.36, 1);
}
.os-signal-prop.is-ghost { background: rgba(133, 171, 198, 0.1); }
@keyframes osPropGrow { from { width: 0; } }

@keyframes osDeckRise { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }

@media (prefers-reduced-motion: reduce) {
  .os-beam,
  .os-flow.is-live,
  .os-radar,
  .os-node.is-live::after,
  .os-core-ring,
  .os-node-core::after,
  .os-mini-spark i,
  .os-cells i.is-on,
  .os-eq i,
  .os-ping::after,
  .os-signal-prop::before,
  .os-division-strip button { animation: none; }
  .os-flow.is-live { opacity: 0; }
}

/* ============================================================= */
/* ==== OS FEEL — power-on / HUD / ambient / keys / toasts ===== */
/* ============================================================= */

/* ---- power-on sequence ---- */
.os-poweron {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: grid;
  place-items: center;
  overflow: hidden;
  background: radial-gradient(120% 90% at 50% 42%, #071018, #02060b 70%);
  animation: osPowerDim 2.2s ease forwards;
  pointer-events: none;
}
.os-poweron.is-gone { opacity: 0; transition: opacity 0.6s ease; pointer-events: none; }
.os-poweron-scan {
  position: absolute;
  left: 0;
  right: 0;
  height: 40%;
  background: linear-gradient(180deg, transparent, rgba(124, 108, 255, 0.06) 60%, rgba(124, 108, 255, 0.14));
  filter: blur(6px);
  animation: osPowerScan 1.5s cubic-bezier(0.5, 0, 0.2, 1) 1;
  pointer-events: none;
}
.os-poweron-inner {
  position: relative;
  width: min(440px, 86vw);
  padding: 0 6px;
  pointer-events: auto;
}
.os-poweron-mark {
  color: #eef6fb;
  font: 700 26px "Instrument Sans", sans-serif;
  letter-spacing: 0.22em;
  animation: osPowerIn 0.5s ease both;
}
.os-poweron-mark em { color: #7c6cff; font-style: normal; }
.os-poweron-tag {
  margin: 6px 0 22px;
  color: #6c7c88;
  font: 500 9px "Spline Sans Mono", monospace;
  letter-spacing: 0.32em;
  animation: osPowerIn 0.5s ease 0.1s both;
}
.os-poweron-lines { margin: 0; padding: 0; list-style: none; display: grid; gap: 9px; }
.os-poweron-lines li {
  display: grid;
  grid-template-columns: 130px 1fr auto;
  align-items: center;
  gap: 12px;
  color: #aeb9c2;
  font: 500 11px "Spline Sans Mono", monospace;
  opacity: 0;
  animation: osPowerLine 0.4s cubic-bezier(0.22, 1, 0.36, 1) both;
  animation-delay: calc(0.28s + var(--i) * 0.19s);
}
.os-poweron-lines span { color: #66c1ff; letter-spacing: 0.12em; }
.os-poweron-lines b { color: #dfe8ee; font-weight: 500; }
.os-poweron-lines u {
  color: #04140d;
  background: #7c6cff;
  border-radius: 3px;
  padding: 1px 6px;
  font-size: 8.5px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-decoration: none;
}
.os-poweron-done {
  margin-top: 20px;
  padding-top: 14px;
  border-top: 1px solid rgba(133, 171, 198, 0.16);
  color: #7c6cff;
  font: 700 12px "Spline Sans Mono", monospace;
  letter-spacing: 0.24em;
  opacity: 0;
  animation: osPowerIn 0.5s ease both;
  animation-delay: calc(0.28s + var(--i) * 0.19s);
}
@keyframes osPowerDim { 0%, 78% { opacity: 1; } 100% { opacity: 1; } }
@keyframes osPowerIn { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
@keyframes osPowerLine { from { opacity: 0; transform: translateX(-10px); } to { opacity: 1; transform: none; } }
@keyframes osPowerScan { from { top: -40%; } to { top: 100%; } }

/* ---- living HUD in the status bar ---- */
.os-hud { display: inline-flex; align-items: center; gap: 9px; padding: 0 clamp(12px, 1.4vw, 24px); border-right: 1px solid rgba(133, 171, 198, 0.1); }
.os-ecg { width: 62px; height: 15px; overflow: visible; }
.os-ecg polyline {
  fill: none;
  stroke: #7c6cff;
  stroke-width: 1.4;
  stroke-linejoin: round;
  stroke-linecap: round;
  filter: drop-shadow(0 0 3px rgba(124, 108, 255, 0.6));
  stroke-dasharray: 66 66;
  animation: osEcg 2.4s linear infinite;
}
@keyframes osEcg { from { stroke-dashoffset: 66; } to { stroke-dashoffset: -66; } }
.os-uptime { color: #9fb0bb !important; font: 500 10px "Spline Sans Mono", monospace !important; font-variant-numeric: tabular-nums; letter-spacing: 0.06em; }

/* ---- ambient: faint scanlines + vignette, the console is never dead ---- */
.os-ambient {
  position: fixed;
  inset: 0;
  z-index: 8;
  pointer-events: none;
  background:
    repeating-linear-gradient(0deg, rgba(0, 0, 0, 0.16) 0 1px, transparent 1px 3px),
    radial-gradient(130% 100% at 50% 45%, transparent 62%, rgba(2, 6, 11, 0.55) 100%);
  opacity: 0.5;
  mix-blend-mode: multiply;
}

/* ---- go-mode: the map arms for a keyboard jump ---- */
.os-go-armed .os-command-rail::after {
  content: "GO →";
  position: absolute;
  left: 50%;
  bottom: -22px;
  transform: translateX(-50%);
  z-index: 90;
  padding: 3px 10px;
  border-radius: 4px;
  background: rgba(124, 108, 255, 0.16);
  color: #7defb8;
  font: 700 9px "Spline Sans Mono", monospace;
  letter-spacing: 0.18em;
  box-shadow: 0 0 18px rgba(124, 108, 255, 0.25);
  animation: osPowerIn 0.16s ease both;
}

/* ---- keyboard cheatsheet ---- */
.os-keys {
  position: fixed;
  inset: 0;
  z-index: 9998;
  display: grid;
  place-items: center;
  padding: 20px;
  background: rgba(2, 6, 11, 0.7);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  animation: osPowerIn 0.18s ease both;
}
.os-keys-panel {
  width: min(660px, 100%);
  padding: 22px 24px 24px;
  border: 1px solid rgba(133, 171, 198, 0.2);
  border-radius: 12px;
  background: linear-gradient(180deg, #0b141d, #060c13);
  box-shadow: 0 40px 120px rgba(0, 0, 0, 0.6), 0 0 60px rgba(79, 141, 255, 0.08);
}
.os-keys-panel header { display: flex; align-items: baseline; justify-content: space-between; margin-bottom: 18px; }
.os-keys-panel header b { color: #eef4f7; font: 700 12px "Spline Sans Mono", monospace; letter-spacing: 0.2em; }
.os-keys-panel header span { color: #63717c; font: 500 9px "Spline Sans Mono", monospace; letter-spacing: 0.14em; }
.os-keys-grid { display: grid; grid-template-columns: 1fr 1.35fr; gap: 26px; }
.os-keys-grid h4 { margin: 0 0 12px; color: #7c6cff; font: 700 9px "Spline Sans Mono", monospace; letter-spacing: 0.16em; text-transform: uppercase; }
.os-keys-grid p { display: flex; align-items: center; gap: 8px; margin: 0 0 10px; }
.os-keys-grid kbd {
  min-width: 20px;
  padding: 3px 7px;
  border: 1px solid rgba(133, 171, 198, 0.28);
  border-bottom-width: 2px;
  border-radius: 5px;
  background: rgba(133, 171, 198, 0.08);
  color: #cdd8df;
  font: 600 10px "Spline Sans Mono", monospace;
  text-align: center;
}
.os-keys-grid i { color: #97a5b0; font-size: 11.5px; font-style: normal; }
@media (max-width: 720px) { .os-keys-grid { grid-template-columns: 1fr; gap: 18px; } }

/* ---- ⌘K discoverability on the Search action ---- */
.os-rail-action[data-cmdk-open]::after {
  content: "⌘K";
  margin-left: 7px;
  padding: 1px 5px;
  border: 1px solid rgba(133, 171, 198, 0.24);
  border-radius: 4px;
  color: #7c8994;
  font: 600 8.5px "Spline Sans Mono", monospace;
  vertical-align: middle;
}

/* ---- real-event toasts ---- */
.os-toasts {
  position: fixed;
  right: 18px;
  bottom: 52px;
  z-index: 9990;
  display: flex;
  flex-direction: column;
  gap: 10px;
  width: min(320px, calc(100vw - 32px));
  pointer-events: none;
}
.os-toast {
  display: flex;
  align-items: flex-start;
  gap: 11px;
  padding: 13px 14px;
  border: 1px solid rgba(133, 171, 198, 0.2);
  border-left: 2px solid #4f8dff;
  border-radius: 8px;
  background: linear-gradient(180deg, rgba(14, 22, 31, 0.98), rgba(8, 14, 20, 0.98));
  box-shadow: 0 22px 60px rgba(0, 0, 0, 0.55);
  -webkit-backdrop-filter: blur(16px);
  backdrop-filter: blur(16px);
  cursor: pointer;
  pointer-events: auto;
  opacity: 0;
  transform: translateX(28px);
  transition: opacity 0.4s ease, transform 0.4s cubic-bezier(0.22, 1, 0.36, 1);
}
.os-toast.is-in { opacity: 1; transform: none; }
.os-toast-ok { border-left-color: #7c6cff; }
.os-toast-warn { border-left-color: #e8b85a; }
.os-toast-led { width: 7px; height: 7px; margin-top: 4px; border-radius: 50%; flex: 0 0 auto; background: #4f8dff; box-shadow: 0 0 10px currentColor; animation: osLedPulse 2s ease-in-out infinite; }
.os-toast-ok .os-toast-led { background: #7c6cff; }
.os-toast-warn .os-toast-led { background: #e8b85a; }
.os-toast-body b { display: block; color: #eef4f7; font-size: 12.5px; font-weight: 600; }
.os-toast-body i { display: block; margin-top: 2px; color: #8f9ca8; font-size: 10.5px; font-style: normal; }

@media (prefers-reduced-motion: reduce) {
  .os-poweron, .os-poweron-scan, .os-poweron-mark, .os-poweron-tag, .os-poweron-lines li, .os-poweron-done,
  .os-ecg polyline, .os-toast-led { animation: none; }
  .os-toast { transition: opacity 0.2s ease; transform: none; }
}

/* ============================================================= */
/* ==== INTERACTIVE DEPTH — the world responds to your hand ==== */
/* ============================================================= */

/* smooth parallax on the map's depth planes (driven by --px/--py on :root) */
.os-gravity-beams,
.os-flow,
.os-node,
.os-node-core {
  translate: calc(var(--px, 0) * 8px) calc(var(--py, 0) * 8px);
  transition: translate 0.45s cubic-bezier(0.22, 1, 0.36, 1);
}
.os-orbit {
  translate: calc(var(--px, 0) * 22px) calc(var(--py, 0) * 17px);
  transition: translate 0.6s cubic-bezier(0.22, 1, 0.36, 1);
}
.os-radar { transition: translate 0.6s cubic-bezier(0.22, 1, 0.36, 1); translate: calc(var(--px, 0) * 30px) calc(var(--py, 0) * 22px); }
.os-earth-horizon { transition: scale 0.7s ease; scale: calc(1.015 + (var(--px, 0) * var(--px, 0) + var(--py, 0) * var(--py, 0)) * 0.01); }

/* magnetic nodes: the nearest node lights and lifts toward the cursor */
.os-node { scale: calc(1 + var(--mag, 0) * 0.13); transition: scale 0.25s ease, filter 0.25s ease; filter: brightness(calc(1 + var(--mag, 0) * 0.55)); }
.os-node::before { transition: box-shadow 0.25s ease, border-color 0.25s ease; }
.os-node[style*="--mag"]::before { box-shadow: 0 0 calc(12px + var(--mag, 0) * 20px) rgba(112, 182, 255, calc(0.6 + var(--mag, 0) * 0.4)); }
.os-beam { transition: stroke-opacity 0.25s ease; }
.os-beam[style*="--mag"] { stroke-opacity: calc(0.6 + var(--mag, 0) * 0.4); }
.os-node:hover,
.os-node:focus-visible { z-index: 8; scale: 1.12; filter: brightness(1.28); }

/* real-event choreography: a node flares when its metric actually changes */
.os-node.is-pinging { animation: osNodeFlare 1.4s cubic-bezier(0.22, 1, 0.36, 1); }
.os-node.is-pinging::after {
  content: "";
  position: absolute;
  top: 4px;
  left: 0;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  border: 1.5px solid rgba(140, 210, 255, 0.9);
  pointer-events: none;
  animation: osNodeShock 1.4s cubic-bezier(0.16, 1, 0.3, 1);
}
@keyframes osNodeFlare { 0%, 100% { filter: brightness(1); } 22% { filter: brightness(1.9) drop-shadow(0 0 10px rgba(120, 190, 255, 0.9)); } }
@keyframes osNodeShock { 0% { transform: scale(1); opacity: 1; } 100% { transform: scale(9); opacity: 0; } }

/* cursor spotlight — the room lights where you look */
.os-cursor-glow {
  position: fixed;
  left: 0;
  top: 0;
  z-index: 7;
  width: 360px;
  height: 360px;
  margin: -180px 0 0 -180px;
  border-radius: 50%;
  pointer-events: none;
  background: radial-gradient(circle, rgba(96, 165, 255, 0.09), rgba(124, 108, 255, 0.03) 42%, transparent 68%);
  translate: var(--mx, -50vw) var(--my, -50vh);
  transition: translate 0.12s linear, opacity 0.4s ease;
  mix-blend-mode: screen;
}

/* ambient sky: an occasional streak across the field */
.os-shooting-star {
  position: absolute;
  top: var(--y, 20%);
  left: -8%;
  width: 120px;
  height: 1px;
  pointer-events: none;
  background: linear-gradient(90deg, transparent, rgba(174, 221, 255, 0.9), #fff);
  box-shadow: 0 0 6px rgba(174, 221, 255, 0.8);
  opacity: 0;
  transform: rotate(9deg);
  animation: osShoot var(--d, 1.6s) ease-in forwards;
  z-index: 3;
}
@keyframes osShoot {
  0% { left: -8%; opacity: 0; }
  8% { opacity: 1; }
  70% { opacity: 1; }
  100% { left: 108%; opacity: 0; }
}

/* sound toggle in the status bar */
.os-sound {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 0 clamp(12px, 1.4vw, 22px);
  border: 0;
  border-right: 1px solid rgba(133, 171, 198, 0.1);
  background: transparent;
  color: #66727d;
  cursor: pointer;
  font: inherit;
}
.os-sound span { position: relative; width: 12px; height: 12px; border-radius: 50%; border: 1px solid currentColor; }
.os-sound span::before { content: ""; position: absolute; inset: 3px; border-radius: 50%; background: currentColor; opacity: 0.3; }
.os-sound i { display: block; height: 8px; overflow: hidden; font: 500 8px/1 "Spline Sans Mono", monospace; font-style: normal; letter-spacing: 0.12em; }
.os-sound:hover { color: #9fb0bb; }
.os-sound.is-on { color: #7c6cff; }
.os-sound.is-on span::before { opacity: 1; box-shadow: 0 0 8px rgba(124, 108, 255, 0.7); animation: osLedPulse 2s ease-in-out infinite; }

@media (prefers-reduced-motion: reduce) {
  .os-gravity-beams, .os-flow, .os-node, .os-node-core, .os-orbit, .os-radar, .os-earth-horizon { translate: none; scale: none; transition: none; }
  .os-node { scale: none; }
  .os-cursor-glow, .os-shooting-star, .os-node.is-pinging, .os-node.is-pinging::after { display: none; animation: none; }
}

/* ============================================================= */
/* ==== PHANTOM PRESENCE — bigger chat + the living Phantom ==== */
/* ============================================================= */
/* The cockpit pass hid the Phantom character and the beloved animated
   mini-avatar that boots in the chat, and squeezed the chat to a sliver.
   Bring all of it back — recoloured to the violet/mint identity — inside a
   proper, large conversation panel. High specificity to beat the reconcile
   layer above. */

/* the chat becomes a real panel, not a slot */
html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .hero2-copy {
  left: clamp(320px, 30vw, 470px) !important;
  bottom: 20px !important;
}
html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .chatbox {
  display: flex !important;
  flex-direction: column !important;
  min-height: min(54vh, 540px) !important;
  border-radius: 12px !important;
  border-color: rgba(124, 108, 255, 0.28) !important;
  box-shadow: 0 26px 80px rgba(0, 0, 0, 0.5), 0 0 46px rgba(124, 108, 255, 0.08), inset 0 1px rgba(255, 255, 255, 0.03) !important;
}

/* restore the Phantom Console header with the animated mini phantom avatar */
html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .chatbox-head {
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
  padding: 12px 15px !important;
  border-bottom: 1px solid rgba(124, 108, 255, 0.16) !important;
  background: linear-gradient(180deg, rgba(124, 108, 255, 0.07), transparent) !important;
}
.command-os-enabled .chatbox-head .pc {
  display: flex !important;
  align-items: center;
  gap: 12px;
  width: 100%;
  min-width: 0;
  padding: 0;
  border: 0;
  background: none;
}
html[data-command-os="2040"] .phantom.command-os-enabled .chatbox-head .pc-avatar {
  width: 54px !important;
  height: 54px !important;
  flex: 0 0 54px !important;
  border-radius: 13px;
  border: 1px solid rgba(124, 108, 255, 0.34);
  background: radial-gradient(circle at 42% 34%, rgba(124, 108, 255, 0.24), rgba(6, 11, 20, 0.9));
  box-shadow: 0 0 22px rgba(124, 108, 255, 0.34), inset 0 0 16px rgba(124, 108, 255, 0.12);
  filter: drop-shadow(0 0 6px rgba(124, 108, 255, 0.5));
}
.command-os-enabled .chatbox-head .pc-meta { display: grid; gap: 2px; min-width: 0; flex: 1 1 auto; }
.command-os-enabled .chatbox-head .pc-title { display: flex; align-items: center; gap: 8px; }
.command-os-enabled .chatbox-head .pc-title b { color: #eef4f7; font-size: 12.5px; font-weight: 600; letter-spacing: 0.01em; }
.command-os-enabled .chatbox-head .pc-label { color: #7c6cff; font: 600 8.5px "Spline Sans Mono", monospace; letter-spacing: 0.1em; text-transform: uppercase; }
.command-os-enabled .chatbox-head .pc-caption { display: none !important; }
.command-os-enabled .chatbox-head .pc-core { display: none !important; }
.command-os-enabled .chatbox-head .pc-dot { width: 7px; height: 7px; border-radius: 50%; background: #7c6cff; box-shadow: 0 0 8px rgba(124, 108, 255, 0.8); }
.command-os-enabled .chatbox-head .pc-actions { display: inline-flex; align-items: center; gap: 6px; flex: 0 0 auto; }
.command-os-enabled .chatbox-head .pc-mode,
.command-os-enabled .chatbox-head .pc-settings {
  border: 1px solid rgba(133, 171, 198, 0.2);
  border-radius: 7px;
  background: rgba(124, 108, 255, 0.08);
  color: #b8c3cc;
  cursor: pointer;
}
.command-os-enabled .chatbox-head .pc-mode { display: inline-flex; align-items: center; gap: 5px; padding: 6px 9px; font: 600 9px "Spline Sans Mono", monospace; }
.command-os-enabled .chatbox-head .pc-mode b { color: #8f9ca8; }
.command-os-enabled .chatbox-head .pc-mode[aria-pressed="true"] { border-color: rgba(124, 108, 255, 0.5); color: #7c6cff; }
.command-os-enabled .chatbox-head .pc-mode[aria-pressed="true"] b { color: #7c6cff; }
.command-os-enabled .chatbox-head .pc-settings { width: 30px; height: 30px; display: grid; place-items: center; }
.command-os-enabled .chatbox-head .pc-avatar.pc-pop { animation: pcPop 0.6s cubic-bezier(0.22, 1, 0.36, 1); }
@keyframes pcPop { 0% { transform: scale(0.4); opacity: 0; } 60% { transform: scale(1.12); } 100% { transform: scale(1); opacity: 1; } }

/* a tall message log — the chat can breathe now */
html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .chatbox-log {
  flex: 1 1 auto !important;
  min-height: 90px !important;
  max-height: min(40vh, 400px) !important;
  padding: 14px 16px 4px !important;
  overflow-y: auto !important;
  scrollbar-width: thin;
}
html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .chatbox-log:empty { display: none !important; }

/* a more substantial composer */
html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .chatbox-composer {
  min-height: 66px !important;
  padding: 10px 76px 10px 18px !important;
}
html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .chatbox-composer input {
  height: 46px !important;
  font-size: 16px !important;
}

/* ---- the painted Phantom, restored: recoloured, standing over the world, still gesturing ---- */
html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .phantom-mode-stage {
  display: flex !important;
  align-items: flex-end !important;
  justify-content: center !important;
  visibility: visible !important;
  opacity: 1 !important;
  position: absolute !important;
  left: 1.5% !important;
  right: auto !important;
  top: auto !important;
  bottom: 84px !important;
  z-index: 14 !important;
  width: min(24vw, 230px) !important;
  min-height: 0 !important;
  height: min(40vh, 330px) !important;
  margin: 0 !important;
  padding: 0 !important;
  pointer-events: none !important;
  animation: osPhantomFloat 7s ease-in-out infinite !important;
}
html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .phantom-mode-pose {
  display: block !important;
  visibility: visible !important;
  opacity: 0.98 !important;
  position: relative !important;
  width: auto !important;
  height: 100% !important;
  max-height: 100% !important;
  object-fit: contain !important;
  object-position: bottom center !important;
  mix-blend-mode: normal !important;
  filter: saturate(1.08) drop-shadow(0 0 22px rgba(124, 108, 255, 0.5)) drop-shadow(0 14px 30px rgba(0, 0, 0, 0.55)) !important;
}
html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .phantom-mode-caption {
  display: none !important;
}
@keyframes osPhantomFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-9px); } }

/* on narrow decks, the painted Phantom would crowd the map — retire it, keep the chat companion */
@media (max-width: 1180px) {
  html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .phantom-mode-stage { display: none !important; }
}
@media (prefers-reduced-motion: reduce) {
  html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .phantom-mode-stage { animation: none !important; }
  .command-os-enabled .chatbox-head .pc-avatar.pc-pop { animation: none !important; }
}

/* ============================================================= */
/* ==== UI REPAIR — declutter + de-overlap the dashboard ====== */
/* ============================================================= */

/* 1. kill the floating "Here's what I'd do." caption bubble — phantom.css
      absolutely-positions .pc-caption at the chat-head's top-left corner
      (spec 0,4,1); beat it with a higher-specificity hide. */
html[data-command-os="2040"] .phantom.command-os-enabled .chatbox-head .pc-caption,
html[data-command-os="2040"] .phantom.command-os-enabled .console .chatbox-head .pc-caption,
html[data-command-os="2040"] .phantom.command-os-enabled .pc .pc-caption {
  display: none !important;
}

/* 2. retire the floating SELECTED VERSION plate — it hovered centre-top over
      the chat; the plan tier already lives in the account menu. */
html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .os-access-version {
  display: none !important;
}

/* 3. rail cards must never overlap: fixed-flow items in a scrolling column,
      regardless of how many widgets (Need-from-you, Work-in-motion, Live
      signals, Needs-attention) are present. */
html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .console-rail {
  display: flex !important;
  flex-direction: column !important;
  grid-template-rows: none !important;
  gap: 0 !important;
  min-height: 0 !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
}
html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .console-rail > * {
  flex: 0 0 auto !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: visible !important;
}

/* 4. the big painted Phantom is retired on the dashboard — with real data the
      greeting + decision deck fill the left column and it collided with them.
      The living mini-Phantom stays in the chat header (it IS the character,
      gesture engine and all), a touch larger and brighter. */
html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .phantom-mode-stage {
  display: none !important;
}
html[data-command-os="2040"] .phantom.command-os-enabled .chatbox-head .pc-avatar {
  width: 50px !important;
  height: 50px !important;
  flex: 0 0 50px !important;
}

/* ============================================================= */
/* ==== PHANTOM CONSOLE DOCK - minimizable, cockpit-safe chat ==== */
/* ============================================================= */

html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .hero2-copy {
  left: auto !important;
  right: clamp(18px, 3vw, 48px) !important;
  bottom: clamp(18px, 3vh, 34px) !important;
  width: min(720px, calc(100% - 560px)) !important;
  max-width: 720px !important;
  z-index: 32 !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .chatbox {
  position: relative !important;
  display: flex !important;
  flex-direction: column !important;
  width: 100% !important;
  min-height: 188px !important;
  max-height: min(42vh, 430px) !important;
  overflow: hidden !important;
  border: 1px solid rgba(124, 108, 255, 0.24) !important;
  border-radius: 14px !important;
  background:
    linear-gradient(180deg, rgba(7, 16, 18, 0.94), rgba(2, 7, 11, 0.91)),
    radial-gradient(circle at 92% 18%, rgba(124, 108, 255, 0.12), transparent 34%) !important;
  box-shadow: 0 22px 64px rgba(0, 0, 0, 0.46), 0 0 0 1px rgba(255, 255, 255, 0.03) inset !important;
  backdrop-filter: blur(20px);
}

html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .chatbox-head {
  display: flex !important;
  align-items: center !important;
  min-height: 58px !important;
  padding: 10px 58px 10px 14px !important;
  border-bottom: 1px solid rgba(124, 108, 255, 0.14) !important;
  background: linear-gradient(90deg, rgba(124, 108, 255, 0.08), transparent) !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .chatbox-toggle {
  position: absolute !important;
  top: 14px !important;
  right: 14px !important;
  z-index: 4 !important;
  width: 34px !important;
  height: 34px !important;
  display: grid !important;
  place-items: center !important;
  border: 1px solid rgba(133, 171, 198, 0.22) !important;
  border-radius: 10px !important;
  background: rgba(12, 21, 26, 0.78) !important;
  color: #d9f7e9 !important;
  cursor: pointer !important;
  font: 800 18px/1 "Spline Sans Mono", monospace !important;
  box-shadow: inset 0 1px rgba(255, 255, 255, 0.04) !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .chatbox-toggle:hover {
  border-color: rgba(124, 108, 255, 0.58) !important;
  color: #7c6cff !important;
  box-shadow: 0 0 18px rgba(124, 108, 255, 0.16), inset 0 1px rgba(255, 255, 255, 0.04) !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .chatbox-log {
  flex: 1 1 auto !important;
  min-height: 44px !important;
  max-height: min(24vh, 250px) !important;
  padding: 14px 16px 4px !important;
  overflow-y: auto !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .chatbox-composer {
  min-height: 72px !important;
  padding: 10px 74px 12px 18px !important;
  border-top: 1px solid rgba(124, 108, 255, 0.1) !important;
  background: linear-gradient(90deg, rgba(4, 11, 13, 0.72), rgba(6, 18, 18, 0.82)) !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .chatbox-composer input {
  height: 48px !important;
  font-size: 15px !important;
  color: #e8f5f0 !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .chatbox .cmd-send {
  right: 18px !important;
  bottom: 17px !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .os-command-state {
  margin-top: 10px !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .os-execution-modes {
  justify-content: flex-end !important;
  margin-top: 8px !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .console[data-chatbox-minimized="true"]:not(.console-workspace) .hero2-copy {
  width: min(340px, calc(100% - 36px)) !important;
  right: clamp(14px, 2vw, 24px) !important;
  bottom: clamp(14px, 2vh, 22px) !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .console[data-chatbox-minimized="true"]:not(.console-workspace) .chatbox {
  min-height: 64px !important;
  max-height: 64px !important;
  border-radius: 999px !important;
  box-shadow: 0 14px 36px rgba(0, 0, 0, 0.42), 0 0 24px rgba(124, 108, 255, 0.08) !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .console[data-chatbox-minimized="true"]:not(.console-workspace) .chatbox-head {
  min-height: 62px !important;
  padding: 8px 58px 8px 10px !important;
  border-bottom: 0 !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .console[data-chatbox-minimized="true"]:not(.console-workspace) .chatbox-head .pc-avatar {
  width: 42px !important;
  height: 42px !important;
  flex-basis: 42px !important;
  border-radius: 999px !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .console[data-chatbox-minimized="true"]:not(.console-workspace) .chatbox-head .pc-title b::after {
  content: " minimized";
  color: #7f8d97;
  font-weight: 500;
}

html[data-command-os="2040"] .phantom.command-os-enabled .console[data-chatbox-minimized="true"]:not(.console-workspace) .chatbox-log,
html[data-command-os="2040"] .phantom.command-os-enabled .console[data-chatbox-minimized="true"]:not(.console-workspace) .chatbox-composer,
html[data-command-os="2040"] .phantom.command-os-enabled .console[data-chatbox-minimized="true"]:not(.console-workspace) .chatbox-tools,
html[data-command-os="2040"] .phantom.command-os-enabled .console[data-chatbox-minimized="true"]:not(.console-workspace) .chatbox-trust,
html[data-command-os="2040"] .phantom.command-os-enabled .console[data-chatbox-minimized="true"]:not(.console-workspace) .os-command-state,
html[data-command-os="2040"] .phantom.command-os-enabled .console[data-chatbox-minimized="true"]:not(.console-workspace) .os-execution-modes {
  display: none !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .console[data-chatbox-minimized="true"]:not(.console-workspace) .chatbox-head .pc-actions {
  position: absolute !important;
  top: 50% !important;
  right: 10px !important;
  z-index: 8 !important;
  display: inline-flex !important;
  transform: translateY(-50%) !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .console[data-chatbox-minimized="true"]:not(.console-workspace) .chatbox-head .pc-mode,
html[data-command-os="2040"] .phantom.command-os-enabled .console[data-chatbox-minimized="true"]:not(.console-workspace) .chatbox-head .pc-settings,
html[data-command-os="2040"] .phantom.command-os-enabled .console[data-chatbox-minimized="true"]:not(.console-workspace) .chatbox-head .pc-menu {
  display: none !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .console[data-chatbox-minimized="true"] .pc-minimize {
  border-radius: 999px !important;
  color: #7c6cff !important;
}

@media (max-width: 1180px) {
  html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .hero2-copy {
    left: 14px !important;
    right: 14px !important;
    bottom: 14px !important;
    width: auto !important;
    max-width: none !important;
  }
}

/* Compact layout ownership: the business brief, decisions and Phantom Console
   are siblings in the DOM, so they must remain siblings in the visual flow.
   Older viewport-locked rules absolutely layered all three into one short
   grid row, which clipped decision copy and parked the console over it on
   real phones and small tablets. Compact widths scroll naturally; only the
   bottom taskbar stays fixed. */
@media (max-width: 900px) {
  html[data-command-os="2040"] .phantom.command-os-enabled .app-main > .console:not(.console-workspace) {
    display: block !important;
    width: 100% !important;
    min-height: calc(100svh - var(--mobile-admin-topbar, 64px)) !important;
    padding: 0 0 calc(var(--mobile-admin-taskbar, 80px) + 18px + env(safe-area-inset-bottom, 0px)) !important;
    overflow: visible !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .console-center {
    display: flex !important;
    flex-direction: column !important;
    gap: 0 !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
    border-right: 0 !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .os-mission-peek {
    display: none !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .dashboard-brief {
    position: relative !important;
    inset: auto !important;
    order: 1 !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 24px 18px 16px !important;
    pointer-events: auto !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .dashboard-brief-kicker {
    margin-bottom: 7px !important;
    font-size: 8px !important;
    letter-spacing: .2em !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .dashboard-brief h1 {
    max-width: none !important;
    margin-bottom: 7px !important;
    font-size: clamp(26px, 8.2vw, 32px) !important;
    line-height: 1.05 !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .dashboard-brief-copy > p:last-child {
    max-width: 38ch !important;
    font-size: 12px !important;
    line-height: 1.45 !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .decision-deck {
    position: relative !important;
    inset: auto !important;
    order: 2 !important;
    width: auto !important;
    max-width: none !important;
    max-height: none !important;
    margin: 8px 16px 16px !important;
    overflow: visible !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .decision-deck[hidden] {
    display: none !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .decision-head {
    padding: 0 2px !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .decision-head h2 {
    font-size: 16px !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .decision-head i {
    display: none !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .decision-list {
    display: grid !important;
    grid-auto-flow: column !important;
    grid-auto-columns: min(86vw, 350px) !important;
    gap: 10px !important;
    width: 100% !important;
    padding: 0 2px 5px !important;
    overflow-x: auto !important;
    overflow-y: visible !important;
    scroll-snap-type: x mandatory !important;
    scrollbar-width: thin !important;
    overscroll-behavior-inline: contain !important;
    -webkit-overflow-scrolling: touch;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .decision-card {
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
    min-height: 0 !important;
    padding: 12px 13px 12px 16px !important;
    overflow: visible !important;
    scroll-snap-align: start !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .decision-card h3,
  html[data-command-os="2040"] .phantom.command-os-enabled .decision-card p {
    max-width: 100% !important;
    overflow: visible !important;
    white-space: normal !important;
    overflow-wrap: anywhere !important;
    text-overflow: clip !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .hero2 {
    position: relative !important;
    order: 3 !important;
    display: block !important;
    width: auto !important;
    height: auto !important;
    min-height: 0 !important;
    margin: 0 12px 18px !important;
    padding: 0 !important;
    overflow: hidden !important;
    border: 1px solid rgba(124, 108, 255, .16) !important;
    border-radius: 14px !important;
    background: #03090d !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .hero2-copy {
    position: relative !important;
    inset: auto !important;
    z-index: 8 !important;
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    height: auto !important;
    min-height: 0 !important;
    padding: 0 !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .hero2-stage {
    position: absolute !important;
    inset: 0 !important;
    z-index: 1 !important;
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    min-height: 0 !important;
    margin: 0 !important;
    opacity: .42 !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .os-earth-horizon {
    object-position: 50% 100% !important;
    filter: saturate(.92) brightness(.7) contrast(1.08) !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .os-command-state {
    position: relative !important;
    z-index: 4 !important;
    margin: 0 !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .os-command-state span {
    min-height: 43px !important;
    padding: 7px 10px !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .os-execution-modes {
    position: relative !important;
    inset: auto !important;
    z-index: 4 !important;
    width: 100% !important;
    transform: none !important;
    justify-content: stretch !important;
    margin: 0 !important;
    padding: 3px !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .chatbox {
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    border-width: 1px 0 0 !important;
    border-radius: 0 !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .chatbox-head {
    min-height: 52px !important;
    padding: 7px 10px !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .chatbox-head .pc-avatar {
    width: 40px !important;
    height: 40px !important;
    flex: 0 0 40px !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .chatbox-log {
    min-height: 68px !important;
    max-height: 180px !important;
    padding: 12px 10px 8px !important;
    overflow-y: auto !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .chatbox-composer {
    min-height: 62px !important;
    margin: 0 !important;
    padding: 8px 62px 9px 12px !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .chatbox-composer input {
    height: 42px !important;
    min-width: 0 !important;
    font-size: 16px !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .chatbox .cmd-send {
    right: 10px !important;
    bottom: 9px !important;
    width: 44px !important;
    height: 44px !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .dashboard-intel-band {
    order: 4 !important;
    grid-template-columns: 1fr !important;
    width: auto !important;
    margin: 0 12px 18px !important;
    overflow: hidden !important;
    border: 1px solid rgba(133, 171, 198, 0.12) !important;
    border-radius: 14px !important;
    background: rgba(4, 9, 14, 0.76) !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .dashboard-intel-head {
    display: grid !important;
    padding: 12px 13px 0 !important;
    border-right: 0 !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .dashboard-intel-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    min-width: 0 !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .dashboard-intel-card {
    min-height: 82px !important;
    border-right: 0 !important;
    border-top: 1px solid rgba(133, 171, 198, 0.08) !important;
  }
}

@media (max-width: 340px) {
  html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .chatbox-head .pc-title b {
    font-size: 0 !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .chatbox-head .pc-title b::before {
    content: "Phantom";
    font-size: 11.5px;
  }
}

/* Final loaded mobile nav kill switch: this stylesheet is loaded after the
   base shell, so it owns the last word. Compact screens get one navigation
   surface: the fixed bottom dock. More opens the drawer when needed. */
@media (max-width: 900px) {
  :root,
  .phantom {
    --mobile-admin-topbar: 0px !important;
  }

  .phantom .topbar2,
  .phantom .os-command-rail,
  .phantom .mobile-admin-homebar,
  .phantom .os-system-line {
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }

  .phantom > .sidebar:not(.is-expanded) {
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
  }

  .phantom .app-main {
    min-height: 100svh !important;
    padding-top: 0 !important;
  }

  .phantom .mobile-bottom-nav {
    display: grid !important;
    grid-template-columns: repeat(6, minmax(0, 1fr)) !important;
  }

  .phantom .dashboard-intel-band {
    order: 4 !important;
    width: auto !important;
    margin: 0 12px 18px !important;
  }

  .phantom .dashboard-intel-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    min-width: 0 !important;
  }
}

@media (max-width: 520px) {
  .phantom .dashboard-intel-grid {
    grid-template-columns: 1fr !important;
  }
}

/* Phone command surface: one priority decision, then the actual command box.
   The previous 86vw horizontal decision rail made the page feel wider than
   the phone and let a long alert push Phantom below the fold. The complete
   queue remains one tap away in Approvals. */
@media (max-width: 680px) {
  html,
  body,
  .phantom.command-os-enabled,
  html[data-command-os="2040"] .phantom.command-os-enabled .app-main,
  html[data-command-os="2040"] .phantom.command-os-enabled .console-center {
    max-width: 100% !important;
    overflow-x: clip !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .dashboard-brief {
    padding: 20px 16px 12px !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .dashboard-brief h1 {
    font-size: clamp(25px, 7.7vw, 30px) !important;
    line-height: 1.03 !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .decision-deck {
    width: calc(100% - 24px) !important;
    margin: 6px 12px 12px !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .decision-head {
    display: grid !important;
    grid-template-columns: auto auto minmax(0, 1fr) !important;
    align-items: center !important;
    gap: 8px !important;
    padding: 0 2px !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .decision-review-all {
    justify-self: end !important;
    min-height: 36px !important;
    padding: 6px 10px !important;
    border: 1px solid rgba(124, 108, 255, .28) !important;
    border-radius: 999px !important;
    background: rgba(124, 108, 255, .07) !important;
    color: #75edb5 !important;
    font: 650 10px "Instrument Sans", sans-serif !important;
    white-space: nowrap !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .decision-list {
    display: grid !important;
    grid-auto-flow: row !important;
    grid-template-columns: minmax(0, 1fr) !important;
    grid-auto-columns: auto !important;
    gap: 0 !important;
    width: 100% !important;
    min-width: 0 !important;
    padding: 0 !important;
    overflow: visible !important;
    scroll-snap-type: none !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .decision-card {
    gap: 6px !important;
    width: 100% !important;
    padding: 11px 12px 11px 15px !important;
    scroll-snap-align: none !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .decision-card:nth-child(n + 2) {
    display: none !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .decision-meta {
    gap: 6px 9px !important;
    font-size: 8.5px !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .decision-card h3 {
    font-size: 14px !important;
    line-height: 1.25 !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .decision-card > p:not(.decision-evidence) {
    display: none !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .decision-evidence {
    display: none !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .decision-actions {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(92px, .55fr) !important;
    gap: 7px !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .decision-actions .btn {
    min-width: 0 !important;
    min-height: 40px !important;
    padding: 7px 9px !important;
    overflow: hidden !important;
    font-size: 10.5px !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .decision-actions .btn-quiet {
    grid-column: 1 / -1 !important;
    min-height: 36px !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .hero2 {
    margin: 0 10px 14px !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .hero2-stage {
    display: none !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .chatbox-log {
    min-height: 58px !important;
    max-height: 132px !important;
  }
}

/* ============================================================= */
/* ============== PHANTOMBOT — DEDICATED AI OS ================= */
/* Page-scoped by design: this layer must never restyle another product. */
body:has(.workspace-page[data-workspace-page="phantomai"]) .os-command-rail [data-cmdk-open],
body:has(.workspace-page[data-workspace-page="phantomai"]) .os-command-rail .os-rail-action[data-cmdk-open],
.workspace-page[data-workspace-page="phantomai"] > [data-page-worker="phantomai"] {
  display: none !important;
}

body:has(.workspace-page[data-workspace-page="phantomai"]) .buddy {
  display: none !important;
}

body:has(.workspace-page[data-workspace-page="phantomai"]) .phantom.command-os-enabled {
  padding-bottom: 0;
}

body:has(.workspace-page[data-workspace-page="phantomai"]) .app-main {
  height: calc(100dvh - 70px);
  min-height: 0;
  overflow: hidden;
}

.console-workspace:has(.workspace-page[data-workspace-page="phantomai"]) {
  height: 100%;
  min-height: 0;
  padding: 0 !important;
  overflow: hidden;
}

.workspace-page[data-workspace-page="phantomai"],
.workspace-page[data-workspace-page="phantomai"] .workspace-page-body {
  width: 100%;
  height: 100%;
  min-height: 0;
  overflow: hidden;
}

.workspace-page[data-workspace-page="phantomai"] .workspace-page-body {
  padding: 0 !important;
}

.phantombot-os {
  --pbot-bg: #05080d;
  --pbot-panel: #080d14;
  --pbot-panel-2: #0b111a;
  --pbot-hover: rgba(255,255,255,.045);
  --pbot-line: rgba(155,181,201,.13);
  --pbot-line-strong: rgba(130,167,198,.28);
  --pbot-text: #edf3f7;
  --pbot-muted: #8c9aa6;
  --pbot-faint: #5e6b76;
  --pbot-live: #67edb3;
  --pbot-brain: #8a79ff;
  position: relative;
  display: grid;
  grid-template-columns: 252px minmax(0,1fr);
  width: 100%;
  height: 100%;
  min-height: 0;
  overflow: hidden;
  border: 0;
  border-radius: 0;
  background: radial-gradient(56% 90% at 70% -18%,rgba(111,91,255,.08),transparent 70%),var(--pbot-bg);
  color: var(--pbot-text);
  font-family: "Instrument Sans",system-ui,sans-serif;
}

/* Task rail */
.phantombot-taskrail {
  position: relative;
  z-index: 20;
  display: flex;
  flex-direction: column;
  min-width: 0;
  min-height: 0;
  padding: 16px 12px 12px;
  border-right: 1px solid var(--pbot-line);
  background: linear-gradient(180deg,rgba(14,20,29,.98),rgba(6,10,16,.985)),var(--pbot-panel);
}

.phantombot-brand {
  display: flex;
  align-items: center;
  gap: 11px;
  min-height: 46px;
  padding: 2px 7px 12px;
}

.phantombot-brand-mark {
  display: grid;
  flex: 0 0 34px;
  width: 34px;
  height: 34px;
  place-items: center;
  overflow: hidden;
  border: 1px solid rgba(103,237,179,.24);
  border-radius: 10px;
  background: rgba(103,237,179,.07);
  box-shadow: 0 0 22px rgba(103,237,179,.08);
}

.phantombot-brand-mark img { width: 24px; height: 24px; object-fit: contain; }
.phantombot-brand > span:last-child { display: grid; min-width: 0; gap: 1px; }
.phantombot-brand b {
  overflow: hidden;
  color: var(--pbot-text);
  font-size: 14px;
  font-weight: 680;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.phantombot-brand small {
  overflow: hidden;
  color: var(--pbot-faint);
  font: 500 8.5px "Spline Sans Mono",monospace;
  letter-spacing: .07em;
  text-transform: uppercase;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.phantombot-new-task {
  display: grid;
  grid-template-columns: 22px minmax(0,1fr) auto;
  align-items: center;
  gap: 8px;
  width: 100%;
  min-height: 42px;
  margin: 4px 0 18px;
  padding: 8px 10px;
  border: 1px solid var(--pbot-line-strong);
  border-radius: 9px;
  background: rgba(255,255,255,.025);
  color: var(--pbot-text);
  text-align: left;
  cursor: pointer;
  transition: border-color 160ms ease,background 160ms ease,transform 160ms ease;
}
.phantombot-new-task:hover {
  border-color: rgba(138,121,255,.5);
  background: rgba(138,121,255,.09);
  transform: translateY(-1px);
}
.phantombot-new-task > span { color: var(--pbot-live); font-size: 20px; font-weight: 300; }
.phantombot-new-task b { font-size: 12px; font-weight: 650; }
.phantombot-new-task kbd {
  padding: 2px 5px;
  border: 1px solid var(--pbot-line);
  border-radius: 5px;
  background: rgba(255,255,255,.025);
  color: var(--pbot-faint);
  font: 500 8px "Spline Sans Mono",monospace;
}

.phantombot-task-section { display: flex; flex: 1 1 auto; flex-direction: column; min-height: 0; }
.phantombot-task-section > p {
  margin: 0 8px 7px;
  color: var(--pbot-faint);
  font: 600 8.5px "Spline Sans Mono",monospace;
  letter-spacing: .11em;
  text-transform: uppercase;
}
.phantombot-task-list {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  gap: 2px;
  min-height: 0;
  padding-right: 2px;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  scrollbar-color: rgba(138,121,255,.28) transparent;
}
.phantombot-task {
  display: grid;
  grid-template-columns: minmax(0,1fr) auto;
  align-items: center;
  gap: 7px;
  width: 100%;
  min-height: 38px;
  padding: 8px 9px;
  border: 0;
  border-radius: 7px;
  background: transparent;
  color: var(--pbot-muted);
  text-align: left;
  cursor: pointer;
}
.phantombot-task:hover { background: var(--pbot-hover); color: var(--pbot-text); }
.phantombot-task.is-active {
  background: rgba(138,121,255,.105);
  color: var(--pbot-text);
  box-shadow: inset 2px 0 var(--pbot-brain);
}
.phantombot-task span {
  overflow: hidden;
  font-size: 11.5px;
  font-weight: 560;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.phantombot-task small { color: var(--pbot-faint); font: 500 8.5px "Spline Sans Mono",monospace; }

.phantombot-rail-tabs.phantomai-tabs {
  display: grid;
  flex: 0 0 auto;
  grid-template-columns: 1fr;
  gap: 2px;
  width: 100%;
  margin: 10px 0 0;
  padding: 10px 0 0;
  border: 0;
  border-top: 1px solid var(--pbot-line);
  border-radius: 0;
  background: transparent;
}
.phantombot-rail-tabs .phantomai-tab {
  justify-content: flex-start;
  min-height: 36px;
  padding: 7px 9px;
  border-radius: 7px;
  color: var(--pbot-muted);
  font: 560 11.5px "Instrument Sans",system-ui,sans-serif;
  letter-spacing: 0;
}
.phantombot-rail-tabs .phantomai-tab > span { width: 18px; color: var(--pbot-faint); text-align: center; }
.phantombot-rail-tabs .phantomai-tab > b { font-weight: 560; }
.phantombot-rail-tabs .phantomai-tab:hover { background: var(--pbot-hover); color: var(--pbot-text); }
.phantombot-rail-tabs .phantomai-tab.is-active {
  background: rgba(138,121,255,.1);
  color: var(--pbot-text);
  box-shadow: inset 2px 0 var(--pbot-brain);
}

/* Conversation stage and titlebar */
.phantombot-stage {
  position: relative;
  display: flex;
  min-width: 0;
  min-height: 0;
  flex-direction: column;
  overflow: hidden;
  background:
    radial-gradient(42% 54% at 50% 48%,rgba(0,255,148,.12),transparent 62%),
    radial-gradient(70% 90% at 72% 36%,rgba(0,255,148,.055),transparent 64%),
    radial-gradient(54% 90% at 18% 20%,rgba(16,255,162,.04),transparent 66%),
    linear-gradient(rgba(125,148,166,.018) 1px,transparent 1px),
    linear-gradient(90deg,rgba(125,148,166,.014) 1px,transparent 1px),
    var(--pbot-bg);
  background-size: 64px 64px;
}
.phantombot-stage::before {
  position: absolute;
  content: "";
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(ellipse at 58% 12%,rgba(8,21,15,.34),transparent 48%),
    linear-gradient(90deg,rgba(2,6,5,.78),transparent 22%,transparent 78%,rgba(2,6,5,.72)),
    url("/app/assets/command-earth-horizon.png") center/cover no-repeat;
  opacity: .17;
  mix-blend-mode: screen;
}
.phantombot-stage::after {
  position: absolute;
  content: "";
  inset: 0;
  pointer-events: none;
  background: linear-gradient(180deg,rgba(0,0,0,.32),transparent 35%,rgba(0,0,0,.46));
}
.phantombot-titlebar {
  position: relative;
  z-index: 12;
  display: grid;
  flex: 0 0 58px;
  grid-template-columns: auto minmax(0,1fr) auto;
  align-items: center;
  gap: 12px;
  min-height: 58px;
  padding: 0 18px;
  border-bottom: 1px solid var(--pbot-line);
  background: rgba(5,8,13,.89);
  backdrop-filter: blur(18px) saturate(1.1);
}
.phantombot-rail-toggle {
  display: none;
  width: 34px;
  height: 34px;
  border: 1px solid var(--pbot-line);
  border-radius: 8px;
  background: transparent;
  color: var(--pbot-muted);
  cursor: pointer;
}
.phantombot-title { display: flex; min-width: 0; align-items: baseline; gap: 9px; }
.phantombot-title > span {
  color: var(--pbot-faint);
  font: 600 8.5px "Spline Sans Mono",monospace;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.phantombot-title > b {
  overflow: hidden;
  color: var(--pbot-text);
  font-size: 12.5px;
  font-weight: 620;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.phantombot-title-actions { display: flex; align-items: center; gap: 8px; }
.phantombot-title-actions > button,.phantombot-panel-head > button {
  min-height: 32px;
  padding: 6px 10px;
  border: 1px solid var(--pbot-line);
  border-radius: 8px;
  background: rgba(255,255,255,.025);
  color: var(--pbot-muted);
  cursor: pointer;
  font-size: 10.5px;
  font-weight: 600;
}
.phantombot-title-actions > button:hover,.phantombot-panel-head > button:hover {
  border-color: var(--pbot-line-strong);
  color: var(--pbot-text);
}
.phantombot-ready {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--pbot-muted);
  font: 550 9px "Spline Sans Mono",monospace;
}
.phantombot-ready i {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--pbot-live);
  box-shadow: 0 0 10px rgba(103,237,179,.62);
}
.phantombot-os[data-busy] .phantombot-ready i {
  background: var(--pbot-brain);
  box-shadow: 0 0 12px rgba(138,121,255,.72);
  animation: pbotPulse 1.1s ease-in-out infinite;
}
.phantombot-stage > .phantomai-pane { flex: 1 1 auto; min-width: 0; min-height: 0; overflow: hidden; }
.phantombot-stage .phantomai-chat,.phantombot-chat-pane {
  position: relative;
  display: grid;
  grid-template-rows: minmax(0,1fr) auto;
  width: 100%;
  height: 100%;
  min-height: 0;
  gap: 0;
  padding: 0;
  overflow: hidden;
  border: 0;
  border-radius: 0;
  background: transparent;
}
.phantombot-stage .phantomai-chat-log {
  min-width: 0;
  min-height: 0;
  padding: 34px max(24px,calc((100% - 900px)/2)) 160px;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
  scrollbar-width: thin;
  scrollbar-color: rgba(138,121,255,.28) transparent;
}

/* Empty state */
.phantombot-empty {
  position: relative;
  z-index: 2;
  display: grid;
  width: min(980px,100%);
  min-height: 100%;
  margin: 0 auto;
  padding: 6vh 0 12vh;
  place-content: center;
  justify-items: center;
  text-align: center;
}
.phantombot-empty-mark {
  position: relative;
  display: grid;
  width: 96px;
  height: 96px;
  margin-bottom: 18px;
  place-items: center;
  border: 1px solid rgba(0,255,148,.34);
  border-radius: 26px;
  background: radial-gradient(circle,rgba(0,255,148,.16),transparent 66%),rgba(6,13,10,.82);
  box-shadow: 0 0 22px rgba(0,255,148,.24),0 0 86px rgba(0,255,148,.18),inset 0 1px rgba(255,255,255,.055);
}
.phantombot-empty-mark::before,.phantombot-empty-mark::after {
  position: absolute;
  content: "";
  inset: -18px;
  border: 1px solid rgba(138,121,255,.13);
  border-radius: 50%;
  animation: pbotOrbit 12s linear infinite;
}
.phantombot-empty-mark::after {
  inset: -31px;
  border-color: rgba(103,237,179,.09);
  animation-direction: reverse;
  animation-duration: 18s;
}
.phantombot-empty-mark img {
  width: 72px;
  height: 72px;
  object-fit: contain;
  opacity: .94;
  filter: saturate(1.2) drop-shadow(0 0 18px rgba(0,255,148,.45));
}
.phantombot-empty > h1 {
  margin: 0;
  color: #19f58e;
  font: 820 clamp(68px,10vw,154px)/.86 "Bricolage Grotesque","Instrument Sans",system-ui,sans-serif;
  letter-spacing: -.07em;
  text-shadow: 0 0 14px rgba(0,255,148,.48),0 0 42px rgba(0,255,148,.26),0 16px 54px rgba(0,0,0,.72);
  text-transform: uppercase;
}
.phantombot-empty > span {
  max-width: 720px;
  margin-top: 22px;
  color: var(--pbot-muted);
  font-size: clamp(15px,1.35vw,20px);
  line-height: 1.42;
  text-shadow: 0 2px 18px rgba(0,0,0,.72);
}
.phantombot-desktop-parity {
  display: grid;
  grid-template-columns: repeat(4,minmax(0,1fr));
  width: min(840px,100%);
  margin-top: 22px;
  gap: 8px;
}
.phantombot-desktop-parity span {
  display: grid;
  min-width: 0;
  gap: 4px;
  padding: 12px 10px;
  border: 1px solid rgba(103,237,179,.18);
  border-radius: 11px;
  background: rgba(5,15,12,.62);
  box-shadow: inset 0 1px rgba(255,255,255,.035);
  text-align: left;
}
.phantombot-desktop-parity b {
  overflow: hidden;
  color: var(--pbot-text);
  font-size: 12px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.phantombot-desktop-parity i {
  color: var(--pbot-faint);
  font: 600 8.5px "Spline Sans Mono",monospace;
  line-height: 1.35;
  text-transform: uppercase;
  font-style: normal;
}
.phantombot-starters {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  width: min(760px,100%);
  margin-top: 30px;
  gap: 10px;
}
.phantombot-starters button {
  display: flex;
  min-height: 48px;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 11px 13px;
  border: 1px solid rgba(0,255,148,.18);
  border-radius: 12px;
  background: rgba(4,12,9,.54);
  box-shadow: inset 0 1px rgba(255,255,255,.035);
  color: var(--pbot-muted);
  text-align: left;
  cursor: pointer;
  font-size: 11.5px;
}
.phantombot-starters button:hover {
  border-color: rgba(0,255,148,.42);
  background: rgba(0,255,148,.075);
  color: var(--pbot-text);
}
.phantombot-starters i { color: var(--pbot-faint); font-style: normal; }

/* Conversation turns */
.phantombot-exchange,.phantombot-message {
  display: grid;
  width: min(900px,100%);
  margin: 0 auto;
  gap: 22px;
}
.phantombot-exchange + .phantombot-exchange { margin-top: 34px; }
.phantombot-turn { display: flex; min-width: 0; gap: 12px; }
.phantombot-turn.is-user { justify-content: flex-end; }
.phantombot-avatar {
  display: grid;
  flex: 0 0 30px;
  width: 30px;
  height: 30px;
  margin-top: 2px;
  place-items: center;
  border: 1px solid rgba(103,237,179,.18);
  border-radius: 9px;
  background: rgba(103,237,179,.055);
}
.phantombot-avatar img { width: 20px; height: 20px; object-fit: contain; }
.phantombot-turn-content { min-width: 0; max-width: min(760px,calc(100% - 46px)); }
.phantombot-turn-content > header { display: flex; align-items: center; gap: 9px; min-height: 22px; }
.phantombot-turn-content > header b { color: var(--pbot-text); font-size: 11px; font-weight: 650; }
.phantombot-turn-content > header span {
  color: var(--pbot-live);
  font: 500 8px "Spline Sans Mono",monospace;
  letter-spacing: .06em;
  text-transform: uppercase;
}
.phantombot-turn.is-user .phantombot-turn-content {
  max-width: min(680px,78%);
  padding: 10px 13px;
  border: 1px solid rgba(138,121,255,.18);
  border-radius: 15px 15px 4px 15px;
  background: rgba(138,121,255,.085);
}
.phantombot-turn.is-user .phantombot-turn-content > header { display: none; }
.phantombot-turn .phantomai-chat-user,.phantombot-turn .phantomai-chat-reply {
  max-width: none;
  margin: 0;
  color: var(--pbot-text);
  font: 430 14px/1.62 "Instrument Sans",system-ui,sans-serif;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}
.phantombot-turn .phantomai-chat-status { margin-top: 8px; color: var(--pbot-live); }
.phantombot-turn.is-error .phantombot-turn-content {
  padding: 12px;
  border: 1px solid rgba(255,95,114,.25);
  border-radius: 10px;
  background: rgba(255,95,114,.055);
}
.phantombot-turn-actions {
  display: flex;
  min-height: 30px;
  align-items: center;
  gap: 3px;
  margin-top: 6px;
  opacity: 0;
  transition: opacity 140ms ease;
}
.phantombot-turn:hover .phantombot-turn-actions,.phantombot-turn:focus-within .phantombot-turn-actions { opacity: 1; }
.phantombot-turn-actions button {
  padding: 4px 7px;
  border: 0;
  border-radius: 6px;
  background: transparent;
  color: var(--pbot-faint);
  cursor: pointer;
  font-size: 9.5px;
}
.phantombot-turn-actions button:hover { background: var(--pbot-hover); color: var(--pbot-text); }
.phantombot-thinking { display: flex; align-items: center; gap: 4px; min-height: 30px; }
.phantombot-thinking i {
  width: 5px;
  height: 5px;
  border-radius: 50%;
  background: var(--pbot-brain);
  animation: pbotThink 1s ease-in-out infinite;
}
.phantombot-thinking i:nth-child(2) { animation-delay: 120ms; }
.phantombot-thinking i:nth-child(3) { animation-delay: 240ms; }
.phantombot-operator {
  margin-top: 12px;
  padding: 12px;
  border: 1px solid var(--pbot-line);
  border-radius: 12px;
  background: color-mix(in srgb, var(--pbot-panel) 88%, transparent);
}
.phantombot-operator > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: .06em;
}
.phantombot-operator > header span { color: var(--pbot-live); }
.phantombot-operator ol {
  display: grid;
  gap: 7px;
  margin: 11px 0 0;
  padding: 0;
  list-style: none;
}
.phantombot-operator li { display: flex; align-items: flex-start; gap: 8px; }
.phantombot-operator li > i {
  width: 7px;
  height: 7px;
  margin-top: 5px;
  flex: 0 0 auto;
  border-radius: 50%;
  background: var(--pbot-live);
  box-shadow: 0 0 9px color-mix(in srgb, var(--pbot-live) 65%, transparent);
}
.phantombot-operator li span { display: grid; gap: 2px; }
.phantombot-operator li b { color: var(--pbot-text); font-size: 11px; font-weight: 600; }
.phantombot-operator li small { color: var(--pbot-muted); font-size: 10px; }
.phantombot-operator-scope {
  display: grid;
  gap: 6px;
  margin: 12px 0 0;
  padding: 10px;
  border-radius: 9px;
  background: var(--pbot-hover);
}
.phantombot-operator-scope div { display: grid; grid-template-columns: 66px 1fr; gap: 8px; }
.phantombot-operator-scope dt {
  color: var(--pbot-muted);
  font-size: 9px;
  text-transform: uppercase;
  letter-spacing: .06em;
}
.phantombot-operator-scope dd {
  min-width: 0;
  margin: 0;
  overflow-wrap: anywhere;
  color: var(--pbot-text);
  font-size: 10px;
}
.phantombot-operator-scope .phantombot-operator-plan {
  gap: 8px;
  margin: 0;
}
.phantombot-operator-scope .phantombot-operator-plan li {
  display: grid;
  gap: 3px;
  padding: 8px;
  border: 1px solid var(--pbot-line);
  border-radius: 7px;
}
.phantombot-operator-plan details { min-width: 0; }
.phantombot-operator-plan summary { cursor: pointer; color: var(--pbot-live); }
.phantombot-operator-plan pre {
  max-height: 240px;
  margin: 7px 0 0;
  overflow: auto;
  white-space: pre-wrap;
  color: var(--pbot-muted);
  font: 9px/1.45 ui-monospace, SFMono-Regular, Consolas, monospace;
}
.phantombot-operator-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }
.phantombot-operator-actions button {
  min-height: 32px;
  padding: 0 11px;
  border: 1px solid var(--pbot-line);
  border-radius: 8px;
  background: var(--pbot-hover);
  color: var(--pbot-text);
  cursor: pointer;
}
.phantombot-operator-actions button:first-child {
  border-color: color-mix(in srgb, var(--pbot-live) 55%, var(--pbot-line));
  color: var(--pbot-live);
}
.phantombot-operator-receipt { margin: 11px 0 0; color: var(--pbot-muted); font-size: 10px; }

/* Sticky/floating composer */
.phantombot-stage .phantomai-chat-form,.phantombot-composer {
  position: absolute;
  z-index: 10;
  right: max(18px,calc((100% - 900px)/2));
  bottom: 18px;
  left: max(18px,calc((100% - 900px)/2));
  display: grid;
  gap: 7px;
  min-width: 0;
  padding: 10px 10px 8px 14px;
  overflow: hidden;
  border: 1px solid var(--pbot-line-strong);
  border-radius: 16px;
  background: rgba(11,17,26,.94);
  box-shadow: 0 24px 65px rgba(0,0,0,.46),inset 0 1px rgba(255,255,255,.035);
  backdrop-filter: blur(22px) saturate(1.1);
}
.phantombot-stage .phantomai-chat-form:focus-within,.phantombot-composer:focus-within {
  border-color: rgba(138,121,255,.56);
  box-shadow: 0 24px 65px rgba(0,0,0,.46),0 0 0 1px rgba(138,121,255,.12);
}
.phantombot-stage .phantomai-chat-input {
  width: 100%;
  min-height: 34px;
  max-height: 168px;
  padding: 5px 3px;
  overflow-y: auto;
  resize: none;
  border: 0;
  border-radius: 0;
  outline: 0;
  background: transparent;
  color: var(--pbot-text);
  font: 430 14px/1.48 "Instrument Sans",system-ui,sans-serif;
}
.phantombot-stage .phantomai-chat-input::placeholder { color: var(--pbot-faint); }
.phantombot-composer-foot {
  display: flex;
  min-width: 0;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.phantombot-composer-foot > span {
  overflow: hidden;
  color: var(--pbot-faint);
  font: 500 8px "Spline Sans Mono",monospace;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.phantombot-send {
  display: grid;
  flex: 0 0 32px;
  width: 32px;
  height: 32px;
  place-items: center;
  border: 0;
  border-radius: 9px;
  background: var(--pbot-text);
  color: #071019;
  cursor: pointer;
  font-size: 17px;
  font-weight: 800;
  transition: opacity 140ms ease,transform 140ms ease;
}
.phantombot-send:hover:not(:disabled) { transform: translateY(-1px); }
.phantombot-send:disabled { cursor: wait; opacity: .32; }
.phantombot-jump,.phantombot-jump-latest {
  position: absolute;
  z-index: 11;
  right: 50%;
  bottom: 128px;
  min-height: 30px;
  padding: 6px 11px;
  transform: translateX(50%);
  border: 1px solid var(--pbot-line-strong);
  border-radius: 999px;
  background: rgba(11,17,26,.94);
  color: var(--pbot-muted);
  box-shadow: 0 8px 28px rgba(0,0,0,.36);
  cursor: pointer;
  font-size: 9.5px;
}
.phantombot-jump[hidden],.phantombot-jump-latest[hidden] { display: none; }

/* Memory/activity panes and optional execution/context drawer. */
.phantombot-panel-pane { overflow-x: hidden !important; overflow-y: auto !important; scrollbar-width: thin; }
.phantombot-panel-head {
  position: sticky;
  top: 0;
  z-index: 8;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  min-height: 64px;
  padding: 10px 22px;
  border-bottom: 1px solid var(--pbot-line);
  background: rgba(5,8,13,.94);
  backdrop-filter: blur(18px);
}
.phantombot-panel-head > div { display: grid; gap: 1px; }
.phantombot-panel-head span {
  color: var(--pbot-live);
  font: 600 8px "Spline Sans Mono",monospace;
  letter-spacing: .1em;
  text-transform: uppercase;
}
.phantombot-panel-head h2 { margin: 0; font-size: 18px; }
.phantombot-panel-pane .phantomai-memory-mount,.phantombot-panel-pane .phantomai-activity-mount {
  padding: 18px 22px 34px;
}
.chat-media figcaption > button,
.phantombot-media-actions button {
  min-height: 30px;
  padding: 6px 9px;
  border: 1px solid rgba(129,74,247,.42);
  border-radius: 6px;
  background: rgba(129,74,247,.1);
  color: #dcd5ff;
  font: 700 9px "Spline Sans Mono", monospace;
  cursor: pointer;
  white-space: nowrap;
}
.chat-media figcaption > button:hover,
.phantombot-media-actions button:hover {
  border-color: #8a79ff;
  background: rgba(129,74,247,.2);
  color: #fff;
}
.phantombot-media-actions {
  display: flex;
  gap: 6px;
  padding-top: 4px;
}
.phantombot-context-pane {
  position: absolute;
  z-index: 30;
  top: 58px;
  right: 0;
  bottom: 0;
  width: min(380px,38vw);
  overflow: auto;
  transform: translateX(102%);
  border-left: 1px solid var(--pbot-line);
  background: rgba(8,13,20,.985);
  box-shadow: -24px 0 70px rgba(0,0,0,.4);
  transition: transform 200ms ease;
}
.phantombot-os.is-context-open .phantombot-context-pane,.phantombot-context-pane.is-open { transform: translateX(0); }

@keyframes pbotThink {
  0%,70%,100% { opacity: .28; transform: translateY(0); }
  35% { opacity: 1; transform: translateY(-3px); }
}
@keyframes pbotPulse { 50% { opacity: .45; transform: scale(.75); } }
@keyframes pbotOrbit { to { transform: rotate(360deg); } }

/* Task rail becomes a drawer without shrinking the reading column. */
@media (max-width: 1100px) {
  .phantombot-os { grid-template-columns: minmax(0,1fr); }
  .phantombot-taskrail {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: min(294px,86vw);
    transform: translateX(-104%);
    border-right-color: var(--pbot-line-strong);
    box-shadow: 26px 0 80px rgba(0,0,0,.54);
    opacity: 0;
    pointer-events: none;
    transition: transform 210ms ease,opacity 170ms ease;
  }
  .phantombot-os.is-rail-open .phantombot-taskrail {
    transform: translateX(0);
    opacity: 1;
    pointer-events: auto;
  }
  .phantombot-rail-toggle { display: grid; place-items: center; }
}

@media (max-width: 900px) {
  body:has(.workspace-page[data-workspace-page="phantomai"]) .app-main { height: calc(100svh - 74px); }
  .workspace-page[data-workspace-page="phantomai"] { min-height: 0 !important; border-radius: 0 !important; }
  .phantombot-titlebar { padding-inline: 14px; }
  .phantombot-stage .phantomai-chat-log { padding-inline: max(18px,calc((100% - 780px)/2)); }
  .phantombot-stage .phantomai-chat-form,.phantombot-composer {
    right: max(14px,calc((100% - 780px)/2));
    left: max(14px,calc((100% - 780px)/2));
  }
  .phantombot-context-pane { top: 58px; width: min(420px,92vw); }
}

@media (max-width: 680px) {
  body:has(.workspace-page[data-workspace-page="phantomai"]) .app-main {
    height: calc(100svh - 72px);
    min-height: 0;
    padding-bottom: 0 !important;
  }
  .phantombot-titlebar { flex-basis: 54px; min-height: 54px; gap: 9px; padding: 0 11px; }
  .phantombot-title { display: grid; gap: 0; }
  .phantombot-title > span { font-size: 7px; }
  .phantombot-title > b { max-width: 48vw; font-size: 11px; }
  .phantombot-title-actions > button { display: none; }
  .phantombot-ready { font-size: 0; }
  .phantombot-ready i { width: 8px; height: 8px; }
  .phantombot-stage .phantomai-chat-log {
    padding: 24px 14px calc(154px + env(safe-area-inset-bottom,0px));
    scrollbar-gutter: auto;
  }
  .phantombot-empty { padding: 5vh 2px; }
  .phantombot-empty-mark { width: 72px; height: 72px; margin-bottom: 19px; border-radius: 22px; }
  .phantombot-empty-mark img { width: 56px; height: 56px; }
  .phantombot-empty-mark::before { inset: -12px; }
  .phantombot-empty-mark::after { inset: -21px; }
  .phantombot-empty > h1 { font-size: clamp(25px,8vw,32px); }
  .phantombot-empty > span { max-width: 330px; font-size: 11.5px; }
  .phantombot-desktop-parity { grid-template-columns: 1fr 1fr; width: min(370px,100%); margin-top: 16px; }
  .phantombot-desktop-parity span { padding: 9px; }
  .phantombot-desktop-parity b { font-size: 10.5px; white-space: normal; }
  .phantombot-desktop-parity i { font-size: 7px; }
  .phantombot-starters { grid-template-columns: 1fr; width: min(370px,100%); margin-top: 22px; }
  .phantombot-starters button { min-height: 42px; padding: 9px 11px; font-size: 10.5px; }
  .phantombot-exchange + .phantombot-exchange { margin-top: 28px; }
  .phantombot-turn { gap: 9px; }
  .phantombot-avatar { flex-basis: 27px; width: 27px; height: 27px; }
  .phantombot-avatar img { width: 18px; height: 18px; }
  .phantombot-turn-content { max-width: calc(100% - 36px); }
  .phantombot-turn.is-user .phantombot-turn-content { max-width: 88%; }
  .phantombot-turn .phantomai-chat-user,.phantombot-turn .phantomai-chat-reply {
    font-size: 13.5px;
    line-height: 1.58;
  }
  .phantombot-turn-actions { opacity: 1; }
  .phantombot-stage .phantomai-chat-form,.phantombot-composer {
    right: 10px;
    bottom: calc(9px + env(safe-area-inset-bottom,0px));
    left: 10px;
    padding: 9px 9px 7px 12px;
    border-radius: 14px;
  }
  .phantombot-composer-foot > span { max-width: calc(100% - 44px); font-size: 7px; }
  .phantombot-jump,.phantombot-jump-latest { bottom: calc(121px + env(safe-area-inset-bottom,0px)); }
  .phantombot-panel-head { min-height: 56px; padding: 9px 13px; }
  .phantombot-panel-pane .phantomai-memory-mount,.phantombot-panel-pane .phantomai-activity-mount {
    padding: 12px 10px calc(28px + env(safe-area-inset-bottom,0px));
  }
  .phantombot-context-pane { top: 54px; width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
  .phantombot-os *,.phantombot-os *::before,.phantombot-os *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
  .phantombot-empty-mark::before,.phantombot-empty-mark::after { display: none; }
}

/* Overview is an operations dashboard. Chat and code belong in the PhantomBot
   tab, so the overview must not render composer-shaped legacy chatbot UI. */
html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .hero2-copy,
html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .chatbox,
html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .chatbox-head,
html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .chatbox-log,
html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .chatbox-composer,
html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .chatbox-tools,
html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .chatbox-trust,
html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .os-execution-modes {
  display: none !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .decision-deck {
  position: absolute !important;
  top: auto !important;
  right: clamp(22px, 3vw, 48px) !important;
  bottom: clamp(22px, 3vh, 42px) !important;
  left: auto !important;
  z-index: 26 !important;
  width: min(720px, calc(100% - 430px)) !important;
  max-height: none !important;
  overflow: visible !important;
  pointer-events: auto;
}

html[data-command-os="2040"] .phantom.command-os-enabled .decision-head {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  min-height: 34px !important;
  padding: 0 0 8px !important;
  border: 0 !important;
  background: transparent !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .decision-head h2 {
  margin: 0 !important;
  color: #eaf2ff !important;
  font: 700 12px "Instrument Sans", sans-serif !important;
  letter-spacing: 0 !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .decision-head i {
  min-width: 0 !important;
  flex: 1 !important;
  overflow: hidden !important;
  color: #81909c !important;
  font-size: 10px !important;
  font-style: normal !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .decision-count {
  display: inline-grid !important;
  place-items: center !important;
  min-width: 22px !important;
  height: 22px !important;
  border: 1px solid rgba(124, 108, 255, 0.34) !important;
  border-radius: 999px !important;
  background: rgba(124, 108, 255, 0.16) !important;
  color: #bfb6ff !important;
  font: 800 11px "Spline Sans Mono", monospace !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .decision-review-all {
  min-height: 28px !important;
  padding: 0 10px !important;
  border: 1px solid rgba(124, 108, 255, 0.28) !important;
  border-radius: 4px !important;
  background: rgba(12, 18, 31, 0.72) !important;
  color: #b9c7d2 !important;
  font-size: 10px !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .decision-list {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 8px !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .decision-card {
  display: grid !important;
  gap: 7px !important;
  min-width: 0 !important;
  min-height: 0 !important;
  padding: 10px !important;
  border: 1px solid rgba(133, 171, 198, 0.12) !important;
  border-left: 2px solid rgba(124, 108, 255, 0.62) !important;
  border-radius: 5px !important;
  background: rgba(5, 11, 17, 0.52) !important;
  box-shadow: none !important;
  backdrop-filter: blur(16px);
}

html[data-command-os="2040"] .phantom.command-os-enabled .decision-card.dc-high { border-left-color: rgba(255, 91, 113, 0.8) !important; }
html[data-command-os="2040"] .phantom.command-os-enabled .decision-card.dc-medium { border-left-color: rgba(255, 199, 94, 0.78) !important; }

html[data-command-os="2040"] .phantom.command-os-enabled .decision-meta {
  display: flex !important;
  align-items: center !important;
  gap: 6px !important;
  min-width: 0 !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .decision-dept,
html[data-command-os="2040"] .phantom.command-os-enabled .decision-impact {
  min-width: 0 !important;
  overflow: hidden !important;
  color: #8f9dab !important;
  font: 700 8px "Spline Sans Mono", monospace !important;
  letter-spacing: 0.12em !important;
  text-overflow: ellipsis !important;
  text-transform: uppercase !important;
  white-space: nowrap !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .decision-impact {
  margin-left: auto !important;
  color: #a89eff !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .decision-conf,
html[data-command-os="2040"] .phantom.command-os-enabled .decision-evidence {
  display: none !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .decision-card h3 {
  margin: 0 !important;
  overflow: hidden !important;
  color: #f1f5f7 !important;
  font-size: 12px !important;
  line-height: 1.22 !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .decision-card p {
  display: -webkit-box !important;
  margin: 0 !important;
  overflow: hidden !important;
  color: #8795a0 !important;
  font-size: 10px !important;
  line-height: 1.35 !important;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

html[data-command-os="2040"] .phantom.command-os-enabled .decision-actions {
  display: flex !important;
  gap: 5px !important;
  margin-top: 1px !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .decision-actions .btn {
  min-height: 24px !important;
  flex: 1 1 0 !important;
  padding: 0 7px !important;
  border-radius: 4px !important;
  font-size: 10px !important;
}

@media (max-width: 1180px) {
  html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .decision-deck {
    position: relative !important;
    right: auto !important;
    bottom: auto !important;
    width: auto !important;
    margin: 8px 16px 16px !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .decision-list {
    display: grid !important;
    grid-auto-flow: column !important;
    grid-auto-columns: min(82vw, 330px) !important;
    grid-template-columns: none !important;
    overflow-x: auto !important;
    padding-bottom: 4px !important;
  }
}

/* Analytics rescue: local business signal is the default, social OAuth is
   optional, and compact widths must not hide controls behind overflow. */
.an-domain-shell,
.an-domain-picker,
.an-domain-shell .ch-card,
.an-domain-shell .an {
  min-width: 0;
  max-width: 100%;
}

.an-domain-picker .ch-card-h {
  align-items: flex-start;
  gap: 14px;
}

.an-domain-note {
  display: block;
  max-width: 680px;
  margin-top: 5px;
  color: var(--dim,#8c9aa6);
  font-size: 12px;
  line-height: 1.45;
}

.an-domain-controls {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 8px;
  min-width: 0;
}

.an-domain-controls select {
  min-width: min(260px,100%);
  max-width: 100%;
}

.an-oauth-note {
  display: grid;
  gap: 8px;
  border-color: rgba(255,184,86,.26);
  background: rgba(255,184,86,.055);
}

.an-oauth-note h3,
.an-oauth-note p {
  margin: 0;
}

.an-oauth-note p {
  color: var(--dim,#8c9aa6);
  font-size: 12px;
  line-height: 1.5;
}

@media (max-width: 680px) {
  .an-domain-picker .ch-card-h,
  .an-domain-controls,
  .an-add-source-form,
  .an-custom-log-form {
    display: grid;
    grid-template-columns: minmax(0,1fr);
    width: 100%;
  }

  .an-domain-controls select,
  .an-domain-controls .btn,
  .an-add-source-form input,
  .an-add-source-form select,
  .an-add-source-form .btn,
  .an-custom-log-form input,
  .an-custom-log-form .btn {
    width: 100%;
    min-width: 0;
  }
}

/* Analytics is a visual instrument panel: three selectors steer one primary
   canvas, while detail remains available on hover or deliberate expansion. */
.an-domain-shell { gap: 8px; }
.an-domain-picker {
  position: sticky;
  top: 0;
  z-index: 8;
  padding: 8px 10px !important;
  border-radius: 7px !important;
  background: color-mix(in srgb, var(--glass) 90%, transparent) !important;
  -webkit-backdrop-filter: blur(18px);
  backdrop-filter: blur(18px);
}
.an-domain-picker .ch-card-h { align-items: center; margin: 0; }
.an-domain-picker .ch-eyebrow { margin: 0 0 2px; }
.an-domain-picker h3 { margin: 0; font-size: 13px; letter-spacing: 0; }
.an-domain-controls {
  display: grid;
  grid-template-columns: repeat(3, minmax(112px, 1fr)) 32px;
  gap: 5px;
}
.an-domain-controls select {
  width: 100%;
  min-width: 0;
  min-height: 32px;
  padding: 0 28px 0 9px;
  border-radius: 6px;
  font-size: 11px;
}
.an-icon-button {
  width: 32px;
  height: 32px;
  border: 1px solid var(--line-strong);
  border-radius: 6px;
  background: transparent;
  color: var(--neon);
  font-size: 19px;
  cursor: pointer;
}
.an-icon-button:hover { background: color-mix(in srgb, var(--neon) 10%, transparent); }
.an-domain-shell .an-trend-card {
  min-height: 0;
  padding: 10px 12px !important;
  border-radius: 7px !important;
}
.an-domain-shell .an-trend-card .ch-card-h {
  position: absolute;
  z-index: 4;
  margin: 6px;
  pointer-events: none;
}
.an-domain-shell .an-live-label {
  border-color: color-mix(in srgb, var(--neon) 35%, transparent);
  background: color-mix(in srgb, var(--neon) 8%, transparent);
}
.an-signal-map {
  position: relative;
  min-height: clamp(410px, 55vh, 680px);
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 6px;
  background:
    linear-gradient(rgba(84,108,125,.055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(84,108,125,.055) 1px, transparent 1px),
    radial-gradient(circle at 50% 50%, rgba(58,227,164,.09), transparent 45%);
  background-size: 36px 36px, 36px 36px, auto;
}
.an-signal-ring {
  position: absolute;
  left: 50%;
  top: 50%;
  border: 1px solid rgba(99,226,169,.12);
  border-radius: 50%;
  transform: translate(-50%,-50%);
  pointer-events: none;
}
.an-signal-ring.r1 { width: 24%; aspect-ratio: 1; }
.an-signal-ring.r2 { width: 48%; aspect-ratio: 1; }
.an-signal-ring.r3 { width: 78%; aspect-ratio: 1; }
.an-signal-center {
  position: absolute;
  left: 50%;
  top: 50%;
  z-index: 2;
  display: grid;
  place-items: center;
  width: 106px;
  aspect-ratio: 1;
  border: 1px solid rgba(99,226,169,.44);
  border-radius: 50%;
  background: rgba(6,19,19,.86);
  box-shadow: 0 0 48px rgba(99,226,169,.15);
  transform: translate(-50%,-50%);
}
.an-signal-center small { color: var(--dim); font: 700 9px "Spline Sans Mono", monospace; text-transform: uppercase; }
.an-signal-center b { color: var(--ink); font-size: 19px; }
.an-signal-node {
  position: absolute;
  left: var(--x);
  top: var(--y);
  z-index: 3;
  display: grid;
  grid-template-columns: 14px auto;
  grid-template-rows: auto auto;
  gap: 1px 7px;
  min-width: 0;
  padding: 6px 8px;
  border: 0;
  background: transparent;
  color: var(--ink);
  text-align: left;
  cursor: pointer;
  transform: translate(-50%,-50%);
}
.an-signal-node i {
  grid-row: 1 / 3;
  align-self: center;
  width: 10px;
  height: 10px;
  border: 2px solid color-mix(in srgb, var(--node) 70%, white);
  border-radius: 50%;
  background: var(--node);
  box-shadow: 0 0 calc(18px * var(--scale)) var(--node);
  transform: scale(var(--scale));
  animation: an-node-pulse 3.2s ease-in-out infinite;
}
.an-signal-node span { color: var(--dim); font: 700 8px "Spline Sans Mono", monospace; text-transform: uppercase; white-space: nowrap; }
.an-signal-node b { font-size: 12px; white-space: nowrap; }
.an-signal-node:hover, .an-signal-node:focus-visible {
  border-radius: 5px;
  outline: 1px solid color-mix(in srgb, var(--node) 48%, transparent);
  background: rgba(4,14,16,.9);
}
@keyframes an-node-pulse {
  50% { filter: brightness(1.35); }
}
.an-domain-shell .an-kpis {
  display: grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap: 1px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 6px;
}
.an-domain-shell .an-kpis .ch-kpi {
  min-height: 58px;
  padding: 8px 10px;
  border: 0;
  border-right: 1px solid var(--line);
  border-radius: 0;
  background: rgba(255,255,255,.014);
}
.an-domain-shell .an-kpis .ch-kpi:last-child { border-right: 0; }
.an-domain-shell .an-kpis .ch-kpi-v { font-size: 17px; }
.an-domain-shell .an-kpis .ch-kpi-s { display: none; }
.an-domain-shell .an-ops-report { margin-top: 0; border-radius: 6px; opacity: .72; }
.an-domain-shell .an-ops-report > summary { min-height: 32px; padding: 6px 9px; }
.an-domain-shell .an-ops-report > summary span { margin-left: auto; }

@media (max-width: 760px) {
  .an-domain-picker { position: relative; }
  .an-domain-picker .ch-card-h { display: grid; }
  .an-domain-controls { grid-template-columns: 1fr 1fr 1fr 32px; width: 100%; }
  .an-domain-picker .ch-card-h > div:first-child { display: none; }
  .an-signal-map { min-height: 430px; }
  .an-signal-node span { display: none; }
  .an-domain-shell .an-kpis { grid-template-columns: repeat(2,minmax(0,1fr)); }
}

/* ============================================================= */
/* ==== FINAL DESKTOP POLISH - viewport-owned command surface === */
/* ============================================================= */

html[data-command-os="2040"],
html[data-command-os="2040"] body {
  width: 100%;
  min-width: 0;
  min-height: 100%;
  margin: 0 !important;
  overflow: hidden !important;
  background: #02060b !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled:not([hidden]) {
  position: fixed !important;
  inset: 0 !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) !important;
  grid-template-rows: 64px 1fr 36px !important;
  width: 100vw !important;
  height: 100dvh !important;
  min-height: 0 !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  background:
    linear-gradient(180deg, rgba(5, 10, 17, 0.96), #02060b 64%),
    #02060b !important;
  color: #eff6f8 !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .os-command-rail {
  position: relative !important;
  top: auto !important;
  grid-row: 1 !important;
  grid-template-columns: 188px minmax(0, 1fr) auto !important;
  min-height: 64px !important;
  height: 64px !important;
  padding: 0 22px !important;
  border-bottom: 1px solid rgba(126, 158, 185, 0.14) !important;
  background:
    linear-gradient(90deg, rgba(124, 108, 255, 0.1), transparent 24%, transparent 72%, rgba(69, 230, 189, 0.055)),
    rgba(3, 7, 12, 0.96) !important;
  box-shadow: 0 14px 34px rgba(0, 0, 0, 0.24) !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .os-identity {
  padding-right: 18px !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .os-identity-name {
  font-size: 12px !important;
  letter-spacing: 0.13em !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .os-primary-nav button {
  padding-inline: 12px !important;
  color: #8996a2 !important;
  font-size: 11px !important;
  letter-spacing: 0 !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .os-primary-nav button.is-active,
html[data-command-os="2040"] .phantom.command-os-enabled .os-primary-nav button:hover {
  color: #f4f8fb !important;
  background: rgba(255, 255, 255, 0.035) !important;
}

/* Analytics 2026: real charts, explicit coverage, and inspectable values. */
.an-domain-shell .an {
  display: grid;
  gap: 10px;
}
.an-analysis-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
  padding: 8px 2px 2px;
}
.an-analysis-head h2 {
  margin: 2px 0 0;
  color: var(--ink);
  font-size: clamp(18px, 2vw, 25px);
  letter-spacing: 0;
}
.an-analysis-head p:last-child {
  max-width: 720px;
  margin: 5px 0 0;
  color: var(--dim);
  font-size: 11px;
  line-height: 1.45;
}
.an-visual-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  min-height: 380px;
  overflow: hidden;
  border: 1px solid var(--line);
  border-radius: 6px;
  background:
    linear-gradient(rgba(84,108,125,.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(84,108,125,.04) 1px, transparent 1px),
    rgba(3, 10, 15, .72);
  background-size: 32px 32px;
}
.an-visual-grid.has-secondary {
  grid-template-columns: minmax(0, 1.65fr) minmax(270px, .7fr);
}
.an-primary-visual,
.an-secondary-visual {
  min-width: 0;
  padding: 22px;
}
.an-secondary-visual {
  border-left: 1px solid var(--line);
  background: rgba(255,255,255,.012);
}
.an-rank-chart {
  display: grid;
  align-content: center;
  min-height: 330px;
}
.an-rank-row {
  display: grid;
  grid-template-columns: 28px minmax(120px, .65fr) minmax(140px, 1.6fr) 64px;
  align-items: center;
  gap: 10px;
  min-height: 54px;
  padding: 0 8px;
  border: 0;
  border-bottom: 1px solid rgba(127,157,179,.1);
  background: transparent;
  color: var(--ink);
  text-align: left;
  cursor: pointer;
}
.an-rank-row:hover,
.an-rank-row:focus-visible {
  outline: 0;
  background: rgba(99,226,169,.055);
}
.an-rank-order {
  color: #586875;
  font: 700 9px "Spline Sans Mono", monospace;
}
.an-rank-label {
  overflow: hidden;
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.an-rank-track {
  height: 7px;
  overflow: hidden;
  border-radius: 2px;
  background: rgba(125,153,172,.11);
}
.an-rank-track span {
  display: block;
  height: 100%;
  min-width: 2px;
  border-radius: inherit;
  box-shadow: 0 0 16px color-mix(in srgb, currentColor 30%, transparent);
}
.an-rank-row > b {
  text-align: right;
  font: 750 12px "Spline Sans Mono", monospace;
}
.an-funnel {
  display: grid;
  align-content: center;
  gap: 20px;
  min-height: 330px;
}
.an-funnel-stage {
  display: grid;
  gap: 9px;
}
.an-funnel-copy {
  display: grid;
  grid-template-columns: 1fr auto;
  align-items: baseline;
  gap: 4px 12px;
}
.an-funnel-copy span { color: var(--ink); font-size: 11px; }
.an-funnel-copy b { font: 750 14px "Spline Sans Mono", monospace; }
.an-funnel-copy i {
  grid-column: 1 / -1;
  color: var(--dim);
  font: 600 8px "Spline Sans Mono", monospace;
  font-style: normal;
  text-transform: uppercase;
}
.an-funnel-bar {
  display: block;
  height: 14px;
  border-radius: 2px;
  background: rgba(125,153,172,.1);
}
.an-funnel-bar i {
  display: block;
  height: 100%;
  min-width: 3px;
  border-radius: inherit;
}
.an-line-chart {
  display: grid;
  min-height: 330px;
}
.an-chart-legend {
  display: flex;
  align-items: center;
  gap: 15px;
  min-height: 32px;
  color: var(--dim);
  font: 650 9px "Spline Sans Mono", monospace;
  text-transform: uppercase;
}
.an-chart-legend span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.an-chart-legend i {
  width: 7px;
  height: 7px;
  border-radius: 50%;
}
.an-chart-legend output {
  min-width: 0;
  margin-left: auto;
  overflow: hidden;
  color: #b9c7d2;
  text-overflow: ellipsis;
  text-transform: none;
  white-space: nowrap;
}
.an-line-chart svg {
  display: block;
  width: 100%;
  height: auto;
  overflow: visible;
}
.an-grid-line line {
  stroke: rgba(126,158,185,.12);
  stroke-width: 1;
}
.an-grid-line text,
.an-axis-start,
.an-axis-end {
  fill: #667681;
  font: 9px "Spline Sans Mono", monospace;
}
.an-grid-line text { text-anchor: end; }
.an-axis-end { text-anchor: end; }
.an-series path {
  fill: none;
  stroke: var(--series);
  stroke-width: 3;
  stroke-linecap: round;
  stroke-linejoin: round;
  filter: drop-shadow(0 0 6px color-mix(in srgb, var(--series) 38%, transparent));
}
.an-series circle {
  fill: #061016;
  stroke: var(--series);
  stroke-width: 3;
  cursor: crosshair;
  transition: r 120ms ease, fill 120ms ease;
}
.an-series circle:hover,
.an-series circle:focus {
  r: 8;
  outline: none;
  fill: var(--series);
}
.an-insight-strip {
  display: grid;
  grid-template-columns: auto minmax(0,1fr);
  gap: 12px;
  min-height: 34px;
  align-items: center;
  padding: 6px 10px;
  border: 1px solid var(--line);
  border-radius: 5px;
  background: rgba(255,255,255,.012);
}
.an-insight-strip span {
  color: var(--neon);
  font: 750 8px "Spline Sans Mono", monospace;
  text-transform: uppercase;
}
.an-insight-strip output {
  min-width: 0;
  overflow: hidden;
  color: #9aabb6;
  font-size: 10px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

@media (max-width: 980px) {
  .an-visual-grid.has-secondary { grid-template-columns: minmax(0,1fr); }
  .an-secondary-visual { border-top: 1px solid var(--line); border-left: 0; }
  .an-rank-chart, .an-funnel, .an-line-chart { min-height: 260px; }
}
@media (max-width: 620px) {
  .an-analysis-head { display: grid; }
  .an-primary-visual, .an-secondary-visual { padding: 12px; }
  .an-visual-grid { min-height: 310px; }
  .an-rank-row { grid-template-columns: 24px minmax(88px,1fr) minmax(75px,1fr) 48px; gap: 6px; }
  .an-chart-legend output { display: none; }
  .an-insight-strip output { white-space: normal; }
}

html[data-command-os="2040"] .phantom.command-os-enabled .app-main {
  grid-column: 1 / -1 !important;
  grid-row: 2 !important;
  display: grid !important;
  grid-template-rows: 34px minmax(0, 1fr) !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: 100vw !important;
  height: 100% !important;
  min-height: 0 !important;
  box-sizing: border-box !important;
  overflow: hidden !important;
  background: #02060b !important;
}

/* Workspace consoles are the second app-main track. Give that track an
   explicit viewport-owned height; without it, grid percentage sizing can
   collapse the console to its first header row and clip every page body. */
html[data-command-os="2040"] .phantom.command-os-enabled .app-main > .console.console-workspace {
  grid-row: 1 / -1 !important;
  display: block !important;
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  max-height: none !important;
  overflow: auto !important;
  padding: 16px 18px 54px !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .app-main > .console.console-workspace .workspace-page {
  min-height: calc(100dvh - 130px) !important;
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .phantomwire {
  position: relative !important;
  top: auto !important;
  z-index: 10 !important;
  min-height: 34px !important;
  height: 34px !important;
  display: flex !important;
  align-items: center !important;
  border-top: 0 !important;
  border-bottom: 1px solid rgba(126, 158, 185, 0.12) !important;
  background: rgba(2, 7, 12, 0.9) !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .phantomwire .atk-label,
html[data-command-os="2040"] .phantom.command-os-enabled .phantomwire .atk-view,
html[data-command-os="2040"] .phantom.command-os-enabled .phantomwire .atk-track,
html[data-command-os="2040"] .phantom.command-os-enabled .phantomwire .atk-item {
  min-height: 34px !important;
  height: 34px !important;
  display: flex !important;
  align-items: center !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .phantomwire .atk-track {
  padding-block: 0 !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .phantomwire .atk-item,
html[data-command-os="2040"] .phantom.command-os-enabled .phantomwire .atk-item b,
html[data-command-os="2040"] .phantom.command-os-enabled .phantomwire .atk-item em,
html[data-command-os="2040"] .phantom.command-os-enabled .phantomwire .atk-txt {
  line-height: 1 !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .app-main > .console:not(.console-workspace) {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) clamp(300px, 18vw, 360px) !important;
  gap: 0 !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: #02060b !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .console-center {
  display: grid !important;
  grid-template-rows: minmax(0, 1fr) 136px !important;
  height: 100% !important;
  min-height: 0 !important;
  overflow: hidden !important;
  border-right: 1px solid rgba(126, 158, 185, 0.12) !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .hero2 {
  height: 100% !important;
  min-height: 0 !important;
  border: 0 !important;
  background:
    radial-gradient(circle at 50% 56%, rgba(75, 133, 219, 0.14), transparent 24%),
    #030910 !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .hero2::before {
  z-index: 5 !important;
  background:
    linear-gradient(90deg, rgba(2, 6, 11, 0.84) 0%, rgba(2, 6, 11, 0.2) 22%, rgba(2, 6, 11, 0.08) 63%, rgba(2, 6, 11, 0.62) 100%),
    linear-gradient(180deg, rgba(2, 6, 11, 0.48) 0%, transparent 34%, rgba(2, 6, 11, 0.16) 72%, rgba(2, 6, 11, 0.84) 100%) !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .os-earth-horizon {
  object-position: center 60% !important;
  filter: saturate(0.94) brightness(0.86) contrast(1.12) !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .dashboard-brief {
  top: clamp(34px, 4.8vh, 58px) !important;
  left: clamp(32px, 3.1vw, 58px) !important;
  width: min(360px, 31vw) !important;
  max-width: 360px !important;
  padding: 0 !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .dashboard-brief-kicker {
  margin-bottom: 10px !important;
  color: #9fb0bf !important;
  font-size: 9px !important;
  letter-spacing: 0.16em !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .dashboard-brief h1 {
  margin-bottom: 12px !important;
  max-width: 8.8ch !important;
  color: #f7fbfd !important;
  font: 700 clamp(38px, 3.3vw, 58px) / 0.94 "Bricolage Grotesque", "Instrument Sans", sans-serif !important;
  text-shadow: 0 18px 42px rgba(0, 0, 0, 0.62) !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .dashboard-brief-copy > p:last-child {
  max-width: 30ch !important;
  color: rgba(220, 231, 238, 0.78) !important;
  font-size: 14px !important;
  line-height: 1.5 !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .os-node {
  padding-left: 13px !important;
  opacity: 0.78 !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .os-node span {
  letter-spacing: 0.11em !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .os-node-core {
  width: 128px !important;
  min-width: 128px !important;
  background: rgba(7, 18, 30, 0.68) !important;
  backdrop-filter: blur(16px);
}

html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .decision-deck {
  right: clamp(24px, 2.4vw, 38px) !important;
  bottom: calc(136px + 18px) !important;
  width: min(680px, calc(100% - 470px)) !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .decision-list {
  gap: 10px !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .decision-card {
  min-height: 102px !important;
  border: 1px solid rgba(126, 158, 185, 0.14) !important;
  border-left: 3px solid rgba(124, 108, 255, 0.78) !important;
  border-radius: 8px !important;
  background: rgba(5, 12, 19, 0.72) !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .dashboard-intel-band {
  grid-row: 2 !important;
  display: grid !important;
  grid-template-columns: 230px minmax(0, 1fr) auto !important;
  min-height: 136px !important;
  border-top: 1px solid rgba(126, 158, 185, 0.14) !important;
  background:
    linear-gradient(180deg, rgba(7, 13, 21, 0.96), rgba(3, 8, 14, 0.98)) !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .dashboard-intel-head {
  padding: 20px 18px !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .dashboard-intel-grid {
  min-width: 0 !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .dashboard-intel-card {
  min-height: 136px !important;
  padding: 18px 16px !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .console-rail {
  display: flex !important;
  flex-direction: column !important;
  gap: 18px !important;
  height: 100% !important;
  padding: 24px 22px 28px !important;
  overflow: hidden auto !important;
  border-left: 1px solid rgba(255, 255, 255, 0.018) !important;
  background:
    linear-gradient(180deg, rgba(6, 12, 18, 0.98), rgba(3, 7, 12, 0.98)) !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .console-rail :where(.plan-card, .queue-card, .signals-card) {
  padding: 0 0 18px !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(126, 158, 185, 0.12) !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .os-mission-head {
  display: grid !important;
  gap: 5px !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .os-mission-head span,
html[data-command-os="2040"] .phantom.command-os-enabled .section-head h2 {
  letter-spacing: 0.1em !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .os-system-line {
  position: relative !important;
  grid-row: 3 !important;
  height: 36px !important;
  min-height: 36px !important;
  border-top: 1px solid rgba(126, 158, 185, 0.12) !important;
  background: rgba(2, 6, 11, 0.98) !important;
}

@media (min-width: 901px) and (max-width: 1320px) {
  html[data-command-os="2040"] .phantom.command-os-enabled .os-command-rail {
    grid-template-columns: 160px minmax(0, 1fr) auto !important;
    padding-inline: 16px !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .app-main > .console:not(.console-workspace) {
    grid-template-columns: minmax(0, 1fr) 310px !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .dashboard-brief h1 {
    font-size: 40px !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .decision-deck {
    width: min(560px, calc(100% - 370px)) !important;
  }
}

@media (max-width: 900px) {
  html[data-command-os="2040"],
  html[data-command-os="2040"] body {
    overflow: hidden auto !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled:not([hidden]) {
    position: relative !important;
    display: block !important;
    width: 100% !important;
    height: auto !important;
    min-height: 100svh !important;
    overflow: hidden !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .app-main {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    min-height: 100svh !important;
    overflow: visible !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .app-main > .console:not(.console-workspace) {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    min-height: 100svh !important;
    overflow: visible !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .console-center {
    display: flex !important;
    flex-direction: column !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .dashboard-brief {
    position: relative !important;
    inset: auto !important;
    width: 100% !important;
    max-width: none !important;
    padding: 22px 18px 14px !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .dashboard-brief h1 {
    max-width: 10.5ch !important;
    font-size: clamp(31px, 11vw, 44px) !important;
    line-height: 0.98 !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .hero2 {
    width: auto !important;
    min-height: 420px !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .dashboard-intel-band {
    min-height: 0 !important;
  }
}

@media (max-width: 680px) {
  html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .hero2 {
    display: none !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .dashboard-intel-band {
    margin-top: 4px !important;
  }
}

@media (min-width: 901px) {
  html[data-command-os="2040"] .phantom.command-os-enabled .console-center:has(> .decision-deck:not([hidden])) {
    grid-template-rows: minmax(0, 1fr) 150px !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .console-center:has(> .decision-deck:not([hidden])) > .dashboard-intel-band {
    display: none !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .console-center > .decision-deck:not([hidden]) {
    position: relative !important;
    inset: auto !important;
    grid-row: 2 !important;
    align-self: stretch !important;
    width: 100% !important;
    max-height: 150px !important;
    padding: 8px 18px 10px !important;
    overflow: hidden !important;
    border-top: 1px solid rgba(126, 158, 185, .14) !important;
    background: linear-gradient(180deg, rgba(7, 13, 21, .96), rgba(3, 8, 14, .98)) !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .console-center > .decision-deck:not([hidden]) .decision-head {
    min-height: 28px !important;
    padding: 0 0 5px !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .console-center > .decision-deck:not([hidden]) .decision-card {
    max-height: 98px !important;
    padding: 7px 9px !important;
  }

  html[data-command-os="2040"] .phantom.command-os-enabled .console-center > .decision-deck:not([hidden]) .decision-card p {
    -webkit-line-clamp: 1;
  }
}

.phantombot-presence {
  position: relative;
  display: grid;
  width: min(310px, 72vw);
  height: min(290px, 36vh);
  min-height: 210px;
  margin-bottom: 6px;
  place-items: center;
  isolation: isolate;
}

.phantombot-presence::before {
  position: absolute;
  z-index: -1;
  width: 86%;
  aspect-ratio: 1;
  content: "";
  border: 1px solid rgba(0, 255, 148, .08);
  border-radius: 50%;
  box-shadow:
    0 0 70px rgba(0, 255, 148, .12),
    inset 0 0 60px rgba(0, 255, 148, .04);
  animation: phantomPresenceOrbit 16s linear infinite;
}

.phantombot-presence-canvas {
  display: block;
  width: 100%;
  height: 100%;
  filter:
    saturate(1.08)
    drop-shadow(0 0 12px rgba(0, 255, 148, .42))
    drop-shadow(0 18px 34px rgba(0, 0, 0, .7));
}

.phantombot-presence-live {
  position: absolute;
  z-index: 2;
  top: 8px;
  right: 10px;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  color: rgba(167, 255, 217, .8);
  font: 700 8px/1 "Spline Sans Mono", monospace;
  letter-spacing: .16em;
  text-transform: uppercase;
}

.phantombot-presence-live i {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: #19f58e;
  box-shadow: 0 0 9px rgba(25, 245, 142, .85);
}

.phantompet-real {
  position: fixed;
  z-index: 86;
  left: var(--pet-x, 67vw);
  top: var(--pet-y, 64vh);
  width: var(--pet-width, clamp(142px, 10.5vw, 190px));
  height: var(--pet-height, clamp(158px, 12vw, 216px));
  transform: translate(-50%, -50%);
  user-select: none;
  touch-action: none;
  filter:
    drop-shadow(0 0 18px rgba(25, 245, 142, .32))
    drop-shadow(0 22px 38px rgba(0, 0, 0, .72));
  transition:
    left .42s cubic-bezier(.2, .8, .2, 1),
    top .42s cubic-bezier(.2, .8, .2, 1),
    transform .22s ease,
    filter .22s ease;
}

.phantompet-real[hidden] {
  display: none !important;
}

.phantompet-real.is-dragging {
  z-index: 120;
  transform: translate(-50%, -50%) scale(1.04);
  filter:
    drop-shadow(0 0 28px rgba(25, 245, 142, .52))
    drop-shadow(0 28px 46px rgba(0, 0, 0, .82));
  transition: transform .12s ease, filter .12s ease;
}

.phantompet-real.is-jumping {
  animation: phantomPetPop .58s cubic-bezier(.2, .9, .16, 1);
}

.phantompet-real.is-spinning .phantompet-stage {
  transform-style: preserve-3d;
  animation: phantomPetSpin 1.05s cubic-bezier(.18, .92, .2, 1);
}

.phantompet-real.is-waving .phantompet-stage {
  animation: phantomPetWave 1.5s cubic-bezier(.18, .9, .2, 1);
}

.phantompet-real.is-waving .phantompet-canvas {
  transform-origin: 57% 32%;
  animation: phantomPetCanvasWave .5s ease-in-out 3;
}

.phantompet-real.is-resizing .phantompet-stage {
  animation: phantomPetResize .42s cubic-bezier(.2, .9, .18, 1);
}

.phantompet-real.is-resizing::after {
  position: absolute;
  left: 50%;
  bottom: -5px;
  z-index: 5;
  padding: 4px 8px;
  color: rgba(236, 255, 246, .96);
  font: 900 9px/1 "Spline Sans Mono", monospace;
  letter-spacing: .08em;
  content: attr(data-pet-scale) "×";
  background: rgba(8, 12, 18, .84);
  border: 1px solid rgba(25, 245, 142, .24);
  border-radius: 999px;
  box-shadow: 0 12px 28px rgba(0, 0, 0, .42);
  transform: translateX(-50%);
  pointer-events: none;
}

.phantompet-stage {
  position: relative;
  display: grid;
  width: 100%;
  height: 100%;
  padding: 0;
  place-items: center;
  cursor: grab;
  background: transparent;
  border: 0;
  outline: none;
}

.phantompet-stage:active {
  cursor: grabbing;
}

.phantompet-stage:focus-visible {
  border-radius: 32px;
  box-shadow: 0 0 0 3px rgba(25, 245, 142, .28);
}

.phantompet-canvas {
  position: relative;
  z-index: 2;
  display: block;
  width: 100%;
  height: 100%;
  pointer-events: none;
}

.phantompet-orbit {
  position: absolute;
  z-index: 1;
  width: 74%;
  aspect-ratio: 1;
  border: 1px solid rgba(25, 245, 142, .18);
  border-radius: 50%;
  box-shadow:
    0 0 48px rgba(25, 245, 142, .16),
    inset 0 0 40px rgba(25, 245, 142, .055);
  animation: phantomPetOrbit 16s linear infinite;
  pointer-events: none;
}

.phantompet-orbit::before,
.phantompet-orbit::after {
  position: absolute;
  inset: 11%;
  content: "";
  border: 1px solid rgba(138, 121, 255, .16);
  border-radius: 50%;
  transform: rotate(64deg) scaleY(.48);
}

.phantompet-orbit::after {
  border-color: rgba(78, 201, 255, .13);
  transform: rotate(-36deg) scaleY(.52);
}

.phantompet-shadow {
  position: absolute;
  z-index: 0;
  bottom: 9%;
  left: 50%;
  width: 46%;
  height: 10%;
  transform: translateX(-50%);
  background: radial-gradient(ellipse, rgba(25, 245, 142, .32), transparent 70%);
  border-radius: 50%;
  filter: blur(1px);
  opacity: .8;
  pointer-events: none;
}

.phantompet-speech {
  position: absolute;
  z-index: 4;
  right: 58%;
  bottom: 78%;
  min-width: 82px;
  max-width: 190px;
  padding: 9px 11px;
  color: rgba(236, 255, 246, .96);
  font: 800 12px/1.25 "Instrument Sans", sans-serif;
  text-align: center;
  background:
    linear-gradient(135deg, rgba(11, 17, 23, .92), rgba(18, 14, 36, .82)),
    radial-gradient(circle at 20% 10%, rgba(25, 245, 142, .14), transparent 44%);
  border: 1px solid rgba(25, 245, 142, .24);
  border-radius: 14px 14px 4px 14px;
  box-shadow: 0 18px 38px rgba(0, 0, 0, .42);
  opacity: 0;
  pointer-events: none;
  transform: translateY(8px) scale(.94);
  transition: opacity .18s ease, transform .18s ease;
}

.phantompet-real.is-talking .phantompet-speech {
  opacity: 1;
  transform: translateY(0) scale(1);
}

.phantompet-menu {
  position: fixed;
  z-index: 140;
  display: grid;
  gap: 5px;
  width: 202px;
  max-height: min(340px, calc(100vh - 24px));
  overflow: auto;
  padding: 8px;
  background: rgba(8, 12, 18, .96);
  border: 1px solid rgba(138, 121, 255, .28);
  border-radius: 14px;
  box-shadow: 0 24px 70px rgba(0, 0, 0, .58), 0 0 34px rgba(25, 245, 142, .12);
  backdrop-filter: blur(18px);
}

.phantompet-menu button {
  min-height: 34px;
  padding: 0 10px;
  color: rgba(236, 255, 246, .94);
  font: 800 12px "Instrument Sans", sans-serif;
  text-align: left;
  background: rgba(255, 255, 255, .045);
  border: 1px solid rgba(255, 255, 255, .07);
  border-radius: 10px;
  cursor: pointer;
}

.os-settings-action {
  width: 38px;
  padding-inline: 0 !important;
  color: #dfeaff !important;
  font-size: 17px !important;
  line-height: 1;
}

.os-settings-action:hover,
.os-settings-action.is-active {
  border-color: rgba(109, 164, 255, .42);
  background: rgba(109, 164, 255, .1);
}

.phantompet-menu button:hover {
  color: #ffffff;
  background: rgba(25, 245, 142, .11);
  border-color: rgba(25, 245, 142, .28);
}

.phantompet-menu small {
  padding: 5px 6px 2px;
  color: rgba(143, 160, 176, .9);
  font: 700 10px/1.35 "Instrument Sans", sans-serif;
}

@keyframes phantomPetOrbit {
  to { transform: rotate(360deg); }
}

@keyframes phantomPetPop {
  0% { transform: translate(-50%, -50%) scale(.74) rotate(-8deg); opacity: .3; }
  68% { transform: translate(-50%, -50%) scale(1.08) rotate(3deg); opacity: 1; }
  100% { transform: translate(-50%, -50%) scale(1) rotate(0); }
}

@keyframes phantomPetSpin {
  0% { transform: perspective(720px) rotateY(0deg) scale(1); filter: saturate(1); }
  38% { transform: perspective(720px) rotateY(170deg) scale(1.13); filter: saturate(1.25) brightness(1.1); }
  70% { transform: perspective(720px) rotateY(315deg) scale(1.04); filter: saturate(1.18); }
  100% { transform: perspective(720px) rotateY(360deg) scale(1); filter: saturate(1); }
}

@keyframes phantomPetWave {
  0%, 100% { transform: translateY(0) rotate(0deg) scale(1); filter: saturate(1); }
  18% { transform: translateY(-5%) rotate(-4deg) scale(1.04); filter: saturate(1.18) brightness(1.08); }
  42% { transform: translateY(1%) rotate(5deg) scale(1.02); }
  68% { transform: translateY(-3%) rotate(-3deg) scale(1.04); }
}

@keyframes phantomPetCanvasWave {
  0%, 100% { transform: rotate(0deg) translateX(0); }
  25% { transform: rotate(-5deg) translateX(-2%); }
  55% { transform: rotate(7deg) translateX(2%); }
  80% { transform: rotate(-3deg) translateX(-1%); }
}

@keyframes phantomPetResize {
  0% { transform: scale(.94); }
  58% { transform: scale(1.07); }
  100% { transform: scale(1); }
}

.phantombot-presence-ring {
  position: absolute;
  bottom: 7%;
  left: 50%;
  width: 52%;
  height: 8%;
  transform: translateX(-50%);
  border: 1px solid rgba(25, 245, 142, .5);
  border-radius: 50%;
  box-shadow:
    0 0 18px rgba(25, 245, 142, .24),
    inset 0 0 13px rgba(25, 245, 142, .18);
  animation: phantomPresenceRing 2.8s ease-in-out infinite;
  pointer-events: none;
}

.phantombot-empty > h1 {
  max-width: 720px;
  color: var(--pbot-text);
  font-size: clamp(30px, 4.2vw, 52px);
  line-height: 1;
  letter-spacing: 0;
  text-shadow: 0 0 28px rgba(0, 255, 148, .18);
  text-transform: none;
}

.phantombot-empty {
  padding-top: 22px;
  padding-bottom: 96px;
}

@keyframes phantomPresenceOrbit {
  to { transform: rotate(360deg); }
}

@keyframes phantomPresenceRing {
  0%, 100% { transform: translateX(-50%) scale(.96); opacity: .62; }
  50% { transform: translateX(-50%) scale(1.06); opacity: 1; }
}

@media (max-width: 680px) {
  html[data-command-os="2040"] .phantom.command-os-enabled .console:not(.console-workspace) .hero2 {
    display: flex !important;
    width: 100% !important;
    height: 78px !important;
    min-height: 78px !important;
    align-items: center !important;
    justify-content: center !important;
  }
  .phantombot-presence {
    width: min(240px, 74vw);
    height: min(220px, 29vh);
    min-height: 164px;
    margin-bottom: 0;
  }

  .phantombot-empty {
    padding: 8px 2px 84px;
  }

  .phantombot-empty > h1 {
    max-width: 11ch;
    font-size: clamp(27px, 8vw, 36px);
  }
}

@media (prefers-reduced-motion: reduce) {
  .phantombot-presence::before,
  .phantombot-presence-ring {
    animation: none;
  }
}

/* PhantomBot desktop parity shell.
   Kept last so legacy chat styles cannot resize or reframe this workspace. */
html[data-command-os="2040"] .phantom.command-os-enabled .app-main > .console.console-workspace:has(.workspace-page[data-workspace-page="phantomai"]) {
  padding: 0 !important;
  overflow: hidden !important;
}

html[data-command-os="2040"] .phantom.command-os-enabled .app-main > .console.console-workspace .workspace-page[data-workspace-page="phantomai"],
html[data-command-os="2040"] .phantom.command-os-enabled .app-main > .console.console-workspace .workspace-page[data-workspace-page="phantomai"] .workspace-page-body {
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

html[data-command-os="2040"] .phantombot-os {
  --pbot-bg: #050806;
  --pbot-panel: #080d0a;
  --pbot-panel-2: #0b1210;
  --pbot-hover: rgba(232, 244, 238, .05);
  --pbot-line: rgba(153, 181, 166, .13);
  --pbot-line-strong: rgba(69, 199, 137, .3);
  --pbot-text: #e7efeb;
  --pbot-muted: #8d9b94;
  --pbot-faint: #59665f;
  --pbot-live: #43d796;
  --pbot-brain: #8d7cf8;
  grid-template-columns: 230px minmax(0, 1fr);
  background: var(--pbot-bg);
  color: var(--pbot-text);
}

html[data-command-os="2040"] .phantombot-os.is-rail-right {
  grid-template-columns: minmax(0, 1fr) 230px;
}

html[data-command-os="2040"] .phantombot-os.is-rail-right .phantombot-taskrail {
  grid-column: 2;
  grid-row: 1;
  border-right: 0;
  border-left: 1px solid var(--pbot-line);
}

html[data-command-os="2040"] .phantombot-os.is-rail-right .phantombot-stage {
  grid-column: 1;
  grid-row: 1;
}

html[data-command-os="2040"] .phantombot-os.is-rail-collapsed {
  grid-template-columns: 0 minmax(0, 1fr);
}

html[data-command-os="2040"] .phantombot-os.is-rail-collapsed.is-rail-right {
  grid-template-columns: minmax(0, 1fr) 0;
}

html[data-command-os="2040"] .phantombot-os.is-rail-collapsed .phantombot-taskrail {
  visibility: hidden;
  overflow: hidden;
  opacity: 0;
}

html[data-command-os="2040"] .phantombot-taskrail {
  display: flex;
  padding: 0;
  overflow: hidden;
  background: #070b09;
  transition: opacity 160ms ease, visibility 160ms ease;
}

html[data-command-os="2040"] .phantombot-window-tools {
  display: flex;
  flex: 0 0 30px;
  align-items: center;
  justify-content: flex-end;
  gap: 2px;
  padding: 0 8px;
  border-bottom: 1px solid var(--pbot-line);
}

html[data-command-os="2040"] .phantombot-window-tools button,
html[data-command-os="2040"] .phantombot-title-actions button,
html[data-command-os="2040"] .phantombot-tab-add {
  display: grid;
  width: 28px;
  height: 28px;
  min-height: 0;
  padding: 0;
  place-items: center;
  border: 0;
  border-radius: 5px;
  background: transparent;
  color: var(--pbot-faint);
  cursor: pointer;
}

html[data-command-os="2040"] .phantombot-window-tools button:hover,
html[data-command-os="2040"] .phantombot-title-actions button:hover,
html[data-command-os="2040"] .phantombot-tab-add:hover {
  background: var(--pbot-hover);
  color: var(--pbot-text);
}

html[data-command-os="2040"] .phantombot-desktop-nav {
  display: grid;
  flex: 0 0 auto;
  gap: 2px;
  padding: 8px;
  border-bottom: 1px solid var(--pbot-line);
}

html[data-command-os="2040"] .phantombot-desktop-nav button {
  display: grid;
  grid-template-columns: 21px minmax(0, 1fr) auto;
  align-items: center;
  gap: 8px;
  width: 100%;
  min-height: 31px;
  padding: 5px 8px;
  border: 0;
  border-radius: 5px;
  background: transparent;
  color: var(--pbot-muted);
  text-align: left;
  cursor: pointer;
}

html[data-command-os="2040"] .phantombot-desktop-nav button:hover,
html[data-command-os="2040"] .phantombot-desktop-nav button.is-active {
  background: var(--pbot-hover);
  color: var(--pbot-text);
}

html[data-command-os="2040"] .phantombot-desktop-nav button.is-primary {
  margin-bottom: 4px;
  border: 1px solid rgba(67, 215, 150, .16);
  background: rgba(67, 215, 150, .055);
  color: var(--pbot-text);
}

html[data-command-os="2040"] .phantombot-desktop-nav button > span {
  color: var(--pbot-live);
  text-align: center;
  font-size: 13px;
}

html[data-command-os="2040"] .phantombot-desktop-nav button b {
  overflow: hidden;
  font-size: 10px;
  font-weight: 600;
  text-overflow: ellipsis;
  white-space: nowrap;
}

html[data-command-os="2040"] .phantombot-desktop-nav button kbd {
  color: var(--pbot-faint);
  font: 500 7px "Spline Sans Mono", monospace;
}

html[data-command-os="2040"] .phantombot-brand {
  min-height: 42px;
  padding: 6px 10px 4px;
  gap: 8px;
}

html[data-command-os="2040"] .phantombot-brand-mark {
  flex-basis: 25px;
  width: 25px;
  height: 25px;
  border-radius: 6px;
}

html[data-command-os="2040"] .phantombot-brand-mark img {
  width: 19px;
  height: 19px;
}

html[data-command-os="2040"] .phantombot-brand b {
  font-size: 11px;
}

html[data-command-os="2040"] .phantombot-brand small {
  font-size: 6.5px;
}

html[data-command-os="2040"] .phantombot-session-search {
  display: grid;
  grid-template-columns: 18px minmax(0, 1fr);
  align-items: center;
  gap: 5px;
  min-height: 29px;
  margin: 2px 8px 8px;
  padding: 0 7px;
  border: 1px solid var(--pbot-line);
  border-radius: 5px;
  background: rgba(255, 255, 255, .018);
  color: var(--pbot-faint);
}

html[data-command-os="2040"] .phantombot-session-search input {
  min-width: 0;
  border: 0;
  outline: 0;
  background: transparent;
  color: var(--pbot-text);
  font-size: 9px;
}

html[data-command-os="2040"] .phantombot-session-search input::placeholder {
  color: var(--pbot-faint);
}

html[data-command-os="2040"] .phantombot-task-section {
  flex: 0 0 auto;
  min-height: 0;
  padding: 0 7px;
}

html[data-command-os="2040"] .phantombot-task-section.is-pinned {
  max-height: 28%;
}

html[data-command-os="2040"] .phantombot-task-section.is-sessions {
  flex: 1 1 auto;
  overflow: hidden;
}

html[data-command-os="2040"] .phantombot-task-section > p {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 20px;
  margin: 0 4px 3px;
  font-size: 7px;
}

html[data-command-os="2040"] .phantombot-task-section > p small {
  font: inherit;
}

html[data-command-os="2040"] .phantombot-pin-hint {
  min-height: 33px;
  padding: 6px 9px;
  color: var(--pbot-faint);
  font-size: 8px;
  line-height: 1.35;
}

html[data-command-os="2040"] .phantombot-task-list {
  gap: 1px;
}

html[data-command-os="2040"] .phantombot-task-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 24px;
  align-items: center;
  min-height: 30px;
  border-radius: 5px;
}

html[data-command-os="2040"] .phantombot-task-row:hover,
html[data-command-os="2040"] .phantombot-task-row.is-active {
  background: rgba(141, 124, 248, .09);
}

html[data-command-os="2040"] .phantombot-task-row.is-active {
  box-shadow: inset 2px 0 var(--pbot-brain);
}

html[data-command-os="2040"] .phantombot-task {
  min-height: 30px;
  padding: 5px 7px;
  background: transparent !important;
  box-shadow: none !important;
}

html[data-command-os="2040"] .phantombot-task span {
  font-size: 9px;
}

html[data-command-os="2040"] .phantombot-task small {
  font-size: 7px;
}

html[data-command-os="2040"] .phantombot-task-pin {
  width: 22px;
  height: 22px;
  padding: 0;
  border: 0;
  border-radius: 4px;
  background: transparent;
  color: var(--pbot-faint);
  cursor: pointer;
  opacity: 0;
}

html[data-command-os="2040"] .phantombot-task-row:hover .phantombot-task-pin,
html[data-command-os="2040"] .phantombot-task-pin[aria-pressed="true"] {
  opacity: 1;
}

html[data-command-os="2040"] .phantombot-task-pin[aria-pressed="true"] {
  color: var(--pbot-brain);
}

html[data-command-os="2040"] .phantombot-profile-row {
  display: grid;
  flex: 0 0 44px;
  grid-template-columns: 26px minmax(0, 1fr) 24px;
  align-items: center;
  gap: 7px;
  padding: 5px 9px;
  border-top: 1px solid var(--pbot-line);
}

html[data-command-os="2040"] .phantombot-profile-avatar {
  display: grid;
  width: 24px;
  height: 24px;
  place-items: center;
  border: 1px solid rgba(141, 124, 248, .28);
  border-radius: 50%;
  background: rgba(141, 124, 248, .08);
  color: #c9c1ff;
  font-size: 9px;
}

html[data-command-os="2040"] .phantombot-profile-row > span:nth-child(2) {
  display: grid;
  min-width: 0;
}

html[data-command-os="2040"] .phantombot-profile-row b {
  font-size: 9px;
}

html[data-command-os="2040"] .phantombot-profile-row small {
  overflow: hidden;
  color: var(--pbot-faint);
  font-size: 7px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

html[data-command-os="2040"] .phantombot-profile-row button {
  width: 22px;
  height: 22px;
  padding: 0;
  border: 0;
  background: transparent;
  color: var(--pbot-faint);
  cursor: pointer;
}

html[data-command-os="2040"] .phantombot-stage {
  display: flex;
  flex-direction: column;
  background: #050806;
}

html[data-command-os="2040"] .phantombot-stage::before {
  background:
    linear-gradient(180deg, rgba(3, 8, 6, .55), rgba(3, 8, 6, .82)),
    url("/app/assets/command-earth-horizon.png") center 44% / cover no-repeat;
  opacity: .14;
  mix-blend-mode: screen;
}

html[data-command-os="2040"] .phantombot-stage::after {
  background:
    linear-gradient(rgba(112, 153, 132, .018) 1px, transparent 1px),
    linear-gradient(90deg, rgba(112, 153, 132, .014) 1px, transparent 1px);
  background-size: 44px 44px;
}

html[data-command-os="2040"] .phantombot-titlebar {
  display: flex;
  flex: 0 0 36px;
  gap: 2px;
  min-height: 36px;
  padding: 0 7px;
  background: rgba(5, 9, 7, .96);
  backdrop-filter: blur(12px);
}

html[data-command-os="2040"] .phantombot-rail-toggle {
  display: none;
  flex: 0 0 28px;
  width: 28px;
  height: 28px;
  min-height: 0;
  padding: 0;
  place-items: center;
  border: 0;
  border-radius: 5px;
  background: transparent;
}

html[data-command-os="2040"] .phantombot-work-tab {
  display: flex;
  min-width: 0;
  max-width: 230px;
  height: 35px;
  align-items: center;
  gap: 7px;
  padding: 0 10px;
  border: 0;
  border-bottom: 2px solid transparent;
  background: transparent;
  color: var(--pbot-faint);
  cursor: pointer;
}

html[data-command-os="2040"] .phantombot-work-tab.is-active {
  border-bottom-color: var(--pbot-live);
  color: var(--pbot-text);
}

html[data-command-os="2040"] .phantombot-work-tab i {
  width: 6px;
  height: 6px;
  flex: 0 0 auto;
  border-radius: 50%;
  background: var(--pbot-live);
  box-shadow: 0 0 7px rgba(67, 215, 150, .5);
}

html[data-command-os="2040"] .phantombot-work-tab:not(.is-active) i {
  background: var(--pbot-faint);
  box-shadow: none;
}

html[data-command-os="2040"] .phantombot-work-tab b {
  overflow: hidden;
  font-size: 9px;
  font-weight: 600;
  text-overflow: ellipsis;
  white-space: nowrap;
}

html[data-command-os="2040"] .phantombot-tab-add {
  flex: 0 0 28px;
}

html[data-command-os="2040"] .phantombot-title-actions {
  display: flex;
  margin-left: auto;
}

html[data-command-os="2040"] .phantombot-stage > .phantomai-pane {
  position: relative;
  z-index: 2;
  flex: 1 1 auto;
}

html[data-command-os="2040"] .phantombot-stage .phantomai-chat {
  display: block;
}

html[data-command-os="2040"] .phantombot-stage .phantomai-chat-log {
  height: 100%;
  padding: 26px max(18px, calc((100% - 780px) / 2)) 142px;
}

html[data-command-os="2040"] .phantombot-empty {
  min-height: 100%;
  justify-content: center;
  padding: 8px 0 118px;
}

html[data-command-os="2040"] .phantombot-presence {
  width: 190px;
  height: 172px;
  min-height: 150px;
  margin-bottom: 4px;
}

html[data-command-os="2040"] .phantombot-empty > h1 {
  max-width: none;
  font-size: 24px;
  line-height: 1.15;
  text-shadow: none;
}

html[data-command-os="2040"] .phantombot-starters {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  width: min(590px, 100%);
  margin-top: 18px;
  gap: 6px;
}

html[data-command-os="2040"] .phantombot-starters button {
  min-height: 38px;
  padding: 8px 10px;
  border-radius: 6px;
  font-size: 9px;
}

html[data-command-os="2040"] .phantombot-exchange {
  width: min(760px, 100%);
  gap: 17px;
}

html[data-command-os="2040"] .phantombot-exchange + .phantombot-exchange {
  margin-top: 25px;
}

html[data-command-os="2040"] .phantombot-turn {
  gap: 8px;
}

html[data-command-os="2040"] .phantombot-avatar {
  flex-basis: 24px;
  width: 24px;
  height: 24px;
  border-radius: 6px;
}

html[data-command-os="2040"] .phantombot-avatar img {
  width: 17px;
  height: 17px;
}

html[data-command-os="2040"] .phantombot-turn-content {
  max-width: min(700px, calc(100% - 34px));
}

html[data-command-os="2040"] .phantombot-turn.is-user .phantombot-turn-content {
  max-width: min(660px, 86%);
  padding: 8px 10px;
  border-color: rgba(67, 215, 150, .2);
  border-radius: 7px;
  background: rgba(67, 215, 150, .055);
}

html[data-command-os="2040"] .phantombot-turn .phantomai-chat-user,
html[data-command-os="2040"] .phantombot-turn .phantomai-chat-reply {
  font-size: 12px;
  line-height: 1.58;
}

html[data-command-os="2040"] .phantomai-rich-text > :first-child {
  margin-top: 0;
}

html[data-command-os="2040"] .phantomai-rich-text > :last-child {
  margin-bottom: 0;
}

html[data-command-os="2040"] .phantomai-rich-text p,
html[data-command-os="2040"] .phantomai-rich-text ul {
  margin: 0 0 8px;
}

html[data-command-os="2040"] .phantomai-rich-text h2,
html[data-command-os="2040"] .phantomai-rich-text h3,
html[data-command-os="2040"] .phantomai-rich-text h4 {
  margin: 15px 0 7px;
  font-size: 13px;
  letter-spacing: 0;
}

html[data-command-os="2040"] .phantomai-rich-text code {
  padding: 1px 4px;
  border-radius: 3px;
  background: rgba(141, 124, 248, .11);
  color: #cec7ff;
}

html[data-command-os="2040"] .phantombot-code {
  margin: 8px 0;
  overflow: hidden;
  border: 1px solid var(--pbot-line);
  border-radius: 6px;
  background: #050806;
}

html[data-command-os="2040"] .phantombot-code header {
  display: flex;
  min-height: 27px;
  align-items: center;
  justify-content: space-between;
  padding: 0 8px;
  border-bottom: 1px solid var(--pbot-line);
  color: var(--pbot-faint);
  font-size: 8px;
}

html[data-command-os="2040"] .phantombot-code button {
  border: 0;
  background: transparent;
  color: var(--pbot-muted);
  cursor: pointer;
  font-size: 8px;
}

html[data-command-os="2040"] .phantombot-code pre {
  max-height: 320px;
  margin: 0;
  padding: 10px;
  overflow: auto;
  color: #c9d4ce;
  font: 9px/1.5 "Spline Sans Mono", monospace;
}

html[data-command-os="2040"] .phantombot-turn-actions {
  min-height: 23px;
  margin-top: 3px;
}

html[data-command-os="2040"] .phantombot-turn-actions > span {
  margin-right: 3px;
  color: var(--pbot-faint);
  font: 500 7px "Spline Sans Mono", monospace;
}

html[data-command-os="2040"] .phantombot-turn-actions button {
  width: 23px;
  height: 23px;
  padding: 0;
}

html[data-command-os="2040"] .phantombot-operator {
  border-radius: 6px;
}

html[data-command-os="2040"] .phantombot-stage .phantomai-chat-form {
  right: max(14px, calc((100% - 760px) / 2));
  bottom: 16px;
  left: max(14px, calc((100% - 760px) / 2));
  grid-template-columns: 28px minmax(0, 1fr);
  gap: 4px 7px;
  min-height: 82px;
  padding: 8px;
  border-color: rgba(67, 215, 150, .34);
  border-radius: 7px;
  background: rgba(7, 12, 9, .97);
  box-shadow: 0 16px 42px rgba(0, 0, 0, .42);
  backdrop-filter: blur(16px);
}

html[data-command-os="2040"] .phantombot-stage .phantomai-chat-form:focus-within {
  border-color: rgba(67, 215, 150, .62);
  box-shadow: 0 16px 42px rgba(0, 0, 0, .42), 0 0 0 1px rgba(67, 215, 150, .08);
}

html[data-command-os="2040"] .phantombot-stage .phantomai-attach {
  grid-column: 1;
  grid-row: 1;
  width: 28px;
  height: 28px;
  border: 0;
  border-radius: 5px;
  background: transparent;
  color: var(--pbot-muted);
  font-size: 13px;
}

html[data-command-os="2040"] .phantombot-stage .phantomai-chat-input {
  grid-column: 2;
  grid-row: 1;
  min-height: 28px;
  padding: 3px 2px;
  font-size: 11px;
}

html[data-command-os="2040"] .phantombot-composer-foot {
  grid-column: 1 / -1;
  grid-row: 2;
  min-height: 29px;
}

html[data-command-os="2040"] .phantombot-composer-controls {
  display: flex;
  min-width: 0;
  align-items: center;
  gap: 3px;
}

html[data-command-os="2040"] .phantombot-composer-controls button,
html[data-command-os="2040"] .phantombot-composer-controls label {
  display: flex;
  height: 25px;
  min-width: 25px;
  align-items: center;
  padding: 0 7px;
  border: 0;
  border-radius: 4px;
  background: transparent;
  color: var(--pbot-muted);
  cursor: pointer;
}

html[data-command-os="2040"] .phantombot-composer-controls .sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

html[data-command-os="2040"] .phantombot-composer-controls button:hover,
html[data-command-os="2040"] .phantombot-composer-controls button.is-active,
html[data-command-os="2040"] .phantombot-composer-controls label:hover {
  background: var(--pbot-hover);
  color: var(--pbot-text);
}

html[data-command-os="2040"] .phantombot-composer-controls [data-phantombot-model] {
  gap: 5px;
  max-width: 150px;
}

html[data-command-os="2040"] .phantombot-composer-controls [data-phantombot-model] span {
  overflow: hidden;
  font-size: 8px;
  font-weight: 600;
  text-overflow: ellipsis;
  white-space: nowrap;
}

html[data-command-os="2040"] .phantombot-composer-controls select {
  max-width: 76px;
  border: 0;
  outline: 0;
  background: transparent;
  color: var(--pbot-muted);
  cursor: pointer;
  font-size: 8px;
}

html[data-command-os="2040"] .phantombot-composer-controls select option {
  background: #0a100d;
  color: var(--pbot-text);
}

html[data-command-os="2040"] .phantombot-send {
  flex-basis: 28px;
  width: 28px;
  height: 28px;
  border-radius: 6px;
  background: #dfe9e4;
  color: #06100b;
  font-size: 14px;
}

html[data-command-os="2040"] .phantombot-model-menu {
  position: absolute;
  z-index: 18;
  left: max(14px, calc((100% - 760px) / 2));
  bottom: 105px;
  width: min(390px, calc(100% - 28px));
  padding: 7px;
  border: 1px solid var(--pbot-line-strong);
  border-radius: 7px;
  background: #0a100d;
  box-shadow: 0 18px 44px rgba(0, 0, 0, .5);
}

html[data-command-os="2040"] .phantombot-model-menu[hidden] {
  display: none;
}

html[data-command-os="2040"] .phantombot-model-menu > header {
  display: grid;
  gap: 3px;
  padding: 6px 7px 9px;
}

html[data-command-os="2040"] .phantombot-model-menu > header span {
  color: var(--pbot-live);
  font: 600 7px/1 "Spline Sans Mono", monospace;
  letter-spacing: .16em;
}

html[data-command-os="2040"] .phantombot-model-menu > header b {
  color: var(--pbot-text);
  font-size: 11px;
}

html[data-command-os="2040"] .phantombot-model-lane {
  display: flex;
  width: 100%;
  min-height: 45px;
  align-items: center;
  gap: 8px;
  padding: 7px 9px;
  border: 0;
  border-radius: 5px;
  background: rgba(255, 255, 255, .025);
  color: var(--pbot-text);
  text-align: left;
}

html[data-command-os="2040"] .phantombot-model-lane + .phantombot-model-lane {
  margin-top: 3px;
}

html[data-command-os="2040"] .phantombot-model-lane.is-primary {
  background: rgba(67, 215, 150, .065);
}

html[data-command-os="2040"] .phantombot-model-lane > i {
  width: 7px;
  height: 7px;
  flex: 0 0 auto;
  border-radius: 999px;
  background: #6e7772;
  box-shadow: 0 0 0 3px rgba(110, 119, 114, .08);
}

html[data-command-os="2040"] .phantombot-model-lane[data-status="online"] > i {
  background: var(--pbot-live);
  box-shadow: 0 0 0 3px rgba(67, 215, 150, .1), 0 0 10px rgba(67, 215, 150, .35);
}

html[data-command-os="2040"] .phantombot-model-lane[data-status="offline"] > i {
  background: #f2a65a;
}

html[data-command-os="2040"] .phantombot-model-lane span {
  display: grid;
  min-width: 0;
  flex: 1 1 auto;
  gap: 2px;
}

html[data-command-os="2040"] .phantombot-model-lane b {
  font-size: 9px;
}

html[data-command-os="2040"] .phantombot-model-lane small {
  color: var(--pbot-muted);
  font-size: 7px;
}

html[data-command-os="2040"] .phantombot-model-lane em {
  flex: 0 0 auto;
  color: var(--pbot-muted);
  font: 600 7px/1 "Spline Sans Mono", monospace;
  text-transform: uppercase;
}

html[data-command-os="2040"] .phantombot-model-lane[data-status="online"] em {
  color: var(--pbot-live);
}

html[data-command-os="2040"] .phantombot-model-menu > footer {
  padding: 8px 7px 3px;
  color: var(--pbot-faint);
  font: 500 7px/1.4 "Spline Sans Mono", monospace;
}

html[data-command-os="2040"] .phantombot-composer-status {
  position: absolute;
  z-index: 17;
  right: max(14px, calc((100% - 760px) / 2));
  bottom: 105px;
  max-width: 340px;
  padding: 5px 8px;
  border: 1px solid var(--pbot-line);
  border-radius: 5px;
  background: #0a100d;
  color: var(--pbot-muted);
  font-size: 8px;
}

html[data-command-os="2040"] .phantombot-composer-status[data-tone="error"] {
  border-color: rgba(242, 94, 119, .35);
  color: #f28ca0;
}

html[data-command-os="2040"] .phantombot-composer-status[data-tone="live"] {
  border-color: rgba(67, 215, 150, .35);
  color: var(--pbot-live);
}

html[data-command-os="2040"] .phantomai-pending {
  position: absolute;
  z-index: 16;
  right: max(14px, calc((100% - 760px) / 2));
  bottom: 105px;
  left: max(14px, calc((100% - 760px) / 2));
  padding: 0;
}

html[data-command-os="2040"] .phantomai-chip {
  border-radius: 6px;
  background: #0a100d;
}

html[data-command-os="2040"] .phantombot-context-drawer {
  position: absolute;
  z-index: 28;
  top: 36px;
  right: 0;
  bottom: 24px;
  width: min(330px, 38vw);
  overflow: auto;
  border-left: 1px solid var(--pbot-line-strong);
  background: rgba(7, 12, 9, .985);
  box-shadow: -20px 0 50px rgba(0, 0, 0, .42);
}

html[data-command-os="2040"] .phantombot-context-drawer[hidden] {
  display: none;
}

html[data-command-os="2040"] .phantombot-context-drawer > header {
  display: flex;
  min-height: 52px;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 8px 11px;
  border-bottom: 1px solid var(--pbot-line);
}

html[data-command-os="2040"] .phantombot-context-drawer > header span {
  color: var(--pbot-faint);
  font: 600 7px "Spline Sans Mono", monospace;
}

html[data-command-os="2040"] .phantombot-context-drawer > header h2 {
  max-width: 260px;
  margin: 2px 0 0;
  overflow: hidden;
  font-size: 11px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

html[data-command-os="2040"] .phantombot-context-drawer > header button {
  width: 25px;
  height: 25px;
  padding: 0;
  border: 0;
  border-radius: 4px;
  background: transparent;
  color: var(--pbot-muted);
  cursor: pointer;
}

html[data-command-os="2040"] .phantombot-context-drawer > nav {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  min-height: 34px;
  border-bottom: 1px solid var(--pbot-line);
}

html[data-command-os="2040"] .phantombot-context-drawer > nav button {
  min-width: 0;
  padding: 0 4px;
  border: 0;
  border-bottom: 2px solid transparent;
  background: transparent;
  color: var(--pbot-faint);
  cursor: pointer;
  font-size: 7px;
}

html[data-command-os="2040"] .phantombot-context-drawer > nav button.is-active {
  border-bottom-color: var(--pbot-brain);
  color: var(--pbot-text);
}

html[data-command-os="2040"] .phantombot-context-drawer > [data-phantombot-detail-body] {
  padding: 11px;
}

html[data-command-os="2040"] .phantombot-context-list {
  display: grid;
  gap: 1px;
  margin: 0;
}

html[data-command-os="2040"] .phantombot-context-list div {
  display: grid;
  grid-template-columns: 82px minmax(0, 1fr);
  gap: 8px;
  min-height: 34px;
  align-items: center;
  padding: 4px 7px;
  border-bottom: 1px solid var(--pbot-line);
}

html[data-command-os="2040"] .phantombot-context-list dt {
  color: var(--pbot-faint);
  font-size: 7px;
  text-transform: uppercase;
}

html[data-command-os="2040"] .phantombot-context-list dd {
  min-width: 0;
  margin: 0;
  overflow-wrap: anywhere;
  color: var(--pbot-text);
  font-size: 9px;
}

html[data-command-os="2040"] .phantombot-context-list dd.is-waiting {
  color: #f5c765;
}

html[data-command-os="2040"] .phantombot-detail-timeline,
html[data-command-os="2040"] .phantombot-detail-steps {
  display: grid;
  gap: 2px;
  margin: 0;
  padding: 0;
  list-style: none;
}

html[data-command-os="2040"] .phantombot-detail-timeline button,
html[data-command-os="2040"] .phantombot-detail-artifacts button {
  display: grid;
  width: 100%;
  grid-template-columns: 12px minmax(0, 1fr);
  gap: 7px;
  min-height: 38px;
  align-items: center;
  padding: 6px 7px;
  border: 0;
  border-radius: 5px;
  background: transparent;
  color: var(--pbot-text);
  text-align: left;
  cursor: pointer;
}

html[data-command-os="2040"] .phantombot-detail-timeline button:hover,
html[data-command-os="2040"] .phantombot-detail-artifacts button:hover {
  background: var(--pbot-hover);
}

html[data-command-os="2040"] .phantombot-detail-timeline button > i,
html[data-command-os="2040"] .phantombot-detail-steps > li > i {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--pbot-live);
}

html[data-command-os="2040"] .phantombot-detail-timeline button span,
html[data-command-os="2040"] .phantombot-detail-steps li span {
  display: grid;
  min-width: 0;
  gap: 2px;
}

html[data-command-os="2040"] .phantombot-detail-timeline b,
html[data-command-os="2040"] .phantombot-detail-steps b,
html[data-command-os="2040"] .phantombot-detail-artifacts b {
  overflow: hidden;
  font-size: 8.5px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

html[data-command-os="2040"] .phantombot-detail-timeline small,
html[data-command-os="2040"] .phantombot-detail-steps small,
html[data-command-os="2040"] .phantombot-detail-artifacts small {
  overflow: hidden;
  color: var(--pbot-faint);
  font-size: 7px;
  text-overflow: ellipsis;
  white-space: nowrap;
}

html[data-command-os="2040"] .phantombot-detail-steps li {
  display: grid;
  grid-template-columns: 12px minmax(0, 1fr);
  gap: 7px;
  min-height: 38px;
  align-items: center;
  padding: 6px 7px;
  border-bottom: 1px solid var(--pbot-line);
}

html[data-command-os="2040"] .phantombot-detail-artifacts {
  display: grid;
  gap: 2px;
}

html[data-command-os="2040"] .phantombot-detail-artifacts button {
  grid-template-columns: 24px minmax(0, 1fr);
}

html[data-command-os="2040"] .phantombot-detail-artifacts button > span {
  display: grid;
  grid-row: 1 / span 2;
  width: 22px;
  height: 22px;
  place-items: center;
  border: 1px solid rgba(141, 124, 248, .2);
  border-radius: 4px;
  color: #c9c1ff;
  font-size: 8px;
}

html[data-command-os="2040"] .phantombot-detail-empty {
  display: grid;
  min-height: 180px;
  place-items: center;
  align-content: center;
  gap: 6px;
  color: var(--pbot-faint);
  text-align: center;
}

html[data-command-os="2040"] .phantombot-detail-empty b {
  color: var(--pbot-muted);
  font-size: 9px;
}

html[data-command-os="2040"] .phantombot-detail-empty p {
  max-width: 220px;
  margin: 0;
  font-size: 8px;
  line-height: 1.45;
}

html[data-command-os="2040"] .phantombot-runtime-bar {
  position: relative;
  z-index: 12;
  display: flex;
  flex: 0 0 24px;
  min-width: 0;
  align-items: center;
  gap: 2px;
  padding: 0 7px;
  border-top: 1px solid var(--pbot-line);
  background: #060a08;
  color: var(--pbot-faint);
}

html[data-command-os="2040"] .phantombot-runtime-bar button,
html[data-command-os="2040"] .phantombot-runtime-bar > span {
  display: inline-flex;
  min-width: 0;
  height: 21px;
  align-items: center;
  gap: 5px;
  padding: 0 7px;
  border: 0;
  border-radius: 4px;
  background: transparent;
  color: inherit;
  font-size: 7px;
  white-space: nowrap;
}

html[data-command-os="2040"] .phantombot-runtime-bar button {
  cursor: pointer;
}

html[data-command-os="2040"] .phantombot-runtime-bar button:hover {
  background: var(--pbot-hover);
  color: var(--pbot-text);
}

html[data-command-os="2040"] .phantombot-runtime-bar i {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--pbot-live);
  box-shadow: 0 0 7px rgba(67, 215, 150, .5);
}

html[data-command-os="2040"] .phantombot-os[data-busy] .phantombot-runtime-bar [data-phantombot-runtime] i {
  background: var(--pbot-brain);
  box-shadow: 0 0 8px rgba(141, 124, 248, .58);
  animation: pbotPulse 1.1s ease-in-out infinite;
}

html[data-command-os="2040"] .phantombot-session-clock {
  margin-left: auto;
}

@media (max-width: 1100px) {
  html[data-command-os="2040"] .phantombot-os,
  html[data-command-os="2040"] .phantombot-os.is-rail-right,
  html[data-command-os="2040"] .phantombot-os.is-rail-collapsed,
  html[data-command-os="2040"] .phantombot-os.is-rail-collapsed.is-rail-right {
    grid-template-columns: minmax(0, 1fr);
  }

  html[data-command-os="2040"] .phantombot-os .phantombot-taskrail,
  html[data-command-os="2040"] .phantombot-os.is-rail-right .phantombot-taskrail {
    position: absolute;
    z-index: 40;
    top: 0;
    bottom: 0;
    left: 0;
    grid-column: 1;
    grid-row: 1;
    width: min(260px, 86vw);
    visibility: visible;
    transform: translateX(-104%);
    border-right: 1px solid var(--pbot-line-strong);
    border-left: 0;
    opacity: 0;
    pointer-events: none;
  }

  html[data-command-os="2040"] .phantombot-os.is-rail-right .phantombot-taskrail {
    right: 0;
    left: auto;
    transform: translateX(104%);
    border-right: 0;
    border-left: 1px solid var(--pbot-line-strong);
  }

  html[data-command-os="2040"] .phantombot-os.is-rail-open .phantombot-taskrail {
    transform: translateX(0);
    opacity: 1;
    pointer-events: auto;
  }

  html[data-command-os="2040"] .phantombot-os .phantombot-stage,
  html[data-command-os="2040"] .phantombot-os.is-rail-right .phantombot-stage {
    grid-column: 1;
    grid-row: 1;
  }

  html[data-command-os="2040"] .phantombot-rail-toggle {
    display: grid;
  }
}

@media (max-width: 680px) {
  html[data-command-os="2040"] .phantombot-titlebar {
    flex-basis: 38px;
    min-height: 38px;
    padding: 0 5px;
  }

  html[data-command-os="2040"] .phantombot-work-tab {
    max-width: 42vw;
    height: 37px;
    padding: 0 7px;
  }

  html[data-command-os="2040"] .phantombot-work-tab:nth-of-type(3) {
    display: none;
  }

  html[data-command-os="2040"] .phantombot-stage .phantomai-chat-log {
    padding: 17px 10px calc(146px + env(safe-area-inset-bottom, 0px));
  }

  html[data-command-os="2040"] .phantombot-empty {
    justify-content: flex-start;
    padding-top: 7vh;
  }

  html[data-command-os="2040"] .phantombot-presence {
    width: min(188px, 64vw);
    height: 150px;
    min-height: 132px;
  }

  html[data-command-os="2040"] .phantombot-empty > h1 {
    max-width: 14ch;
    font-size: 22px;
    text-align: center;
  }

  html[data-command-os="2040"] .phantombot-starters {
    grid-template-columns: 1fr;
    width: min(340px, 100%);
  }

  html[data-command-os="2040"] .phantombot-starters button:nth-child(n + 4) {
    display: none;
  }

  html[data-command-os="2040"] .phantombot-turn-content {
    max-width: calc(100% - 32px);
  }

  html[data-command-os="2040"] .phantombot-turn.is-user .phantombot-turn-content {
    max-width: 91%;
  }

  html[data-command-os="2040"] .phantombot-turn .phantomai-chat-user,
  html[data-command-os="2040"] .phantombot-turn .phantomai-chat-reply {
    font-size: 12.5px;
  }

  html[data-command-os="2040"] .phantombot-stage .phantomai-chat-form {
    right: 7px;
    bottom: calc(8px + env(safe-area-inset-bottom, 0px));
    left: 7px;
    min-height: 80px;
  }

  html[data-command-os="2040"] .phantombot-composer-controls [data-phantombot-model] {
    max-width: 118px;
  }

  html[data-command-os="2040"] .phantombot-model-menu {
    right: auto;
    left: 7px;
    bottom: calc(104px + env(safe-area-inset-bottom, 0px));
  }

  html[data-command-os="2040"] .phantombot-composer-status {
    right: 7px;
    left: auto;
    bottom: calc(104px + env(safe-area-inset-bottom, 0px));
  }

  html[data-command-os="2040"] .phantomai-pending {
    right: 7px;
    bottom: calc(104px + env(safe-area-inset-bottom, 0px));
    left: 7px;
  }

  html[data-command-os="2040"] .phantombot-context-drawer {
    top: 38px;
    bottom: 24px;
    width: 100%;
  }

  html[data-command-os="2040"] .phantombot-runtime-bar > button:nth-child(n + 2):nth-child(-n + 4),
  html[data-command-os="2040"] .phantombot-runtime-bar > span:last-child {
    display: none;
  }

  html[data-command-os="2040"] .phantombot-runtime-bar [data-phantombot-companion] span {
    max-width: 98px;
    overflow: hidden;
    text-overflow: ellipsis;
  }
}

