/* Ravok workspace. Loaded after the legacy workspace styles; API and DOM contracts stay intact. */
body.ravok-panel {
  --ravok-bg: #080c14;
  --ravok-surface: #141c29;
  --ravok-raised: #1b2738;
  --ravok-field: #101927;
  --ravok-hover: #223149;
  --ravok-text: #fff;
  --ravok-muted: #bdcadb;
  --ravok-faint: #90a1b8;
  --ravok-line: #2d3c52;
  --ravok-card-edge: #27364b;
  --ravok-edge: var(--ravok-card-edge);
  --ravok-soft: #28364a;
  --ravok-input-border: #40516b;
  --ravok-table-head: #1b2739;
  --ravok-action-cell: #2a3b54;
  --ravok-accent: #ff8a3d;
  --ravok-accent-soft: #ff8a3d24;
  --ravok-accent-ink: #ffb57d;
  --ravok-positive: #4aebaf;
  --ravok-negative: #ff8da3;
  --ravok-dot: #a1bfff0c;
  --panel-accent: var(--ravok-accent);
  --panel-bg: var(--ravok-bg);
  --panel-card: var(--ravok-surface);
  --panel-border: var(--ravok-line);
  --panel-text: var(--ravok-text);
  --panel-muted: var(--ravok-muted);
  --green: var(--ravok-accent);
  --green2: var(--ravok-accent-ink);
  --muted: var(--ravok-muted);
  --line: var(--ravok-line);
  margin: 0;
  min-width: 320px;
  min-height: 100dvh;
  background: var(--ravok-bg);
  color: var(--ravok-text);
  font: 14px/1.5 ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  -webkit-font-smoothing: antialiased;
  color-scheme: dark;
}
body.ravok-panel[data-panel-theme="light"] {
  --ravok-bg: #ffffff;
  --ravok-surface: #fff;
  --ravok-raised: #f8fafc;
  --ravok-field: #f8fafc;
  --ravok-hover: #f1f5f9;
  --ravok-text: #0f172a;
  --ravok-muted: #475569;
  --ravok-faint: #64748b;
  --ravok-line: #e2e8f0;
  --ravok-card-edge: #e2e8f0;
  --ravok-soft: #e9eef5;
  --ravok-input-border: #cbd5e1;
  --ravok-table-head: #f8fafc;
  --ravok-action-cell: #edf2f7;
  --ravok-accent-soft: #fff1e6;
  --ravok-accent-ink: #b8430d;
  --ravok-positive: #087c50;
  --ravok-negative: #be254a;
  --ravok-dot: #00000000;
  color-scheme: light;
}
body.ravok-panel *, body.ravok-panel *::before, body.ravok-panel *::after { box-sizing: border-box; }
body.ravok-panel [hidden] { display: none !important; }
body.ravok-panel button, body.ravok-panel input, body.ravok-panel select, body.ravok-panel textarea { font-family: inherit; }
body.ravok-panel button, body.ravok-panel summary, body.ravok-panel a { -webkit-tap-highlight-color: transparent; }
body.ravok-panel button { cursor: pointer; }
body.ravok-panel button:disabled { cursor: default; opacity: .42; }
body.ravok-panel a { color: inherit; text-decoration: none; }
body.ravok-panel p, body.ravok-panel .muted { color: var(--ravok-muted); }
body.ravok-panel h1, body.ravok-panel h2, body.ravok-panel h3, body.ravok-panel h4 { color: var(--ravok-text); }
body.ravok-panel :focus-visible { outline: 2px solid var(--ravok-accent); outline-offset: 4px; }
body.ravok-panel ::selection { background: #d9834a55; color: var(--ravok-text); }
body.ravok-panel .dashboard { display: block; min-height: 100dvh; }

/* Floating application header. */
body.ravok-panel .ravok-topbar {
  position: fixed; z-index: 70; top: 10px; right: 15px; left: 15px;
  height: 64px; padding: 0 20px; border: 1px solid #ffffff03; border-radius: 18px;
  display: flex; align-items: center; gap: 22px; background: var(--ravok-surface);
}
body.ravok-panel .ravok-brand { display: flex; align-items: center; gap: 10px; min-width: 190px; flex-shrink: 0; font-size: 21px; font-weight: 650; letter-spacing: -.7px; color: var(--ravok-text); }
body.ravok-panel .ravok-brand-mark { width: 31px; height: 34px; display: grid; place-items: center; flex-shrink: 0; color: var(--ravok-accent); }
body.ravok-panel .ravok-brand-mark svg { display: block; width: 31px; height: 34px; }
body.ravok-panel .ravok-brand img { width: 32px; height: 32px; object-fit: contain; }
body.ravok-panel .ravok-brand > span { display: block; line-height: 22px; }
body.ravok-panel .ravok-brand small { display: block; margin-top: 1px; color: var(--ravok-muted); font-size: 7px; line-height: 10px; font-weight: 500; letter-spacing: 3px; }
body.ravok-panel .ravok-topbar-actions { display: flex; align-items: center; justify-content: flex-end; gap: 12px; margin-left: auto; min-width: 0; }
body.ravok-panel .ravok-topbar .icon-button { width: 36px; height: 36px; background: transparent; color: var(--ravok-muted); }
body.ravok-panel .ravok-topbar .icon-button:hover { background: var(--ravok-hover); color: var(--ravok-text); }
body.ravok-panel .ravok-global-search { display: flex; align-items: center; gap: 10px; flex: 1; max-width: 320px; min-width: 100px; height: 38px; padding: 0 12px; color: var(--ravok-faint); border: 0; border-radius: 12px; background: transparent; }
body.ravok-panel .ravok-global-search input { width: 100%; min-width: 0; min-height: 0 !important; border: 0 !important; padding: 0 !important; outline: 0 !important; background: transparent !important; box-shadow: none !important; color: var(--ravok-text); font-size: 13px; }
body.ravok-panel .ravok-global-search input::placeholder { color: var(--ravok-faint); }
body.ravok-panel .ravok-global-search kbd { border: 1px solid var(--ravok-line); border-radius: 5px; padding: 1px 5px; font-family: inherit; font-size: 10px; white-space: nowrap; }
body.ravok-panel .ravok-global-search > span { color: var(--ravok-faint); font-size: 12px; white-space: nowrap; }
body.ravok-panel .ravok-locale { display: flex; align-items: center; gap: 6px; color: var(--ravok-muted); font-size: 14px; white-space: nowrap; }
body.ravok-panel .ravok-locale > span { font-size: 10px; }
body.ravok-panel .account-avatar { width: 34px; height: 34px; border-radius: 50%; color: #352319; background: #dfb291; font-size: 13px; font-weight: 650; display: grid; place-items: center; flex-shrink: 0; }
body.ravok-panel .ravok-topbar .panel-account-strip { margin: 0; padding: 0; width: auto; min-width: 0; height: auto; background: transparent; gap: 10px; }
body.ravok-panel .ravok-topbar .panel-account-strip b { color: var(--ravok-text); font-size: 12px; font-weight: 550; }
body.ravok-panel .ravok-topbar .panel-account-strip small { color: var(--ravok-muted); font-size: 10px; }
body.ravok-panel .account-menu > summary { border: 0; border-radius: 12px; background: transparent; color: var(--ravok-muted); }
body.ravok-panel .ravok-topbar .account-menu > summary { gap: 9px; padding: 0 0 0 10px; }
body.ravok-panel .ravok-topbar .account-menu > summary::after { display: none; }
body.ravok-panel .ravok-topbar .account-menu > summary b { display: block; font-size: 11px; font-weight: 500; color: var(--ravok-text); line-height: 16px; }
body.ravok-panel .ravok-topbar .account-menu > summary small { display: block; font-size: 9px; color: var(--ravok-faint); line-height: 14px; }
body.ravok-panel .account-menu > div { top: calc(100% + 10px); min-width: 190px; padding: 8px; border: 1px solid var(--ravok-line); border-radius: 18px; background: var(--ravok-raised); box-shadow: 0 18px 50px #0005; }
body.ravok-panel .account-menu button { border-radius: 12px; color: var(--ravok-text); padding: 10px 12px; }
body.ravok-panel .account-menu button:hover { background: var(--ravok-hover); }
body.ravok-panel .panel-credit-balance { border-color: var(--ravok-line); color: var(--ravok-muted); font-size: 11px; }
body.ravok-panel .panel-credit-balance b { color: var(--ravok-text); }

/* Sidebar and route scaffold. */
body.ravok-panel .dash-sidebar {
  position: fixed; inset: 86px auto 20px 14px; width: 220px; height: auto;
  padding: 20px 12px 14px; border: 0; border-radius: 20px; display: flex;
  flex-direction: column; gap: 0; background: var(--ravok-surface); box-shadow: none;
  overflow: auto; scrollbar-width: thin; scrollbar-color: var(--ravok-line) transparent; z-index: 60;
}
body.ravok-panel .sidebar-brand { display: none !important; }
body.ravok-panel .dash-nav { display: flex; flex: 1; flex-direction: column; gap: 5px; margin: 0; padding: 0; overflow: visible; max-height: none; }
body.ravok-panel .ravok-nav-section { margin: 18px 12px 9px; padding: 0; color: var(--ravok-faint); font-size: 9px; line-height: 16px; letter-spacing: 1.25px; text-transform: uppercase; font-weight: 500; }
body.ravok-panel .ravok-nav-section:first-child { margin-top: 0; }
body.ravok-panel .dash-nav button, body.ravok-panel .nav-group summary {
  display: flex; justify-content: flex-start; align-items: center; gap: 11px; width: 100%; min-height: 42px;
  margin: 0; padding: 10px 13px; border: 1px solid transparent; border-radius: 24px;
  background: transparent; color: var(--ravok-muted); font-size: 12px; font-weight: 450;
  letter-spacing: 0; text-align: left; line-height: 19px; white-space: nowrap;
}
body.ravok-panel .dash-nav .panel-icon { width: 18px; height: 18px; color: currentColor; flex-shrink: 0; }
body.ravok-panel .dash-nav button:hover, body.ravok-panel .nav-group summary:hover { color: var(--ravok-text); border-color: transparent; background: var(--ravok-hover); }
body.ravok-panel .dash-nav button.active { color: #fff; border-color: transparent; background: linear-gradient(105deg,#e1a477,#b96b39); box-shadow: inset 0 1px 0 #ffffff25; font-weight: 550; }
body.ravok-panel .dash-nav button span { display: inline; overflow: hidden; text-overflow: ellipsis; }
body.ravok-panel .nav-group { margin: 0; padding: 0; border: 0; background: transparent; }
body.ravok-panel .nav-group summary { list-style: none; cursor: pointer; }
body.ravok-panel .nav-group summary::after { content: '⌄'; display: inline-block; margin-left: auto; color: var(--ravok-faint); font-size: 14px; }
body.ravok-panel .nav-group[open] summary::after { transform: rotate(180deg); }
body.ravok-panel .nav-group > button { width: calc(100% - 21px); margin: 3px 0 3px 21px; min-height: 36px; padding: 8px 14px; font-size: 11px; }
body.ravok-panel .dash-user { position: static; display: block; margin-top: 20px; padding: 17px 9px 2px; border: 0; border-top: 1px solid var(--ravok-line); border-radius: 0; background: transparent; font-size: 11px; }
body.ravok-panel .dash-user b { color: var(--ravok-text); font-size: 12px; font-weight: 550; }
body.ravok-panel .dash-user small { color: var(--ravok-faint); text-transform: none; letter-spacing: 0; font-size: 10px; }
body.ravok-panel .sidebar-logout { color: var(--ravok-muted); margin-top: 12px; width: auto; padding: 0; font-size: 11px; }
body.ravok-panel .dash-content { margin-left: 250px; width: calc(100% - 250px); max-width: none; min-width: 0; padding: 100px 24px 30px; background: var(--ravok-bg); }
body.ravok-panel .dash-content > * { max-width: 1440px; margin-left: auto; margin-right: auto; }
body.ravok-panel .dash-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 20px; min-height: 0; border: 0; padding: 0; margin-top: 0; margin-bottom: 26px; }
body.ravok-panel .dash-header h1 { color: var(--ravok-text); font-size: 24px; line-height: 32px; font-weight: 550; letter-spacing: -.65px; margin: 0; }
body.ravok-panel .ravok-breadcrumb { display: flex; align-items: center; gap: 9px; margin: 0 0 13px; color: var(--ravok-faint); font-size: 10px; line-height: 18px; }
body.ravok-panel .ravok-breadcrumb .panel-icon { width: 13px; height: 13px; }
body.ravok-panel .ravok-breadcrumb span:last-child { color: var(--ravok-muted); }
body.ravok-panel .ravok-page-description { margin: 4px 0 0; color: var(--ravok-muted); font-size: 14px; font-weight: 400; line-height: 22px; }
body.ravok-panel .ravok-page-tools, body.ravok-panel .dash-actions { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin: 24px 0 0; }
body.ravok-panel .ravok-period { display: flex; align-items: center; gap: 8px; height: 38px; padding: 0 12px; border: 1px solid var(--ravok-line); border-radius: 999px; background: var(--ravok-raised); }
body.ravok-panel .ravok-period > span { display: flex; color: var(--ravok-muted); }
body.ravok-panel .ravok-period select { min-height: 34px; width: auto; padding: 6px 18px 6px 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; font-size: 11px; }
body.ravok-panel .dash-section { min-width: 0; padding: 0; }
body.ravok-panel .customer-sync-status { margin-top: -12px; margin-bottom: 16px; padding: 0; border: 0; background: transparent; color: var(--ravok-faint); font-size: 11px; }
body.ravok-panel .customer-sync-status.error { color: var(--ravok-negative); }
body.ravok-panel .panel-credit-alert { margin: 0 auto 20px; padding: 12px 18px; min-height: 0; border: 1px solid #d9834a33; border-radius: 18px; background: var(--ravok-accent-soft); color: var(--ravok-accent-ink); font-size: 12px; }
body.ravok-panel .panel-credit-alert button { color: inherit; }
body.ravok-panel .legacy-overview { display: none; }
body.ravok-panel.client-panel .legacy-overview { display: block; }

/* Twelve-column dashboard: the same proportions as the reference. */
body.ravok-panel .ravok-overview-grid { display: grid; grid-template-columns: repeat(12,minmax(0,1fr)); gap: 24px; align-items: stretch; }
body.ravok-panel .ravok-bento {
  position: relative; isolation: isolate; display: flex; flex-direction: column; min-width: 0; margin: 0; padding: 24px;
  border: 0; border-radius: 34px; color: var(--ravok-text); overflow: hidden;
  background: radial-gradient(ellipse at 5% 115%,#bb704d24,transparent 65%),radial-gradient(circle,var(--ravok-dot) .7px,transparent .85px),var(--ravok-surface);
  background-size: auto,7px 7px,auto; box-shadow: none;
}
body.ravok-panel .ravok-bento-main { grid-column: span 6; min-height: 280px; }
body.ravok-panel .ravok-bento-growth, body.ravok-panel .ravok-bento-visitors { grid-column: span 3; min-height: 280px; }
body.ravok-panel .ravok-bento-sales, body.ravok-panel .ravok-bento-goal, body.ravok-panel .ravok-bento-conversion { grid-column: span 4; min-height: 256px; }
body.ravok-panel .ravok-bento-recent, body.ravok-panel .ravok-bento-health { grid-column: span 3; min-height: 256px; }
body.ravok-panel .ravok-bento-activity { grid-column: span 6; min-height: 256px; }
body.ravok-panel .ravok-bento-table { grid-column: 1 / -1; min-height: 0; background: var(--ravok-surface); }
body.ravok-panel .ravok-card-cut { position: absolute; top: -1px; right: -1px; z-index: 1; width: 136px; height: 82px; fill: var(--ravok-bg); pointer-events: none; }
body.ravok-panel .ravok-card-cut .ravok-card-edge { fill: none; stroke: var(--ravok-card-edge); stroke-width: 1px; }
body.ravok-panel .ravok-card-tools { position: absolute; top: 8px; right: 10px; z-index: 3; display: flex; gap: 8px; }
body.ravok-panel .ravok-card-tools button, body.ravok-panel .ravok-card-tools .icon-button, body.ravok-panel .ravok-card-tools a {
  display: inline-flex; align-items: center; justify-content: center; width: 46px; height: 46px; min-height: 46px;
  padding: 0; border: 0; border-radius: 50%; background: var(--ravok-surface); color: var(--ravok-muted);
}
body.ravok-panel .ravok-card-tools button:hover, body.ravok-panel .ravok-card-tools a:hover { background: var(--ravok-hover); color: var(--ravok-text); }
body.ravok-panel .ravok-card-tools .panel-icon { width: 19px; height: 19px; }
body.ravok-panel .ravok-card-content { position: relative; z-index: 2; flex: 1; min-width: 0; }
body.ravok-panel .ravok-card-kicker { display: block; max-width: calc(100% - 110px); margin: 0 0 7px; color: var(--ravok-muted); font-size: 12px; font-weight: 400; line-height: 19px; }
body.ravok-panel .ravok-card-title { margin: 0 105px 6px 0; color: var(--ravok-text); font-size: 15px; font-weight: 500; line-height: 23px; letter-spacing: -.2px; }
body.ravok-panel .ravok-stat-value { display: block; margin: 13px 0 7px; font-size: 32px; font-weight: 500; line-height: 1.1; letter-spacing: -1.5px; font-variant-numeric: tabular-nums; }
body.ravok-panel .ravok-bento-main .ravok-stat-value { font-size: 60px; letter-spacing: -3px; margin-top: 22px; }
body.ravok-panel .ravok-stat-line { position: relative; z-index: 2; display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin: 8px 0 0; color: var(--ravok-muted); font-size: 11px; }
body.ravok-panel .ravok-stat-line strong, body.ravok-panel .ravok-stat-line b { color: var(--ravok-accent-ink); font-weight: 500; }
body.ravok-panel .ravok-stat-line .positive, body.ravok-panel .ravok-positive { color: var(--ravok-positive); }
body.ravok-panel .ravok-stat-line .negative, body.ravok-panel .ravok-negative { color: var(--ravok-negative); }
body.ravok-panel .ravok-stat-line .panel-icon { width: 13px; height: 13px; }
body.ravok-panel .ravok-stat-caption { position: relative; z-index: 2; margin-top: 7px; color: var(--ravok-muted); font-size: 11px; line-height: 19px; }
body.ravok-panel .ravok-bento-main .ravok-stat-line { gap: 25px; margin-top: 16px; align-items: center; }
body.ravok-panel .ravok-bento-main .ravok-stat-line .ravok-stat-value { margin: 0; }
body.ravok-panel .ravok-bento-main .ravok-mini-stats { margin-top: 0; gap: 20px; color: var(--ravok-muted); }
body.ravok-panel .ravok-bento-main .ravok-stat-line strong { color: var(--ravok-text); }
body.ravok-panel .ravok-bento-main .ravok-mini-stats > span { font-size: 10px; }
body.ravok-panel .ravok-bento-main .ravok-mini-stats strong { margin-top: 2px; font-size: 18px; }
body.ravok-panel .ravok-main-spark { position: absolute; left: 0; bottom: -2px; width: 68%; opacity: .75; }
body.ravok-panel .ravok-main-spark .ravok-sparkline { height: 58px; margin-top: 0; }
body.ravok-panel .ravok-mini-stats { position: relative; z-index: 2; display: flex; gap: 26px; margin-top: 35px; }
body.ravok-panel .ravok-mini-stats > * { min-width: 0; }
body.ravok-panel .ravok-mini-stats small { display: block; color: var(--ravok-muted); font-size: 10px; }
body.ravok-panel .ravok-mini-stats strong, body.ravok-panel .ravok-mini-stats b { display: block; margin-top: 4px; color: var(--ravok-text); font-size: 18px; font-weight: 500; letter-spacing: -.5px; }
body.ravok-panel .ravok-orbit { position: absolute; z-index: 0; width: 220px; height: 220px; right: 9px; bottom: 1px; object-fit: contain; pointer-events: none; }
body.ravok-panel .ravok-orbit svg, body.ravok-panel svg.ravok-orbit { overflow: visible; }
body.ravok-panel .ravok-orbit > svg { position: relative; z-index: 1; display: block; width: 100%; height: 100%; }
body.ravok-panel .ravok-orbit-halo { position: absolute; inset: 30% 10% 2%; background: radial-gradient(ellipse,#b8682e44,transparent 70%); filter: blur(15px); }
body.ravok-panel .ravok-bento-main > :not(.ravok-orbit):not(.ravok-card-cut):not(.ravok-card-tools) { position: relative; z-index: 2; }
body.ravok-panel .ravok-sparkline { width: 100%; height: 82px; display: block; margin-top: 20px; overflow: visible; }
body.ravok-panel .ravok-sparkline text, body.ravok-panel .ravok-bar-chart text { fill: var(--ravok-faint); font-size: 9px; font-family: inherit; }
body.ravok-panel .ravok-bar-chart { display: flex; align-items: flex-end; justify-content: space-between; gap: 8px; height: 125px; margin-top: 24px; width: 100%; }
body.ravok-panel svg.ravok-bar-chart { display: block; height: 140px; }
body.ravok-panel .ravok-bar-chart > div { flex: 1; display: flex; align-items: center; flex-direction: column; justify-content: flex-end; gap: 8px; height: 100%; min-width: 0; }
body.ravok-panel .ravok-bar-chart i, body.ravok-panel .ravok-bar-chart .ravok-bar { display: block; width: min(28px,100%); min-height: 4px; border-radius: 8px 8px 3px 3px; background: linear-gradient(0deg,#7f4d35,#d9996f); }
body.ravok-panel .ravok-bar-chart > div > span { display: block; width: min(26px,100%); min-height: 6px; border-radius: 7px 7px 3px 3px; background: linear-gradient(0deg,#61402d,#a56a43); }
body.ravok-panel .ravok-bar-chart > div > span.active { background: linear-gradient(0deg,#b96c3c,#e3a478); }
body.ravok-panel .ravok-bar-chart small { font-size: 9px; color: var(--ravok-faint); }
body.ravok-panel .ravok-ring { display: block; position: relative; flex-shrink: 0; width: 120px; height: 120px; margin: 14px auto 0; }
body.ravok-panel .ravok-ring svg { width: 100%; height: 100%; overflow: visible; }
body.ravok-panel .ravok-ring > strong, body.ravok-panel .ravok-ring > b { position: absolute; inset: 0; display: grid; place-items: center; font-size: 23px; font-weight: 500; letter-spacing: -1px; }
body.ravok-panel .ravok-ring-row { display: flex; align-items: center; gap: 22px; margin-top: 20px; }
body.ravok-panel .ravok-ring-row .ravok-ring { margin: 0; }
body.ravok-panel .ravok-ring-number { color: var(--ravok-text); font-size: 31px; font-weight: 500; letter-spacing: -1px; line-height: 1.2; }
body.ravok-panel .ravok-ring-row p { max-width: 130px; margin: 7px 0 0; color: var(--ravok-muted); font-size: 11px; line-height: 18px; }
body.ravok-panel .ravok-progress { position: relative; height: 11px; margin-top: 35px; overflow: hidden; border-radius: 999px; background: var(--ravok-soft); }
body.ravok-panel .ravok-progress > span { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg,#b46b3e,#e3a578); }
body.ravok-panel .ravok-progress-labels { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 11px; color: var(--ravok-muted); font-size: 10px; }
body.ravok-panel .ravok-health-lines { display: grid; gap: 17px; margin-top: 25px; }
body.ravok-panel .ravok-health-lines > span { display: flex; align-items: center; gap: 7px; color: var(--ravok-muted); font-size: 10px; line-height: 17px; }
body.ravok-panel .ravok-health-lines .panel-icon { width: 14px; height: 14px; }
body.ravok-panel .ravok-health-lines b { color: var(--ravok-text); margin-left: auto; font-size: 10px; font-weight: 450; }
body.ravok-panel .ravok-health-lines i { width: 7px; height: 7px; margin-inline: 3px 4px; flex-shrink: 0; border-radius: 50%; background: var(--ravok-accent); }
body.ravok-panel .ravok-health-lines i.online { background: var(--ravok-positive); }
body.ravok-panel .ravok-bento-health .ravok-stat-value { margin-top: 26px; font-size: clamp(20px,2.1vw,30px); letter-spacing: -.7px; }
body.ravok-panel .ravok-portfolio { display: flex; align-items: center; gap: 30px; margin-top: 22px; }
body.ravok-panel .ravok-portfolio > div { flex: 0 0 45%; display: flex; align-items: center; gap: 15px; }
body.ravok-panel .ravok-portfolio .ravok-ring { margin: 0; }
body.ravok-panel .ravok-portfolio > div > strong { min-width: 0; font-size: 28px; font-weight: 500; line-height: 1.2; letter-spacing: -.8px; }
body.ravok-panel .ravok-portfolio > div > strong small { display: block; margin-top: 6px; max-width: 100px; color: var(--ravok-muted); font-size: 10px; line-height: 17px; letter-spacing: 0; font-weight: 400; }
body.ravok-panel .ravok-portfolio ul { flex: 1; min-width: 0; margin: 0; padding: 0; list-style: none; display: grid; gap: 16px; }
body.ravok-panel .ravok-portfolio li { display: flex; align-items: center; gap: 9px; color: var(--ravok-muted); font-size: 11px; }
body.ravok-panel .ravok-portfolio li b { color: var(--ravok-text); margin-left: auto; font-weight: 500; }
body.ravok-panel .ravok-portfolio li i { display: block; width: 8px; height: 8px; flex-shrink: 0; border-radius: 2px; background: var(--ravok-accent); }
body.ravok-panel .ravok-portfolio li i.active { background: var(--ravok-positive); }
body.ravok-panel .ravok-portfolio li i.expiring { background: #d9a164; }
body.ravok-panel .ravok-portfolio li i.expired { background: #d17c6a; }
body.ravok-panel .ravok-portfolio li i.blocked { background: #82828a; }
body.ravok-panel .ravok-recent-list { display: grid; gap: 0; margin-top: 24px; padding: 0; list-style: none; }
body.ravok-panel .ravok-recent-list > * { display: flex; align-items: center; gap: 10px; min-width: 0; padding: 11px 0; border-bottom: 1px solid var(--ravok-line); }
body.ravok-panel .ravok-recent-list > :last-child { border-bottom: 0; }
body.ravok-panel .ravok-recent-list > li > span:nth-child(2) { min-width: 0; }
body.ravok-panel .ravok-recent-list > li > span:nth-child(2) b { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
body.ravok-panel .ravok-person-avatar { display: inline-grid; place-items: center; width: 31px; height: 31px; flex-shrink: 0; border: 1px solid #c48b5f35; border-radius: 50%; color: var(--ravok-accent-ink); background: #c48b5f16; font-size: 11px; font-weight: 500; }
body.ravok-panel .ravok-recent-list .reference-status { max-width: 80px; margin-left: auto; padding: 3px 6px; font-size: 9px; overflow: hidden; }
body.ravok-panel .ravok-recent-list .reference-status .panel-icon { width: 11px; height: 11px; }
body.ravok-panel .ravok-empty { padding: 22px 0; color: var(--ravok-faint); font-size: 12px; }
body.ravok-panel .ravok-recent-list strong, body.ravok-panel .ravok-recent-list b { color: var(--ravok-text); font-size: 12px; font-weight: 500; }
body.ravok-panel .ravok-recent-list small { display: block; margin-top: 2px; color: var(--ravok-faint); font-size: 10px; }
body.ravok-panel .ravok-recent-list .account-avatar { width: 29px; height: 29px; font-size: 10px; }
body.ravok-panel .ravok-recent-list time, body.ravok-panel .ravok-recent-list > * > span:last-child { margin-left: auto; color: var(--ravok-muted); font-size: 10px; white-space: nowrap; }
body.ravok-panel .ravok-overview-table { min-width: 0; max-width: 100%; overflow-x: auto; margin-top: 22px; border-radius: 14px; scrollbar-width: thin; scrollbar-color: var(--ravok-line) transparent; }
body.ravok-panel .ravok-overview-table .data-table { min-width: 680px; }
body.ravok-panel .ravok-overview-table td:first-child { white-space: nowrap; }
body.ravok-panel .ravok-overview-table td:first-child > span { display: inline-grid; vertical-align: middle; }
body.ravok-panel .ravok-overview-table td:first-child > .ravok-person-avatar { margin-right: 10px; }
body.ravok-panel .ravok-bento .ravok-card-link { width: fit-content; min-height: 30px; padding: 6px 0; margin-top: 14px; color: var(--ravok-muted); font-size: 10px; border: 0; background: transparent; box-shadow: none; }
body.ravok-panel .ravok-bento .ravok-card-link:hover { color: var(--ravok-accent-ink); }
body.ravok-panel .ravok-footer { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 12px; padding: 26px 0 0; color: var(--ravok-faint); font-size: 11px; }
body.ravok-panel .ravok-footer a { color: var(--ravok-muted); }

/* Existing pages use the same neutral surfaces and orange action hierarchy. */
body.ravok-panel .data-card, body.ravok-panel .action-card, body.ravok-panel .stat-card, body.ravok-panel .release-card {
  min-width: 0; border: 1px solid var(--ravok-card-edge); border-radius: 24px; background: var(--ravok-surface);
  box-shadow: none; color: var(--ravok-text); padding: 24px; margin-bottom: 24px;
}
body.ravok-panel .stat-card::after { display: none; }
body.ravok-panel .stat-card strong { color: var(--ravok-text); font-size: 32px; font-weight: 500; letter-spacing: -1px; }
body.ravok-panel .stat-card small { color: var(--ravok-muted); text-transform: none; letter-spacing: 0; font-size: 12px; font-weight: 400; }
body.ravok-panel .card-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 0; margin-bottom: 22px; }
body.ravok-panel .card-head h2, body.ravok-panel .data-card > h2 { font-size: 17px; line-height: 25px; font-weight: 500; letter-spacing: -.3px; }
body.ravok-panel .card-head p { color: var(--ravok-muted); font-size: 12px; }
body.ravok-panel .mini-button, body.ravok-panel .portal-button, body.ravok-panel .period-option, body.ravok-panel .modal-cancel {
  display: inline-flex; align-items: center; justify-content: center; gap: 7px; min-height: 38px;
  border: 1px solid var(--ravok-line); border-radius: 999px; padding: 9px 16px;
  background: var(--ravok-raised); color: var(--ravok-text); font-size: 12px; line-height: 18px;
  font-weight: 450; letter-spacing: 0; text-transform: none; box-shadow: none; white-space: nowrap;
}
body.ravok-panel .mini-button:hover, body.ravok-panel .period-option:hover, body.ravok-panel .modal-cancel:hover { background: var(--ravok-hover); border-color: #8e685044; color: var(--ravok-text); transform: none; }
body.ravok-panel .mini-button.primary, body.ravok-panel .portal-button, body.ravok-panel .period-option.active, body.ravok-panel .primary {
  border-color: transparent; background: linear-gradient(110deg,#e0a174,#bd7040); color: #fff; box-shadow: inset 0 1px 0 #ffffff20;
}
body.ravok-panel .portal-button { min-height: 44px; font-size: 13px; }
body.ravok-panel .mini-button.primary:hover, body.ravok-panel .portal-button:hover { background: linear-gradient(110deg,#e6ae86,#ca7c49); filter: none; color: #fff; }
body.ravok-panel .mini-button.danger, body.ravok-panel .danger-button { color: var(--ravok-negative); background: #ef81810c; border-color: #ef818133; }
body.ravok-panel .icon-button, body.ravok-panel .icon-button.circle { width: 34px; height: 34px; min-height: 34px; border: 1px solid var(--ravok-line); border-radius: 50%; background: var(--ravok-raised); color: var(--ravok-muted); box-shadow: none; }
body.ravok-panel .icon-button:hover { background: var(--ravok-hover); color: var(--ravok-text); }
body.ravok-panel .panel-icon { width: 17px; height: 17px; }
body.ravok-panel .field { color: var(--ravok-muted); font-size: 12px; font-weight: 400; gap: 8px; line-height: 19px; }
body.ravok-panel input:not([type="checkbox"]):not([type="radio"]):not([type="color"]):not([type="file"]),
body.ravok-panel select, body.ravok-panel textarea {
  width: 100%; min-width: 0; min-height: 44px; padding: 11px 15px; border: 1px solid var(--ravok-input-border); border-radius: 18px;
  background: var(--ravok-field); color: var(--ravok-text); outline: 0; box-shadow: none; font-size: 13px; font-weight: 400;
}
body.ravok-panel input::placeholder, body.ravok-panel textarea::placeholder { color: var(--ravok-faint); }
body.ravok-panel input:focus, body.ravok-panel select:focus, body.ravok-panel textarea:focus { border-color: var(--ravok-accent); box-shadow: 0 0 0 3px var(--ravok-accent-soft); }
body.ravok-panel input[type="checkbox"], body.ravok-panel input[type="radio"] { accent-color: var(--ravok-accent); }
body.ravok-panel input[type="file"] { color: var(--ravok-muted); max-width: 100%; }
body.ravok-panel input[type="file"]::file-selector-button { border: 1px solid var(--ravok-line); border-radius: 999px; background: var(--ravok-field); color: var(--ravok-text); margin-right: 12px; padding: 9px 14px; cursor: pointer; }
body.ravok-panel textarea { border-radius: 18px; resize: vertical; min-height: 88px; }
body.ravok-panel .form-grid { gap: 0 20px; }
body.ravok-panel .panel-search { display: flex; min-width: 0; width: 260px; min-height: 40px; padding: 9px 14px; border: 1px solid var(--ravok-line); border-radius: 999px; color: var(--ravok-faint); background: var(--ravok-surface); box-shadow: none; }
body.ravok-panel .panel-search:focus-within { border-color: var(--ravok-accent); box-shadow: 0 0 0 3px var(--ravok-accent-soft); }
body.ravok-panel .panel-search input { min-height: 0; border: 0 !important; padding: 0; border-radius: 0; background: transparent !important; box-shadow: none !important; color: var(--ravok-text); }
body.ravok-panel .list-toolbar { min-height: 40px; margin: 0 0 20px; gap: 9px; display: flex; flex-wrap: wrap; }
body.ravok-panel .filter-menu, body.ravok-panel .column-menu { z-index: 8; }
body.ravok-panel .customer-filters, body.ravok-panel .column-menu > div { border: 1px solid var(--ravok-line); border-radius: 18px; background: var(--ravok-raised); box-shadow: 0 15px 40px #0005; padding: 8px; top: 48px; }
body.ravok-panel .customer-filters .mini-button { border-radius: 12px; }
body.ravok-panel .column-menu label { color: var(--ravok-muted); }
body.ravok-panel .bulk-toolbar { color: var(--ravok-text); border: 1px solid var(--ravok-line); border-radius: 18px; background: var(--ravok-surface); padding: 12px 15px; }
body.ravok-panel .table-wrap { min-width: 0; margin-inline: 0; border: 1px solid var(--ravok-line); border-radius: 20px; background: var(--ravok-surface); overflow: visible; }
body.ravok-panel .table-wrap:not(:has(.reference-table-scroll)) { overflow-x: auto; }
body.ravok-panel .reference-table-scroll { min-width: 0; max-height: calc(100dvh - 320px); overflow: auto; border-radius: 20px 20px 0 0; scrollbar-width: thin; scrollbar-color: var(--ravok-line) transparent; }
body.ravok-panel .data-table, body.ravok-panel #customers-table .data-table { display: table; width: 100%; min-width: 680px; border-collapse: separate; border-spacing: 0; font-size: 12px; }
body.ravok-panel .data-table thead, body.ravok-panel #customers-table thead { display: table-header-group; background: var(--ravok-table-head); }
body.ravok-panel .data-table tbody, body.ravok-panel #customers-table tbody { display: table-row-group; }
body.ravok-panel .data-table tr, body.ravok-panel #customers-table tr { display: table-row; border: 0; padding: 0; background: transparent; }
body.ravok-panel .data-table th, body.ravok-panel #customers-table th { display: table-cell; padding: 15px 18px; border: 0; border-bottom: 1px solid var(--ravok-line); background: var(--ravok-table-head); color: var(--ravok-muted); font-size: 11px; line-height: 18px; font-weight: 450; text-transform: none; letter-spacing: 0; white-space: nowrap; }
body.ravok-panel .data-table td, body.ravok-panel #customers-table td { display: table-cell; padding: 13px 18px; height: 61px; border: 0; border-bottom: 1px solid var(--ravok-line); background: var(--ravok-surface); color: var(--ravok-muted); font-size: 12px; line-height: 19px; vertical-align: middle; }
body.ravok-panel .data-table tr:last-child td { border-bottom: 0; }
body.ravok-panel .data-table tr:hover td, body.ravok-panel #customers-table tr:hover td { background: var(--ravok-hover); }
body.ravok-panel .data-table td b { color: var(--ravok-text); font-size: 12px; font-weight: 500; }
body.ravok-panel .data-table td small { color: var(--ravok-faint); font-size: 10px; }
body.ravok-panel .data-table td:first-child { border-left: 0; }
body.ravok-panel #customers-table td.select-cell { position: static; width: 38px; }
body.ravok-panel .data-table .selected-row td { background: var(--ravok-accent-soft); }
body.ravok-panel .table-pagination { display: flex; flex-wrap: wrap; gap: 7px; min-height: 64px; padding: 13px 18px; border-top: 1px solid var(--ravok-line); color: var(--ravok-muted); font-size: 11px; }
body.ravok-panel .table-pagination select { width: 66px; min-height: 32px; padding: 5px 9px; border-radius: 12px; background: var(--ravok-raised); }
body.ravok-panel .table-pagination .mini-button { min-height: 30px; min-width: 30px; padding: 5px 10px; border-radius: 999px; font-size: 10px; }
body.ravok-panel .row-actions { gap: 7px; }
body.ravok-panel .row-actions > .icon-button, body.ravok-panel .row-actions .row-menu > .icon-button { width: 32px; height: 32px; min-height: 32px; background: var(--ravok-action-cell); border: 0; border-radius: 10px; color: var(--ravok-text); }
body.ravok-panel .row-actions > .mini-button { background: var(--ravok-raised); border-color: var(--ravok-line); border-radius: 999px; }
body.ravok-panel .row-menu[open] > div { border: 1px solid var(--ravok-line); border-radius: 18px; background: var(--ravok-raised); box-shadow: 0 18px 50px #0007; padding: 8px; z-index: 90; }
body.ravok-panel .row-menu > div .mini-button { border-radius: 12px; color: var(--ravok-muted); }
body.ravok-panel .row-menu > div .mini-button:hover { background: var(--ravok-hover); color: var(--ravok-text); }
body.ravok-panel .login-cell .icon-button { background: var(--ravok-field); }
body.ravok-panel .password-reveal { color: var(--ravok-faint); }
body.ravok-panel .reference-status, body.ravok-panel .status-pill, body.ravok-panel .service-tag {
  display: inline-flex; gap: 5px; align-items: center; border: 1px solid #64b68b25;
  border-radius: 999px; padding: 4px 9px; background: #64b68b12; color: var(--ravok-positive);
  font-size: 10px; font-weight: 450; letter-spacing: 0; text-transform: none; white-space: nowrap;
}
body.ravok-panel .reference-status.expired, body.ravok-panel .reference-status.blocked, body.ravok-panel .status-pill.off { color: var(--ravok-negative); background: #e77b7b12; border-color: #e77b7b25; }
body.ravok-panel .reference-status.expiring, body.ravok-panel .status-pill.pending { color: var(--ravok-accent-ink); background: var(--ravok-accent-soft); border-color: #d9834a30; }
body.ravok-panel .empty-state, body.ravok-panel .sync-error { color: var(--ravok-muted); font-size: 12px; border-radius: 20px; }
body.ravok-panel .sync-error { padding: 30px; background: var(--ravok-surface); border: 1px solid var(--ravok-line); }

/* Dialog, payment, application and settings surfaces. */
body.ravok-panel .panel-dialog, body.ravok-panel .action-dialog {
  padding: 0; width: min(700px,calc(100% - 32px)); max-width: calc(100% - 32px); max-height: min(90dvh,920px);
  border: 1px solid var(--ravok-line); border-radius: 28px; background: var(--ravok-surface);
  color: var(--ravok-text); box-shadow: 0 30px 100px #0009; overflow: auto; overscroll-behavior: contain;
}
body.ravok-panel .compact-dialog { width: min(560px,calc(100% - 32px)); }
body.ravok-panel .panel-dialog::backdrop { background: #0009; backdrop-filter: blur(8px); }
body.ravok-panel .panel-dialog form, body.ravok-panel .panel-dialog .dialog-content { position: relative; padding: 30px; }
body.ravok-panel .panel-dialog h2 { margin: 0 30px 23px 0; font-size: 23px; line-height: 31px; letter-spacing: -.7px; font-weight: 550; }
body.ravok-panel .panel-dialog .dialog-close { position: absolute; top: 18px; right: 18px; display: grid; place-items: center; width: 32px; height: 32px; padding: 0; border: 1px solid var(--ravok-line); border-radius: 50%; background: var(--ravok-raised); color: var(--ravok-muted); font-size: 23px; line-height: 1; float: none; }
body.ravok-panel .panel-dialog .dialog-close:hover { background: var(--ravok-hover); color: var(--ravok-text); }
body.ravok-panel .panel-dialog .modal-customer, body.ravok-panel .confirm-details, body.ravok-panel .cost-preview, body.ravok-panel .webhook-copy, body.ravok-panel .support-preview { padding: 16px; border: 1px solid var(--ravok-line); border-radius: 18px; color: var(--ravok-muted); background: var(--ravok-raised); }
body.ravok-panel .panel-dialog .modal-customer b, body.ravok-panel .panel-dialog .modal-customer strong, body.ravok-panel .cost-preview strong { color: var(--ravok-text); }
body.ravok-panel .modal-actions { display: flex; justify-content: flex-end; align-items: center; gap: 10px; border-color: var(--ravok-line); }
body.ravok-panel .modal-actions .portal-button { width: auto; min-width: 150px; }
body.ravok-panel .modal-symbol, body.ravok-panel .modal-symbol.success { color: var(--ravok-accent-ink); border-color: #d9834a33; background: var(--ravok-accent-soft); box-shadow: none; }
body.ravok-panel .form-status { color: var(--ravok-positive) !important; font-size: 12px; }
body.ravok-panel .form-status.error { color: var(--ravok-negative) !important; }
body.ravok-panel .panel-note, body.ravok-panel .field-hint, body.ravok-panel .credit-estimate-note { color: var(--ravok-muted); font-size: 11px; }
body.ravok-panel .panel-note { border-color: var(--ravok-accent); background: var(--ravok-accent-soft); }
body.ravok-panel .portal-toast { border: 1px solid var(--ravok-line); border-radius: 18px; background: var(--ravok-raised); color: var(--ravok-text); box-shadow: 0 12px 40px #0005; }
body.ravok-panel .api-key-card, body.ravok-panel .customer-app-card, body.ravok-panel .reference-plan, body.ravok-panel .quick-action, body.ravok-panel .app-choice, body.ravok-panel .bulk-app-row, body.ravok-panel .addon-choice {
  border: 1px solid var(--ravok-line); border-radius: 20px; background: var(--ravok-raised); box-shadow: none; color: var(--ravok-text);
}
body.ravok-panel .reference-plan.active, body.ravok-panel .app-choice.active { border-color: var(--ravok-accent); background: var(--ravok-accent-soft); }
body.ravok-panel .reference-plan strong, body.ravok-panel .reference-plan b { color: var(--ravok-text); }
body.ravok-panel .reference-plan span, body.ravok-panel .customer-app-card p, body.ravok-panel .quick-action span { color: var(--ravok-muted); }
body.ravok-panel .api-key-card code, body.ravok-panel .api-key-card .docs-card, body.ravok-panel .integration-meta { color: var(--ravok-muted); background: var(--ravok-field); border-color: var(--ravok-line); border-radius: 14px; }
body.ravok-panel .docs-card { color: var(--ravok-accent-ink); background: var(--ravok-accent-soft); border-color: #d9834a33; }
body.ravok-panel .create-summary .data-card { border-radius: 24px; }
body.ravok-panel .summary-total, body.ravok-panel .contact-fields, body.ravok-panel .form-footer, body.ravok-panel .customization-grid, body.ravok-panel .customization-grid > div + div { border-color: var(--ravok-line); }
body.ravok-panel .summary-total strong, body.ravok-panel .service-brand, body.ravok-panel .neon { color: var(--ravok-accent-ink); text-shadow: none; }
body.ravok-panel .page-tabs button { color: var(--ravok-muted); border-color: var(--ravok-line); }
body.ravok-panel .page-tabs button.active { color: var(--ravok-accent-ink); border-color: var(--ravok-accent); }
body.ravok-panel .customization-grid { border-radius: 20px; }
body.ravok-panel .service-fold { border-color: var(--ravok-line); border-radius: 18px; }
body.ravok-panel .service-fold summary { color: var(--ravok-muted); }
body.ravok-panel .panel-dialog pre, body.ravok-panel code { color: var(--ravok-muted); overflow-wrap: anywhere; }
body.ravok-panel .release-grid { gap: 24px; }
body.ravok-panel .release-card { margin: 0; }
body.ravok-panel .release-card h3 { color: var(--ravok-text); font-size: 17px; font-weight: 500; }
body.ravok-panel .release-card details, body.ravok-panel .release-upload { color: var(--ravok-muted); border-color: var(--ravok-line); }
body.ravok-panel .release-card small, body.ravok-panel .release-intro { color: var(--ravok-muted); }
body.ravok-panel .app-choice-logo, body.ravok-panel .app-choice-logo img { background: transparent; }
body.ravok-panel .app-picker, body.ravok-panel #app-picker { border-color: var(--ravok-line); border-radius: 18px; background: var(--ravok-raised); }
body.ravok-panel #app-picker[open] { border-color: var(--ravok-accent); }
body.ravok-panel .app-choice:hover { background: var(--ravok-hover); border-color: #d9834a55; }
body.ravok-panel .app-choice-copy b { color: var(--ravok-text); }
body.ravok-panel .app-choice-copy small { color: var(--ravok-muted); }
body.ravok-panel .ravok-list-metrics { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 20px; margin-bottom: 24px; }
body.ravok-panel .ravok-list-metric { position: relative; isolation: isolate; overflow: hidden; min-width: 0; min-height: 133px; padding: 22px; border: 1px solid var(--ravok-card-edge); border-radius: 26px; background: radial-gradient(ellipse at 0 110%,#b9794c20,transparent 70%),var(--ravok-surface); }
body.ravok-panel .ravok-list-metric > small, body.ravok-panel .ravok-list-metric > span:not(.ravok-metric-icon):not(.ravok-metric-watermark) { display: block; position: relative; z-index: 1; max-width: calc(100% - 30px); color: var(--ravok-muted); font-size: 11px; line-height: 17px; }
body.ravok-panel .ravok-list-metric > strong { display: block; margin-top: 14px; color: var(--ravok-text); font-size: 30px; font-weight: 500; line-height: 1.1; letter-spacing: -1px; }
body.ravok-panel .ravok-list-metric::before { content: ''; position: absolute; top: -1px; right: -1px; width: 58px; height: 54px; background: var(--ravok-bg); border-bottom-left-radius: 25px; }
body.ravok-panel .ravok-metric-icon { position: absolute; top: 7px; right: 8px; z-index: 2; display: grid; place-items: center; width: 34px; height: 34px; border: 1px solid var(--ravok-card-edge); border-radius: 50%; background: var(--ravok-surface); color: var(--ravok-accent); }
body.ravok-panel .ravok-metric-icon .panel-icon { width: 16px; height: 16px; }
body.ravok-panel .ravok-metric-watermark { position: absolute; right: 9px; bottom: 4px; z-index: 0; color: var(--ravok-accent); opacity: .065; transform: rotate(-12deg); pointer-events: none; }
body.ravok-panel .ravok-metric-watermark .panel-icon { width: 64px; height: 64px; }
body.ravok-panel .ravok-list-metric.active .ravok-metric-icon { color: var(--ravok-positive); }
body.ravok-panel .ravok-list-metric.expired .ravok-metric-icon { color: var(--ravok-negative); }
body.ravok-panel .ravok-list-metric.blocked .ravok-metric-icon { color: #ada6bd; }
body.ravok-panel .ravok-list-metric .ravok-card-cut { width: 90px; height: 55px; }
body.ravok-panel .ravok-list-metric .ravok-card-tools { top: 5px; right: 6px; }
body.ravok-panel .ravok-list-metric .ravok-card-tools button, body.ravok-panel .ravok-list-metric .ravok-card-tools .icon-button { width: 32px; height: 32px; min-height: 32px; }
body.ravok-panel .ravok-list-filters { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 18px; padding: 22px; margin-bottom: 24px; border: 1px solid var(--ravok-card-edge); border-radius: 20px; background: var(--ravok-surface); }
body.ravok-panel .ravok-list-filters .field { margin: 0; font-size: 13px; }
body.ravok-panel .ravok-list-filters input, body.ravok-panel .ravok-list-filters select { min-height: 40px; height: 40px; padding: 9px 14px; border-radius: 999px; background: var(--ravok-table-head); }
body.ravok-panel .ravok-list-filters .panel-search { min-height: 40px; width: 100%; border-radius: 999px; background: var(--ravok-table-head); }
body.ravok-panel .ravok-command-dialog { width: min(590px,calc(100% - 28px)); max-height: min(80dvh,700px); padding: 25px; }
body.ravok-panel .ravok-command-heading { display: flex; align-items: center; justify-content: space-between; gap: 15px; margin-bottom: 20px; }
body.ravok-panel .ravok-command-heading h2 { margin: 0 35px 0 0; font-size: 20px; }
body.ravok-panel .ravok-command-dialog > .field { margin: 0 0 18px; }
body.ravok-panel .ravok-command-results { display: grid; gap: 5px; max-height: 48dvh; overflow-y: auto; padding: 0 3px 0 0; scrollbar-width: thin; scrollbar-color: var(--ravok-line) transparent; }
body.ravok-panel .ravok-command-results > button { display: flex; align-items: center; gap: 12px; width: 100%; padding: 12px; border: 1px solid transparent; border-radius: 13px; background: transparent; color: var(--ravok-muted); text-align: left; font-size: 13px; }
body.ravok-panel .ravok-command-results > button:hover, body.ravok-panel .ravok-command-results > button:focus-visible { border-color: #d9834a33; background: var(--ravok-accent-soft); color: var(--ravok-text); }
body.ravok-panel .ravok-command-results > button > span { flex: 1; min-width: 0; }
body.ravok-panel .ravok-command-results > button > span small { display: block; margin-top: 3px; font-size: 10px; color: var(--ravok-faint); }
body.ravok-panel .ravok-command-results .panel-icon { width: 18px; height: 18px; }
body.ravok-panel .ravok-command-results > button > .panel-icon:last-child { width: 14px; height: 14px; color: var(--ravok-faint); }
body.ravok-panel .ravok-command-dialog > small { display: block; margin-top: 18px; padding-top: 13px; border-top: 1px solid var(--ravok-line); color: var(--ravok-faint); font-size: 10px; }
body.ravok-panel .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
body.ravok-panel .sidebar-backdrop { display: none; }
body.ravok-panel .mobile-dash-toggle, body.ravok-panel .sidebar-close { display: none; }

/* Compact desktop navigation. */
body.ravok-panel.sidebar-collapsed .dash-sidebar { width: 76px; padding-inline: 10px; }
body.ravok-panel.sidebar-collapsed .dash-content { margin-left: 106px; width: calc(100% - 106px); }
body.ravok-panel.sidebar-collapsed .dash-nav button { width: 52px; height: 44px; padding: 0; gap: 0; justify-content: center; font-size: 0; }
body.ravok-panel.sidebar-collapsed .dash-nav button span, body.ravok-panel.sidebar-collapsed .ravok-nav-section, body.ravok-panel.sidebar-collapsed .dash-user, body.ravok-panel.sidebar-collapsed .nav-group summary { display: none; }
body.ravok-panel.sidebar-collapsed .nav-group > button { width: 52px; margin-left: 0; }
body.ravok-panel.sidebar-collapsed .nav-group:not([open]) > button { display: flex; }

@media (min-width: 1600px) {
  body.ravok-panel .dash-content { padding-left: 36px; padding-right: 36px; }
}
@media (min-width: 901px) and (max-width: 1190px) {
  body.ravok-panel .ravok-overview-grid { gap: 16px; }
  body.ravok-panel .ravok-bento { padding: 20px; border-radius: 28px; }
  body.ravok-panel .ravok-card-title { font-size: 13px; margin-right: 70px; }
  body.ravok-panel .ravok-card-kicker { max-width: calc(100% - 70px); font-size: 10px; }
  body.ravok-panel .ravok-ring-row { flex-wrap: wrap; gap: 12px; }
  body.ravok-panel .ravok-ring-row p { max-width: none; }
  body.ravok-panel .ravok-portfolio { gap: 18px; flex-wrap: wrap; }
  body.ravok-panel .ravok-portfolio > div { flex: 1 1 100%; }
  body.ravok-panel .ravok-portfolio ul { flex: 1 1 100%; }
  body.ravok-panel .ravok-topbar-actions { gap: 6px; }
  body.ravok-panel .ravok-topbar .panel-credit-balance { display: none; }
  body.ravok-panel .ravok-topbar .account-menu > summary > span:not(.account-avatar) { display: none; }
  body.ravok-panel .ravok-topbar .ravok-global-search > span { display: none; }
  body.ravok-panel .ravok-list-metrics { gap: 12px; }
  body.ravok-panel .ravok-list-metric { padding: 18px; }
  body.ravok-panel .ravok-list-filters { grid-template-columns: repeat(3,minmax(0,1fr)); }
  body.ravok-panel .ravok-global-search { max-width: 240px; }
  body.ravok-panel .ravok-orbit { width: 180px; height: 180px; }
}
@media (max-width: 900px) {
  body.ravok-panel .ravok-topbar { inset: 10px 12px auto; height: 60px; padding: 0 13px; gap: 12px; border-radius: 17px; }
  body.ravok-panel .ravok-brand { min-width: 0; font-size: 19px; gap: 8px; }
  body.ravok-panel .ravok-brand-mark { width: 26px; height: 29px; }
  body.ravok-panel .ravok-brand-mark svg { width: 26px; height: 29px; }
  body.ravok-panel .ravok-global-search { max-width: 240px; min-width: 0; margin-left: auto; }
  body.ravok-panel .ravok-global-search kbd { display: none; }
  body.ravok-panel .ravok-topbar-actions { gap: 5px; margin-left: 0; }
  body.ravok-panel #ravok-sidebar-toggle { display: none; }
  body.ravok-panel #mobile-menu { display: inline-flex; }
  body.ravok-panel .ravok-site-link { display: none; }
  body.ravok-panel .ravok-topbar .account-menu > summary > span:not(.account-avatar) { display: none; }
  body.ravok-panel .ravok-topbar .panel-account-strip > span:not(.account-avatar) { display: none; }
  body.ravok-panel .ravok-topbar .panel-credit-balance, body.ravok-panel .ravok-topbar #refresh-panel { display: none; }
  body.ravok-panel .mobile-dash-toggle { display: inline-flex; align-items: center; justify-content: center; flex-shrink: 0; width: 32px; height: 36px; padding: 0; border: 0; border-radius: 10px; background: transparent; color: var(--ravok-text); font-size: 20px; }
  body.ravok-panel .dash-sidebar, body.ravok-panel.sidebar-collapsed .dash-sidebar { inset: 82px auto 12px 12px; width: 240px; max-width: calc(100vw - 44px); height: auto; padding: 20px 12px 14px; transform: translateX(calc(-100% - 24px)); visibility: hidden; transition: transform .2s ease,visibility .2s; box-shadow: 20px 20px 60px #0005; z-index: 80; }
  body.ravok-panel .menu-open .dash-sidebar, body.ravok-panel.sidebar-collapsed .menu-open .dash-sidebar { transform: translateX(0); visibility: visible; }
  body.ravok-panel .sidebar-close { display: inline-grid; place-items: center; width: 28px; height: 28px; border: 0; background: var(--ravok-raised); color: var(--ravok-text); border-radius: 50%; }
  body.ravok-panel .menu-open ~ .sidebar-backdrop { display: block; position: fixed; inset: 76px 0 0; z-index: 75; border: 0; background: #0007; backdrop-filter: blur(3px); }
  body.ravok-panel .dash-content, body.ravok-panel.sidebar-collapsed .dash-content { margin-left: 0; width: 100%; padding: 92px 20px 26px; }
  body.ravok-panel .dash-header { gap: 14px; margin-bottom: 22px; }
  body.ravok-panel .dash-header h1 { font-size: 24px; }
  body.ravok-panel .ravok-page-description { font-size: 13px; }
  body.ravok-panel .ravok-page-tools, body.ravok-panel .dash-actions { margin-top: 25px; gap: 7px; }
  body.ravok-panel .ravok-overview-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px; }
  body.ravok-panel .ravok-bento-main, body.ravok-panel .ravok-bento-activity, body.ravok-panel .ravok-bento-table { grid-column: 1 / -1; }
  body.ravok-panel .ravok-bento-growth, body.ravok-panel .ravok-bento-visitors, body.ravok-panel .ravok-bento-sales, body.ravok-panel .ravok-bento-goal, body.ravok-panel .ravok-bento-conversion, body.ravok-panel .ravok-bento-recent, body.ravok-panel .ravok-bento-health { grid-column: span 1; }
  body.ravok-panel .ravok-bento { border-radius: 28px; }
  body.ravok-panel .ravok-orbit { right: 30px; }
  body.ravok-panel .settings-services, body.ravok-panel .dashboard-grid { grid-template-columns: 1fr; }
  body.ravok-panel .ravok-list-metrics { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 14px; }
  body.ravok-panel .ravok-list-filters { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; }
  body.ravok-panel .list-toolbar { justify-content: flex-start; }
  body.ravok-panel .list-toolbar .panel-search { margin-right: auto; }
  body.ravok-panel .card-head { align-items: flex-start; flex-direction: row; }
  body.ravok-panel .data-card, body.ravok-panel .action-card { padding: 22px; }
  body.ravok-panel .reference-table-scroll { max-height: 65dvh; }
  body.ravok-panel .table-wrap:not(:has(.reference-table-scroll)) { overflow-x: auto; }
  body.ravok-panel #recent-customers .data-table { display: table; min-width: 560px; }
  body.ravok-panel #recent-customers thead { display: table-header-group; }
  body.ravok-panel #recent-customers tbody { display: table-row-group; }
  body.ravok-panel #recent-customers tr { display: table-row; }
  body.ravok-panel #recent-customers td { display: table-cell; }
  body.ravok-panel.sidebar-collapsed .dash-nav button { width: 100%; height: auto; min-height: 42px; padding: 10px 13px; gap: 11px; justify-content: flex-start; font-size: 12px; }
  body.ravok-panel.sidebar-collapsed .dash-nav button span { display: inline; }
  body.ravok-panel.sidebar-collapsed .ravok-nav-section, body.ravok-panel.sidebar-collapsed .dash-user { display: block; }
  body.ravok-panel.sidebar-collapsed .nav-group summary { display: flex; }
  body.ravok-panel.sidebar-collapsed .nav-group > button { width: calc(100% - 21px); margin-left: 21px; min-height: 36px; font-size: 11px; }
  body.ravok-panel.sidebar-collapsed .nav-group:not([open]) > button { display: none; }
}
@media (max-width: 560px) {
  body.ravok-panel .ravok-topbar { left: 10px; right: 10px; padding: 0 10px; gap: 7px; }
  body.ravok-panel .ravok-brand { font-size: 18px; }
  body.ravok-panel .ravok-global-search { flex: 0 0 30px; width: 30px; height: 34px; padding: 0 5px; margin-left: auto; }
  body.ravok-panel .ravok-global-search input { width: 0; opacity: 0; pointer-events: none; }
  body.ravok-panel .ravok-global-search > span, body.ravok-panel .ravok-global-search kbd, body.ravok-panel .ravok-locale > span { display: none; }
  body.ravok-panel .ravok-global-search:focus-within { position: static; width: 30px; height: 34px; padding: 0 5px; background: transparent; }
  body.ravok-panel .ravok-locale { font-size: 12px; }
  body.ravok-panel .ravok-topbar-actions { gap: 2px; }
  body.ravok-panel .ravok-topbar-actions .icon-button { width: 30px; height: 32px; }
  body.ravok-panel .account-avatar { width: 29px; height: 29px; }
  body.ravok-panel .ravok-topbar .account-menu > summary { padding: 5px; }
  body.ravok-panel .ravok-topbar .account-menu > summary::after { margin-left: 2px; }
  body.ravok-panel .dash-content, body.ravok-panel.sidebar-collapsed .dash-content { padding: 90px 14px 22px; }
  body.ravok-panel .dash-header { flex-wrap: wrap; gap: 4px; }
  body.ravok-panel .ravok-breadcrumb { margin-bottom: 10px; }
  body.ravok-panel .dash-header h1 { font-size: 23px; line-height: 31px; }
  body.ravok-panel .ravok-page-description { max-width: 330px; font-size: 12px; line-height: 20px; }
  body.ravok-panel .ravok-page-tools, body.ravok-panel .dash-actions { margin: 13px 0 0; width: 100%; justify-content: flex-start; }
  body.ravok-panel .ravok-overview-grid { grid-template-columns: minmax(0,1fr); gap: 16px; }
  body.ravok-panel .ravok-overview-grid > .ravok-bento { grid-column: 1 / -1; min-height: 248px; padding: 23px; }
  body.ravok-panel .ravok-overview-grid > .ravok-bento-main { min-height: 280px; }
  body.ravok-panel .ravok-overview-grid > .ravok-bento-table { min-height: 0; padding: 20px 0; }
  body.ravok-panel .ravok-bento-table > .ravok-card-title, body.ravok-panel .ravok-bento-table > .ravok-card-kicker { margin-left: 20px; }
  body.ravok-panel .ravok-bento-main .ravok-stat-value { font-size: 52px; }
  body.ravok-panel .ravok-orbit { width: 145px; height: 145px; bottom: 18px; right: 5px; opacity: .8; }
  body.ravok-panel .ravok-mini-stats { gap: 21px; max-width: 200px; }
  body.ravok-panel .ravok-mini-stats strong { font-size: 17px; }
  body.ravok-panel .ravok-ring { margin-top: 10px; }
  body.ravok-panel .ravok-ring-row .ravok-ring, body.ravok-panel .ravok-portfolio .ravok-ring { margin: 0; }
  body.ravok-panel .ravok-ring-row { gap: 18px; }
  body.ravok-panel .ravok-portfolio { gap: 20px; flex-wrap: wrap; }
  body.ravok-panel .ravok-portfolio > div { flex: 1 1 100%; }
  body.ravok-panel .ravok-portfolio ul { flex: 1 1 100%; }
  body.ravok-panel .data-card, body.ravok-panel .action-card, body.ravok-panel .release-card { padding: 20px; border-radius: 22px; margin-bottom: 18px; }
  body.ravok-panel .card-head { flex-wrap: wrap; gap: 12px; }
  body.ravok-panel .card-head .compact-search { flex-basis: 100%; width: 100%; }
  body.ravok-panel .list-toolbar { gap: 7px; }
  body.ravok-panel .ravok-list-metrics { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; margin-bottom: 18px; }
  body.ravok-panel .ravok-list-metric { min-height: 122px; padding: 18px; border-radius: 22px; }
  body.ravok-panel .ravok-list-filters { grid-template-columns: minmax(0,1fr); gap: 14px; padding: 20px; margin-bottom: 18px; }
  body.ravok-panel .list-toolbar .panel-search { flex-basis: 100%; width: 100%; }
  body.ravok-panel .list-toolbar > .mini-button, body.ravok-panel .list-toolbar summary.mini-button { padding: 8px 12px; font-size: 11px; }
  body.ravok-panel .form-grid, body.ravok-panel .plan-card-grid, body.ravok-panel .integration-cards, body.ravok-panel .customer-app-grid { grid-template-columns: minmax(0,1fr); }
  body.ravok-panel .form-grid .full { grid-column: auto; }
  body.ravok-panel .create-user-layout { display: block; }
  body.ravok-panel .create-summary { position: static; margin-top: 18px; }
  body.ravok-panel .table-pagination { gap: 7px; padding: 12px; font-size: 10px; }
  body.ravok-panel .table-pagination > label { width: 100%; flex: auto; }
  body.ravok-panel .table-pagination .pagination-spacer { display: none; }
  body.ravok-panel .table-pagination .mini-button { min-width: 28px; padding: 5px 8px; }
  body.ravok-panel .bulk-toolbar { flex-wrap: wrap; gap: 8px; }
  body.ravok-panel .bulk-toolbar > span { width: 100%; }
  body.ravok-panel .panel-dialog, body.ravok-panel .action-dialog { max-height: calc(100dvh - 32px); width: calc(100% - 24px); max-width: calc(100% - 24px); border-radius: 24px; }
  body.ravok-panel .panel-dialog form, body.ravok-panel .panel-dialog .dialog-content { padding: 25px 20px; }
  body.ravok-panel .ravok-command-dialog { padding: 25px 20px; }
  body.ravok-panel .panel-dialog h2 { font-size: 21px; margin-right: 25px; }
  body.ravok-panel .modal-actions { flex-wrap: wrap; }
  body.ravok-panel .modal-actions .portal-button { min-width: 0; flex: 1; }
  body.ravok-panel .customization-grid { padding: 16px; }
  body.ravok-panel .form-footer { gap: 12px; }
  body.ravok-panel .ravok-footer { font-size: 10px; padding-top: 20px; }
}
@media (prefers-reduced-motion: reduce) {
  body.ravok-panel *, body.ravok-panel *::before, body.ravok-panel *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; transition-duration: .01ms !important; }
}

/* Keep legacy status rows neutral in both palettes. */
body.ravok-panel #dashboard .data-table td { background: var(--ravok-surface); border: 0; border-bottom: 1px solid var(--ravok-line); color: var(--ravok-muted); height: 61px; }
body.ravok-panel #dashboard .data-table th { background: var(--ravok-table-head); color: var(--ravok-muted); }
body.ravok-panel #dashboard .data-table td b { color: var(--ravok-text); }
body.ravok-panel #dashboard .data-table tr:hover td { background: var(--ravok-hover); }
body.ravok-panel #dashboard .data-table { background: var(--ravok-surface); border-spacing: 0; }
body.ravok-panel .panel-dialog .app-account { background: var(--ravok-accent-soft); color: var(--ravok-accent-ink); border-color: var(--ravok-accent); }
body.ravok-panel .panel-dialog .kicker { color: var(--ravok-accent-ink); }
body.ravok-panel .portal-button:disabled { background: var(--ravok-raised); border-color: var(--ravok-line); color: var(--ravok-muted); opacity: .6; }
@media (max-width:900px) {
 body.ravok-panel .sidebar-brand { display:flex !important; align-items:center; justify-content:flex-end; height:30px; margin:0 0 10px; }
 body.ravok-panel .sidebar-brand img { display:none; }
}

/* Reference typography and card rhythm. */
body.ravok-panel .dash-nav button, body.ravok-panel .nav-group summary { font-size:14px; }
body.ravok-panel .nav-group > button { font-size:13px; }
body.ravok-panel .ravok-nav-section { font-size:10px; }
body.ravok-panel .ravok-card-title { font-size:16px; font-weight:700; margin-right:0; }
body.ravok-panel .ravok-stat-value, body.ravok-panel .ravok-ring-number, body.ravok-panel .ravok-ring > strong { font-weight:700; }
body.ravok-panel .ravok-card-kicker { margin-bottom:0; }
body.ravok-panel .ravok-bento { background-size:auto,14px 14px,auto; border:1px solid var(--ravok-card-edge); }
body.ravok-panel .ravok-bento-main { padding:24px 32px; }
body.ravok-panel .ravok-bento-visitors .ravok-bar-chart { height:96px; margin-top:24px; }
body.ravok-panel .reference-table-scroll { background:var(--ravok-surface); }
body.ravok-panel .table-wrap { overflow:hidden; }
@media (min-width:901px) {
 body.ravok-panel .ravok-bento-main,body.ravok-panel .ravok-bento-growth,body.ravok-panel .ravok-bento-visitors { height:280px; }
 body.ravok-panel .ravok-bento-main .ravok-stat-line { margin-top:24px; }
}
@media (max-width:900px) { body.ravok-panel .ravok-card-title { margin-right:70px; } }

body.ravok-panel { --text:var(--ravok-text); --bg:var(--ravok-bg); --panel:var(--ravok-surface); --panel2:var(--ravok-raised); --danger:var(--ravok-negative); }
body.ravok-panel #dashboard .portal-button:not(:disabled), body.ravok-panel #dashboard .mini-button.primary:not(:disabled) { color:#fff; font-weight:600; }
body.ravok-panel #dashboard .field input:not([type=checkbox]):not([type=radio]), body.ravok-panel #dashboard .field select, body.ravok-panel #dashboard .field textarea { color:var(--ravok-text); background:var(--ravok-field); border:1px solid var(--ravok-input-border); box-shadow:none; }
body.ravok-panel #dashboard .field input[type=file] { padding:10px; border-radius:18px; }
body.ravok-panel #view-updates .release-upload input::file-selector-button { border:1px solid var(--ravok-line); border-radius:999px; background:var(--ravok-raised); color:var(--ravok-text); }
body.ravok-panel .integration-meta b { color:var(--ravok-text); }
@media(max-width:560px) { body.ravok-panel .ravok-list-metrics > :last-child:nth-child(odd) { grid-column:1 / -1; min-height:110px; } }

body.panel-workspace.ravok-panel .portal-button:not(:disabled), body.panel-workspace.ravok-panel .mini-button.primary:not(:disabled) { color:#fff; font-weight:600; }
body.panel-workspace.ravok-panel .panel-dialog .field input:not([type=checkbox]):not([type=radio]), body.panel-workspace.ravok-panel .panel-dialog .field select, body.panel-workspace.ravok-panel .panel-dialog .field textarea { background:var(--ravok-field); color:var(--ravok-text); border:1px solid var(--ravok-input-border); border-radius:18px; box-shadow:none; }
body.panel-workspace.ravok-panel .panel-dialog .field input:focus, body.panel-workspace.ravok-panel .panel-dialog .field select:focus, body.panel-workspace.ravok-panel .panel-dialog .field textarea:focus { border-color:var(--ravok-accent); box-shadow:0 0 0 3px var(--ravok-accent-soft); }
body.ravok-panel .ravok-overview-table .table-wrap { border:0; }

body.ravok-panel .ravok-brand.has-custom-logo > svg,body.ravok-panel .ravok-brand.has-custom-logo > span { display:none; }
body.ravok-panel .ravok-brand #ravok-brand-logo { width:auto; max-width:150px; height:36px; }
body.ravok-panel .nav-group > button[data-view=customers] > svg,body.ravok-panel .nav-group > button[data-view=create-user] > svg { display:none; }
body.ravok-panel.sidebar-collapsed .nav-group > button[data-view=customers] > svg,body.ravok-panel.sidebar-collapsed .nav-group > button[data-view=create-user] > svg { display:block; }
@media(max-width:900px) { body.ravok-panel .ravok-brand #ravok-brand-logo { max-width:100px; height:30px; } body.ravok-panel.sidebar-collapsed .nav-group > button[data-view=customers] > svg,body.ravok-panel.sidebar-collapsed .nav-group > button[data-view=create-user] > svg { display:none; } }

/* Floating navigation and controls observed in the reference capture. */
body.ravok-panel .dash-nav button.active { color:var(--ravok-accent-ink); background:linear-gradient(90deg,var(--ravok-accent-soft),transparent); border-color:var(--ravok-line); box-shadow:none; }
body.ravok-panel .dash-nav button.active .panel-icon { color:var(--ravok-accent); }
body.ravok-panel .ravok-global-search { background:var(--ravok-hover); border-radius:999px; height:34px; min-width:180px; }
body.ravok-panel .ravok-global-search > span { flex:1; text-align:left; color:var(--ravok-muted); font-size:13px; }
body.ravok-panel .ravok-bento-main .ravok-stat-line .ravok-stat-value { font-weight:700; }
body.ravok-panel .dash-sidebar { overflow:hidden; }
body.ravok-panel .dash-nav { overflow-y:auto; min-height:0; padding-right:3px; scrollbar-width:thin; scrollbar-color:var(--ravok-line) transparent; }
body.ravok-panel .dash-user { flex-shrink:0; margin-top:12px; padding:12px 8px 0; }
body.ravok-panel .dash-user > div { overflow:hidden; }
body.ravok-panel .dash-user b { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
body.ravok-panel .sidebar-logout { display:inline-flex; align-items:center; gap:7px; margin:8px 0 0; padding:5px 0; white-space:nowrap; }
@media(max-width:560px) { body.ravok-panel .ravok-global-search { min-width:30px; background:transparent; } }

@media(min-width:901px) and (max-width:1599px) { body.ravok-panel .dash-content { padding-left:0; padding-right:16px; } }
body.ravok-panel .ravok-page-description { font-size:16px; line-height:24px; }
body.ravok-panel .ravok-stat-caption { font-size:12px; }
@media(max-width:900px) { body.ravok-panel .ravok-page-description { font-size:13px; line-height:21px; } }

body.ravok-panel .panel-dialog { scrollbar-color:var(--ravok-input-border) var(--ravok-surface); }
body.ravok-panel .panel-dialog h2, body.ravok-panel .panel-dialog h3, body.ravok-panel .panel-dialog .field { color:var(--ravok-text); }
body.ravok-panel .panel-dialog .field small { color:var(--ravok-muted); }
body.ravok-panel .panel-dialog input::placeholder, body.ravok-panel .panel-dialog textarea::placeholder { color:var(--ravok-faint); }
@media(max-width:560px) {
 body.ravok-panel .ravok-bento-main .ravok-orbit { width:95px; height:110px; right:0; bottom:40px; }
 body.ravok-panel .ravok-bento-main .ravok-stat-caption { max-width:180px; }
}

/* Responsive workspace refinement: opaque surfaces, clear hierarchy, touch controls. */
body.ravok-panel::before { content:none; display:none; }
body.ravok-panel { --ravok-shadow:0 8px 28px #00000015; }
body.ravok-panel[data-panel-theme=light] { --ravok-shadow:0 3px 18px #0f172a07; }
body.ravok-panel .ravok-topbar { box-shadow:var(--ravok-shadow); border-color:var(--ravok-line); }
body.ravok-panel .dash-sidebar { backdrop-filter:none; border:1px solid var(--ravok-line); }
body.ravok-panel .ravok-topbar .account-menu > div { z-index:110; }
body.ravok-panel .account-menu button { display:flex; align-items:center; gap:10px; min-height:44px; font-size:13px; }
body.ravok-panel .ravok-card-kicker,body.ravok-panel .ravok-stat-caption { color:var(--ravok-muted); }
body.ravok-panel .ravok-bento { background:radial-gradient(ellipse at 0 100%,#fb83271c,transparent 60%),radial-gradient(circle,var(--ravok-dot) .7px,transparent 1px),var(--ravok-surface); background-size:auto,14px 14px,auto; }
body.ravok-panel .ravok-bar-chart > div > span { background:linear-gradient(0deg,#f66b2638,#ff8a3dd9); }
body.ravok-panel .ravok-bar-chart > div > span.active { background:#ff9d54; }
body.ravok-panel .ravok-main-spark { opacity:1; }
body.ravok-panel .ravok-orbit { filter:saturate(1.3); }
body.ravok-panel .ravok-positive { color:var(--ravok-positive); }
body.ravok-panel .ravok-progress > span { background:linear-gradient(90deg,#fd6927,#ffb45c); }
body.ravok-panel .ravok-list-metric { min-height:112px; border-radius:20px; padding:20px; background:var(--ravok-surface); box-shadow:var(--ravok-shadow); }
body.ravok-panel .ravok-list-metric::before,body.ravok-panel .ravok-metric-watermark { display:none; }
body.ravok-panel .ravok-metric-icon { top:16px; right:16px; border:0; border-radius:12px; background:var(--ravok-accent-soft); color:var(--ravok-accent-ink); }
body.ravok-panel .ravok-list-metric.active .ravok-metric-icon { background:#24d69b18; color:var(--ravok-positive); }
body.ravok-panel .ravok-list-metric.expired .ravok-metric-icon { background:#fb71851a; color:var(--ravok-negative); }
body.ravok-panel .ravok-list-metric > span:not(.ravok-metric-icon):not(.ravok-metric-watermark) { font-size:12px; font-weight:500; max-width:calc(100% - 38px); }
body.ravok-panel .ravok-list-metric > strong { margin-top:12px; font-weight:700; }
body.ravok-panel .ravok-mobile-list,body.ravok-panel .ravok-mobile-options { display:none; }
body.ravok-panel .mini-button.primary,body.ravok-panel .portal-button,body.ravok-panel .period-option.active { background:linear-gradient(120deg,#ff9f51,#ff7a32); border-color:#ff9f5160; }
body.panel-workspace.ravok-panel .portal-button:not(:disabled),body.panel-workspace.ravok-panel .mini-button.primary:not(:disabled),body.ravok-panel #dashboard .portal-button:not(:disabled),body.ravok-panel #dashboard .mini-button.primary:not(:disabled) { color:#172033; font-weight:700; }
body.ravok-panel .dash-nav button.active { background:var(--ravok-accent-soft); color:var(--ravok-accent-ink); border-color:transparent; }
body.ravok-panel[data-panel-theme=light] .ravok-bento,
body.ravok-panel[data-panel-theme=light] .ravok-list-metric,
body.ravok-panel[data-panel-theme=light] .panel-dialog,
body.ravok-panel[data-panel-theme=light] .data-card,
body.ravok-panel[data-panel-theme=light] .action-card { background:#fff; border-color:#e2e8f0; box-shadow:var(--ravok-shadow); }
body.ravok-panel[data-panel-theme=light] .ravok-card-tools .icon-button { background:#fff; border:1px solid #e2e8f0; }
body.ravok-panel[data-panel-theme=light] .reference-status { background:#ecfdf5; border-color:#a7f3d0; color:#067647; }
body.ravok-panel[data-panel-theme=light] .reference-status.expired,
body.ravok-panel[data-panel-theme=light] .reference-status.blocked { background:#fff1f2; border-color:#fecdd3; color:#be254a; }
body.ravok-panel[data-panel-theme=light] .reference-status.expiring { background:#fff7ed; border-color:#fed7aa; color:#a74410; }
body.ravok-panel .panel-dialog .field { font-weight:600; }
body.ravok-panel .panel-dialog::backdrop { background:#03081799; backdrop-filter:blur(3px); }
body.ravok-panel .ravok-drawer-brand { display:flex; align-items:center; gap:10px; color:var(--ravok-text); font-size:24px; font-weight:750; letter-spacing:-.7px; }
body.ravok-panel .ravok-drawer-brand svg { width:30px; height:34px; color:var(--ravok-accent); }
body.ravok-panel .ravok-drawer-brand span { line-height:24px; }
body.ravok-panel .ravok-drawer-brand small { display:block; font-size:8px; line-height:12px; letter-spacing:3px; color:var(--ravok-muted); }

@media(max-width:1100px) {
 body.ravok-panel .ravok-topbar .ravok-site-link,body.ravok-panel .ravok-locale { display:none; }
 body.ravok-panel .ravok-global-search { min-width:150px; }
}
@media(max-width:900px) {
 body.ravok-panel .ravok-topbar { left:12px; right:12px; top:10px; height:64px; padding:0 10px; gap:8px; border-radius:18px; display:grid; grid-template-columns:40px minmax(0,1fr) auto; }
 body.ravok-panel #ravok-sidebar-toggle { display:none; }
 body.ravok-panel #mobile-menu { display:inline-flex; width:40px; height:40px; border:0; border-radius:12px; background:var(--ravok-raised); color:var(--ravok-text); }
 body.ravok-panel .ravok-brand { min-width:0; gap:7px; font-size:21px; letter-spacing:-.7px; }
 body.ravok-panel .ravok-brand-mark { width:25px; height:29px; }
 body.ravok-panel .ravok-brand small { font-size:7px; letter-spacing:2.3px; }
 body.ravok-panel .ravok-topbar-actions { margin:0; gap:4px; min-width:0; }
 body.ravok-panel .ravok-topbar .ravok-site-link,
 body.ravok-panel .ravok-topbar .ravok-locale,
 body.ravok-panel .ravok-topbar #ravok-theme-toggle,
 body.ravok-panel .ravok-topbar-actions > [data-panel-notice],
 body.ravok-panel .ravok-topbar .panel-credit-balance { display:none; }
 body.ravok-panel .ravok-global-search { flex:none; display:grid; place-items:center; min-width:40px; width:40px; height:40px; padding:0; margin:0; background:transparent; border-radius:12px; color:var(--ravok-muted); }
 body.ravok-panel .ravok-global-search > span,body.ravok-panel .ravok-global-search kbd { display:none; }
 body.ravok-panel .ravok-global-search .panel-icon { width:20px; height:20px; }
 body.ravok-panel .ravok-global-search:focus-within { width:40px; height:40px; padding:0; }
 body.ravok-panel .ravok-topbar .account-menu > summary { padding:2px; min-width:40px; min-height:40px; justify-content:center; }
 body.ravok-panel .ravok-topbar .account-menu > summary > svg { display:none; }
 body.ravok-panel .ravok-topbar .account-avatar { width:34px; height:34px; font-size:13px; background:var(--ravok-accent-soft); color:var(--ravok-accent-ink); border:1px solid #ff8a3d50; }
 body.ravok-panel .ravok-topbar .account-menu > div { position:fixed; top:82px; right:12px; width:min(290px,calc(100vw - 24px)); border-radius:20px; padding:8px; box-shadow:0 12px 40px #0003; }
 body.ravok-panel.ravok-menu-open { overflow:hidden; }
 body.ravok-panel #ravok-sidenav,body.ravok-panel.sidebar-collapsed #ravok-sidenav { inset:10px auto 10px 10px; width:min(320px,calc(100vw - 44px)); max-width:calc(100vw - 44px); padding:0; z-index:100; border-radius:24px; background:var(--ravok-surface); border:1px solid var(--ravok-line); box-shadow:0 20px 60px #0005; transform:translateX(calc(-100% - 16px)); transition:transform .16s ease,visibility .16s; }
 body.ravok-panel .menu-open #ravok-sidenav,body.ravok-panel.sidebar-collapsed .menu-open #ravok-sidenav { transform:translateX(0); visibility:visible; }
 body.ravok-panel #ravok-sidenav .sidebar-brand { display:flex !important; align-items:center; justify-content:space-between; flex-shrink:0; height:78px; padding:0 20px; margin:0; border-bottom:1px solid var(--ravok-line); }
 body.ravok-panel #sidebar-close { display:grid; place-items:center; width:36px; height:36px; min-height:36px; padding:0; border:1px solid var(--ravok-line); background:var(--ravok-raised); color:var(--ravok-text); font-size:24px; border-radius:50%; }
 body.ravok-panel #ravok-sidenav .dash-nav { padding:16px 12px; gap:4px; min-height:0; overflow-y:auto; overscroll-behavior:contain; }
 body.ravok-panel #ravok-sidenav .ravok-nav-section { display:block; font-size:10px; font-weight:700; margin:14px 12px 5px; line-height:16px; color:var(--ravok-faint); letter-spacing:1px; }
 body.ravok-panel #ravok-sidenav .ravok-nav-section:first-child { margin-top:0; }
 body.ravok-panel #ravok-sidenav .dash-nav button,body.ravok-panel #ravok-sidenav .nav-group summary { display:flex; align-items:center; min-height:44px; width:100%; height:auto; gap:12px; padding:11px 13px; font-size:14px; line-height:20px; font-weight:550; border-radius:13px; }
 body.ravok-panel #ravok-sidenav .nav-group > button { margin:3px 0 3px 18px; padding-left:16px; width:calc(100% - 18px); font-size:13px; min-height:42px; }
 body.ravok-panel #ravok-sidenav .nav-group > button .panel-icon { display:none; }
 body.ravok-panel #ravok-sidenav .nav-group:not([open]) > button { display:none; }
 body.ravok-panel #ravok-sidenav .nav-group summary::after { font-size:15px; }
 body.ravok-panel #ravok-sidenav .dash-user { display:block; margin:0; padding:16px 20px; border-top:1px solid var(--ravok-line); background:var(--ravok-raised); border-radius:0 0 24px 24px; }
 body.ravok-panel #ravok-sidenav .dash-user b { font-size:13px; color:var(--ravok-text); }
 body.ravok-panel #ravok-sidenav .dash-user small { font-size:11px; }
 body.ravok-panel #ravok-sidenav .sidebar-logout { min-height:36px; margin-top:7px; font-size:12px; color:var(--ravok-muted); }
 body.ravok-panel .menu-open ~ #sidebar-backdrop { display:block; position:fixed; inset:0; z-index:90; background:#02081599; backdrop-filter:blur(2px); }
 body.ravok-panel .ravok-page-description { font-size:14px; line-height:22px; }
 body.ravok-panel .dash-content { padding-top:96px; }
}
@media(max-width:900px) {
 body.ravok-panel .ravok-list-metrics { display:grid; grid-auto-flow:column; grid-auto-columns:clamp(132px,calc((100% - 10px)/2),170px); grid-template-columns:none; gap:10px; overflow-x:auto; padding:2px 1px 12px; margin:0 0 14px; scroll-snap-type:x proximity; scrollbar-width:none; }
 body.ravok-panel .ravok-list-metrics > .ravok-list-metric,body.ravok-panel .ravok-list-metrics > :last-child:nth-child(odd) { grid-column:auto; min-height:105px; height:105px; border-radius:18px; padding:15px; scroll-snap-align:start; }
 body.ravok-panel .ravok-list-metric > span:not(.ravok-metric-icon):not(.ravok-metric-watermark) { max-width:calc(100% - 22px); font-size:11px; line-height:16px; }
 body.ravok-panel .ravok-metric-icon { width:26px; height:26px; top:12px; right:12px; border-radius:9px; }
 body.ravok-panel .ravok-metric-icon .panel-icon { width:14px; height:14px; }
 body.ravok-panel .ravok-list-metric > strong { margin-top:12px; font-size:27px; }
 body.ravok-panel #view-customers .list-toolbar,body.ravok-panel #view-tests .list-toolbar { display:grid; grid-template-columns:auto 1fr auto; gap:8px; margin-bottom:18px; }
 body.ravok-panel #view-customers .panel-search,body.ravok-panel #view-tests .panel-search { grid-column:1/-1; width:100%; min-height:46px; height:46px; border-radius:14px; background:var(--ravok-field); }
 body.ravok-panel #view-customers .list-toolbar > [data-export-list],body.ravok-panel #view-customers .list-toolbar > [data-view=trash],body.ravok-panel #view-customers .column-menu { display:none; }
 body.ravok-panel #view-customers .list-toolbar > .primary { justify-self:end; width:100%; }
 body.ravok-panel #view-customers .list-toolbar .mini-button { min-height:42px; padding:10px 12px; font-size:12px; }
 body.ravok-panel .ravok-mobile-options { display:block; position:relative; }
 body.ravok-panel .ravok-mobile-options summary { list-style:none; cursor:pointer; }
 body.ravok-panel .ravok-mobile-options summary::-webkit-details-marker { display:none; }
 body.ravok-panel .ravok-mobile-options > div { position:absolute; top:50px; right:0; z-index:30; width:220px; background:var(--ravok-surface); border:1px solid var(--ravok-line); border-radius:18px; padding:8px; box-shadow:0 15px 40px #0003; }
 body.ravok-panel .ravok-mobile-options > div .mini-button { width:100%; background:transparent; border:0; justify-content:flex-start; }
 body.ravok-panel .customer-filters { left:0; right:auto; width:210px; }
 body.ravok-panel #customers-table,body.ravok-panel #tests-table { border:0; border-radius:0; background:transparent; overflow:visible; }
 body.ravok-panel #customers-table .ravok-desktop-list,body.ravok-panel #tests-table .ravok-desktop-list { display:none; }
 body.ravok-panel .ravok-mobile-list { display:grid; gap:14px; }
 body.ravok-panel .ravok-customer-card { min-width:0; padding:18px; border:1px solid var(--ravok-line); border-radius:20px; background:var(--ravok-surface); box-shadow:var(--ravok-shadow); }
 body.ravok-panel .ravok-customer-card > header { display:flex; align-items:center; gap:10px; padding:0; margin:0 0 15px; }
 body.ravok-panel .ravok-customer-avatar { display:grid; place-items:center; flex-shrink:0; width:40px; height:40px; border-radius:13px; color:var(--ravok-accent-ink); background:var(--ravok-accent-soft); font-size:13px; font-weight:750; }
 body.ravok-panel .ravok-customer-card > header > div { min-width:0; flex:1; }
 body.ravok-panel .ravok-customer-card h2 { margin:0 0 1px; font-size:16px; font-weight:750; line-height:23px; letter-spacing:-.3px; overflow-wrap:anywhere; }
 body.ravok-panel .ravok-customer-card header small { font-size:11px; color:var(--ravok-faint); }
 body.ravok-panel .ravok-customer-card .reference-status { font-size:10px; padding:4px 7px; flex-shrink:0; }
 body.ravok-panel .ravok-customer-plan { display:flex; align-items:center; gap:8px; padding:10px 12px; border-radius:12px; background:var(--ravok-raised); color:var(--ravok-muted); font-size:12px; font-weight:550; line-height:18px; }
 body.ravok-panel .ravok-customer-plan .panel-icon { color:var(--ravok-accent); width:16px; height:16px; }
 body.ravok-panel .ravok-customer-facts { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin:15px 0 10px; }
 body.ravok-panel .ravok-customer-card dt { font-size:11px; color:var(--ravok-muted); margin:0 0 4px; }
 body.ravok-panel .ravok-customer-card dd { margin:0; color:var(--ravok-text); font-size:12px; line-height:19px; font-weight:650; overflow-wrap:anywhere; }
 body.ravok-panel .ravok-customer-details > summary { display:flex; justify-content:space-between; align-items:center; min-height:38px; list-style:none; font-size:12px; font-weight:550; color:var(--ravok-muted); cursor:pointer; }
 body.ravok-panel .ravok-customer-details > summary::-webkit-details-marker { display:none; }
 body.ravok-panel .ravok-customer-details[open] > summary span { transform:rotate(180deg); }
 body.ravok-panel .ravok-customer-details > div { padding:12px 0; }
 body.ravok-panel .ravok-customer-details dl { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin:0 0 12px; }
 body.ravok-panel .ravok-customer-details p { font-size:12px; line-height:20px; margin:0 0 12px; overflow-wrap:anywhere; }
 body.ravok-panel .ravok-customer-details .mini-button { min-height:38px; padding:8px 10px; font-size:11px; margin:0 5px 4px 0; }
 body.ravok-panel .ravok-customer-select { display:flex; align-items:center; gap:8px; margin:8px 0 12px; font-size:12px; }
 body.ravok-panel .ravok-customer-card > footer { display:flex; align-items:center; gap:8px; padding:14px 0 0; border-top:1px solid var(--ravok-line); }
 body.ravok-panel .ravok-customer-card > footer > .mini-button { flex:1; min-width:0; padding:9px; min-height:42px; font-size:11px; }
 body.ravok-panel .ravok-customer-card .row-menu > summary { width:40px; height:42px; border-radius:12px; background:var(--ravok-raised); border:1px solid var(--ravok-line); }
 body.ravok-panel .row-menu[open] > div { inset:auto 12px 12px; width:calc(100vw - 24px); max-height:70dvh; border-radius:22px; padding:10px; background:var(--ravok-surface); box-shadow:0 0 0 100vmax #02081588,0 15px 60px #0004; z-index:120; overscroll-behavior:contain; }
 body.ravok-panel .row-menu > div .mini-button { min-height:42px; padding:10px 12px; font-size:13px; }
 body.ravok-panel .table-pagination { padding:14px 0; border-top:0; gap:8px; }
 body.ravok-panel .table-pagination > label { width:auto; flex:1; }
 body.ravok-panel .table-pagination select { min-height:38px; }
 body.ravok-panel .table-pagination .mini-button { min-height:38px; padding:8px 10px; font-size:11px; }
 body.ravok-panel .dash-header { margin-bottom:20px; }
 body.ravok-panel .dash-header h1 { font-size:25px; line-height:32px; font-weight:750; }
 body.ravok-panel .ravok-page-description { font-size:13px; line-height:21px; }
}
@media(max-width:360px) {
 body.ravok-panel .ravok-topbar { left:8px; right:8px; padding:0 8px; grid-template-columns:36px minmax(0,1fr) auto; gap:6px; }
 body.ravok-panel #mobile-menu { width:36px; }
 body.ravok-panel .ravok-brand { font-size:19px; gap:5px; }
 body.ravok-panel .ravok-brand-mark { width:22px; }
 body.ravok-panel .ravok-topbar-actions { gap:1px; }
 body.ravok-panel .ravok-global-search { min-width:36px; width:36px; }
 body.ravok-panel .ravok-customer-card { padding:15px; }
}
@media(max-width:900px) {
 body.ravok-panel #view-customers .list-toolbar { grid-template-columns:82px minmax(0,1fr) 44px; min-width:0; }
 body.ravok-panel #view-customers .list-toolbar > *,body.ravok-panel #view-tests .list-toolbar > * { min-width:0; }
 body.ravok-panel .ravok-mobile-options > summary { width:44px; min-width:44px; padding:10px 0 !important; font-size:0 !important; gap:0; }
 body.ravok-panel .ravok-mobile-options > summary .panel-icon { width:19px; height:19px; }
 body.ravok-panel #view-customers .list-toolbar > .primary { font-size:12px; padding:10px 9px; }
}
body.ravok-panel { min-width:0; width:100%; }
body.ravok-panel #view-customers #customers-table { background:var(--ravok-surface); border:1px solid var(--ravok-line); border-radius:20px; }
@media(max-width:900px) {
 body.ravok-panel #view-customers #customers-table { background:transparent; border:0; border-radius:0; }
 body.ravok-panel #view-customers .panel-search { min-width:0; }
}

body.ravok-panel .ravok-actions-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:8px 10px 12px; border-bottom:1px solid var(--ravok-line); margin-bottom:6px; }
body.ravok-panel .ravok-actions-heading strong { color:var(--ravok-text); font-size:13px; font-weight:700; }
body.ravok-panel .ravok-actions-heading button { display:grid; place-items:center; width:32px; height:32px; padding:0; border-radius:50%; border:1px solid var(--ravok-line); background:var(--ravok-raised); color:var(--ravok-text); font-size:22px; }
body.ravok-panel:has(.row-menu[open]) { overflow:hidden; }

body.ravok-panel .ravok-list-metric.new .ravok-metric-icon { color:#6aaaff; background:#478eff1c; }
body.ravok-panel .ravok-list-metric.blocked .ravok-metric-icon { color:#b999ff; background:#a178ff1c; }
body.ravok-panel[data-panel-theme=light] .ravok-list-metric.new .ravok-metric-icon { color:#2563eb; background:#eff6ff; }
body.ravok-panel[data-panel-theme=light] .ravok-list-metric.blocked .ravok-metric-icon { color:#7c3aed; background:#f5f3ff; }
@media(min-width:650px) and (max-width:900px) { body.ravok-panel .ravok-mobile-list { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:900px) { body.ravok-panel .ravok-topbar .account-menu > div { max-height:calc(100dvh - 96px); overflow-y:auto; overscroll-behavior:contain; } }

body.ravok-panel:has(dialog[open]) { overflow:hidden; }
body.ravok-panel .panel-dialog { scrollbar-width:thin; }
@media(max-width:900px) and (max-height:500px) {
 body.ravok-panel #ravok-sidenav .sidebar-brand { height:62px; }
 body.ravok-panel #ravok-sidenav .dash-user { padding:8px 16px; }
 body.ravok-panel #ravok-sidenav .dash-user > div { display:none; }
 body.ravok-panel #ravok-sidenav .sidebar-logout { margin:0; }
}

/* Solid contrast for the white workspace. */
body.ravok-panel[data-panel-theme="light"] { --ravok-muted:#334155;--ravok-faint:#475569;--ravok-accent:#ea580c;--ravok-accent-ink:#9a3412;--ravok-input-border:#94a3b8;--ravok-line:#d9e0e9; }
body.ravok-panel[data-panel-theme="light"] .ravok-topbar { border-color:#e2e8f0; box-shadow:0 4px 18px #0f172a08; }
body.panel-workspace.ravok-panel[data-panel-theme="light"] .mini-button.primary:not(:disabled),body.panel-workspace.ravok-panel[data-panel-theme="light"] .portal-button:not(:disabled),body.ravok-panel[data-panel-theme="light"] .period-option.active { background:#c2410c;border-color:#c2410c;color:#fff;font-weight:700; }
body.ravok-panel[data-panel-theme="light"] .dash-nav button.active {background:#fff1e6;color:#9a3412;border-color:#fdba74;font-weight:750;}
body.ravok-panel[data-panel-theme="light"] .status-pill:not(.off):not(.pending) {background:#dcfce7;color:#166534;border:1px solid #86efac;font-weight:700;}
body.ravok-panel[data-panel-theme="light"] .source-summary-card:nth-child(1) strong {color:#c2410c;}body.ravok-panel[data-panel-theme="light"] .source-summary-card:nth-child(2) strong {color:#1d4ed8;}body.ravok-panel[data-panel-theme="light"] .source-summary-card:nth-child(3) strong {color:#047857;}

body.ravok-panel[data-panel-theme="light"] #dashboard .mini-button.primary:not(:disabled),body.ravok-panel[data-panel-theme="light"] #dashboard .portal-button:not(:disabled){background:#c2410c;color:#fff;border-color:#c2410c;}

body.ravok-panel .customer-owner-field{max-width:400px;margin:0 0 20px;}