@font-face {
  font-family: "ToolLatin";
  src: url("./latin.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+2000-206F, U+2212;
  font-display: swap;
}

:root {
  --primary: #0078d4;
  --primary-dark: #005a9e;
  --base: #f3f3f3;
  --surface: #ffffff;
  --text: #1f1f1f;
  --muted: #605e5c;
  --faint: #767472;
  --line: #e1dfdd;
  --selected: #ebf3fc;
  --hover: #f5f5f5;
  --ok: #107c10;
  --warn: #9d5d00;
  --fail: #c42b1c;
  --on-primary: #ffffff;
  --scroll: #c8c6c4;
  --scroll-hover: #a19f9d;
  --disabled-text: #a19f9d;
  --shadow-pop: 0 6px 16px rgba(0, 0, 0, 0.08), 0 3px 6px rgba(0, 0, 0, 0.12);
  --font-mono: "Cascadia Mono", Consolas, "Courier New", monospace;
  --radius-card: 0;
  --radius: 4px;
  --radius-lg: 8px;
  --ease: 0.15s ease;
  --panel: 0.18s ease;
  --sidebar: 180px;
  --config: 360px;
  --label: 68px;
  --control: 32px;
  --topbar: 46px;
  --fs-title: 15px;
  --fs-body: 13px;
  --fs-label: 12px;
  --space-s: 8px;
  --space-m: 12px;
  --space-row: 10px;
  --icon-hit: 34px;
  --nav-mark: 3px;
  --nav-pad: 9px 10px;
  --btn-pad: 0 14px;
  --cell-pad: 5px 10px;
  --copy-hit: 24px;
  --toast-pad: 8px 12px;
  --z-toast: 300;
}

* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

[hidden] {
  display: none;
}

html,
body,
.app {
  height: 100%;
  overflow: hidden;
}

body {
  font-family: "ToolLatin", "Microsoft YaHei UI", "Segoe UI", "PingFang SC", sans-serif;
  font-size: var(--fs-body);
  color: var(--text);
  background: var(--base);
  -webkit-font-smoothing: antialiased;
}

.app {
  display: flex;
  flex-direction: column;
}