/* A reserved toolbar row avoids covering dashboard controls on small screens. */
.gt-appearance-bar { height: 48px; box-sizing: border-box; display: flex; align-items: center; justify-content: flex-end; gap: 10px; padding: 0 16px; border-bottom: 1px solid #dce1d8; background: #fafbf8; color: #111; font: 12px/1.4 Inter, sans-serif; }
.gt-appearance-bar select { height: 40px; min-width: 124px; border: 1px solid #c8cec4; border-radius: 10px; background: #fff; color: #111; padding: 0 10px; font: inherit; }
.gt-appearance-bar select:focus-visible { outline: 2px solid #111; outline-offset: 2px; }
#root { height: calc(100vh - 48px); height: calc(100dvh - 48px); }
#root .min-h-dvh { min-height: calc(100dvh - 48px); }
#root :is(.h-dvh, .h-screen) { height: calc(100dvh - 48px); }
@media (max-width: 767px) { #root .glass-sidebar { top: 48px; } }
html[data-appearance="soft-grey"] {
  --gt-bg: #eeeeee; --zen-paper: #f5f5f5; --zen-surface: #f7f7f7;
  --zen-ink: #000; --zen-muted: #000; --zen-accent: #202020; --zen-line: #d5d5d5;
  --color-zinc-50: #f6f6f6; --color-zinc-100: #ededed; --color-zinc-200: #d8d8d8;
  --color-zinc-300: #bcbcbc; --color-zinc-400: #505050; --color-zinc-500: #000;
  --color-zinc-600: #000; --color-zinc-700: #000; --color-zinc-800: #000;
  --color-zinc-900: #171717; --color-zinc-950: #080808;
  --pca-surface-primary: #f3f3f3; --pca-surface-raised: #f7f7f7;
  --pca-glass-border: #d5d5d5; --pca-gradient-brand: linear-gradient(#303030,#303030);
}
html[data-appearance="soft-grey"] .gt-appearance-bar { background: #e9e9e9; border-color: #d5d5d5; }
html[data-appearance="soft-grey"] #root .glass-sidebar { background: #f2f2f2; }
html[data-appearance="soft-grey"] #root .glass-sidebar a[aria-current="page"] { background: #dedede; color: #000; }
html[data-appearance="soft-grey"] #root :is(.glass-card, .glass-panel, .wrr-panel, .wrr-metric) { background: #f7f7f7; border: 1px solid #d5d5d5; border-radius: 16px; box-shadow: none; }
html[data-appearance="soft-grey"] #root :is(section.bg-white, article.bg-white) { background: #f7f7f7; border-radius: 16px; }
html[data-appearance="soft-grey"] #root .wrr-dashboard { --wrr-ink: #000; --wrr-muted: #000; color: #000; }
html[data-appearance="soft-grey"] #root :is(.wrr-hero-description, .wrr-eyebrow, .wrr-hero-meta span, .wrr-metric h2, .wrr-exact, .wrr-metric-note, .wrr-footnote, .wrr-percentage, .wrr-search, .wrr-action p, .wrr-action p strong, .wrr-source p, .wrr-tools > span, .wrr-badge) { color: #000; }
html[data-appearance="soft-grey"] #root :is(.wrr-hero-action, .wrr-action, .wrr-budget-line) { background: #ececec; border-radius: 12px; color: #000; border-color: #d5d5d5; }
html[data-appearance="soft-grey"] #root :is(.wrr-dashboard td a, .wrr-text-link, .wrr-source a, .wrr-action h3 a) { color: #000; }
html[data-appearance="soft-grey"] #root .wrr-dashboard th { background: #e7e7e7; color: #000; }
html[data-appearance="soft-grey"] #root .wrr-dashboard tbody tr:nth-child(even) { background: #f0f0f0; }
html[data-appearance="soft-grey"] #root .wrr-dashboard tbody tr:hover { background: #e4e4e4; }
html[data-appearance="soft-grey"] #root .wrr-dashboard td { border-color: #d8d8d8; }
html[data-appearance="soft-grey"] #root :is(.wrr-button, .wrr-dashboard button, .wrr-search input, .wrr-search select) { background: #e9e9e9; color: #000; border-color: #c6c6c6; border-radius: 10px; }
html[data-appearance="soft-grey"] #root :is(.wrr-button:hover, .wrr-dashboard button:hover, .wrr-dashboard button[aria-pressed="true"]) { background: #d8d8d8; color: #000; }
html[data-appearance="soft-grey"] #root .wrr-dashboard .wrr-explain { background: transparent; }
html[data-appearance="soft-grey"] body [role="dialog"] > div { background: #f3f3f3; border-color: #d5d5d5; border-radius: 16px; }
html[data-appearance="soft-grey"] body [role="dialog"] .wrr-workbench { --wrr-ink: #000; --wrr-muted: #000; color: #000; }
html[data-appearance="soft-grey"] body [role="dialog"] .wrr-tools button { background: #e7e7e7; color: #000; border-color: #c6c6c6; }
html[data-appearance="soft-grey"] body [role="dialog"] .wrr-tools button[aria-pressed="true"] { background: #ccc; }
@media print { .gt-appearance-bar { display: none; } #root { height: auto; } }