:root { color-scheme: light; --ground: #f4f5f7; --surface: #ffffff; --sunken: #ebedf1; --ink: #1e2430; --text-2: #4a5262; --muted: #5f6878; --rule: #dde1e7; --rule-strong: #1e2430; --control: #7d8696; --amber: #00babc; --amber-data: #009c9e; --amber-ink: #007778; --amber-rail: #00babc; --on-amber: #1e2430; --ramp-lo: #c7f0f0; --ramp-hi: #009c9e; --slate: #3f5a73; --slate-lo: #dfe6ee; --good: #237a4b; --critical: #c2402f; --neutral: #7d8696; --seat-empty: #dde1e7; --focus: #1e2430; --rail: #1e2430; --rail-2: #2a3242; --rail-text: #f4f5f7; --rail-muted: #9aa3b2; --rail-rule: #3a4253; --edge-shadow: rgba(30, 36, 48, .18); --tip-shadow: 0 6px 18px rgba(0, 0, 0, .2); --list-shadow: 0 10px 28px rgba(30, 36, 48, .18); --mask: #000000; --bubble-fill: 38%; --rail-accent: #00babc; --on-rail-accent: #1e2430; --type-font-display: "Barlow Semi Condensed", "Barlow", system-ui, sans-serif; --type-font-text: "Barlow", system-ui, -apple-system, "Segoe UI", sans-serif; --type-size-body: 16px; --type-line-body: 1.5; --radius-s: 2px; --radius-m: 4px; --radius-l: 6px; --radius-pill: 999px; --motion-fast: .15s; --motion-settle: .22s; --motion-entrance: .5s; --motion-ease: cubic-bezier(.16, 1, .3, 1); --c-page-padding-x: 16px; --c-page-padding-bottom: 48px; --c-page-max-width: 1360px; --c-section-padding-top: 44px; --c-section-h2-size: 26px; --c-section-h2-rule: 3px; --c-section-h2-gap: 16px; --c-section-h3-size: 20px; --c-section-lede-size: 17px; --c-section-lede-gap: 28px; --c-section-note-size: 14px; --c-section-grid-gap-y: 40px; --c-section-grid-gap-x: 12px; --c-section-grid-top: 36px; --c-rail-width: 340px; --c-rail-side: left; --c-rail-padding-x: 16px; --c-rail-padding-top: 22px; --c-rail-padding-bottom: 22px; --c-rail-gap: 18px; --c-rail-avatar-size: 52px; --c-rail-name-size: 22px; --c-rail-meta-size: 15px; --c-figure-size: 64px; --c-figure-stat-size: 24px; --c-figure-label-size: 15px; --c-mobile-nav-position: bottom; --c-mobile-nav-height: 60px; --c-mobile-nav-padding-x: 8px; --c-mobile-nav-padding-y: 6px; --c-mobile-nav-link-padding-x: 12px; --c-mobile-nav-link-padding-y: 10px; --c-mobile-nav-border-width: 1px; --c-nav-link-padding-x: 10px; --c-nav-link-padding-y: 7px; --c-nav-font-size: 15px; --c-nav-radius: var(--radius-m); --c-period-switch-height: 44px; --c-period-switch-padding-x: 10px; --c-period-switch-padding-y: 8px; --c-period-switch-gap: 6px; --c-period-switch-radius: 4px; --c-period-switch-border-width: 1px; --c-period-switch-font-size: 14px; --c-period-switch-value-size: 14px; --c-period-switch-fg: var(--rail-text); --c-period-switch-bg: transparent; --c-period-switch-border: var(--rail-rule); --c-period-switch-border-hover: var(--rail-muted); --c-period-switch-bg-active: var(--rail-accent); --c-period-switch-fg-active: var(--on-rail-accent); --c-rail-segmented-height: 34px; --c-rail-segmented-padding: 3px; --c-rail-segmented-gap: 3px; --c-rail-segmented-radius: 5px; --c-rail-segmented-item-radius: 3px; --c-rail-segmented-padding-x: 10px; --c-rail-segmented-font-size: 14px; --c-rail-segmented-border: var(--rail-rule); --c-rail-segmented-fg: var(--rail-muted); --c-rail-segmented-fg-hover: var(--rail-text); --c-rail-segmented-bg-active: var(--rail-text); --c-rail-segmented-fg-active: var(--rail); --c-segmented-height: 38px; --c-segmented-padding-x: 14px; --c-segmented-border-width: 2px; --c-segmented-radius: 4px; --c-segmented-font-size: 15px; --c-segmented-border: var(--rule-strong); --c-segmented-fg: var(--text-2); --c-segmented-fg-hover: var(--ink); --c-segmented-bg-active: var(--rule-strong); --c-segmented-fg-active: var(--ground); --c-button-height: 44px; --c-button-padding-x: 18px; --c-button-radius: 4px; --c-button-border-width: 2px; --c-button-font-size: 16px; --c-button-disabled-opacity: .45; --c-button-primary-bg: var(--amber); --c-button-primary-fg: var(--on-amber); --c-button-primary-border: var(--amber); --c-button-primary-border-hover: var(--ink); --c-button-secondary-bg: transparent; --c-button-secondary-fg: var(--ink); --c-button-secondary-border: var(--rule-strong); --c-button-secondary-bg-hover: var(--sunken); --c-button-ghost-bg: transparent; --c-button-ghost-fg: var(--text-2); --c-button-ghost-border: transparent; --c-button-ghost-fg-hover: var(--ink); --c-button-ghost-bg-hover: var(--sunken); --c-button-rail-bg: transparent; --c-button-rail-fg: var(--rail-text); --c-button-rail-border: var(--rail-rule); --c-button-rail-border-hover: var(--rail-muted); --c-switch-track-width: 40px; --c-switch-track-height: 22px; --c-switch-knob-size: 16px; --c-switch-gap: 10px; --c-switch-font-size: 15px; --c-switch-on-bg: var(--amber-data); --c-switch-off-bg: var(--control); --c-switch-knob: var(--surface); --c-input-height: 40px; --c-input-padding-x: 12px; --c-input-radius: 4px; --c-input-border-width: 1px; --c-input-border: var(--control); --c-input-border-focus: var(--focus); --c-input-bg: var(--surface); --c-input-fg: var(--ink); --c-input-font-size: 15px; --c-input-min-width: 0; --c-input-placeholder: var(--muted); --c-input-caret: var(--amber-data); --c-input-label-size: 14px; --c-select-list-max-height: 280px; --c-select-option-padding-y: 8px; --c-select-option-padding-x: 12px; --c-select-list-bg: var(--surface); --c-select-list-border: var(--rule); --c-select-list-shadow: var(--list-shadow); --c-select-option-bg-active: var(--sunken); --c-select-option-fg-selected: var(--amber-ink); --c-select-arrow-size: 5px; --c-sort-header-font-size: 14px; --c-sort-header-padding: 10px; --c-sort-header-fg: var(--text-2); --c-sort-header-fg-hover: var(--ink); --c-sort-header-fg-active: var(--ink); --c-sort-header-arrow-size: 5px; --c-table-font-size: 15px; --c-table-cell-padding-y: 9px; --c-table-cell-padding-x: 10px; --c-table-head-rule: 2px; --c-table-radius: 6px; --c-table-max-height: 640px; --c-table-tall-max-height: 900px; --c-table-bg: var(--surface); --c-table-border: var(--rule); --c-table-row-hover: var(--sunken); --c-chip-padding-x: 6px; --c-chip-radius: 3px; --c-chip-font-size: 14px; --c-badge-padding-x: 8px; --c-badge-padding-y: 1px; --c-badge-radius: 999px; --c-badge-font-size: 13px; --c-tooltip-max-width: 320px; --c-tooltip-padding-x: 10px; --c-tooltip-padding-y: 7px; --c-tooltip-radius: 4px; --c-tooltip-font-size: 14px; --c-tooltip-bg: var(--ink); --c-tooltip-fg: var(--ground); --c-tooltip-shadow: var(--tip-shadow); --c-disclosure-marker-size: 5px; --c-disclosure-gap: 6px; --c-disclosure-fg: var(--text-2); --c-scrollbar-size: 10px; --c-scrollbar-thumb: var(--control); --c-scrollbar-thumb-hover: var(--text-2); --c-scrollbar-track: transparent; --c-scrollbar-radius: 999px; --c-focus-width: 2px; --c-focus-offset: 2px; --c-seat-height: 18px; --c-seat-radius: 3px; --c-seat-gap: 4px; --c-seat-label-width: 32px; --c-seat-ring: 1px; --c-seat-top-ring: 2px; --c-cell-radius: 2px; --c-cell-gap: 3px; --c-cluster-label-size: 38px; --c-cluster-rule: 3px; --c-cluster-gap-x: 44px; --c-cluster-gap-y: 28px; --c-cluster-min-width: 210px; --c-lead-size: 44px; --c-lead-first-size: 64px; --c-lead-rule: 3px; --c-compare-size: 44px; --c-compare-rule: 3px; --c-legend-swatch: 12px; --c-legend-font-size: 14px; --c-bubble-stroke-width: 1.5px; --c-bubble-stroke: var(--ground); --c-bubble-label-size: 13px; --c-bubble-link: var(--rule-strong); --c-bubble-link-width: 1.5px; --c-bubble-focus-width: 3px; --c-site-max-width: 72ch; --c-site-padding-x: 16px; --c-site-title-size: 44px; --c-site-h1-size: 34px; --c-site-h2-size: 20px; --c-site-mark-size: 150px; --c-site-head-mark-size: 26px; --c-site-plan-width: 100%; --c-lang-height: 32px; --c-lang-padding-x: 10px; --c-lang-radius: 4px; --c-lang-font-size: 13px; --c-lang-border: var(--rule-strong); --c-lang-fg: var(--text-2); --c-lang-bg-active: var(--rule-strong); --c-lang-fg-active: var(--ground); --c-kpi-size: 40px; --c-kpi-rule: 3px; --c-kpi-lead-size: 64px; --c-boot-bar-height: 8px; --c-boot-max-width: 520px; --c-topbar-height: 56px; --c-topbar-padding-x: 16px; --c-topbar-brand-size: 19px; --c-island-bg: var(--surface); --c-island-border: var(--rule); --c-island-radius: 8px; --c-island-padding: 16px; --c-settings-width: 300px; --c-settings-radius: 8px; --c-settings-padding: 16px; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) { color-scheme: dark; --ground: #12161d; --surface: #1a1f28; --sunken: #222833; --ink: #eef0f3; --text-2: #b8bfcb; --muted: #949caa; --rule: #2a313d; --rule-strong: #c9ced6; --control: #7a8394; --amber-data: #00babc; --amber-ink: #00babc; --ramp-lo: #0d474d; --ramp-hi: #00babc; --slate: #8fb0cf; --slate-lo: #25313e; --good: #4cc38a; --critical: #f0715e; --neutral: #7a8394; --seat-empty: #262d38; --focus: var(--amber-ink); --rail: #0b0e13; --rail-2: #1a1f28; --rail-rule: #222833; --edge-shadow: rgba(0, 0, 0, .55); --list-shadow: 0 10px 28px rgba(0, 0, 0, .5); --bubble-fill: 52%; --amber: #00babc; --on-amber: #1e2430; --amber-rail: #00babc; --rail-accent: #00babc; --on-rail-accent: #1e2430; } }
:root[data-theme="dark"] { color-scheme: dark; --ground: #12161d; --surface: #1a1f28; --sunken: #222833; --ink: #eef0f3; --text-2: #b8bfcb; --muted: #949caa; --rule: #2a313d; --rule-strong: #c9ced6; --control: #7a8394; --amber-data: #00babc; --amber-ink: #00babc; --ramp-lo: #0d474d; --ramp-hi: #00babc; --slate: #8fb0cf; --slate-lo: #25313e; --good: #4cc38a; --critical: #f0715e; --neutral: #7a8394; --seat-empty: #262d38; --focus: var(--amber-ink); --rail: #0b0e13; --rail-2: #1a1f28; --rail-rule: #222833; --edge-shadow: rgba(0, 0, 0, .55); --list-shadow: 0 10px 28px rgba(0, 0, 0, .5); --bubble-fill: 52%; --amber: #00babc; --on-amber: #1e2430; --amber-rail: #00babc; --rail-accent: #00babc; --on-rail-accent: #1e2430; }
[data-panel="seat-plan"] { grid-column: span 12; } [data-panel="hours-month"] { grid-column: span 12; } [data-panel="hours-month"] .plot { height: 200px; } [data-panel="calendar"] { grid-column: span 12; } [data-panel="heat-presence"] { grid-column: span 12; } [data-panel="table-seats"] { grid-column: span 12; } [data-panel="table-sessions"] { grid-column: span 12; } [data-panel="timeline"] { grid-column: span 12; } [data-panel="correctors"] { grid-column: span 12; } [data-panel="table-people"] { grid-column: span 12; } [data-panel="where-plan"] { grid-column: span 12; } [data-panel="where-clusters"] { grid-column: span 12; } [data-panel="where-clusters"] .plot { height: 200px; } [data-panel="table-log"] { grid-column: span 12; } [data-panel="connections"] { grid-column: span 12; } [data-panel="connections"] .plot { height: 420px; } [data-panel="retries"] { grid-column: span 12; } [data-panel="cum-retries"] { grid-column: span 12; } [data-panel="cum-retries"] .plot { height: 380px; } [data-panel="recv-monthly"] { grid-column: span 12; } [data-panel="recv-monthly"] .plot { height: 280px; } [data-panel="marks"] { grid-column: span 12; } [data-panel="marks"] .plot { height: 280px; } [data-panel="cum-evals"] { grid-column: span 12; } [data-panel="cum-evals"] .plot { height: 280px; } [data-panel="cum-out"] { grid-column: span 12; } [data-panel="cum-out"] .plot { height: 280px; } [data-panel="heat-recv"] { grid-column: span 12; } [data-panel="heat-given"] { grid-column: span 12; } [data-panel="duration"] { grid-column: span 12; } [data-panel="duration"] .plot { height: 280px; } [data-panel="lead"] { grid-column: span 12; } [data-panel="lead"] .plot { height: 280px; } [data-panel="given-monthly"] { grid-column: span 12; } [data-panel="given-monthly"] .plot { height: 280px; } [data-panel="given-projects"] { grid-column: span 12; } [data-panel="given-projects"] .plot { height: 280px; } [data-panel="table-feedback"] { grid-column: span 12; } [data-panel="low-feedback"] { grid-column: span 12; } [data-panel="points"] { grid-column: span 12; } [data-panel="points"] .plot { height: 280px; } [data-panel="table-reasons"] { grid-column: span 12; } [data-panel="skills"] { grid-column: span 12; } [data-panel="achievements"] { grid-column: span 12; } [data-panel="events"] { grid-column: span 12; } [data-panel="misc"] { grid-column: span 12; } [data-panel="kpis"] { grid-column: span 12; } [data-panel="projects-table"] { grid-column: span 12; } [data-panel="fail-rates"] { grid-column: span 12; } [data-panel="by-group"] { grid-column: span 12; } [data-panel="by-hour"] { grid-column: span 12; } [data-panel="by-hour"] .plot { height: 280px; } [data-panel="network"] { grid-column: span 12; } [data-panel="network"] .plot { height: 480px; } [data-panel="coalitions"] { grid-column: span 12; } [data-panel="promo"] { grid-column: span 12; }
@media (min-width: 960px) { :root { --c-page-padding-x: 48px; --c-page-padding-bottom: 64px; --c-section-padding-top: 56px; --c-section-h2-size: 30px; --c-section-grid-gap-x: 48px; --c-rail-padding-x: 24px; --c-rail-padding-top: 28px; --c-rail-padding-bottom: 20px; --c-rail-gap: 26px; --c-figure-size: 80px; --c-period-switch-padding-x: 14px; --c-period-switch-padding-y: 10px; --c-period-switch-font-size: 16px; --c-period-switch-value-size: 15px; --c-input-min-width: 220px; --c-lead-size: 56px; --c-lead-first-size: 88px; --c-compare-size: 52px; --c-site-padding-x: 48px; --c-site-title-size: 76px; --c-site-h1-size: 44px; --c-site-mark-size: 300px; --c-site-plan-width: 42%; --c-kpi-size: 52px; --c-kpi-lead-size: 72px; --c-topbar-height: 60px; --c-topbar-padding-x: 24px; --c-island-padding: 22px; } [data-panel="connections"] .plot { height: 560px; } [data-panel="network"] .plot { height: 640px; } }
@media (min-width: 1280px) { [data-panel="retries"] { grid-column: span 6; } [data-panel="cum-retries"] { grid-column: span 6; } [data-panel="recv-monthly"] { grid-column: span 6; } [data-panel="marks"] { grid-column: span 6; } [data-panel="cum-evals"] { grid-column: span 6; } [data-panel="cum-out"] { grid-column: span 6; } [data-panel="heat-recv"] { grid-column: span 6; } [data-panel="heat-given"] { grid-column: span 6; } [data-panel="duration"] { grid-column: span 6; } [data-panel="lead"] { grid-column: span 6; } [data-panel="given-monthly"] { grid-column: span 6; } [data-panel="given-projects"] { grid-column: span 6; } [data-panel="table-feedback"] { grid-column: span 6; } [data-panel="low-feedback"] { grid-column: span 6; } [data-panel="points"] { grid-column: span 6; } [data-panel="table-reasons"] { grid-column: span 6; } [data-panel="achievements"] { grid-column: span 6; } [data-panel="events"] { grid-column: span 6; } [data-panel="misc"] { grid-column: span 6; } [data-panel="by-group"] { grid-column: span 6; } [data-panel="by-hour"] { grid-column: span 6; } [data-panel="coalitions"] { grid-column: span 5; } [data-panel="promo"] { grid-column: span 7; } }