:root {
  color-scheme: light;

  /* Reference colors: Opifex Brand Book Vivo v1.0 */
  --org-ref-color-teal-900: #0f4f4a;
  --org-ref-color-teal-700: #1f6f68;
  --org-ref-color-teal-100: #dcefeb;
  --org-ref-color-sand-300: #e8ddc8;
  --org-ref-color-sand-100: #f5efe3;
  --org-ref-color-off-white: #faf8f3;
  --org-ref-color-graphite: #263331;
  --org-ref-color-white: #ffffff;
  --org-ref-color-black: #0b1210;

  /* Extended references: technical application and accessible feedback */
  --org-ref-color-surface-lowest: #ffffff;
  --org-ref-color-surface-low: #f7f3ea;
  --org-ref-color-surface-high: #eee7d9;
  --org-ref-color-neutral-600: #55635f;
  --org-ref-color-neutral-500: #71807b;
  --org-ref-color-neutral-300: #cbd2ce;
  --org-ref-color-neutral-200: #dfe4e1;
  --org-ref-color-error-700: #8a1f11;
  --org-ref-color-error-100: #f8e9e4;
  --org-ref-color-warning-700: #704500;
  --org-ref-color-warning-100: #fff5df;
  --org-ref-color-success-700: #176b5b;
  --org-ref-color-success-100: #e0f1eb;
  --org-ref-color-info-700: #315b73;
  --org-ref-color-info-100: #e8f1f6;
  --org-ref-color-focus: #946b2d;

  /* System color roles: MD3-inspired, Opifex-expressed */
  --org-sys-color-primary: var(--org-ref-color-teal-700);
  --org-sys-color-on-primary: var(--org-ref-color-white);
  --org-sys-color-primary-container: var(--org-ref-color-teal-100);
  --org-sys-color-on-primary-container: var(--org-ref-color-teal-900);
  --org-sys-color-surface: var(--org-ref-color-off-white);
  --org-sys-color-surface-container-lowest: var(--org-ref-color-surface-lowest);
  --org-sys-color-surface-container-low: var(--org-ref-color-surface-low);
  --org-sys-color-surface-container: var(--org-ref-color-sand-100);
  --org-sys-color-surface-container-high: var(--org-ref-color-surface-high);
  --org-sys-color-surface-container-highest: var(--org-ref-color-sand-300);
  --org-sys-color-on-surface: var(--org-ref-color-graphite);
  --org-sys-color-on-surface-variant: var(--org-ref-color-neutral-600);
  --org-sys-color-outline: var(--org-ref-color-neutral-500);
  --org-sys-color-outline-variant: var(--org-ref-color-neutral-300);
  --org-sys-color-inverse-surface: var(--org-ref-color-graphite);
  --org-sys-color-inverse-on-surface: var(--org-ref-color-off-white);
  --org-sys-color-error: var(--org-ref-color-error-700);
  --org-sys-color-on-error: var(--org-ref-color-white);
  --org-sys-color-error-container: var(--org-ref-color-error-100);
  --org-sys-color-on-error-container: var(--org-ref-color-error-700);
  --org-sys-color-warning: var(--org-ref-color-warning-700);
  --org-sys-color-warning-container: var(--org-ref-color-warning-100);
  --org-sys-color-success: var(--org-ref-color-success-700);
  --org-sys-color-success-container: var(--org-ref-color-success-100);
  --org-sys-color-info: var(--org-ref-color-info-700);
  --org-sys-color-info-container: var(--org-ref-color-info-100);
  --org-sys-color-focus: var(--org-ref-color-focus);
  --org-sys-color-scrim: rgb(11 18 16 / 52%);

  /* Typography */
  --org-sys-type-family-brand: Manrope, Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --org-sys-type-display-large-size: 2.75rem;
  --org-sys-type-display-large-line: 3.25rem;
  --org-sys-type-display-large-weight: 700;
  --org-sys-type-headline-large-size: 2rem;
  --org-sys-type-headline-large-line: 2.5rem;
  --org-sys-type-headline-large-weight: 700;
  --org-sys-type-headline-small-size: 1.5rem;
  --org-sys-type-headline-small-line: 2rem;
  --org-sys-type-headline-small-weight: 650;
  --org-sys-type-title-medium-size: 1.125rem;
  --org-sys-type-title-medium-line: 1.5rem;
  --org-sys-type-title-medium-weight: 650;
  --org-sys-type-body-large-size: 1rem;
  --org-sys-type-body-large-line: 1.5rem;
  --org-sys-type-body-large-weight: 400;
  --org-sys-type-body-medium-size: 0.875rem;
  --org-sys-type-body-medium-line: 1.25rem;
  --org-sys-type-body-medium-weight: 400;
  --org-sys-type-label-large-size: 0.875rem;
  --org-sys-type-label-large-line: 1.25rem;
  --org-sys-type-label-large-weight: 650;
  --org-sys-type-label-small-size: 0.75rem;
  --org-sys-type-label-small-line: 1rem;
  --org-sys-type-label-small-weight: 600;

  /* Spacing: base 4px */
  --org-sys-space-0: 0;
  --org-sys-space-1: 0.25rem;
  --org-sys-space-2: 0.5rem;
  --org-sys-space-3: 0.75rem;
  --org-sys-space-4: 1rem;
  --org-sys-space-6: 1.5rem;
  --org-sys-space-8: 2rem;
  --org-sys-space-10: 2.5rem;
  --org-sys-space-12: 3rem;
  --org-sys-space-16: 4rem;

  /* Shape */
  --org-sys-shape-small: 0.5rem;
  --org-sys-shape-medium: 0.75rem;
  --org-sys-shape-large: 1rem;
  --org-sys-shape-extra-large: 1.5rem;
  --org-sys-shape-full: 999px;

  /* Elevation */
  --org-sys-elevation-0: none;
  --org-sys-elevation-1: 0 2px 8px rgb(38 51 49 / 10%);
  --org-sys-elevation-2: 0 12px 32px rgb(38 51 49 / 16%);

  /* Motion */
  --org-sys-motion-duration-instant: 100ms;
  --org-sys-motion-duration-short: 160ms;
  --org-sys-motion-duration-medium: 240ms;
  --org-sys-motion-duration-long: 320ms;
  --org-sys-motion-easing-standard: cubic-bezier(0.2, 0, 0, 1);
  --org-sys-motion-easing-exit: cubic-bezier(0.4, 0, 1, 1);

  /* Interaction and layout */
  --org-sys-state-hover-opacity: 8%;
  --org-sys-state-pressed-opacity: 12%;
  --org-sys-state-disabled-opacity: 38%;
  --org-sys-focus-width: 3px;
  --org-sys-focus-offset: 3px;
  --org-sys-target-min: 2.75rem;
  --org-sys-target-mobile: 3rem;
  --org-sys-content-max: 90rem;
  --org-sys-rail-width: 5.5rem;
  --org-sys-drawer-width: 17rem;
  --org-sys-bottom-nav-height: 4.75rem;

  /* Component decisions */
  --org-comp-button-filled-container: var(--org-sys-color-primary);
  --org-comp-button-filled-label: var(--org-sys-color-on-primary);
  --org-comp-button-tonal-container: var(--org-sys-color-primary-container);
  --org-comp-button-tonal-label: var(--org-sys-color-on-primary-container);
  --org-comp-button-outlined-border: var(--org-sys-color-outline);
  --org-comp-button-outlined-label: var(--org-sys-color-primary);
  --org-comp-field-container: var(--org-sys-color-surface-container-lowest);
  --org-comp-field-border: var(--org-sys-color-outline);
  --org-comp-field-border-focus: var(--org-sys-color-primary);
  --org-comp-card-filled-container: var(--org-sys-color-surface-container);
  --org-comp-card-outlined-container: var(--org-sys-color-surface-container-lowest);
  --org-comp-card-outlined-border: var(--org-sys-color-outline-variant);

  /* Temporary aliases for a future controlled migration */
  --color-bg: var(--org-sys-color-surface);
  --color-background: var(--org-sys-color-surface);
  --color-background-soft: var(--org-sys-color-surface-container);
  --color-surface: var(--org-sys-color-surface-container-lowest);
  --color-surface-strong: var(--org-sys-color-primary-container);
  --color-white: var(--org-ref-color-white);
  --color-text: var(--org-sys-color-on-surface);
  --color-muted: var(--org-sys-color-on-surface-variant);
  --color-border: var(--org-sys-color-outline-variant);
  --color-brand: var(--org-sys-color-primary);
  --color-brand-strong: var(--org-ref-color-teal-900);
  --color-primary: var(--org-sys-color-primary);
  --color-primary-strong: var(--org-ref-color-teal-900);
  --color-danger: var(--org-sys-color-error);
  --color-error-bg: var(--org-sys-color-error-container);
  --color-error-border: #d6a397;
  --color-info-bg: var(--org-sys-color-info-container);
  --color-warning-bg: var(--org-sys-color-warning-container);
  --color-warning-text: var(--org-sys-color-warning);
  --color-success-bg: var(--org-sys-color-success-container);
  --color-focus: var(--org-sys-color-focus);
  --shadow-card: var(--org-sys-elevation-1);
  --shadow-soft: var(--org-sys-elevation-1);
  --radius-lg: var(--org-sys-shape-extra-large);
  --radius-md: var(--org-sys-shape-medium);
  --radius-sm: var(--org-sys-shape-small);
  --space-1: var(--org-sys-space-2);
  --space-2: var(--org-sys-space-3);
  --space-3: var(--org-sys-space-4);
  --space-4: var(--org-sys-space-6);
  --space-5: var(--org-sys-space-8);
  --space-6: var(--org-sys-space-12);
  --font-base: var(--org-sys-type-family-brand);
}

* {
  box-sizing: border-box;
}

html {
  min-width: 320px;
  scroll-behavior: smooth;
}

body {
  margin: 0;
  background: var(--org-sys-color-surface);
  color: var(--org-sys-color-on-surface);
  font-family: var(--org-sys-type-family-brand);
  font-size: var(--org-sys-type-body-large-size);
  line-height: var(--org-sys-type-body-large-line);
  text-rendering: optimizeLegibility;
}

button,
input,
select,
textarea {
  color: inherit;
  font: inherit;
}

button,
a,
input,
select,
textarea,
summary {
  -webkit-tap-highlight-color: transparent;
}

button,
a,
input,
select,
textarea {
  min-height: var(--org-sys-target-min);
}

button:focus-visible,
a:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
summary:focus-visible,
[tabindex]:focus-visible {
  outline: var(--org-sys-focus-width) solid var(--org-sys-color-focus);
  outline-offset: var(--org-sys-focus-offset);
}

h1,
h2,
h3,
h4,
p {
  margin-top: 0;
}

h1,
h2,
h3,
h4 {
  text-wrap: balance;
}

p,
li {
  text-wrap: pretty;
}

p,
li,
dd,
td,
th,
.org-field-help,
.org-field-error {
  overflow-wrap: anywhere;
}

a {
  color: var(--org-sys-color-primary);
  text-decoration-thickness: 0.08em;
  text-underline-offset: 0.18em;
}

img,
svg {
  max-width: 100%;
}

[hidden] {
  display: none !important;
}

.org-type-display-large {
  font-size: var(--org-sys-type-display-large-size);
  font-weight: var(--org-sys-type-display-large-weight);
  letter-spacing: -0.025em;
  line-height: var(--org-sys-type-display-large-line);
}

.org-type-headline-large {
  font-size: var(--org-sys-type-headline-large-size);
  font-weight: var(--org-sys-type-headline-large-weight);
  letter-spacing: -0.018em;
  line-height: var(--org-sys-type-headline-large-line);
}

.org-type-headline-small {
  font-size: var(--org-sys-type-headline-small-size);
  font-weight: var(--org-sys-type-headline-small-weight);
  letter-spacing: -0.012em;
  line-height: var(--org-sys-type-headline-small-line);
}

.org-type-title-medium {
  font-size: var(--org-sys-type-title-medium-size);
  font-weight: var(--org-sys-type-title-medium-weight);
  line-height: var(--org-sys-type-title-medium-line);
}

.org-type-body-large {
  font-size: var(--org-sys-type-body-large-size);
  font-weight: var(--org-sys-type-body-large-weight);
  line-height: var(--org-sys-type-body-large-line);
}

.org-type-body-medium {
  font-size: var(--org-sys-type-body-medium-size);
  font-weight: var(--org-sys-type-body-medium-weight);
  line-height: var(--org-sys-type-body-medium-line);
}

.org-type-label-large {
  font-size: var(--org-sys-type-label-large-size);
  font-weight: var(--org-sys-type-label-large-weight);
  line-height: var(--org-sys-type-label-large-line);
}

.org-type-label-small {
  font-size: var(--org-sys-type-label-small-size);
  font-weight: var(--org-sys-type-label-small-weight);
  line-height: var(--org-sys-type-label-small-line);
}

.org-visually-hidden {
  border: 0;
  clip: rect(0 0 0 0);
  clip-path: inset(50%);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  white-space: nowrap;
  width: 1px;
}

@media (max-width: 599px) {
  :root {
    --org-sys-type-display-large-size: 2.25rem;
    --org-sys-type-display-large-line: 2.75rem;
    --org-sys-type-headline-large-size: 1.75rem;
    --org-sys-type-headline-large-line: 2.25rem;
  }

  button,
  a,
  input,
  select,
  textarea {
    min-height: var(--org-sys-target-mobile);
  }
}

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

@media (forced-colors: active) {
  :root {
    --org-sys-focus-width: 2px;
  }

  button,
  a,
  input,
  select,
  textarea,
  summary,
  .org-card,
  .org-chip,
  .org-status {
    forced-color-adjust: auto;
  }
}