/* Private IA workspace, presentation only. Shared by the six existing renderers.
   No state, services, prices, source documents or generated text are changed here. */
:root {
  --ui-page: #f5f6f8;
  --ui-white: #ffffff;
  --ui-ink: #1c2837;
  --ui-muted: #596779;
  --ui-line: #dfe5ec;
  --ui-soft: #f3f6fa;
  --ui-night: #101721;
  --ui-night-raised: #1b2635;
  --ui-inverse-muted: #b6c2d2;
  --ui-accent: #d63829;
  --ui-accent-hover: #b62d21;
  --ui-blue: #226483;
  --ui-blue-soft: #eff7fa;
  --ui-blue-line: #c7dfe9;
  --ui-radius: 18px;
  --ui-shadow: 0 4px 20px #13203306;
  --ui-font: Jakarta, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}
html { scroll-padding-top: 96px; }
.ui-skip-link { position: fixed; left: 16px; top: -100px; z-index: 10000; padding: 12px 18px; background: var(--ui-white); color: var(--ui-ink); border-radius: 10px; }
.ui-skip-link:focus { top: 16px; }
#main:focus { outline: none; }
:root body {
  font: 14px/1.65 var(--ui-font);
  background: var(--ui-page);
  color: var(--ui-ink);
}
:root body :is(button, input, select, textarea) { font-family: var(--ui-font); }
:root body :is(a, button, input, select, textarea, summary):focus-visible {
  outline: 3px solid var(--ui-blue);
  outline-offset: 4px;
}
:root body :is(button, a) { -webkit-tap-highlight-color: transparent; }
:root body .app { align-items: flex-start; }
:root body .workspace { background: var(--ui-page) !important; min-height: 100dvh; }
:root body .sidebar {
  width: 260px !important;
  flex-basis: 260px !important;
  height: 100dvh !important;
  padding: 24px 18px 18px !important;
  background: var(--ui-night) !important;
  border-color: var(--ui-night-raised) !important;
  scrollbar-width: thin;
  scrollbar-color: var(--ui-night-raised) var(--ui-night);
  overscroll-behavior-y: contain;
}
:root body .sidebar .brand {
  display: flex !important;
  font-size: 17px;
  margin: 0 0 12px;
  flex-shrink: 0;
}
:root body .sidebar .private-label {
  margin: 0 0 22px;
  font-size: 9px;
  letter-spacing: .1em;
  color: var(--ui-inverse-muted);
}
:root body .sidebar .property {
  padding: 12px;
  margin-bottom: 18px;
  background: var(--ui-night-raised);
  border-color: #303e50;
  border-radius: 14px;
}
:root body .sidebar .property img { height: 82px; border-radius: 8px; }
:root body .sidebar .property h2 { font-size: 13px !important; line-height: 1.5; margin: 10px 0 4px !important; }
:root body .sidebar .property p { font-size: 11px !important; color: var(--ui-inverse-muted) !important; }
:root body .sidebar .property .text-link { min-height: 34px; font-size: 11px; color: var(--ui-inverse-muted); }
:root body .sidebar .demo-tag { font-size: 8px; }
:root body .sidebar nav { gap: 5px !important; flex-shrink: 0; }
:root body .sidebar nav a {
  min-height: 46px;
  padding: 9px 10px !important;
  gap: 10px !important;
  font-size: 12px !important;
  line-height: 1.45;
  color: var(--ui-inverse-muted) !important;
  border: 1px solid transparent;
  border-left: 3px solid transparent !important;
  border-radius: 10px !important;
}
:root body .sidebar nav a:hover {
  color: var(--ui-white) !important;
  background: var(--ui-night-raised) !important;
}
:root body .sidebar nav a[aria-current='page'] {
  background: var(--ui-night-raised) !important;
  border-color: #303e50;
  border-left-color: var(--red) !important;
  color: var(--ui-white) !important;
}
:root body .sidebar nav .nav-rank {
  flex: none;
  width: 26px !important;
  height: 26px !important;
  background: #2b394c !important;
  color: var(--ui-inverse-muted) !important;
  border-radius: 8px !important;
  font-size: 11px !important;
}
:root body .sidebar nav a[aria-current='page'] .nav-rank {
  background: var(--ui-accent) !important;
  color: var(--ui-white) !important;
}
:root body .sidebar .nav-section-label { margin: 18px 8px 10px; font-size: 9px; letter-spacing: .08em; color: var(--ui-inverse-muted); }
:root body #btn-sidebar-concierge { min-height: 44px; font-size: 12px !important; border-radius: 10px !important; }
:root body .journey-side-note { margin: 20px 0; padding: 16px 8px; }
:root body .journey-side-note p { color: var(--ui-inverse-muted); font-size: 11px; }
@media (min-width: 901px) {
  :root body .journey-side-note { display: none; }
  :root body .sidebar .property img { height: 64px; }
  :root body #concierge-trigger { display: none; }
}
:root body .side-bottom { margin-top: auto; padding-top: 16px; }
:root body .side-bottom strong { font-size: 11px; }
:root body .side-bottom span { color: var(--ui-inverse-muted); font-size: 10px; }
:root body .topbar {
  min-height: 68px !important;
  height: auto !important;
  padding: 14px clamp(20px, 3vw, 48px) !important;
  gap: 14px;
  flex-wrap: wrap;
  border-color: var(--ui-line) !important;
}
:root body .breadcrumb { font-size: 12px; color: var(--ui-muted); flex-wrap: wrap; gap: 10px; }
:root body .breadcrumb strong { color: var(--ui-ink); font-weight: 600; }
:root body .topbar > div:last-child { flex-wrap: wrap; gap: 10px !important; }
:root body .private-pill { font-size: 11px; padding: 6px 10px; color: var(--ui-muted); }
:root body #btn-reset-demo { min-height: 36px !important; font-size: 11px !important; padding: 7px 12px !important; color: var(--ui-muted); }
:root body #main {
  max-width: 1440px !important;
  margin-inline: auto !important;
  padding: 36px clamp(20px, 3vw, 48px) 104px !important;
  color: var(--ui-ink);
}
#main *, #facts-modal *, #concierge-drawer * { min-width: 0; }
:root body #main .page-heading {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 20px;
  margin: 0 0 28px;
  padding-bottom: 24px;
  border-bottom: 1px solid var(--ui-line);
}
:root body #main .page-heading > div { width: 100%; }
:root body #main h1 {
  max-width: 29ch;
  margin: 10px 0 12px;
  font-size: clamp(28px, 2.7vw, 40px);
  font-weight: 650;
  line-height: 1.2;
  letter-spacing: -.045em;
  color: var(--ui-ink);
  text-wrap: balance;
}
:root body #main .page-heading > div > p:not(.eyebrow) {
  max-width: 76ch;
  font-size: 14px;
  line-height: 1.75;
  color: var(--ui-muted);
}
:root body #main .eyebrow {
  font-size: 11px !important;
  font-weight: 650;
  letter-spacing: .09em;
  line-height: 1.65;
  color: var(--ui-muted);
}
:root body #main :is(h2, h3) { text-wrap: balance; line-height: 1.4; letter-spacing: -.025em; }
:root body #main h2 { font-size: 21px !important; font-weight: 650; }
:root body #main h3 { font-size: 17px !important; font-weight: 650; }
:root body #main :is(.ai-card, .panel) {
  padding: 26px !important;
  border: 1px solid var(--ui-line);
  border-radius: var(--ui-radius) !important;
  background: var(--ui-white);
  box-shadow: var(--ui-shadow);
  margin-bottom: 24px;
}
:root body #main :is(.ai-card, .panel) > :last-child { margin-bottom: 0; }
:root body #main p { overflow-wrap: anywhere; }
:root body #main p[style*='font-size:1'],
:root body #main :is(ul, ol)[style*='font-size:1'] { font-size: 14px !important; line-height: 1.8 !important; }
:root body #main label[style*='font-size:1'],
:root body #main span[style*='font-size:10px'],
:root body #main span[style*='font-size:11px'] { font-size: 12px !important; line-height: 1.6; }
:root body #main :is(input, select, textarea):not([type='file']):not([type='checkbox']):not([type='radio']) {
  width: 100%;
  max-width: 100%;
  min-height: 46px;
  border: 1px solid #c5ceda !important;
  border-radius: 10px !important;
  background: var(--ui-white);
  color: var(--ui-ink);
  padding: 12px 14px !important;
  font-size: 14px !important;
  line-height: 1.7 !important;
  box-sizing: border-box;
}
:root body #main textarea { resize: vertical; }
:root body #main .ai-text-area { min-height: 240px !important; }
:root body #main :is(input, textarea, select):hover { border-color: var(--ui-blue) !important; }
:root body :is(.btn-ai, .primary, .secondary, .btn-mini, .btn-view-doc) {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 44px !important;
  max-width: 100%;
  border-radius: 10px !important;
  padding: 10px 16px !important;
  font-size: 12px !important;
  font-weight: 650 !important;
  line-height: 1.5 !important;
  white-space: normal !important;
  text-align: center;
  text-decoration: none;
}
:root body :is(.btn-ai, .primary) {
  color: var(--ui-white) !important;
  background: var(--ui-accent) !important;
  border: 1px solid var(--ui-accent) !important;
  box-shadow: none !important;
}
:root body :is(.btn-ai, .primary):hover:not(:disabled) {
  background: var(--ui-accent-hover) !important;
  border-color: var(--ui-accent-hover) !important;
  color: var(--ui-white) !important;
  filter: none;
}
:root body :is(.secondary, .btn-mini, .btn-view-doc) {
  color: var(--ui-ink) !important;
  border: 1px solid #c5ceda !important;
  background: var(--ui-white) !important;
  box-shadow: none;
}
:root body :is(.secondary, .btn-mini, .btn-view-doc):hover:not(:disabled) {
  background: var(--ui-soft) !important;
  border-color: var(--ui-blue) !important;
  color: var(--ui-ink) !important;
}
/* A selected language carries .primary and .btn-mini together. */
:root body .btn-mini.primary { color: var(--ui-white) !important; background: var(--ui-night-raised) !important; border-color: var(--ui-night-raised) !important; }
:root body #main .ai-badge {
  display: inline-flex;
  flex: none;
  align-items: center;
  gap: 7px;
  padding: 6px 10px;
  border: 1px solid var(--ui-blue-line);
  border-radius: 8px;
  background: var(--ui-blue-soft);
  color: var(--ui-blue);
  font-size: 11px;
  line-height: 1.5;
}
:root body #main .ai-hero-action {
  border: 1px solid var(--ui-night-raised);
  border-top: 2px solid var(--ice);
  border-radius: var(--ui-radius) !important;
  background: var(--ui-night) !important;
  padding: 26px !important;
  gap: 22px !important;
  flex-wrap: wrap;
}
:root body #main .ai-hero-action > div { flex: 1 1 320px; }
:root body #main .ai-hero-action h3 { color: var(--ui-white) !important; margin-bottom: 8px !important; }
:root body #main .ai-hero-action p { color: var(--ui-inverse-muted) !important; font-size: 13px !important; line-height: 1.7 !important; }
:root body #main .docs-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 16px !important; }
:root body #main .doc-box {
  border-radius: 14px !important;
  border-color: var(--ui-line) !important;
  background: var(--ui-white) !important;
  padding: 20px !important;
  min-height: 200px !important;
  gap: 16px;
  box-shadow: var(--ui-shadow) !important;
}
:root body #main .doc-box.loaded { background: var(--ui-white) !important; border-color: var(--ui-blue-line) !important; }
:root body #main .doc-title { font-size: 14px !important; font-weight: 650; line-height: 1.5; }
:root body #main .doc-source { font-size: 12px !important; color: var(--ui-muted) !important; line-height: 1.6; }
:root body #main .doc-box-header div[style*='font-size:10.5px'] { font-size: 12px !important; line-height: 1.6 !important; color: var(--ui-muted) !important; }
:root body #main .doc-status { font-size: 12px !important; overflow-wrap: anywhere; }
:root body #main .doc-icon { width: 40px !important; height: 46px !important; border-radius: 10px !important; background: var(--ui-blue-soft) !important; color: var(--ui-blue) !important; flex: none; }
:root body #main .doc-actions { display: flex; flex-wrap: wrap; gap: 8px; }
:root body #main .ai-card-dark {
  background: var(--ui-night) !important;
  border-radius: var(--ui-radius) !important;
  padding: 26px !important;
  box-shadow: var(--ui-shadow) !important;
}
:root body #main .ai-card-dark :is(h2, h3) { color: var(--ui-white); }
:root body #main .ai-card-dark .eyebrow { color: var(--ice) !important; }
:root body #main .valuation-big-price { font-size: clamp(30px, 3vw, 42px) !important; flex-wrap: wrap; }
:root body #main .valuation-sublabel { font-size: 12px !important; color: var(--ui-inverse-muted) !important; }
:root body #main .clean-tabs {
  display: flex;
  gap: 6px;
  background: #e9edf2;
  padding: 5px;
  border: 1px solid var(--ui-line);
  border-radius: 12px;
  margin-bottom: 24px;
}
:root body #main .clean-tab {
  flex: 1;
  min-height: 48px;
  border: 1px solid transparent !important;
  border-radius: 8px;
  padding: 10px 14px !important;
  font-size: 13px !important;
  line-height: 1.5;
  color: var(--ui-muted) !important;
  white-space: normal;
  text-align: center;
}
:root body #main .clean-tab.active {
  border-color: var(--ui-line) !important;
  background: var(--ui-white);
  color: var(--ui-ink) !important;
  box-shadow: 0 2px 6px #10172108;
}
:root body #main .clean-tab:hover { color: var(--ui-ink) !important; background: var(--ui-white); }
:root body #main .assistant-layout { grid-template-columns: minmax(220px, .8fr) minmax(0, 2fr); gap: 24px; align-items: start; }
:root body #main .inbox { padding: 16px !important; }
:root body #main .inbox-title { font-size: 13px; margin-bottom: 16px; }
:root body #main .inbox button { width: 100%; padding: 16px !important; text-align: left; line-height: 1.65; min-height: 100px; }
:root body #main .inbox .person { flex-wrap: wrap; gap: 4px 12px; }
:root body #main .inbox .person strong { font-size: 13px; }
:root body #main .inbox :is(.time, .preview) { font-size: 12px; color: var(--ui-muted); }
:root body #main .incoming-head { gap: 12px; flex-wrap: wrap; }
:root body #main .incoming-head > div > span { display: block; margin-top: 5px; }
:root body #main .incoming blockquote { font-size: 14px !important; line-height: 1.85 !important; background: var(--ui-blue-soft) !important; border-left-color: var(--ui-blue) !important; }
:root body #main .portal-table { display: block; overflow-x: auto; max-width: 100%; overscroll-behavior-x: contain; }
:root body #main .portal-table th { font-size: 11px !important; }
:root body #main .portal-table td { font-size: 13px !important; }
:root body #main .steps-dashboard-grid { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 16px !important; }
:root body #main .clean-step-card { border-radius: var(--ui-radius) !important; padding: 24px !important; box-shadow: var(--ui-shadow) !important; }
:root body #main .clean-step-card p { font-size: 13px !important; line-height: 1.75 !important; color: var(--ui-muted) !important; }
:root body #main .clean-step-card-head strong { font-size: 15px !important; }
:root body #main .clean-step-card:hover { border-color: var(--ui-blue) !important; }
:root body .workspace > footer { border-top: 1px solid var(--ui-line); padding: 20px 28px 88px; color: var(--ui-muted); font-size: 11px; }
/* Reserve room below the content for the existing concierge entry. */
:root body #concierge-trigger { font: 600 12px/1.5 var(--ui-font); padding: 12px 16px; min-height: 48px; bottom: 20px; right: 20px; background: var(--ui-night); }
:root body #concierge-drawer { height: 100dvh; }
:root body .concierge-header h3 { color: var(--ui-white); }
:root body .concierge-header p { color: var(--ui-inverse-muted); }
:root body .concierge-filter-pill { min-height: 40px; font-size: 12px; }
:root body .concierge-faq-card { padding: 16px; min-height: 64px; }
:root body .concierge-faq-card strong { font-size: 13px; }
:root body :is(.chat-bubble-user, .chat-bubble-ai) { font-size: 14px; line-height: 1.75; }
:root body .concierge-close { min-width: 40px; min-height: 40px; flex: none; }
:root body dialog { max-width: calc(100vw - 32px); max-height: 90dvh; overflow-y: auto; border-radius: var(--ui-radius); }
:root body dialog .dialog-head { gap: 16px; }
:root body dialog .dialog-head .icon-button { min-width: 44px; min-height: 44px; }
/* The templates keep their existing inline layouts. Reflow these without touching
   the renderers, their event handlers or their hidden tab states. */
@media (max-width: 1200px) {
  :root body #main > div[style*='grid-template-columns'],
  :root body #main .assistant-layout { grid-template-columns: minmax(0, 1fr) !important; }
  :root body #main .inbox { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  :root body #main .inbox-title { grid-column: 1 / -1; margin-bottom: 0; }
  :root body #main .inbox button { margin: 0 !important; }
}
@media (max-width: 900px) {
  :root body .app { flex-direction: column !important; }
  :root body .sidebar {
    position: relative !important;
    width: 100% !important;
    height: auto !important;
    flex: none !important;
    padding: 20px !important;
    overflow: visible !important;
    border-right: 0 !important;
  }
  :root body .sidebar .brand { font-size: 19px; margin-bottom: 14px; }
  :root body .sidebar .private-label { display: none; }
  :root body .sidebar .property { display: grid !important; grid-template-columns: minmax(0, 1fr) auto; gap: 3px 12px; margin: 0 0 12px; padding: 12px 14px; }
  :root body .sidebar .property img, :root body .sidebar .demo-tag { display: none; }
  :root body .sidebar .property h2 { margin-top: 0 !important; }
  :root body .sidebar .property p { margin: 3px 0 !important; }
  :root body .sidebar .property h2, :root body .sidebar .property p { grid-column: 1; }
  :root body .sidebar .property .text-link { grid-column: 2; grid-row: 1 / 3; max-width: 140px; min-height: 36px; }
  :root body .sidebar nav { display: grid !important; grid-template-columns: repeat(3, minmax(0, 1fr)) !important; gap: 6px !important; }
  :root body .sidebar nav :is(.overview-link, .nav-section-label),
  :root body .sidebar nav > div { grid-column: 1 / -1; }
  :root body .sidebar .nav-section-label { margin: 8px 4px; }
  :root body .sidebar nav a { padding: 10px 8px !important; font-size: 11px !important; gap: 8px !important; min-height: 64px; }
  :root body .sidebar nav .overview-link { min-height: 40px; }
  :root body .sidebar nav a { justify-content: flex-start; }
  :root body .sidebar nav .nav-rank { width: 23px !important; height: 23px !important; }
  :root body .sidebar :is(.journey-side-note, .side-bottom) { display: none; }
  :root body .sidebar nav > div { margin: 8px 0 0 !important; padding-top: 12px !important; }
  :root body .workspace { width: 100%; }
  :root body .topbar { min-height: 64px !important; padding: 16px 20px !important; }
  :root body #main { padding: 28px 20px 100px !important; }
  :root body #main .page-heading { gap: 16px; }
  :root body #main .ai-hero-action { align-items: flex-start !important; }
}
@media (max-width: 600px) {
  /* Miguel's review of 17.10, point 14: at 390 px the three-column grid cut the step names.
     One step per line, full width, nothing truncated. */
  :root body .sidebar nav { grid-template-columns: minmax(0, 1fr) !important; gap: 4px !important; }
  :root body .sidebar nav a { min-height: 44px; padding: 8px 10px !important; }
  :root body .sidebar nav a .count { margin-left: auto; }
  :root body #main .page-heading h1 { font-size: 29px; }
  :root body #main .page-heading :is(.btn-ai, .secondary) { width: 100%; }
  :root body #main .docs-grid,
  :root body #main .steps-dashboard-grid,
  :root body #main .inbox { grid-template-columns: minmax(0, 1fr) !important; }
  :root body #main :is(.ai-card, .panel, .ai-card-dark, .ai-hero-action) { padding: 20px !important; border-radius: 14px !important; }
  :root body #main .doc-box { min-height: 0 !important; }
  :root body #main .ai-hero-action > div { flex-basis: 100%; }
  :root body #main .ai-hero-action .btn-ai { width: 100%; }
  :root body #main .clean-tabs { flex-direction: column; }
  :root body #main .clean-tab { flex: auto; text-align: left; }
  :root body #main div[style*='display:grid'],
  :root body #main div[style*='display: grid'] { grid-template-columns: minmax(0, 1fr) !important; }
  :root body #main div[style*='display:flex'],
  :root body #main div[style*='display: flex'] { flex-wrap: wrap; gap: 10px; }
  :root body #main .ai-card div:has(> #ad-title) { flex: 1 1 100%; }
  :root body #main #section-ads > div:first-child { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 8px; }
  :root body #main input:not([type='file']),
  :root body #main textarea,
  :root body #main select { font-size: 16px !important; }
  :root body #main .valuation-subgrid { grid-template-columns: 1fr !important; }
  :root body #concierge-trigger { bottom: 14px; right: 14px; max-width: calc(100vw - 28px); font-size: 11px; }
  :root body #concierge-drawer { width: 100%; max-width: 100%; }
  :root body .concierge-header { padding: 16px; gap: 12px; }
  :root body .concierge-body { padding: 16px; }
  :root body dialog .dialog-head { flex-wrap: wrap; }
  :root body dialog h2 { font-size: 23px; }
}
@media (max-width: 420px) {
  /* External audit of 19.10: 13 px of horizontal overflow and the step rail overlapping at 390 px.
     Nothing may be wider than the viewport: the hidden concierge drawer is parked with a transform
     instead of a negative offset (an off-screen fixed box lets iOS Safari pan sideways), every
     container clips sideways overflow, and the few boxes with a fixed width reflow. */
  html, body, :root body .app, :root body .workspace, :root body #main { overflow-x: clip; max-width: 100vw; }
  :root body .app, :root body .sidebar, :root body .workspace, :root body #main { min-width: 0 !important; }
  :root body #main img, :root body #main iframe, :root body #main video, :root body #main table, :root body #main pre { max-width: 100%; }
  :root body #main pre { white-space: pre-wrap; overflow-wrap: anywhere; }
  :root body #main :is(h1, h2, h3, p, li, td, th, label, strong, small) { overflow-wrap: anywhere; }
  :root body #concierge-drawer { right: 0; width: 100%; max-width: 100%; transform: translateX(100%); visibility: hidden; transition: transform 0.32s cubic-bezier(0.16, 1, 0.3, 1), visibility 0s linear 0.32s; }
  :root body #concierge-drawer.open { transform: none; visibility: visible; transition-delay: 0s; }
  :root body #concierge-trigger { max-width: calc(100vw - 28px); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  /* Step rail: one step per line, the rank and the name on the same row, the count pushed right. */
  :root body .sidebar { padding: 16px !important; }
  :root body .sidebar nav { grid-template-columns: minmax(0, 1fr) !important; gap: 4px !important; }
  :root body .sidebar nav a { display: flex !important; align-items: center; flex-wrap: nowrap; min-height: 44px; padding: 8px 10px !important; font-size: 12px !important; white-space: normal; overflow-wrap: anywhere; }
  :root body .sidebar nav .nav-rank { flex: 0 0 auto; }
  :root body .sidebar .property { grid-template-columns: minmax(0, 1fr); }
  :root body .sidebar .property .text-link { grid-column: 1; grid-row: auto; max-width: none; }
  :root body .topbar { padding: 12px 16px !important; flex-wrap: wrap; gap: 8px; }
  :root body #main { padding: 24px 16px 110px !important; }
  :root body .workspace > footer { padding: 20px 16px 96px; }
  /* Step 1: the swisstopo map toolbar wraps instead of pushing its buttons out of their box. */
  :root body #main .geo-map-toolbar { flex-wrap: wrap; gap: 6px; }
  :root body #main .geo-map-switch { flex-wrap: wrap; }
  :root body #main .geo-map-btn { white-space: nowrap; }
  /* Locked example inputs: no wider than their card. */
  :root body #main input:not([type='file']), :root body #main textarea, :root body #main select { max-width: 100%; }
  :root body .demo-bar { padding: 9px 16px; }
  :root body .demo-bar .demo-bar-text { flex-basis: 100%; }
  :root body .demo-bar .demo-bar-actions > * { flex: 1 1 auto; justify-content: center; }
  /* Guided tour popover: title clear of the close button, never wider than the screen. */
  :root body .driver-popover.jvmb-tour { max-width: calc(100vw - 24px); padding: 18px 16px 14px; }
  :root body .jvmb-tour .driver-popover-title { padding-right: 44px; font-size: 17px; }
  :root body .jvmb-tour .driver-popover-footer button { flex: 1 1 auto; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation: none !important; transition: none !important; }
}