:root {
  color-scheme: light;
  --st-color-bg: #fff;
  --st-color-surface: #f8fbfa;
  --st-color-surface-alt: #f2f7f6;
  --st-color-raised: #fff;
  --st-color-text: #152126;
  --st-color-text-secondary: #34464d;
  --st-color-muted: #596c73;
  --st-color-border: #dbe4e3;
  --st-color-border-strong: #aebdbd;
  --st-color-link: #08729c;
  --st-color-link-hover: #00618a;
  --st-color-action: #122026;
  --st-color-action-hover: #35434a;
  --st-color-on-action: #fff;
  --st-color-focus: #087dac;
  --st-color-selection: #dceefe;
  --st-color-selection-text: #122026;
  --st-color-accent-soft: #e5f5fc;
  --st-color-cyan: #1da0db;
  --st-color-magenta: #cb177f;
  --st-color-yellow: #fcee25;
  --st-color-success: #16734b;
  --st-color-error: #b42350;
  --st-shadow-card: 0 20px 60px rgb(16 30 34 / 6%);
  --st-font-sans: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
  --st-font-body: var(--st-font-sans);
  --st-font-heading: var(--st-font-sans);
  --st-text-small: .875rem;
  --st-text-body: 1.125rem;
  --st-text-title: clamp(2.3125rem, 3.6vw, 3.625rem);
  --st-leading-body: 1.55;
  --st-leading-heading: 1.12;
  --st-tracking-heading: -.055em;
  --st-space-1: .25rem;
  --st-space-2: .5rem;
  --st-space-3: .75rem;
  --st-space-4: 1rem;
  --st-space-6: 1.5rem;
  --st-space-8: 2rem;
  --st-space-12: 3rem;
  --st-space-section: clamp(4.375rem, 6vw, 6.5625rem);
  --st-content-max: 130rem;
  --st-gutter: clamp(1.5rem, 3.25vw, 6.25rem);
  --st-reading-width: 65ch;
  --st-radius-control: .5rem;
  --st-radius-card: 1rem;
  --st-border-width: 1px;
  --st-control-min: 3rem;
  --st-duration: 180ms;
  --st-ease: cubic-bezier(.22, 1, .36, 1);
}

:root[data-st-theme="dark"] {
  color-scheme: dark;
  --st-color-bg: #10191e;
  --st-color-surface: #17242b;
  --st-color-surface-alt: #1d2d35;
  --st-color-raised: #22343d;
  --st-color-text: #edf4f6;
  --st-color-text-secondary: #c2d3da;
  --st-color-muted: #a6bac4;
  --st-color-border: #354a54;
  --st-color-border-strong: #607985;
  --st-color-link: #79d4f5;
  --st-color-link-hover: #b9ecff;
  --st-color-action: #edf4f6;
  --st-color-action-hover: #cbdde4;
  --st-color-on-action: #10191e;
  --st-color-focus: #79d4f5;
  --st-color-selection: #264d61;
  --st-color-selection-text: #edf4f6;
  --st-color-accent-soft: #193b4b;
  --st-color-magenta: #f17ab8;
  --st-color-success: #79dfac;
  --st-color-error: #ff91ad;
  --st-shadow-card: 0 20px 60px rgb(0 0 0 / 28%);
}

:where(body.stinga-site) {
  margin: 0;
  background: var(--st-color-bg);
  color: var(--st-color-text);
  font-family: var(--st-font-body);
  font-size: var(--st-text-body);
  line-height: var(--st-leading-body);
}

:where(body.stinga-site) ::selection {
  background: var(--st-color-selection);
  color: var(--st-color-selection-text);
}

.stinga-skip:focus {
  background: var(--st-color-raised);
  color: var(--st-color-text);
}

:where(body.stinga-site) a:where(:not([class])),
:where(.st-copy) a:where(:not(.st-button)) {
  color: var(--st-color-link);
  text-decoration: underline;
  text-underline-offset: .2em;
}

:where(body.stinga-site) a:where(:not([class])):hover,
:where(.st-copy) a:where(:not(.st-button)):hover {
  color: var(--st-color-link-hover);
}

:where(.st-component) :where(button, input, select, textarea) {
  font: inherit;
}

:where(.st-component) :where(img, video) {
  max-inline-size: 100%;
  block-size: auto;
}

:where(.st-component) :where(button, a, input, textarea, select, summary):focus-visible,
.st-button:focus-visible {
  outline: 3px solid var(--st-color-focus);
  outline-offset: 3px;
}

.st-container {
  inline-size: min(var(--st-content-max), calc(100% - var(--st-gutter) * 2));
  margin-inline: auto;
  min-inline-size: 0;
}

.st-section {
  padding-block: var(--st-space-section);
}

.st-title {
  margin-block: 0 var(--st-space-4);
  font-family: var(--st-font-heading);
  font-size: var(--st-text-title);
  font-weight: 700;
  line-height: var(--st-leading-heading);
  letter-spacing: var(--st-tracking-heading);
  color: var(--st-color-text);
  overflow-wrap: anywhere;
}

.st-copy {
  max-inline-size: var(--st-reading-width);
  color: var(--st-color-text-secondary);
}

.st-muted {
  color: var(--st-color-muted);
}

.st-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--st-space-3);
  min-block-size: var(--st-control-min);
  padding: var(--st-space-3) var(--st-space-6);
  border: var(--st-border-width) solid var(--st-color-action);
  border-radius: var(--st-radius-control);
  background: var(--st-color-action);
  color: var(--st-color-on-action);
  font: 600 1rem/1.25 var(--st-font-body);
  text-align: center;
  text-decoration: none;
  white-space: normal;
  overflow-wrap: anywhere;
  cursor: pointer;
  transition: background-color var(--st-duration) var(--st-ease), border-color var(--st-duration) var(--st-ease), color var(--st-duration) var(--st-ease);
}

.st-button:hover {
  border-color: var(--st-color-action-hover);
  background: var(--st-color-action-hover);
  color: var(--st-color-on-action);
}

.st-button--outline {
  border-color: var(--st-color-border-strong);
  background: transparent;
  color: var(--st-color-text);
}

.st-button--outline:hover {
  border-color: var(--st-color-text);
  background: var(--st-color-surface-alt);
  color: var(--st-color-text);
}

.st-button:disabled {
  opacity: .55;
  cursor: not-allowed;
}

.st-sr-only:not(:focus):not(:active) {
  position: absolute;
  inline-size: 1px;
  block-size: 1px;
  padding: 0;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}

@media (max-width: 62.5rem) {
  :root { --st-gutter: 1.3125rem; }
}

@media (max-width: 48.75rem) {
  :root { --st-gutter: 1.125rem; --st-text-body: 1.0625rem; }
}

@media (max-width: 30rem) {
  :root { --st-gutter: .875rem; }
}

@media (prefers-reduced-motion: reduce) {
  :root { --st-duration: 0ms; }
}
