/* KBD V4–V7 presentation layer. Scoped to VRI shells, never consumer brands.
   Loaded after legacy page styles; contracts, IDs and control behavior stay intact. */
body[data-vri-shell]:not([data-vri-shell=""]) {
  --font-sans: 'Satoshi', 'Inter', system-ui, sans-serif;
  --font-heading: var(--font-sans);
  --brand-bg: #f8fafc;
  --brand-surface: #fff;
  --brand-section-bg: #eef2f6;
  --brand-background: #fff;
  --brand-background-light: #f8fafc;
  --brand-border: #dce3ec;
  --brand-text-primary: #1e293b;
  --brand-text-secondary: #526277;
  --text-primary: #1e293b;
  --text-secondary: #526277;
  --text-muted: #526277;
  --brand-primary: #167c91;
  --brand-primary-hover: #106477;
  --brand-accent: #0c2962;
  --vri-action: #f7a619;
  --vri-action-hover: #e89a10;
  --vri-on-action: #172334;
  --vri-brand: #0c2962;
  --dashboard-bg: var(--brand-bg);
  --dashboard-bg-card: var(--brand-surface);
  --dashboard-bg-elevated: var(--brand-surface);
  --dashboard-border: var(--brand-border);
  --dashboard-text-primary: var(--text-primary);
  --dashboard-text-secondary: var(--text-secondary);
  --dashboard-text-muted: var(--text-muted);
  --sidebar-bg: var(--brand-surface);
  --sidebar-text: var(--text-primary);
  --sidebar-item-active-bg: var(--brand-section-bg);
  --sidebar-item-hover-bg: var(--brand-bg);
  --sidebar-border: var(--brand-border);
  background: var(--brand-bg);
  color: var(--text-primary);
  font-family: var(--font-sans);
  line-height: 1.5;
}
[data-theme="dark"] body[data-vri-shell]:not([data-vri-shell=""]) {
  --brand-bg: #0b1423;
  --brand-surface: #142033;
  --brand-section-bg: #1c2c42;
  --brand-background: #142033;
  --brand-background-light: #0b1423;
  --brand-border: #33465f;
  --brand-text-primary: #f1f5f9;
  --brand-text-secondary: #b7c6d9;
  --text-primary: #f1f5f9;
  --text-secondary: #b7c6d9;
  --text-muted: #a9b9cf;
  --brand-primary: #67cfdf;
  --brand-primary-hover: #92e0ea;
  --brand-accent: #a9c9ff;
  --vri-brand: #c1d8ff;
}
body[data-vri-shell]:not([data-vri-shell=""]) :focus-visible {
  outline: 3px solid var(--brand-primary);
  outline-offset: 3px;
}
body[data-vri-shell]:not([data-vri-shell=""]) :is(input, select, textarea) {
  color: var(--text-primary);
  background-color: var(--brand-surface);
  border-color: var(--brand-border);
}
body[data-vri-shell]:not([data-vri-shell=""]) :is(button, .btn, .button, input:not([type="checkbox"]):not([type="radio"]), select) { min-height: 44px; }
body[data-vri-shell]:not([data-vri-shell=""]) :is(h1, h2, h3, h4) { color: var(--text-primary); letter-spacing: -.025em; }
body[data-vri-shell]:not([data-vri-shell=""]) :is(.btn-primary, .btn--primary, .button--primary, .public-nav__auth-btn, .hero-button-primary-v2, .vri-primary) {
  background: var(--vri-action);
  border-color: var(--vri-action);
  color: var(--vri-on-action);
  box-shadow: none;
}
body[data-vri-shell]:not([data-vri-shell=""]) :is(.btn-primary, .btn--primary, .button--primary, .public-nav__auth-btn, .hero-button-primary-v2, .vri-primary):hover { background: var(--vri-action-hover); color: var(--vri-on-action); }
body[data-vri-shell]:not([data-vri-shell=""]) :is(.card, .panel, .stat-card, .stats-card, .dashboard-card) {
  background: var(--brand-surface); border-color: var(--brand-border); border-radius: 14px; box-shadow: none;
}
body[data-vri-shell="public"] .public-nav { background: var(--brand-surface); border-bottom: 1px solid var(--brand-border); box-shadow: none; }
body[data-vri-shell="public"] .public-nav__container { max-width: 1440px; padding: 18px 32px; }
body[data-vri-shell="public"] :is(.public-nav__logo-link, .public-nav__logo-text, .public-nav__logo-icon) { color: var(--vri-brand); }
body[data-vri-shell="public"] :is(.public-nav__link, .public-nav__auth-link, .public-nav__dropdown-link) { color: var(--text-primary); }
body[data-vri-shell="public"] .public-nav__dropdown { background: var(--brand-surface); border: 1px solid var(--brand-border); }
body[data-vri-shell="public"] .main-footer { background: var(--brand-section-bg); color: var(--text-secondary); border-top: 1px solid var(--brand-border); }
body[data-vri-shell="public"] .main-footer :is(h4, h5, a) { color: var(--text-primary); }
body[data-vri-shell="public"] :is(.apiOverview, .api-docs-container) { max-width: 1280px; padding: 48px 32px; }
body[data-vri-shell="public"] .apiHero { text-align: left; background: transparent; border: 0; padding: 0; margin: 0 0 32px; }
body[data-vri-shell="public"] .apiHero h1 { font-size: clamp(2rem, 3vw, 2.75rem); margin-bottom: 16px; }
body[data-vri-shell="public"] .apiHero p { max-width: none; margin: 0; font-size: 17px; color: var(--text-secondary); }
body[data-vri-shell="public"] .dev-tools-hero { background: var(--brand-section-bg); border: 0; padding: 24px; border-radius: 12px; box-shadow: none; }
body[data-vri-shell="public"] :is(.dev-tools-card, .quickStartStep, .apiCard) { background: var(--brand-surface); border: 1px solid var(--brand-border); box-shadow: none; border-radius: 12px; color: var(--text-primary); }
body[data-vri-shell="public"] :is(.dev-tools-card__name, .dev-tools-hero__title) { color: var(--text-primary); }
body[data-vri-shell="public"] .dev-tools-card__description { color: var(--text-secondary); }
body[data-vri-shell="public"] .quickStart { text-align: left; background: transparent; border: 0; padding: 0; margin: 40px 0; }
body[data-vri-shell="public"] .quickStart h2 { font-size: 24px; }
body[data-vri-shell="public"] .quickStart > p { margin-left: 0; font-size: 16px; }
body[data-vri-shell="public"] .quickStartGrid { gap: 20px; }
body[data-vri-shell="public"] .api-header { background: transparent; padding: 0 0 24px; border: 0; text-align: left; }
body[data-vri-shell="public"] .api-title { font-size: clamp(1.8rem, 3vw, 2.6rem); line-height: 1.2; }
body[data-vri-shell="public"] .api-sidebar { background: var(--brand-surface); border: 1px solid var(--brand-border); border-radius: 12px; }
body[data-vri-shell="public"] .api-section { background: var(--brand-surface); border: 1px solid var(--brand-border); border-radius: 14px; padding: 28px; margin-bottom: 24px; scroll-margin-top: 100px; }
body[data-vri-shell="public"] :is(.api-main-content, .api-docs) { min-width: 0; }
body[data-vri-shell="public"] .api-section :is(pre, .endpoint-box) { background: var(--brand-section-bg); color: var(--text-primary); border: 1px solid var(--brand-border); border-radius: 8px; }
body[data-vri-shell="public"] pre { max-width: 100%; overflow-x: auto; }
body[data-vri-shell="public"] .api-section table { width: 100%; }
body[data-vri-shell="public"] .api-section th { background: var(--brand-section-bg); color: var(--text-primary); }
body[data-vri-shell="public"] .api-section :is(th, td) { border-color: var(--brand-border); }
body[data-vri-shell="workspace"] .dashboard-sidebar,
body[data-vri-shell="admin"] .dashboard-sidebar { background: var(--brand-surface); color: var(--text-primary); border-right: 1px solid var(--brand-border); }
body[data-vri-shell="workspace"] .dashboard-sidebar :is(a, button, .dashboard-sidebar__section-title),
body[data-vri-shell="admin"] .dashboard-sidebar :is(a, button, .dashboard-sidebar__section-title) { color: var(--text-secondary); }
body[data-vri-shell="workspace"] .dashboard-sidebar__link.active,
body[data-vri-shell="admin"] .dashboard-sidebar__link.active { background: var(--brand-section-bg); color: var(--brand-primary); border-radius: 8px; }
body[data-vri-shell="workspace"] .dashboard-sidebar__link:hover,
body[data-vri-shell="admin"] .dashboard-sidebar__link:hover { background: var(--brand-bg); color: var(--text-primary); }
body[data-vri-shell="workspace"] .dashboard-sidebar__logo-icon .logo-lines,
body[data-vri-shell="admin"] .dashboard-sidebar__logo-icon .logo-lines { stroke: var(--vri-brand); }
body[data-vri-shell="workspace"] .dashboard-sidebar__logo-icon .logo-nodes,
body[data-vri-shell="admin"] .dashboard-sidebar__logo-icon .logo-nodes { fill: var(--vri-brand); }
body[data-vri-shell="workspace"] .dashboard-content-area,
body[data-vri-shell="admin"] .dashboard-content-area { background: var(--brand-bg); }
.vri-eyebrow { color: var(--brand-primary); font-size: 12px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.vri-section { padding: 64px 32px; }
.vri-container { max-width: 1280px; margin: 0 auto; }
.vri-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: start; }
.vri-primary, .vri-secondary { display: inline-flex; min-height: 48px; align-items: center; justify-content: center; padding: 12px 24px; border: 1px solid var(--brand-border); border-radius: 7px; font-weight: 600; text-decoration: none; }
.vri-secondary { background: var(--brand-surface); color: var(--text-primary); }
.vri-actions { display: flex; gap: 12px; flex-wrap: wrap; margin: 24px 0 18px; }
.vri-hero h1 { font-size: clamp(36px, 4.1vw, 60px); line-height: 1.1; margin: 24px 0; max-width: 620px; }
.vri-hero p { color: var(--text-secondary); max-width: 560px; }
.vri-hero .vri-lead { font-size: 19px; margin-bottom: 20px; }
.vri-hero small { display: block; color: var(--text-secondary); line-height: 1.7; }
.vri-human-photo { width: 100%; height: auto; aspect-ratio: 1.85; object-fit: cover; border-radius: 14px; }
.vri-example { border: 1px solid var(--brand-border); border-radius: 12px; background: var(--brand-surface); padding: 24px; }
.vri-example h2 { font-size: 22px; margin: 12px 0; }
.vri-example dl { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; padding: 12px 0 20px; }
.vri-example dt { color: var(--brand-primary); font-size: 11px; text-transform: uppercase; font-weight: 700; }
.vri-example dd { margin: 6px 0 0; font-weight: 600; }
.vri-example small { border-top: 1px solid var(--brand-border); padding-top: 12px; }
.vri-capabilities { background: var(--brand-section-bg); padding: 24px 32px; }
.vri-capabilities .vri-container { display: flex; justify-content: space-between; gap: 24px; flex-wrap: wrap; }
@media (max-width: 767px) {
  .vri-section { padding: 40px 22px; }
  .vri-grid { grid-template-columns: 1fr; gap: 28px; }
  .vri-hero h1 { font-size: 38px; }
  .vri-hero .vri-lead { font-size: 17px; }
  .vri-example { padding: 20px; }
  body[data-vri-shell="public"] :is(.apiOverview, .api-docs-container) { padding: 28px 18px; }
  body[data-vri-shell="public"] .api-section { padding: 20px; }
  body[data-vri-shell="public"] .public-nav__container { padding: 14px 20px; }
  body[data-vri-shell="public"] .quickStartGrid { grid-template-columns: 1fr; }
}
@media (prefers-reduced-motion: reduce) {
  body[data-vri-shell]:not([data-vri-shell=""]) * { scroll-behavior: auto; }
}

/* Shared page families retain their complete forms, tables and controls. */
body[data-vri-shell="public"] :is(.quickStartCard, .auth-form, .feature-card, .product-card, .contact-card, .pricing-card, .faq-item) {
  background: var(--brand-surface); border: 1px solid var(--brand-border); border-radius: 12px; box-shadow: none;
}
body[data-vri-shell="public"] .quickStartCard { padding: 24px; text-align: left; }
body[data-vri-shell="public"] :is(.ctaButton, .auth-submit) {
  background: var(--vri-action); color: var(--vri-on-action); border-color: var(--vri-action); box-shadow: none;
}
body[data-vri-shell="public"] .auth-page { background: var(--brand-bg); padding: 56px 24px; }
body[data-vri-shell="public"] .auth-container { max-width: 720px; }
body[data-vri-shell="public"] .auth-header { text-align: left; }
body[data-vri-shell="public"] .auth-title { font-size: clamp(30px, 4vw, 42px); line-height: 1.18; }
body[data-vri-shell="public"] .auth-subtitle { color: var(--text-secondary); }
body[data-vri-shell="public"] .api-console-widget { background: var(--brand-surface); border: 1px solid var(--brand-border); border-radius: 12px; box-shadow: none; }
body[data-vri-shell="public"] .api-console-header { background: var(--brand-section-bg); color: var(--text-primary); border-bottom: 1px solid var(--brand-border); }
body[data-vri-shell="public"] .api-console-security-note { color: var(--text-secondary); }
body[data-vri-shell="public"] .action-btn.primary { background: var(--vri-action); color: var(--vri-on-action); border-color: var(--vri-action); }
body[data-vri-shell="public"] .action-btn:disabled { opacity: .55; cursor: not-allowed; }
body[data-vri-shell="public"] .api-section pre { white-space: pre; }
body[data-vri-shell="public"] .api-section .table-responsive { overflow-x: auto; }
body[data-vri-shell="workspace"] :is(.modern-card, .modern-card-compact, .stat-card-modern, .analytics-card, .chart-card, .analytics-date-filter, .analytics-tabs, .lookup-card, .billing-card, .settings-card),
body[data-vri-shell="admin"] :is(.modern-card, .modern-card-compact, .stat-card-modern) {
  background: var(--brand-surface); border: 1px solid var(--brand-border); border-radius: 12px; box-shadow: none; color: var(--text-primary);
}
body[data-vri-shell="workspace"] :is(.btn-modern--primary, .lookup-submit-btn) { background: var(--vri-action); color: var(--vri-on-action); border-color: var(--vri-action); }
body[data-vri-shell="workspace"] :is(.modern-card-header, .modern-card-compact-header) { background: transparent; border-color: var(--brand-border); }
body[data-vri-shell="workspace"] :is(.analytics-title, .page-title) { font-size: clamp(28px, 3vw, 38px); }
body[data-vri-shell="workspace"] :is(th, .table-header) { background: var(--brand-section-bg); color: var(--text-secondary); }
body[data-vri-shell="workspace"] :is(td, th) { border-color: var(--brand-border); }
body[data-vri-shell="workspace"] :is(.filter-preset--active, .tab-btn--active) { color: var(--brand-primary); background: var(--brand-section-bg); border-color: var(--brand-primary); }
.vri-workspace-intro { margin: 0 0 28px; }
.vri-workspace-intro h1 { font-size: clamp(28px, 3vw, 38px); margin: 10px 0; }
.vri-task-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin-top: 24px; }
.vri-task { display: block; padding: 20px; border: 1px solid var(--brand-border); border-radius: 12px; background: var(--brand-surface); text-decoration: none; color: var(--text-primary); }
.vri-task strong { display: block; margin-bottom: 6px; }
.vri-task span { color: var(--text-secondary); }
@media(max-width:767px) {
  .vri-task-grid { grid-template-columns: 1fr; }
  body[data-vri-shell="public"] .auth-page { padding: 32px 18px; }
  body[data-vri-shell="public"] .dev-tools-grid { grid-template-columns: 1fr; }
  body[data-vri-shell="public"] .api-key-input-wrapper { flex-wrap: wrap; }
  body[data-vri-shell="public"] #api-key-input { min-width: 0; flex: 1 1 180px; }
}

body[data-vri-shell="public"] .api-sidebar { align-self: start; position: sticky; top: 92px; max-height: calc(100vh - 110px); overflow-y: auto; }
body[data-vri-shell="public"] .api-nav { border: 0; box-shadow: none; background: transparent; }
body[data-vri-shell="public"] .api-console-widget { margin: 0 0 28px; }
body[data-vri-shell="public"] .api-console-header { padding: 16px; border-radius: 8px; }
body[data-vri-shell="public"] .api-console-security-note { background: transparent; padding: 8px 0 0; }
body[data-vri-shell="public"] :is(.about-hero, .featuresHero, .pricing-header, .contactHeader) { background: transparent; color: var(--text-primary); text-align: left; border: 0; box-shadow: none; }
body[data-vri-shell="public"] :is(.about-page, .contactContainer, .pricing-page) { max-width: 1280px; margin: auto; padding: 48px 32px; }
body[data-vri-shell="public"] :is(.about-section, .philosophy-item, .featureCard, .contactInfo, .contactForm, .plan-card, .enterprise-content) { background: var(--brand-surface); border: 1px solid var(--brand-border); border-radius: 12px; padding: 28px; box-shadow: none; }
body[data-vri-shell="public"] :is(.about-section, .featuresHero, .contactHeader, .pricing-header) { margin-bottom: 28px; }
body[data-vri-shell="public"] :is(.plan-button.primary, .cta-button--primary, .submitButton) { background: var(--vri-action); color: var(--vri-on-action); border-color: var(--vri-action); }
body[data-vri-shell="public"] :is(.benefits-section-v2, .pricing-comparison-section-v2, .api-playground-section, .authoritative-content-section, .resources-section-v2, .faq-section-v2) { background: var(--brand-bg); padding: 48px 32px; }
body[data-vri-shell="public"] :is(.benefit-item-v2, .resource-card-v2, .faq-item-v2) { background: var(--brand-surface); border: 1px solid var(--brand-border); border-radius: 12px; box-shadow: none; }
body[data-vri-shell="public"] .section-header { text-align: left; margin-bottom: 28px; }
body[data-vri-shell="public"] .section-title-v2 { font-size: clamp(26px, 3vw, 38px); text-align: left; }
body[data-vri-shell="public"] .section-subtitle-v2 { color: var(--text-secondary); margin-left: 0; text-align: left; }
body[data-vri-shell="public"] .cta-section-v2 { background: var(--brand-section-bg); color: var(--text-primary); padding: 48px 32px; }
body[data-vri-shell="public"] :is(.cta-title-v2, .cta-description-v2) { color: var(--text-primary); }
@media(max-width:767px) {
 body[data-vri-shell="public"] .api-sidebar { position: static; max-height: none; }
 body[data-vri-shell="public"] :is(.about-page, .contactContainer, .pricing-page) { padding: 32px 18px; }
}
body[data-vri-shell="public"] .parameter-table { max-width: 100%; overflow-x: auto; }
body[data-vri-shell="public"] .endpoint-url { overflow-wrap: anywhere; min-width: 0; }
@media(max-width:1024px) {
 body[data-vri-shell="public"] .api-sidebar { position: static; max-height: none; }
 body[data-vri-shell="public"] .api-nav { max-height: none; margin-bottom: 0; padding: 16px; }
 body[data-vri-shell="public"] .api-nav ul { display: grid; grid-template-columns: 1fr 1fr; gap: 2px; }
 body[data-vri-shell="public"] .api-nav a { padding: 10px 8px; }
}
body[data-vri-shell="workspace"] :is(.dashboard-sidebar__footer, .dashboard-sidebar__balance, .dashboard-sidebar__user),
body[data-vri-shell="admin"] :is(.dashboard-sidebar__footer, .dashboard-sidebar__balance, .dashboard-sidebar__user) { background: var(--brand-surface); border-color: var(--brand-border); box-shadow: none; }
body[data-vri-shell="workspace"] :is(.dashboard-sidebar__balance-amount, .dashboard-sidebar__user-name),
body[data-vri-shell="admin"] :is(.dashboard-sidebar__balance-amount, .dashboard-sidebar__user-name) { color: var(--text-primary); }
body[data-vri-shell="workspace"] .dashboard-sidebar__user-email,
body[data-vri-shell="admin"] .dashboard-sidebar__user-email { color: var(--text-secondary); }
body[data-vri-shell="workspace"] .modern-card-elevated { background: var(--brand-surface); border: 1px solid var(--brand-border); border-radius: 12px; box-shadow: none; }
body[data-vri-shell="workspace"] .card-header-accent { background: transparent; border-color: var(--brand-border); }
body[data-vri-shell="public"] :is(.content-main, .sidebar-cta, .sidebar-section, .solution-card, .highlightCard) { background: var(--brand-surface); border: 1px solid var(--brand-border); border-radius: 12px; box-shadow: none; }
body[data-vri-shell="public"] .content-page { max-width: 1280px; }
[data-theme="dark"] body[data-vri-shell="workspace"] .dashboard-sidebar a.dashboard-sidebar__link.active,
[data-theme="dark"] body[data-vri-shell="admin"] .dashboard-sidebar a.dashboard-sidebar__link.active { color: #67cfdf; background: #1c2c42; }

.vri-contact-photo { display: block; width: 100%; height: auto; aspect-ratio: 1.78; object-fit: cover; border-radius: 14px; margin: 24px 0; }
body[data-vri-shell="public"] :is(.featuresHero h1, .pricing-title, .contactHeader h1, .content-header h1) { font-size: clamp(32px, 4vw, 52px); line-height: 1.16; margin: 24px 0; }
body[data-vri-shell="public"] :is(.always-free-card, .pricing-table, .enterprise-note) { background: var(--brand-surface); color: var(--text-primary); border: 1px solid var(--brand-border); border-radius: 12px; box-shadow: none; }
body[data-vri-shell="public"] .pricing-table { overflow-x: auto; }
body[data-vri-shell="public"] .pricing-table th { background: var(--brand-section-bg); color: var(--text-secondary); }

.vri-theme-toggle { border: 1px solid var(--brand-border); border-radius: 7px; padding: 8px 12px; background: var(--brand-surface); color: var(--text-secondary); cursor: pointer; }

.vri-next-steps { margin-top: 40px; gap: 24px; }
body[data-vri-shell="public"] .vri-section .pricing-table { margin: 28px 0; }

body[data-vri-shell="workspace"] .balance-card { background: var(--brand-section-bg); border: 1px solid var(--brand-border); border-radius: 12px; text-align: left; box-shadow: none; }
body[data-vri-shell="workspace"] :is(.balance-card__amount, .balance-card__label) { color: var(--text-primary); }
body[data-vri-shell="workspace"] .balance-card__subtitle { color: var(--text-secondary); }
body[data-vri-shell="public"] .api-explorer-header { background: var(--brand-bg); text-align: left; padding: 40px 32px; }
body[data-vri-shell="public"] .api-explorer-header p { margin-left: 0; max-width: 900px; }
body[data-vri-shell="public"] .api-key-notice { margin-left: 0; max-width: 900px; }
body[data-vri-shell="public"] .swagger-container { max-width: 1280px; padding: 24px 32px; }

/* Review corrections: bounded chart parents, readable footer, compact onboarding. */
body[data-vri-shell="workspace"] .analytics-chart { position: relative; height: 240px; width: 100%; min-width: 0; max-height: none; }
body[data-vri-shell="workspace"] .analytics-chart--wide { height: 280px; }
body[data-vri-shell="workspace"] .analytics-chart canvas { max-width: 100%; max-height: 100%; }
body[data-vri-shell="workspace"] .analytics-grid { align-items: start; }
body[data-vri-shell="workspace"] .analytics-card { min-width: 0; }
body[data-vri-shell="workspace"] .vri-onboarding-details summary { cursor: pointer; color: var(--text-primary); padding: 8px 0; }
body[data-vri-shell="workspace"] .onboarding-card__head { margin-bottom: 0; }
body[data-vri-shell="public"] .main-footer :is(p, .footer-bottom, .footer-bottom p) { color: var(--text-secondary); }

body[data-vri-shell="public"] .apiGrid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 1000px) { body[data-vri-shell="public"] .apiGrid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) { body[data-vri-shell="public"] .apiGrid { grid-template-columns: minmax(0, 1fr); } }

body[data-vri-shell="public"] .vri-task summary { cursor: pointer; }
body[data-vri-shell="public"] .vri-task p { font-size: 1rem; line-height: 1.6; }
body[data-vri-shell="public"] .vri-task-grid { align-items: start; }

body[data-vri-shell="workspace"] .vri-history .modern-stat-grid { grid-template-columns: repeat(auto-fit, minmax(115px, 1fr)); gap: 10px; margin-bottom: 16px; }
body[data-vri-shell="workspace"] .vri-history .stat-card { padding: 12px; }
body[data-vri-shell="workspace"] .vri-history .stat-card__value { font-size: 24px; }
body[data-vri-shell="workspace"] .vri-history .modern-section-header { margin-bottom: 16px; }
body[data-vri-shell="workspace"] .vri-history .modern-filter-bar { padding: 16px; gap: 12px; }
body[data-vri-shell="workspace"] .vri-history .modern-searchbar { padding: 12px 16px; }

body[data-vri-shell="workspace"] .vm-go { background: #f7a619; color: #172334; }
@media (max-width: 600px) {
 body[data-vri-shell="workspace"] .analytics-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
 body[data-vri-shell="workspace"] .summary-card { padding: 16px 8px; }
 body[data-vri-shell="workspace"] .summary-card__value { font-size: 24px; overflow-wrap: anywhere; }
}
@media (min-width: 768px) {
 body[data-vri-shell="workspace"] .vri-workspace-intro { margin-bottom: 16px; }
 body[data-vri-shell="workspace"] .vri-workspace-intro h1 { margin: 4px 0; font-size: 30px; }
 body[data-vri-shell="workspace"] .vri-workspace-intro p { margin-bottom: 12px; }
 body[data-vri-shell="workspace"] .vri-workspace-intro .vri-task { padding: 12px 16px; }
 body[data-vri-shell="workspace"] .vri-workspace-intro .vri-task strong { margin-bottom: 4px; }
 body[data-vri-shell="workspace"] .onboarding-card { padding: 8px 16px; margin-bottom: 16px; }
 body[data-vri-shell="workspace"] .onboarding-card__head { float: right; gap: 12px; }
 body[data-vri-shell="workspace"] .onboarding-card__title { font-size: 14px; margin: 8px 0; }
 body[data-vri-shell="workspace"] .vri-onboarding-details { min-height: 36px; }
 body[data-vri-shell="workspace"] .vri-onboarding-details[open] .onboarding-list { clear: both; }
}
[data-theme="dark"] body[data-vri-shell]:not([data-vri-shell=""]) input { color-scheme: dark; }

body[data-vri-shell="workspace"] .vm-result-details pre { overflow-x: auto; max-width: 100%; font-size: 12px; }
body[data-vri-shell="workspace"] #vmQuote { padding: 16px; margin-top: 16px; }
body[data-vri-shell="workspace"] #vmQuote[hidden] { display: none; }