/* Choice Box Web — generated from tokens.json */
:root, [data-theme="light"] {
  --bg: #ffffff;
  --surface: #f4f5f7;
  --surface-2: #e6e8ec;
  --line: #eef0f3;
  --line-strong: #868c97;
  --ink: #121419;
  --ink-muted: #5b606b;
  --accent: #2453c9;
  --accent-hover: #173b99;
  --accent-tint: #eaf0fd;
  --on-accent: #ffffff;
  --success: #1f7a4d;
  --success-tint: #e7f4ec;
  --on-success: #ffffff;
  --warning: #8a5100;
  --warning-tint: #fdf1dc;
  --danger: #b42318;
  --danger-tint: #fdecea;
  --on-danger: #ffffff;
  --knob: #ffffff;
  --focus: var(--accent);
}
[data-theme="dark"] {
  --bg: #0d0e11;
  --surface: #17191e;
  --surface-2: #24272e;
  --line: #23262d;
  --line-strong: #6e7480;
  --ink: #ecedf0;
  --ink-muted: #9ba0ab;
  --accent: #8fb0ff;
  --accent-hover: #b9ceff;
  --accent-tint: #18213a;
  --on-accent: #0d1530;
  --success: #6cd39e;
  --success-tint: #10281c;
  --on-success: #07170f;
  --warning: #f0b45c;
  --warning-tint: #2d2111;
  --danger: #ff8f86;
  --danger-tint: #371512;
  --on-danger: #2a0906;
  --knob: #ecedf0;
  --focus: var(--accent);
}
:root {
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-12: 48px;
  --space-16: 64px;
  --radius-sm: 8px;
  --radius-md: 12px;
  --radius-lg: 16px;
  --radius-xl: 20px;
  --radius-pill: 999px;
  --tap-min: 44px;
  --dock-button: 54px;
  --row-min: 56px;
  --phone-width: 390px;
  --pc-container: 1600px;
  --safe-top: 54px;
  --safe-bottom: 34px;
  --font-sans: "M PLUS 1", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Yu Gothic UI", Meiryo, system-ui, sans-serif;
  --font-mono: "SF Mono", ui-monospace, "Cascadia Mono", Consolas, monospace;
}
.text-display {
  font-family: var(--font-sans);
  font-size: 30px;
  line-height: 38px;
  font-weight: 800;
  letter-spacing: -0.01em;
}
.text-choice {
  font-family: var(--font-sans);
  font-size: 26px;
  line-height: 38px;
  font-weight: 700;
}
.text-title {
  font-family: var(--font-sans);
  font-size: 20px;
  line-height: 28px;
  font-weight: 700;
}
.text-row {
  font-family: var(--font-sans);
  font-size: 17px;
  line-height: 24px;
  font-weight: 600;
}
.text-button {
  font-family: var(--font-sans);
  font-size: 16px;
  line-height: 24px;
  font-weight: 700;
}
.text-body {
  font-family: var(--font-sans);
  font-size: 15px;
  line-height: 24px;
  font-weight: 400;
}
.text-label {
  font-family: var(--font-sans);
  font-size: 13px;
  line-height: 20px;
  font-weight: 600;
}
.text-meta {
  font-family: var(--font-sans);
  font-size: 13px;
  line-height: 20px;
  font-weight: 500;
}
.text-eyebrow {
  font-family: var(--font-sans);
  font-size: 12px;
  line-height: 16px;
  font-weight: 700;
  letter-spacing: 0.08em;
}
.text-code {
  font-family: var(--font-mono);
  font-size: 13px;
  line-height: 20px;
  font-weight: 500;
}
