/* DeskGo 官网。视觉约定见 docs/官网设计系统.md */

/* tokens：字体、色板、页面底 */
@font-face {
  font-family: Satoshi;
  src: url("/assets/fonts/Satoshi-Regular.woff2") format("woff2");
  font-weight: 400;
  font-display: swap;
}
@font-face {
  font-family: Satoshi;
  src: url("/assets/fonts/Satoshi-Medium.woff2") format("woff2");
  font-weight: 500;
  font-display: swap;
}
@font-face {
  font-family: Satoshi;
  src: url("/assets/fonts/Satoshi-Bold.woff2") format("woff2");
  font-weight: 700;
  font-display: swap;
}

:root {
  --bg: #f4f4f5;
  --bg-2: #ececee;
  --paper: #fafafa;
  --ink: #18181b;
  --muted: #52525b;
  --line: rgba(24, 24, 27, 0.12);
  --gutter: clamp(28px, 6vw, 72px);
  --page: 1140px;
  --board: #18181b;
  --board-2: #27272a;
  --board-ink: #f4f4f5;
  --board-muted: #a1a1aa;
  --board-line: rgba(244, 244, 245, 0.1);
  --lamp: #d4d4d8;
  --ok: #4ade80;
  --wait: #fbbf24;
  --cut: #b42318;
  --cut-on-board: #f87171;
  --shadow: 0 28px 56px rgba(24, 24, 27, 0.16);
  --board-border: #3f3f46;
  --font: "Satoshi", "PingFang SC", "Hiragino Sans GB", "Noto Sans SC", "Microsoft YaHei", sans-serif;
  --top-h: 68px;
  --radius: 12px;
  --ease: cubic-bezier(0.16, 1, 0.3, 1);
  color-scheme: light;
}

html[data-theme="dark"] {
  color-scheme: dark;
  --bg: #0a1020;
  --bg-2: #0d1428;
  --paper: #161d30;
  --ink: #fafafa;
  --muted: #a8b4c8;
  --line: rgba(176, 196, 230, 0.14);
  --board: #101624;
  --board-2: #1a2438;
  --board-ink: #f4f4f5;
  --board-muted: #9aabc4;
  --board-line: rgba(176, 196, 230, 0.12);
  --lamp: #3d4a66;
  --shadow: 0 28px 56px rgba(4, 8, 20, 0.55);
  --board-border: rgba(176, 196, 230, 0.18);
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: auto; }
html, body {
  margin: 0;
  min-height: 100%;
  background: var(--bg);
  color: var(--ink);
  font-family: var(--font);
  font-size: 16px;
  line-height: 1.55;
  overscroll-behavior-y: none;
}
html { scrollbar-gutter: stable; }
::selection { background: var(--ink); color: var(--paper); }
:focus-visible {
  outline: 2px solid var(--ink);
  outline-offset: 3px;
}
.board :focus-visible { outline-color: var(--board-ink); }
body { scrollbar-color: #a1a1aa var(--bg-2); }
html[data-theme="dark"] body { scrollbar-color: #52525b var(--bg-2); }
body::-webkit-scrollbar { width: 10px; }
body::-webkit-scrollbar-thumb { background: #a1a1aa; border-radius: 10px; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; }
.hidden { display: none !important; }
[id] { scroll-margin-top: 88px; }