/* Delivery-only readability rules. Benchmark values and source files stay intact. */
html {
    font-size: 16px !important;
}

body {
    font-size: 20px !important;
    line-height: 1.5 !important;
}

body :where(p, span, a, div, li, dt, dd, label, button, input, select,
    textarea, small, code, pre, th, td, svg text, tspan) {
    font-size: inherit !important;
}

h1 {
    font-size: clamp(32px, 3vw, 44px) !important;
    line-height: 1.2 !important;
}

h2 {
    font-size: 30px !important;
    line-height: 1.3 !important;
}

h3 {
    font-size: 26px !important;
    line-height: 1.3 !important;
}

h4, h5, h6 {
    font-size: 22px !important;
    line-height: 1.4 !important;
}

button, input, select, textarea {
    font-size: 20px !important;
    min-height: 44px !important;
    height: auto !important;
    line-height: 1.5 !important;
}

button {
    white-space: normal !important;
}

p, li, td, th, label {
    line-height: 1.5 !important;
}

[role="tablist"] {
    height: auto !important;
    flex-wrap: wrap !important;
}

table {
    font-size: 20px !important;
}

[class*="text-neutral-500"], [class*="text-neutral-600"] {
    color: #b9bec8 !important;
}

.recharts-tooltip-wrapper {
    font-size: 20px !important;
}

svg text, svg tspan {
    font-size: 18px !important;
}
