@font-face {
  font-family: "Geist";
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url("./geist.ttf") format("truetype");
}

:root {
  color-scheme: light;
  --brand-canvas: #faf9f6;
  --brand-canvas-strong: #f0eee8;
  --brand-surface: #ffffff;
  --brand-surface-raised: #ffffff;
  --brand-surface-muted: #f3f2ed;
  --brand-surface-hover: #ebece5;
  --brand-text: #17212b;
  --brand-text-muted: #4b5864;
  --brand-border: #818980;
  --brand-border-soft: #dedfd8;
  --brand-navy: #17212b;
  --brand-sidebar: #17212b;
  --brand-sidebar-raised: #202d39;
  --brand-sidebar-current: #2b3945;
  --brand-sidebar-text: #f4f7f8;
  --brand-sidebar-muted: #bbc5cc;
  --brand-coral: #ff6d66;
  --brand-coral-hover: #f25d57;
  --brand-coral-soft: #ffe1dd;
  --brand-cyan: #20bfd0;
  --brand-cyan-soft: #cef5f7;
  --brand-orange: #ff9e3d;
  --brand-orange-soft: #ffead1;
  --brand-green: #157a54;
  --brand-green-hover: #106544;
  --brand-green-soft: #ddf5e9;
  --brand-danger: #a52a31;
  --brand-danger-hover: #8e2029;
  --brand-danger-soft: #ffe3e4;
  --brand-focus: #006d84;
  --brand-shadow-small: 0 2px 8px rgb(23 33 43 / 0.05);
  --brand-shadow: 0 16px 48px rgb(23 33 43 / 0.12);
  --brand-control-radius: 0.35rem;
  --brand-control-radius-compact: 0.3rem;
  --brand-control-height: 2.5rem;
  --brand-control-height-compact: 2rem;
  --brand-control-height-large: 3rem;
  --brand-control-shadow: none;
  --brand-control-shadow-hover: none;
  --brand-action-text: #ffffff;
  --brand-action-hover: #106544;
  --brand-success: #157a54;
  --brand-success-hover: #106544;
  --brand-success-soft: #ddf5e9;
  --brand-warning: #8a4b00;
  --brand-warning-soft: #ffead1;
  --brand-info: #0b6575;
  --brand-info-soft: #cef5f7;
  --brand-link: #006d84;
  --brand-link-hover: #004e60;
  --brand-radius-small: 0.4rem;
  --brand-radius: 0.5rem;
  --brand-radius-large: 0.65rem;
  font-family:
    "Geist", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    color-scheme: dark;
    --brand-canvas: #141a20;
    --brand-canvas-strong: #1a222a;
    --brand-surface: #1b232c;
    --brand-surface-raised: #222c36;
    --brand-surface-muted: #202a33;
    --brand-surface-hover: #2a3641;
    --brand-text: #f2f5f7;
    --brand-text-muted: #bcc7d1;
    --brand-border: #65727d;
    --brand-border-soft: #35414c;
    --brand-navy: #eef3f6;
    --brand-sidebar: #10161d;
    --brand-sidebar-raised: #18212a;
    --brand-sidebar-current: #26323d;
    --brand-sidebar-text: #f2f5f7;
    --brand-sidebar-muted: #b4c0c9;
    --brand-coral: #ff8179;
    --brand-coral-hover: #ff978f;
    --brand-coral-soft: #4a262d;
    --brand-cyan: #3ed6e1;
    --brand-cyan-soft: #123f4c;
    --brand-orange: #ffb357;
    --brand-orange-soft: #4b3520;
    --brand-green: #52d49b;
    --brand-green-hover: #6be2ad;
    --brand-green-soft: #123d30;
    --brand-danger: #ff7b82;
    --brand-danger-hover: #ff969b;
    --brand-danger-soft: #4c252e;
    --brand-focus: #72e2ec;
    --brand-action-text: #061321;
    --brand-action-hover: #6be2ad;
    --brand-success: #52d49b;
    --brand-success-hover: #6be2ad;
    --brand-success-soft: #123d30;
    --brand-warning: #ffb357;
    --brand-warning-soft: #4b3520;
    --brand-info: #3ed6e1;
    --brand-info-soft: #123f4c;
    --brand-link: #72e2ec;
    --brand-link-hover: #a0f1f7;
    --brand-shadow-small: 0 12px 34px rgb(0 0 0 / 0.25);
    --brand-shadow: 0 28px 80px rgb(0 0 0 / 0.34);
    --brand-control-shadow: none;
    --brand-control-shadow-hover: none;
  }
}

:root[data-theme="dark"] {
  color-scheme: dark;
  --brand-canvas: #141a20;
  --brand-canvas-strong: #1a222a;
  --brand-surface: #1b232c;
  --brand-surface-raised: #222c36;
  --brand-surface-muted: #202a33;
  --brand-surface-hover: #2a3641;
  --brand-text: #f2f5f7;
  --brand-text-muted: #bcc7d1;
  --brand-border: #65727d;
  --brand-border-soft: #35414c;
  --brand-navy: #eef3f6;
  --brand-sidebar: #10161d;
  --brand-sidebar-raised: #18212a;
  --brand-sidebar-current: #26323d;
  --brand-sidebar-text: #f2f5f7;
  --brand-sidebar-muted: #b4c0c9;
  --brand-coral: #ff8179;
  --brand-coral-hover: #ff978f;
  --brand-coral-soft: #4a262d;
  --brand-cyan: #3ed6e1;
  --brand-cyan-soft: #123f4c;
  --brand-orange: #ffb357;
  --brand-orange-soft: #4b3520;
  --brand-green: #52d49b;
  --brand-green-hover: #6be2ad;
  --brand-green-soft: #123d30;
  --brand-danger: #ff7b82;
  --brand-danger-hover: #ff969b;
  --brand-danger-soft: #4c252e;
  --brand-focus: #72e2ec;
  --brand-action-text: #061321;
  --brand-action-hover: #6be2ad;
  --brand-success: #52d49b;
  --brand-success-hover: #6be2ad;
  --brand-success-soft: #123d30;
  --brand-warning: #ffb357;
  --brand-warning-soft: #4b3520;
  --brand-info: #3ed6e1;
  --brand-info-soft: #123f4c;
  --brand-link: #72e2ec;
  --brand-link-hover: #a0f1f7;
  --brand-shadow-small: 0 12px 34px rgb(0 0 0 / 0.25);
  --brand-shadow: 0 28px 80px rgb(0 0 0 / 0.34);
  --brand-control-shadow: none;
  --brand-control-shadow-hover: none;
}

/* The approved wordmark uses one alpha master in every theme. The mask is
   centered to remove the source's vertical clear space at header sizes. */
.brand-wordmark {
  --wordmark-ink: var(--brand-text);
  --wordmark-cursor: var(--brand-green);
  background:
    linear-gradient(var(--wordmark-cursor), var(--wordmark-cursor)) right bottom / 11% 30% no-repeat,
    var(--wordmark-ink);
  display: inline-block;
  flex: none;
  width: 10rem;
  height: 2rem;
  -webkit-mask: url("./freshdev-wordmark.png") center / 100% auto no-repeat;
  mask: url("./freshdev-wordmark.png") center / 100% auto no-repeat;
}

.sidebar .brand-wordmark,
.auth-visual .brand-wordmark {
  --wordmark-ink: #faf9f6;
  --wordmark-cursor: #52d49b;
}

.brand-wordmark-label {
  clip: rect(0, 0, 0, 0);
  clip-path: inset(50%);
  height: 1px;
  overflow: hidden;
  position: absolute;
  white-space: nowrap;
  width: 1px;
}

@media (max-width: 520px) {
  .brand-wordmark { width: 8rem; height: 1.6rem; }
}

@media (forced-colors: active) {
  .brand-wordmark {
    background: CanvasText;
    forced-color-adjust: none;
  }
}

