@font-face {
  font-family: "TC Sans";
  font-style: normal;
  font-weight: 200 800;
  font-display: swap;
  src: url("/fonts/pjs-latin.woff2") format("woff2");
}

body.tc-studio {
  --tc-canvas: #f0ecdf;
  --tc-paper: #fbf8ef;
  --tc-paper-strong: #fffdf7;
  --tc-ink: #151512;
  --tc-ink-soft: #5d5b53;
  --tc-line: rgba(21, 21, 18, 0.24);
  --tc-line-soft: rgba(21, 21, 18, 0.12);
  --tc-action: #1648d8;
  --tc-action-strong: #0e35aa;
  --tc-signal: #df3d2e;
  --tc-highlight: #f4d45f;
  --tc-success: #167254;
  --tc-dark: #11110f;
  --tc-dark-soft: #23231f;
  --tc-white: #fffdf7;
  --tc-display: Georgia, "Times New Roman", serif;
  --tc-sans: "TC Sans", "Plus Jakarta Sans", system-ui, sans-serif;
  --tc-mono: ui-monospace, "SFMono-Regular", "SF Mono", Menlo, Consolas, monospace;
  --tc-nav-height: 68px;
  --tc-gutter: clamp(20px, 4vw, 64px);
  --tc-max: 1240px;
  --tc-radius-sm: 3px;
  --tc-radius-md: 8px;
  --tc-radius-lg: 18px;
  --tc-shadow-paper: 0 18px 60px rgba(25, 23, 17, 0.13), 0 2px 8px rgba(25, 23, 17, 0.08);
  --tc-ease: cubic-bezier(0.22, 1, 0.36, 1);
  --tc-fast: 160ms;
  --tc-medium: 420ms;
  color: var(--tc-ink);
  background: var(--tc-canvas);
  font-family: var(--tc-sans);
  color-scheme: light;
}

body.tc-studio .nav-logo {
  display: inline-flex;
  align-items: center;
  gap: 0;
  white-space: nowrap;
}

body.tc-studio .nav-logo::before {
  content: none;
}

body.tc-studio .brand-underline {
  position: relative;
  display: inline-block;
  color: inherit !important;
}

body.tc-studio .brand-underline::after {
  content: "";
  position: absolute;
  left: -0.04em;
  right: -0.11em;
  bottom: 0.01em;
  height: clamp(1px, 0.065em, 2px);
  background: var(--tc-signal);
  transform: rotate(-0.3deg);
  transform-origin: left center;
  pointer-events: none;
}

body.tc-studio *,
body.tc-studio *::before,
body.tc-studio *::after {
  box-sizing: border-box;
}

body.tc-studio ::selection {
  color: var(--tc-ink);
  background: var(--tc-highlight);
}

body.tc-studio :focus-visible {
  outline: 3px solid var(--tc-action);
  outline-offset: 4px;
}

body.tc-studio .tc-mono {
  font-family: var(--tc-mono);
}

@media (prefers-reduced-motion: reduce) {
  body.tc-studio *,
  body.tc-studio *::before,
  body.tc-studio *::after {
    scroll-behavior: auto !important;
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}
