/* Design tokens of the overview page. Colours are the rise.sk web's (config/brand/rise-brand.css, which also loads Inter),
   light set first, dark set below; --m-* is the chart palette. Every widget styles itself with these names only. */
:root {
  --bg: #F7F5F0; --panel: #FFFFFF; --line: #DED8CB; --track: #E9E4D8;
  --ink: #14120E; --ink2: #3D3A34; --mute: #6B665C;
  --gold: #855F1F; --gold-soft: #855F1F22;
  --good: #0F7A52; --good-soft: #0F7A521c; --warn: #8F4E08; --warn-soft: #b4600c1a; --crit: #B3261E; --crit-soft: #B3261E14;
  --blue: #2f6fe0; --mono-icon: none;
  --m-clk: #9a7420; --m-imp: #3f6fc0; --m-ctr: #bf5a24; --m-pos: #00897b; --m-vis: #9a4aa8; --m-view: #5d8a2a;
  /* Glass: widget cards, menus and the toast sit on the brand ambient; text on them keeps at least 4.5:1. */
  --card: color-mix(in srgb, #FFFFFF 74%, transparent); --card-hi: #FFFFFFd9; --card-line: color-mix(in srgb, #CFC7B6 70%, transparent);
  --raise: color-mix(in srgb, #3D2E12 6%, transparent); --sticky: color-mix(in srgb, #FFFFFF 90%, transparent);
  --pop-bg: color-mix(in srgb, #FFFFFF 88%, transparent);
  --shadow: 0 1px 2px #1c1b180a, 0 10px 30px -12px #3d2e1226;
  --shadow-lift: 0 2px 4px #1c1b180d, 0 18px 40px -14px #3d2e1238;
  --pop: 0 16px 48px -8px #1c1b1830, 0 2px 6px #1c1b1814;
  --glow-a: #DAB54930; --glow-b: #B98A3A1f; --glow-c: #6A4C1A14;
  color-scheme: light;
}
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) {
  --bg: #080807; --panel: #0F0F0E; --line: #2B2924; --track: #22201C;
  --ink: #F8F4EC; --ink2: #D5D3D0; --mute: #A39F96;
  --gold: #DAB549; --gold-soft: #DAB5491f;
  --good: #34D399; --good-soft: #34D3991a; --warn: #f0a23b; --warn-soft: #f0a23b17; --crit: #F87171; --crit-soft: #F8717117;
  --blue: #6f9bef; --mono-icon: invert(1);
  --m-clk: #ad8726; --m-imp: #5b86d0; --m-ctr: #d0703a; --m-pos: #2fa39a; --m-vis: #b46ac0; --m-view: #7da34a;
  --card: color-mix(in srgb, #16150F 62%, transparent); --card-hi: #FFFFFF14; --card-line: color-mix(in srgb, #3A362E 80%, transparent);
  --raise: color-mix(in srgb, #FFF6E0 6%, transparent); --sticky: color-mix(in srgb, #12110D 92%, transparent);
  --pop-bg: color-mix(in srgb, #15140F 86%, transparent);
  --shadow: 0 1px 2px #0008, 0 12px 32px -14px #000c;
  --shadow-lift: 0 2px 4px #0008, 0 20px 44px -14px #000e;
  --pop: 0 18px 50px -6px #000c, 0 2px 6px #0008;
  --glow-a: #DAB54926; --glow-b: #8B672318; --glow-c: #DAB5490f;
  color-scheme: dark; } }
:root[data-theme="dark"] {
  --bg: #080807; --panel: #0F0F0E; --line: #2B2924; --track: #22201C;
  --ink: #F8F4EC; --ink2: #D5D3D0; --mute: #A39F96;
  --gold: #DAB549; --gold-soft: #DAB5491f;
  --good: #34D399; --good-soft: #34D3991a; --warn: #f0a23b; --warn-soft: #f0a23b17; --crit: #F87171; --crit-soft: #F8717117;
  --blue: #6f9bef; --mono-icon: invert(1);
  --m-clk: #ad8726; --m-imp: #5b86d0; --m-ctr: #d0703a; --m-pos: #2fa39a; --m-vis: #b46ac0; --m-view: #7da34a;
  --card: color-mix(in srgb, #16150F 62%, transparent); --card-hi: #FFFFFF14; --card-line: color-mix(in srgb, #3A362E 80%, transparent);
  --raise: color-mix(in srgb, #FFF6E0 6%, transparent); --sticky: color-mix(in srgb, #12110D 92%, transparent);
  --pop-bg: color-mix(in srgb, #15140F 86%, transparent);
  --shadow: 0 1px 2px #0008, 0 12px 32px -14px #000c;
  --shadow-lift: 0 2px 4px #0008, 0 20px 44px -14px #000e;
  --pop: 0 18px 50px -6px #000c, 0 2px 6px #0008;
  --glow-a: #DAB54926; --glow-b: #8B672318; --glow-c: #DAB5490f;
  color-scheme: dark;
}
:root {
  --glass: blur(22px) saturate(1.5);
  /* Type in rem, so the browser's text size and zoom to 200 % scale everything (WCAG 1.4.4). */
  --fs-xs: .78125rem; --fs-s: .84375rem; --fs-m: .9375rem; --fs-b: 1rem; --fs-l: 1.25rem; --fs-xl: 1.75rem; --fs-xxl: 2rem;
  --r-s: 10px; --r-m: 14px; --r-l: 20px;
  --gap: clamp(16px, 1.5vw, 28px); --edge: clamp(16px, 2.4vw, 40px);
  --ease: var(--rise-ease-standard, cubic-bezier(.2, 0, .38, .9)); --ease-in: var(--rise-ease-entrance, cubic-bezier(0, 0, .38, .9));
  --ease-spring: cubic-bezier(.34, 1.4, .64, 1);
  --t-fast: 120ms; --t: 220ms; --t-slow: 480ms;
}
/* Solid surfaces where transparency is unwanted or unsupported; stronger lines on request. */
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  :root { --card: var(--panel); --pop-bg: var(--panel); --sticky: var(--panel); }
}
@media (prefers-reduced-transparency: reduce) {
  :root, :root[data-theme] { --card: var(--panel) !important; --pop-bg: var(--panel) !important; --sticky: var(--panel) !important; --glass: none; }
}
@media (prefers-contrast: more) {
  :root, :root[data-theme] { --card: var(--panel) !important; --pop-bg: var(--panel) !important; --sticky: var(--panel) !important; --glass: none;
    --card-line: var(--mute) !important; --line: var(--mute) !important; }
}
/* Load steps: l1 super, l2 v poriadku, l3 stred, l4 pozor, l5 strašné (ringLevel). The ring, the meters, the lines and
   their gradient stops take the colour of their step from --rc, in cards and on the page alike. */
.l1 { --rc: var(--good); }
.l2 { --rc: color-mix(in srgb, var(--good) 50%, var(--gold)); }
.l3 { --rc: var(--gold); }
.l4 { --rc: var(--warn); }
.l5 { --rc: var(--crit); }
stop { stop-color: var(--rc, var(--good)); }