/* Kubera Revenue Command Center v6
   Authoritative desktop presentation layer. Loaded after legacy styles. */

:root {
  --rv6-bg: #020810;
  --rv6-panel: rgba(3, 20, 32, .96);
  --rv6-panel-2: rgba(4, 28, 44, .94);
  --rv6-line: rgba(38, 200, 242, .38);
  --rv6-line-soft: rgba(38, 200, 242, .17);
  --rv6-cyan: #39e8ff;
  --rv6-cyan-2: #10aeea;
  --rv6-green: #35efaa;
  --rv6-text: #eafaff;
  --rv6-muted: #83aebe;
}

html:has(body.ro-final-active),
body.ro-final-active {
  width: 100%;
  height: 100%;
  margin: 0;
  overflow: hidden !important;
  background: var(--rv6-bg) !important;
}

body.ro-final-active:not(.workspace-layer-open) .workspace-shell {
  display: grid !important;
  grid-template-columns: clamp(184px, 12.8vw, 214px) minmax(0, 1fr) !important;
  width: 100vw !important;
  height: 100dvh !important;
  min-height: 0 !important;
  overflow: hidden !important;
  background: var(--rv6-bg) !important;
}

body.ro-final-active:not(.workspace-layer-open) .workspace-main {
  display: block !important;
  width: 100% !important;
  height: 100dvh !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 12px 10px !important;
  overflow: hidden !important;
  background:
    radial-gradient(circle at 48% 46%, rgba(0, 124, 174, .12), transparent 36%),
    linear-gradient(rgba(15, 89, 117, .11) 1px, transparent 1px),
    linear-gradient(90deg, rgba(15, 89, 117, .11) 1px, transparent 1px),
    var(--rv6-bg) !important;
  background-size: auto, 32px 32px, 32px 32px, auto !important;
}

body.ro-final-active:not(.workspace-layer-open) .workspace-main > :not(#revenueOS) {
  display: none !important;
}

body.ro-final-active:not(.workspace-layer-open) #revenueOS {
  display: grid !important;
  grid-template-rows: 52px 86px minmax(0, 1fr) 146px !important;
  gap: 8px !important;
  width: 100% !important;
  height: 100dvh !important;
  min-height: 0 !important;
  margin: 0 !important;
  padding: 0 0 10px !important;
  overflow: hidden !important;
  color: var(--rv6-text) !important;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif !important;
}

/* Left command rail */
body.ro-final-active .ro-final-side {
  box-sizing: border-box !important;
  display: flex !important;
  flex-direction: column !important;
  width: auto !important;
  height: 100dvh !important;
  min-height: 0 !important;
  padding: 16px 13px 12px !important;
  overflow: hidden !important;
  position: relative !important;
  inset: auto !important;
  border-right: 1px solid rgba(40, 186, 225, .25) !important;
  background:
    linear-gradient(180deg, rgba(6, 25, 39, .99), rgba(2, 9, 17, .99)),
    var(--rv6-bg) !important;
  box-shadow: 18px 0 52px rgba(0, 0, 0, .38) !important;
}

body.ro-final-active .ro-final-brand {
  flex: 0 0 58px !important;
  padding: 0 6px 12px !important;
  gap: 10px !important;
}

body.ro-final-active .ro-final-brand img {
  width: 42px !important;
  height: 42px !important;
  object-fit: contain !important;
  filter: drop-shadow(0 0 12px rgba(40, 224, 255, .44)) !important;
}

body.ro-final-active .ro-final-brand b {
  font-size: 15px !important;
  letter-spacing: 3.4px !important;
  color: #f2fcff !important;
}

body.ro-final-active .ro-final-brand span {
  margin-top: 2px !important;
  font-size: 8px !important;
  letter-spacing: 3.4px !important;
  color: #c9edf6 !important;
}

body.ro-final-active .ro-final-nav {
  display: grid !important;
  grid-template-rows: repeat(9, minmax(37px, 1fr)) !important;
  flex: 0 1 475px !important;
  gap: 4px !important;
  min-height: 0 !important;
}

body.ro-final-active .ro-final-nav button {
  min-height: 0 !important;
  height: auto !important;
  padding: 0 11px !important;
  gap: 11px !important;
  border-radius: 7px !important;
  border: 1px solid transparent !important;
  background: transparent !important;
  color: #9fc4d1 !important;
  font-size: 12px !important;
  font-weight: 650 !important;
  box-shadow: none !important;
}

body.ro-final-active .ro-final-nav button:hover,
body.ro-final-active .ro-final-nav button.active {
  color: #effcff !important;
  border-color: rgba(27, 191, 230, .48) !important;
  background: linear-gradient(90deg, rgba(7, 58, 82, .92), rgba(4, 25, 39, .85)) !important;
  box-shadow: inset 3px 0 0 var(--rv6-cyan), 0 0 22px rgba(13, 212, 255, .08) !important;
}

body.ro-final-active .ro-final-nav i {
  width: 18px !important;
  font-size: 16px !important;
  color: #5ae9ff !important;
}

body.ro-final-active .ro-upgrade {
  flex: 0 0 auto !important;
  margin-top: auto !important;
  padding: 10px 11px !important;
  border-radius: 7px !important;
  border-color: rgba(41, 188, 225, .34) !important;
  background: linear-gradient(145deg, rgba(5, 35, 52, .9), rgba(3, 17, 27, .95)) !important;
  box-shadow: inset 0 0 22px rgba(20, 219, 255, .04) !important;
}

body.ro-final-active .ro-final-foot {
  flex: 0 0 auto !important;
  padding: 9px 10px 0 !important;
  font-size: 8px !important;
  letter-spacing: 4px !important;
  line-height: 1.65 !important;
  color: #507c8c !important;
}

/* Header */
body.ro-final-active .revos-top {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 292px auto !important;
  align-items: center !important;
  gap: 14px !important;
  width: 100% !important;
  height: 52px !important;
  min-height: 0 !important;
  padding: 0 4px !important;
  border-bottom: 1px solid rgba(41, 184, 220, .13) !important;
}

body.ro-final-active .revos-brandline {
  font-size: 9px !important;
  line-height: 1.65 !important;
  letter-spacing: 3.7px !important;
  color: #53bfd9 !important;
  white-space: nowrap !important;
}

body.ro-final-active .revos-brandline b {
  color: #75eaff !important;
  font-size: 9px !important;
  letter-spacing: 3.7px !important;
}

body.ro-final-active .revos-search {
  box-sizing: border-box !important;
  width: 292px !important;
  height: 36px !important;
  padding: 0 13px !important;
  border-radius: 7px !important;
  border: 1px solid rgba(32, 178, 219, .48) !important;
  background: linear-gradient(180deg, rgba(5, 29, 45, .98), rgba(3, 17, 28, .98)) !important;
  color: #b0d0dc !important;
  font-size: 11px !important;
  box-shadow: inset 0 0 24px rgba(21, 217, 255, .04), 0 8px 20px rgba(0, 0, 0, .24) !important;
}

body.ro-final-active .ro-profile {
  min-width: 96px !important;
}

body.ro-final-active .ro-profile > span {
  width: 34px !important;
  height: 34px !important;
  border-color: rgba(47, 190, 224, .48) !important;
  background: linear-gradient(145deg, #0b405d, #08253a) !important;
  box-shadow: inset 0 0 18px rgba(32, 217, 255, .08) !important;
}

/* KPI strip */
body.ro-final-active .revos-kpis {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 8px !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

body.ro-final-active .revos .glass {
  border: 1px solid var(--rv6-line) !important;
  border-radius: 8px !important;
  background:
    linear-gradient(145deg, rgba(6, 34, 52, .96), rgba(2, 15, 25, .98)) !important;
  box-shadow:
    inset 0 0 34px rgba(24, 211, 255, .035),
    0 12px 30px rgba(0, 0, 0, .28) !important;
}

body.ro-final-active .revos-kpi {
  box-sizing: border-box !important;
  display: grid !important;
  grid-template-columns: 42px minmax(0, 1fr) !important;
  align-items: center !important;
  gap: 10px !important;
  min-width: 0 !important;
  min-height: 0 !important;
  height: 86px !important;
  padding: 9px 11px !important;
  overflow: hidden !important;
  position: relative !important;
}

body.ro-final-active .revos-kpi::after {
  content: "" !important;
  position: absolute !important;
  right: 9px !important;
  bottom: 10px !important;
  left: 58% !important;
  height: 19px !important;
  border-bottom: 1px solid rgba(46, 224, 255, .12) !important;
  background: linear-gradient(155deg, transparent 45%, rgba(46, 232, 255, .8) 47%, rgba(46, 232, 255, .8) 50%, transparent 52%) !important;
  clip-path: polygon(0 77%, 16% 60%, 31% 68%, 48% 39%, 63% 49%, 78% 20%, 100% 0, 100% 100%, 0 100%) !important;
  opacity: .58 !important;
}

body.ro-final-active .revos-kpi .ico {
  width: 40px !important;
  height: 40px !important;
  border-radius: 8px !important;
  border: 1px solid rgba(36, 196, 235, .38) !important;
  background: linear-gradient(145deg, rgba(7, 61, 87, .94), rgba(4, 31, 47, .96)) !important;
  color: #48e9ff !important;
  font-size: 18px !important;
  box-shadow: inset 0 0 21px rgba(24, 224, 255, .08), 0 0 16px rgba(18, 213, 255, .05) !important;
}

body.ro-final-active .revos-kpi small {
  font-size: 7px !important;
  letter-spacing: 1.2px !important;
  color: #94b7c4 !important;
  white-space: nowrap !important;
}

body.ro-final-active .revos-kpi strong {
  position: relative !important;
  z-index: 1 !important;
  margin-top: 3px !important;
  font-size: clamp(17px, 1.45vw, 23px) !important;
  line-height: 1 !important;
  color: #f4fdff !important;
  white-space: nowrap !important;
}

body.ro-final-active .revos-kpi em {
  position: relative !important;
  z-index: 1 !important;
  margin-top: 6px !important;
  font-size: 7px !important;
  letter-spacing: .6px !important;
  color: var(--rv6-green) !important;
}

/* Main command field */
body.ro-final-active .revos-main {
  display: grid !important;
  grid-template-columns: minmax(210px, .82fr) minmax(460px, 1.85fr) minmax(245px, 1fr) !important;
  gap: 8px !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

body.ro-final-active .revos-agents {
  box-sizing: border-box !important;
  display: grid !important;
  grid-template-rows: 32px repeat(6, minmax(0, 1fr)) !important;
  min-height: 0 !important;
  height: 100% !important;
  padding: 10px 12px !important;
  overflow: hidden !important;
}

body.ro-final-active .revos-head {
  box-sizing: border-box !important;
  height: 32px !important;
  min-height: 0 !important;
  padding: 0 2px 8px !important;
  border-bottom: 1px solid rgba(42, 192, 227, .26) !important;
  font-size: 10px !important;
  letter-spacing: 1.2px !important;
}

body.ro-final-active .revos-agent {
  box-sizing: border-box !important;
  min-height: 0 !important;
  height: auto !important;
  padding: 4px 2px !important;
  gap: 8px !important;
  grid-template-columns: 34px minmax(0, 1fr) 12px !important;
  border-bottom: 1px solid rgba(35, 143, 172, .22) !important;
  border-radius: 0 !important;
  background: transparent !important;
}

body.ro-final-active .revos-agent:hover {
  background: linear-gradient(90deg, rgba(8, 60, 83, .48), transparent) !important;
}

body.ro-final-active .revos-agent .aico {
  width: 32px !important;
  height: 32px !important;
  border-radius: 7px !important;
  font-size: 14px !important;
  border-color: rgba(33, 181, 218, .38) !important;
  background: linear-gradient(145deg, rgba(7, 59, 82, .95), rgba(4, 28, 43, .98)) !important;
  box-shadow: inset 0 0 17px rgba(26, 222, 255, .07) !important;
}

body.ro-final-active .revos-agent b {
  font-size: 10px !important;
  line-height: 1.1 !important;
}

body.ro-final-active .revos-agent small {
  margin-top: 2px !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;
  font-size: 7px !important;
  color: #719bab !important;
}

body.ro-final-active .revos-agent i {
  margin-top: 2px !important;
  font-size: 7px !important;
  color: var(--rv6-green) !important;
}

body.ro-final-active .revos-agent .chev {
  font-size: 14px !important;
}

body.ro-final-active .revos-core {
  position: relative !important;
  box-sizing: border-box !important;
  width: 100% !important;
  height: 100% !important;
  min-height: 0 !important;
  overflow: hidden !important;
  isolation: isolate !important;
  background:
    radial-gradient(circle at 50% 51%, rgba(5, 101, 139, .36) 0, rgba(3, 35, 53, .18) 28%, transparent 48%),
    repeating-radial-gradient(circle at 50% 50%, transparent 0 38px, rgba(32, 215, 244, .055) 39px, transparent 41px),
    linear-gradient(rgba(13, 78, 103, .13) 1px, transparent 1px),
    linear-gradient(90deg, rgba(13, 78, 103, .13) 1px, transparent 1px),
    #020b13 !important;
  background-size: auto, auto, 25px 25px, 25px 25px, auto !important;
  box-shadow: inset 0 0 92px rgba(0, 0, 0, .88), 0 12px 34px rgba(0, 0, 0, .32) !important;
}

body.ro-final-active .revos-core::before {
  width: min(72%, 430px) !important;
  height: auto !important;
  aspect-ratio: 1 !important;
  border: 1px solid rgba(49, 226, 255, .38) !important;
  background:
    repeating-conic-gradient(from 0deg, rgba(35, 224, 255, .22) 0 1deg, transparent 1deg 9deg) !important;
  mask: radial-gradient(circle, transparent 64%, #000 65% 66%, transparent 67% 78%, #000 79% 80%, transparent 81%) !important;
  -webkit-mask: radial-gradient(circle, transparent 64%, #000 65% 66%, transparent 67% 78%, #000 79% 80%, transparent 81%) !important;
  box-shadow: 0 0 54px rgba(21, 208, 255, .20) !important;
  animation: rv6-orbit 28s linear infinite !important;
}

body.ro-final-active .revos-core::after {
  width: min(60%, 352px) !important;
  height: auto !important;
  aspect-ratio: 1 !important;
  border: 1px dashed rgba(63, 232, 255, .44) !important;
  box-shadow: 0 0 24px rgba(21, 215, 255, .12) !important;
  animation: rv6-orbit-reverse 20s linear infinite !important;
}

@keyframes rv6-orbit {
  to { transform: translate(-50%, -50%) rotate(360deg); }
}

@keyframes rv6-orbit-reverse {
  to { transform: translate(-50%, -50%) rotate(-360deg); }
}

body.ro-final-active .ro-line {
  width: min(51%, 306px) !important;
  height: auto !important;
  aspect-ratio: 1 !important;
  border-width: 5px !important;
  border-top-color: rgba(44, 229, 255, .92) !important;
  border-right-color: rgba(44, 229, 255, .92) !important;
  filter: drop-shadow(0 0 7px rgba(35, 228, 255, .72)) !important;
  animation: rv6-orbit 13s linear infinite !important;
}

body.ro-final-active .ro-center {
  width: min(35%, 205px) !important;
  height: auto !important;
  aspect-ratio: 1 !important;
  border: 2px solid #48ecff !important;
  background:
    radial-gradient(ellipse at center, transparent 47%, rgba(78, 232, 255, .2) 48% 49%, transparent 50%),
    repeating-linear-gradient(90deg, transparent 0 20px, rgba(54, 217, 246, .07) 21px, transparent 22px),
    radial-gradient(circle at 50% 42%, #0d6c90 0, #063b58 37%, #031826 70%, #020a11 100%) !important;
  box-shadow:
    0 0 0 8px rgba(38, 226, 255, .07),
    0 0 70px rgba(15, 211, 255, .48),
    inset 0 0 44px rgba(31, 227, 255, .24) !important;
}

body.ro-final-active .ro-center::before {
  inset: 10px !important;
  border-color: rgba(127, 242, 255, .32) !important;
  box-shadow: inset 0 0 28px rgba(30, 221, 255, .08) !important;
}

body.ro-final-active .ro-center::after {
  content: "" !important;
  position: absolute !important;
  inset: -24px !important;
  border-radius: 50% !important;
  border: 4px solid transparent !important;
  border-top-color: var(--rv6-cyan) !important;
  border-right-color: var(--rv6-cyan) !important;
  filter: drop-shadow(0 0 7px rgba(44, 230, 255, .8)) !important;
  animation: rv6-orbit 11s linear infinite !important;
}

body.ro-final-active .ro-center .mark {
  font-size: clamp(29px, 2.5vw, 42px) !important;
  color: #58efff !important;
  text-shadow: 0 0 28px rgba(53, 234, 255, .9) !important;
}

body.ro-final-active .ro-center b {
  margin-top: 6px !important;
  font-size: clamp(13px, 1.15vw, 18px) !important;
  line-height: 1.17 !important;
  letter-spacing: 3.5px !important;
}

body.ro-final-active .ro-center small {
  margin-top: 6px !important;
  font-size: 6px !important;
  letter-spacing: 2.1px !important;
  color: #69ddf4 !important;
}

body.ro-final-active .ro-stage {
  width: min(17%, 92px) !important;
  height: auto !important;
  aspect-ratio: 1 !important;
  border: 1px solid rgba(63, 229, 255, .9) !important;
  background: radial-gradient(circle at 50% 28%, #0b5a77, #031722 73%) !important;
  box-shadow: 0 0 27px rgba(18, 216, 255, .28), inset 0 0 23px rgba(26, 228, 255, .10) !important;
}

body.ro-final-active .ro-stage span {
  font-size: clamp(15px, 1.35vw, 21px) !important;
}

body.ro-final-active .ro-stage b {
  margin-top: 3px !important;
  font-size: clamp(7px, .66vw, 10px) !important;
  letter-spacing: .25px !important;
}

body.ro-final-active .ro-s1 { top: 3% !important; }
body.ro-final-active .ro-s2 { right: 8% !important; top: 30% !important; }
body.ro-final-active .ro-s3 { right: 14% !important; bottom: 5% !important; }
body.ro-final-active .ro-s4 { left: 14% !important; bottom: 5% !important; }
body.ro-final-active .ro-s5 { left: 8% !important; top: 30% !important; }

body.ro-final-active .ro-mini {
  padding: 7px 10px !important;
  border-radius: 7px !important;
  border-color: rgba(44, 187, 222, .45) !important;
  background: rgba(3, 26, 40, .95) !important;
  box-shadow: inset 0 0 18px rgba(20, 218, 255, .04), 0 7px 16px rgba(0, 0, 0, .23) !important;
  font-size: 7px !important;
  letter-spacing: .6px !important;
}

body.ro-final-active .ro-mini strong {
  font-size: clamp(14px, 1.25vw, 19px) !important;
}

body.ro-final-active .ro-mini.left { left: 4% !important; top: 8% !important; }
body.ro-final-active .ro-mini.right { right: 4% !important; top: 8% !important; }

body.ro-final-active .exact-orbit-a,
body.ro-final-active .exact-orbit-b,
body.ro-final-active .exact-scan {
  opacity: .5 !important;
  pointer-events: none !important;
}

/* Right rail */
body.ro-final-active .revos-side {
  display: grid !important;
  grid-template-rows: minmax(0, 1fr) minmax(0, .9fr) !important;
  gap: 8px !important;
  height: 100% !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

body.ro-final-active .revos-feed,
body.ro-final-active .revos-convos {
  box-sizing: border-box !important;
  min-height: 0 !important;
  padding: 10px 11px !important;
  overflow: hidden !important;
}

body.ro-final-active #roFeed,
body.ro-final-active #roOps {
  display: grid !important;
  height: calc(100% - 32px) !important;
  min-height: 0 !important;
  grid-auto-rows: minmax(0, 1fr) !important;
  overflow: hidden !important;
}

body.ro-final-active .ro-feed-item,
body.ro-final-active .ro-convo {
  box-sizing: border-box !important;
  min-height: 0 !important;
  padding: 4px 0 !important;
  gap: 7px !important;
  grid-template-columns: 28px minmax(0, 1fr) auto !important;
  border-bottom-color: rgba(33, 140, 168, .22) !important;
}

body.ro-final-active .ro-feed-item .fi,
body.ro-final-active .ro-avatar {
  width: 27px !important;
  height: 27px !important;
  border-radius: 7px !important;
  background: linear-gradient(145deg, rgba(7, 63, 89, .95), rgba(5, 32, 48, .98)) !important;
  border-color: rgba(34, 181, 219, .38) !important;
  font-size: 8px !important;
}

body.ro-final-active .ro-feed-item b,
body.ro-final-active .ro-convo b {
  font-size: 9px !important;
}

body.ro-final-active .ro-feed-item small,
body.ro-final-active .ro-convo small,
body.ro-final-active .ro-feed-item time,
body.ro-final-active .ro-convo em {
  font-size: 7px !important;
}

/* Bottom analytics */
body.ro-final-active .revos-bottom {
  display: grid !important;
  grid-template-columns: 1fr 1.18fr 1fr !important;
  gap: 8px !important;
  height: 146px !important;
  min-height: 0 !important;
  overflow: hidden !important;
}

body.ro-final-active .ro-chart {
  box-sizing: border-box !important;
  min-height: 0 !important;
  height: 146px !important;
  padding: 10px 12px !important;
  overflow: hidden !important;
}

body.ro-final-active .ro-chart h4 {
  position: relative !important;
  z-index: 2 !important;
  font-size: 9px !important;
  letter-spacing: 1.25px !important;
  color: #b6dbe6 !important;
}

body.ro-final-active .ro-bars {
  left: 12px !important;
  right: 12px !important;
  bottom: 10px !important;
  height: 88px !important;
  gap: 8px !important;
  background:
    linear-gradient(rgba(30, 128, 158, .18) 1px, transparent 1px) !important;
  background-size: 100% 29px !important;
}

body.ro-final-active .ro-bars i {
  background: linear-gradient(180deg, #3deaff, #0b82b4) !important;
  box-shadow: 0 0 13px rgba(24, 221, 255, .27) !important;
}

body.ro-final-active .ro-trend svg {
  bottom: 9px !important;
  height: 91px !important;
  filter: drop-shadow(0 0 5px rgba(32, 223, 255, .28)) !important;
}

body.ro-final-active .ro-ring {
  width: 76px !important;
  height: 76px !important;
  margin: 10px auto 0 !important;
  border-width: 8px !important;
  border-color: #0b354a !important;
  border-top-color: var(--rv6-cyan) !important;
  border-right-color: var(--rv6-cyan) !important;
  box-shadow: 0 0 24px rgba(25, 224, 255, .22), inset 0 0 20px rgba(22, 215, 255, .05) !important;
}

body.ro-final-active .ro-ring b {
  font-size: 13px !important;
}

body.ro-final-active .ro-final-kill {
  right: 17px !important;
  bottom: 18px !important;
  width: 52px !important;
  height: 52px !important;
  border-width: 2px !important;
  box-shadow: 0 0 0 5px rgba(255, 47, 65, .10), 0 0 25px rgba(255, 42, 61, .38) !important;
}

/* Short desktop screens remain one-screen command surfaces. */
@media (min-width: 821px) and (max-height: 790px) {
  body.ro-final-active:not(.workspace-layer-open) #revenueOS {
    grid-template-rows: 43px 72px minmax(0, 1fr) 116px !important;
    gap: 6px !important;
    padding-bottom: 6px !important;
  }

  body.ro-final-active .revos-top { height: 43px !important; }
  body.ro-final-active .revos-kpi { height: 72px !important; padding: 7px 9px !important; }
  body.ro-final-active .revos-kpi .ico { width: 34px !important; height: 34px !important; }
  body.ro-final-active .revos-kpi strong { font-size: clamp(15px, 1.25vw, 20px) !important; }
  body.ro-final-active .revos-kpi em { margin-top: 4px !important; }
  body.ro-final-active .revos-agent .aico { width: 27px !important; height: 27px !important; }
  body.ro-final-active .revos-agent b { font-size: 9px !important; }
  body.ro-final-active .revos-agent small { display: none !important; }
  body.ro-final-active .revos-bottom,
  body.ro-final-active .ro-chart { height: 116px !important; }
  body.ro-final-active .ro-bars,
  body.ro-final-active .ro-trend svg { height: 66px !important; }
  body.ro-final-active .ro-ring { width: 58px !important; height: 58px !important; margin-top: 7px !important; }
  body.ro-final-active .ro-final-brand { flex-basis: 48px !important; }
  body.ro-final-active .ro-final-nav { flex-basis: 410px !important; }
  body.ro-final-active .ro-final-foot { display: none !important; }
}

/* Narrow desktop/tablet: preserve the console, reduce chrome instead of stacking. */
@media (min-width: 821px) and (max-width: 1240px) {
  body.ro-final-active:not(.workspace-layer-open) .workspace-shell {
    grid-template-columns: 76px minmax(0, 1fr) !important;
  }
  body.ro-final-active .ro-final-side { padding-inline: 8px !important; }
  body.ro-final-active .ro-final-brand div,
  body.ro-final-active .ro-final-nav button span,
  body.ro-final-active .ro-upgrade,
  body.ro-final-active .ro-final-foot { display: none !important; }
  body.ro-final-active .ro-final-brand { justify-content: center !important; }
  body.ro-final-active .ro-final-nav button { justify-content: center !important; padding: 0 !important; }
  body.ro-final-active .revos-main {
    grid-template-columns: minmax(170px, .72fr) minmax(390px, 1.7fr) minmax(205px, .92fr) !important;
  }
  body.ro-final-active .revos-brandline { letter-spacing: 2px !important; }
  body.ro-final-active .revos-search { width: 220px !important; }
  body.ro-final-active .revos-top { grid-template-columns: minmax(0, 1fr) 220px auto !important; }
}

/* Phones use contained internal scrolling; the desktop viewport remains untouched. */
@media (max-width: 820px) {
  html:has(body.ro-final-active), body.ro-final-active { overflow: auto !important; }
  body.ro-final-active:not(.workspace-layer-open) .workspace-shell {
    display: block !important;
    height: auto !important;
    min-height: 100dvh !important;
    overflow: visible !important;
  }
  body.ro-final-active .ro-final-side {
    position: sticky !important;
    top: 0 !important;
    z-index: 80 !important;
    width: 100% !important;
    height: 48px !important;
    min-height: 48px !important;
    padding: 5px 8px !important;
    border-right: 0 !important;
    border-bottom: 1px solid var(--rv6-line-soft) !important;
  }
  body.ro-final-active .ro-final-brand,
  body.ro-final-active .ro-upgrade,
  body.ro-final-active .ro-final-foot { display: none !important; }
  body.ro-final-active .ro-final-nav {
    display: flex !important;
    height: 38px !important;
    overflow-x: auto !important;
    gap: 4px !important;
  }
  body.ro-final-active .ro-final-nav button {
    flex: 0 0 40px !important;
    width: 40px !important;
    height: 36px !important;
    padding: 0 !important;
    justify-content: center !important;
  }
  body.ro-final-active .ro-final-nav button span { display: none !important; }
  body.ro-final-active:not(.workspace-layer-open) .workspace-main {
    height: auto !important;
    min-height: calc(100dvh - 48px) !important;
    padding: 0 7px 72px !important;
    overflow: visible !important;
  }
  body.ro-final-active:not(.workspace-layer-open) #revenueOS {
    height: auto !important;
    min-height: calc(100dvh - 48px) !important;
    grid-template-rows: auto auto auto auto !important;
    overflow: visible !important;
  }
  body.ro-final-active .revos-top { grid-template-columns: 1fr auto !important; }
  body.ro-final-active .revos-search { display: none !important; }
  body.ro-final-active .revos-kpis { overflow-x: auto !important; }
  body.ro-final-active .revos-kpi { min-width: 134px !important; }
  body.ro-final-active .revos-main { grid-template-columns: 1fr !important; overflow: visible !important; }
  body.ro-final-active .revos-core { min-height: 470px !important; order: 1 !important; }
  body.ro-final-active .revos-agents { min-height: 420px !important; order: 2 !important; }
  body.ro-final-active .revos-side { min-height: 420px !important; order: 3 !important; grid-template-columns: 1fr 1fr !important; grid-template-rows: none !important; }
  body.ro-final-active .revos-bottom { height: auto !important; grid-template-columns: 1fr !important; overflow: visible !important; }
}

@media (prefers-reduced-motion: reduce) {
  body.ro-final-active .revos-core::before,
  body.ro-final-active .revos-core::after,
  body.ro-final-active .ro-line,
  body.ro-final-active .ro-center::after {
    animation: none !important;
  }
}