@font-face {
  font-family: "IBM Plex Sans";
  src: url("../fonts/IBMPlexSans-Regular.woff2") format("woff2");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: "IBM Plex Sans";
  src: url("../fonts/IBMPlexSans-Medium.woff2") format("woff2");
  font-style: normal;
  font-weight: 500;
  font-display: swap;
}
@font-face {
  font-family: "IBM Plex Sans";
  src: url("../fonts/IBMPlexSans-SemiBold.woff2") format("woff2");
  font-style: normal;
  font-weight: 600;
  font-display: swap;
}
@font-face {
  font-family: "IBM Plex Sans";
  src: url("../fonts/IBMPlexSans-Bold.woff2") format("woff2");
  font-style: normal;
  font-weight: 700;
  font-display: swap;
}
@font-face {
  font-family: "IBM Plex Mono";
  src: url("../fonts/IBMPlexMono-Regular.woff2") format("woff2");
  font-style: normal;
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: "IBM Plex Mono";
  src: url("../fonts/IBMPlexMono-Medium.woff2") format("woff2");
  font-style: normal;
  font-weight: 500;
  font-display: swap;
}
@font-face {
  font-family: "IBM Plex Mono";
  src: url("../fonts/IBMPlexMono-SemiBold.woff2") format("woff2");
  font-style: normal;
  font-weight: 600;
  font-display: swap;
}

:root, [data-theme="dark"] {
  --font-ui: "IBM Plex Sans", "Segoe UI", Arial, sans-serif;
  --font-mono: "IBM Plex Mono", Consolas, monospace;
  --bg: #151515;
  --chart-bg: #000000;
  --panel: #222222;
  --panel-2: #2B2B2B;
  --border: #363636;
  --text: #E6E6E6;
  --muted: #AAAAAA;
  --accent: #D6B575;
  --accent-fill: #D6B575;
  --on-accent: #171717;
  --accent-label-text: #171717;
  --accent-hover: #E4C78E;
  --accent-soft: rgba(214, 181, 117, 0.18);
  --up: #089981;
  --down: #f23645;
  --hover: #2B2B2B;
  --grid: #1A1A1A;
  --divider: #555555;
  --input: #151515;
  --shadow: 0 8px 32px rgba(0, 0, 0, 0.45);
  --gold: #D6B575;
  --gold-soft: rgba(214, 181, 117, 0.16);
  --scroll: #484848;
  color-scheme: dark;
}
[data-theme="light"] {
  --bg: #F5F5F5;
  --chart-bg: #FFFFFF;
  --panel: #EEEEEE;
  --panel-2: #E3E3E3;
  --border: #D0D0D0;
  --text: #222222;
  --muted: #626262;
  --accent: #805D19;
  --accent-label-text: #FFFFFF;
  --accent-soft: rgba(128, 93, 25, 0.12);
  --hover: #E3E3E3;
  --grid: #E9E9E9;
  --divider: #AAAAAA;
  --input: #FFFFFF;
  --shadow: 0 8px 32px rgba(0, 0, 0, 0.15);
  --gold: #805D19;
  --gold-soft: rgba(128, 93, 25, 0.14);
  --scroll: #BBBBBB;
  color-scheme: light;
}
@media (prefers-color-scheme: light) {
  :root:not([data-theme]) {
  --bg: #F5F5F5;
  --chart-bg: #FFFFFF;
  --panel: #EEEEEE;
  --panel-2: #E3E3E3;
  --border: #D0D0D0;
  --text: #222222;
  --muted: #626262;
  --accent: #805D19;
  --accent-label-text: #FFFFFF;
  --accent-soft: rgba(128, 93, 25, 0.12);
  --hover: #E3E3E3;
  --grid: #E9E9E9;
  --divider: #AAAAAA;
  --input: #FFFFFF;
  --shadow: 0 8px 32px rgba(0, 0, 0, 0.15);
  --gold: #805D19;
  --gold-soft: rgba(128, 93, 25, 0.14);
  --scroll: #BBBBBB;
  color-scheme: light;
  }
}
