@layer alz.material {
:root,
[data-style],
[data-palette],
[data-theme] {
  --mat-sys-primary: var(--accent);
  --mat-sys-on-primary: var(--fg-on-accent);
  --mat-sys-primary-container: var(--accent-subtle);
  --mat-sys-on-primary-container: var(--fg-heading);
  --mat-sys-secondary: var(--accent-alt);
  --mat-sys-secondary-container: var(--accent-subtle);
  --mat-sys-on-secondary-container: var(--fg-heading);
  --mat-sys-background: var(--bg-canvas);
  --mat-sys-surface: var(--bg-surface);
  --mat-sys-surface-variant: var(--bg-muted);
  --mat-sys-on-surface: var(--fg);
  --mat-sys-on-background: var(--fg);
  --mat-sys-on-surface-variant: var(--fg-muted);
  --mat-sys-surface-container-low: var(--bg-surface);
  --mat-sys-surface-container-lowest: var(--bg-surface);
  --mat-sys-surface-container: var(--bg-muted);
  --mat-sys-surface-container-high: var(--bg-muted);
  --mat-sys-surface-container-highest: var(--bg-muted);
  --mat-sys-outline: var(--border-input);
  --mat-sys-outline-variant: var(--border);
  --mat-sys-error: var(--status-danger);
  --mat-sys-on-error: var(--status-danger-bg);
  --mat-sys-error-container: var(--status-danger-bg);
  --mat-sys-on-error-container: var(--status-danger);
  --mat-sys-scrim: var(--bg-scrim);
  --mat-sys-corner-small: var(--radius-sm);
  --mat-sys-corner-medium: var(--radius-md);
  --mat-sys-corner-large: var(--radius-lg);
  --mat-sys-body-medium-font: var(--font-family-body);
  --mat-sys-label-large-font: var(--font-family-control);
  --mat-sys-headline-medium-font: var(--font-family-display);
}
}

@layer alz.material {
:is([data-style="alianza"], [data-style="alianza-shadow"]) {
  --mat-sys-display-large: var(--type-display-weight) var(--mat-sys-display-large-size) / var(--mat-sys-display-large-line-height) var(--font-family-display);
  --mat-sys-display-medium: var(--type-display-weight) var(--mat-sys-display-medium-size) / var(--mat-sys-display-medium-line-height) var(--font-family-display);
  --mat-sys-display-small: var(--type-display-weight) var(--mat-sys-display-small-size) / var(--mat-sys-display-small-line-height) var(--font-family-display);
  --mat-sys-headline-large: var(--type-display-weight) var(--mat-sys-headline-large-size) / var(--mat-sys-headline-large-line-height) var(--font-family-display);
  --mat-sys-headline-medium: var(--type-display-weight) var(--mat-sys-headline-medium-size) / var(--mat-sys-headline-medium-line-height) var(--font-family-display);
  --mat-sys-headline-small: var(--type-display-weight) var(--mat-sys-headline-small-size) / var(--mat-sys-headline-small-line-height) var(--font-family-display);
  --mat-sys-title-large: var(--type-title-weight) var(--mat-sys-title-large-size) / var(--mat-sys-title-large-line-height) var(--font-family-display);
  --mat-sys-title-medium: var(--type-title-weight) var(--mat-sys-title-medium-size) / var(--mat-sys-title-medium-line-height) var(--font-family-display);
  --mat-sys-title-small: var(--type-title-weight) var(--mat-sys-title-small-size) / var(--mat-sys-title-small-line-height) var(--font-family-display);
  --mat-sys-body-large: var(--font-weight-regular) var(--mat-sys-body-large-size) / var(--mat-sys-body-large-line-height) var(--font-family-body);
  --mat-sys-body-medium: var(--font-weight-regular) var(--mat-sys-body-medium-size) / var(--mat-sys-body-medium-line-height) var(--font-family-body);
  --mat-sys-body-small: var(--font-weight-regular) var(--mat-sys-body-small-size) / var(--mat-sys-body-small-line-height) var(--font-family-body);
  --mat-sys-display-large-weight: var(--type-display-weight);
  --mat-sys-display-medium-weight: var(--type-display-weight);
  --mat-sys-display-small-weight: var(--type-display-weight);
  --mat-sys-headline-large-weight: var(--type-display-weight);
  --mat-sys-headline-medium-weight: var(--type-display-weight);
  --mat-sys-headline-small-weight: var(--type-display-weight);
  --mat-sys-title-large-weight: var(--type-title-weight);
  --mat-sys-title-medium-weight: var(--type-title-weight);
  --mat-sys-title-small-weight: var(--type-title-weight);
  --mat-sys-body-large-weight: var(--font-weight-regular);
  --mat-sys-body-medium-weight: var(--font-weight-regular);
  --mat-sys-body-small-weight: var(--font-weight-regular);
  font-weight: var(--font-weight-regular);
}

:is([data-style="alianza"], [data-style="alianza-shadow"]) :where(h1) {
  font-family: var(--font-family-display);
  font-weight: var(--type-display-weight);
}

:is([data-style="alianza"], [data-style="alianza-shadow"]) :where(h2, h3, h4, h5, h6) {
  font-family: var(--font-family-display);
  font-weight: var(--type-title-weight);
}
}

:where(.mat-mdc-button-base) {
  min-block-size: var(--control-height);
  border-radius: var(--button-radius);
  transition-duration: var(--motion-duration-fast);
}

:is(
  [data-style] .mat-mdc-card,
  [data-style].mat-mdc-card,
  [data-style] .mat-mdc-dialog-surface,
  [data-style].mat-mdc-dialog-surface,
  [data-style] .mat-bottom-sheet-container,
  [data-style].mat-bottom-sheet-container
) {
  background-color: var(--skin-panel-fill);
  background-image: var(--skin-panel-texture);
  border: var(--skin-panel-edge);
  box-shadow: var(--skin-panel-shadow);
  backdrop-filter: blur(var(--skin-panel-blur));
}

:where(.mat-mdc-form-field) {
  --mat-form-field-outlined-outline-color: var(--border-input);
  --mat-form-field-outlined-focus-outline-color: var(--focus-ring);
  --mat-form-field-outlined-error-outline-color: var(--status-danger);
  --mat-form-field-filled-container-color: var(--bg-muted);
  --mat-form-field-filled-active-indicator-color: var(--border-input);
  --mat-form-field-filled-focus-active-indicator-color: var(--focus-ring);
}

.mat-expansion-panel .mat-expansion-panel-body {
  padding: var(--space-4) var(--space-6);
  border-block-start: 1px var(--skin-rule-style) var(--border);
  color: var(--fg);
  background: var(--bg-muted);
}

[data-style="terminal"] {
  --skin-control-before: "[";
  --skin-control-after: "]";
  --skin-chip-before: "(";
  --skin-chip-after: ")";
  --skin-chip-edge: 1px dashed var(--border-input);
  --skin-heading-before: ">";
  --skin-check-on: "[x]";
  --skin-check-off: "[ ]";
  --skin-panel-edge: 1px dashed var(--border-input);
  --skin-rule-style: dashed;
  --skin-rail-height: 6px;
  --skin-progress-fill: repeating-linear-gradient(90deg, var(--accent) 0 0.45rem, transparent 0.45rem 0.6rem);
  --skin-glow: 0 0 18px color-mix(in srgb, var(--fg) 28%, transparent);
  --skin-text-glow: 0 0 8px color-mix(in srgb, var(--fg) 40%, transparent);
}

[data-style="terminal"] :where(.mat-mdc-button-base):not(.mat-mdc-icon-button):not(.mat-mdc-fab) {
  border-radius: 0;
  border-style: dashed;
  font-family: var(--font-family-mono);
}

[data-style="terminal"] :where(.mat-mdc-button-base):not(.mat-mdc-icon-button):not(.mat-mdc-fab) .mdc-button__label::before {
  content: var(--skin-control-before);
  margin-inline-end: 0.35em;
}

[data-style="terminal"] :where(.mat-mdc-button-base):not(.mat-mdc-icon-button):not(.mat-mdc-fab) .mdc-button__label::after {
  content: var(--skin-control-after);
  margin-inline-start: 0.35em;
}

[data-style="terminal"] .mdc-evolution-chip__text-label::before {
  content: var(--skin-chip-before);
}

[data-style="terminal"] .mdc-evolution-chip__text-label::after {
  content: var(--skin-chip-after);
}

[data-style="terminal"] .mdc-evolution-chip__action {
  border: var(--skin-chip-edge);
  border-radius: 0;
  background: var(--skin-chip-fill);
}

[data-style="terminal"] :where(.mat-mdc-card-title, h1, h2, h3)::before {
  content: var(--skin-heading-before);
  margin-inline-end: 0.5em;
}

[data-style="terminal"] :where(.mat-mdc-card-title, h1, h2, h3) {
  text-shadow: var(--skin-text-glow);
}

[data-style="terminal"] :is(.mat-mdc-card, .mat-mdc-dialog-surface, .mat-bottom-sheet-container),
[data-style="terminal"].mat-mdc-card,
[data-style="terminal"].mat-mdc-dialog-surface,
[data-style="terminal"].mat-bottom-sheet-container {
  box-shadow: var(--skin-glow);
}

[data-style="terminal"] .mdc-checkbox__background::after {
  display: grid;
  width: max-content;
  border: 0;
  content: var(--skin-check-off);
  font-family: var(--font-family-mono);
  place-items: center;
  transform: none;
}

[data-style="terminal"] .mdc-checkbox--selected .mdc-checkbox__background::after {
  content: var(--skin-check-on);
}

[data-style="terminal"] .mat-mdc-progress-bar .mdc-linear-progress__bar-inner {
  background-image: var(--skin-progress-fill);
  block-size: var(--skin-rail-height);
}

[data-style="terminal"] .mat-mdc-slider .mdc-slider__track--active_fill {
  background-image: var(--skin-progress-fill);
}

[data-style="sketch"] {
  --skin-panel-edge: 1.5px solid var(--border-input);
  --skin-panel-shadow: 4px 4px 0 var(--border-input);
  --skin-panel-texture: repeating-linear-gradient(to bottom, transparent 0 1.65rem, color-mix(in srgb, var(--border) 30%, transparent) 1.65rem 1.7rem);
  --skin-primary-texture: repeating-linear-gradient(135deg, transparent 0 5px, color-mix(in srgb, var(--fg) 18%, transparent) 5px 6px);
  --skin-rail-texture: repeating-linear-gradient(135deg, var(--bg-muted) 0 4px, color-mix(in srgb, var(--border-input) 45%, var(--bg-muted)) 4px 6px);
  --skin-thumb-texture: repeating-linear-gradient(135deg, var(--accent) 0 3px, color-mix(in srgb, var(--fg-on-accent) 35%, var(--accent)) 3px 5px);
}

[data-style="sketch"] :where(.mat-mdc-card, .mat-mdc-dialog-surface, .mat-bottom-sheet-container) {
  position: relative;
  border-radius: var(--radius-sm);
  box-shadow: var(--skin-panel-shadow);
}

[data-style="sketch"] :is(.mat-mdc-card, .mat-mdc-dialog-surface)::after,
[data-style="sketch"].mat-mdc-card::after,
[data-style="sketch"].mat-mdc-dialog-surface::after {
  position: absolute;
  inset: 3px;
  border: 1px solid var(--border-input);
  border-radius: inherit;
  content: "";
  filter: url(#alz-pencil);
  pointer-events: none;
}

[data-style="sketch"] :where(.mat-mdc-unelevated-button, .mat-mdc-raised-button) {
  background-image: var(--skin-primary-texture);
  box-shadow: 2px 2px 0 var(--border-input);
}

[data-style="sketch"] .mat-mdc-progress-bar .mdc-linear-progress__bar-inner {
  background-image: var(--skin-rail-texture);
  block-size: var(--skin-rail-height);
}

[data-style="sketch"] .mat-mdc-slider .mdc-slider__track--active_fill {
  background-image: var(--skin-rail-texture);
}

[data-style="sketch"] .mat-mdc-slider .mdc-slider__thumb-knob {
  background-image: var(--skin-thumb-texture);
  border-radius: var(--skin-thumb-radius);
  box-shadow: var(--skin-thumb-shadow);
  filter: url(#alz-pencil-2);
}

[data-style="plasma"] {
  --skin-canvas:
    radial-gradient(ellipse at 18% 0%, color-mix(in srgb, var(--accent) 25%, transparent), transparent 58%),
    radial-gradient(ellipse at 88% 18%, color-mix(in srgb, var(--accent-alt) 22%, transparent), transparent 54%);
  --skin-panel-fill: color-mix(in srgb, var(--bg-surface) 84%, transparent);
  --skin-panel-blur: 16px;
  --skin-panel-edge: 1px solid color-mix(in srgb, var(--fg) 20%, transparent);
  --skin-panel-shadow: 0 1px 0 color-mix(in srgb, var(--fg) 30%, transparent) inset, var(--elevation-2);
  --skin-primary-fill: color-mix(in srgb, var(--accent) 46%, transparent);
  --skin-primary-blur: 4px;
  --skin-primary-edge: 1px solid color-mix(in srgb, var(--fg) 36%, var(--accent));
  --skin-glow: 0 0 22px color-mix(in srgb, var(--accent) 40%, transparent);
}

[data-style="plasma"] body {
  isolation: isolate;
}

[data-style="plasma"] body::before {
  position: fixed;
  z-index: 0;
  inset: 0;
  background: var(--skin-canvas);
  content: "";
  pointer-events: none;
}

[data-style="plasma"] body > * {
  position: relative;
  z-index: 1;
}

[data-style="plasma"] :is(.mat-mdc-card, .mat-mdc-dialog-surface, .mat-bottom-sheet-container),
[data-style="plasma"].mat-mdc-card,
[data-style="plasma"].mat-mdc-dialog-surface,
[data-style="plasma"].mat-bottom-sheet-container {
  background-image: linear-gradient(180deg, color-mix(in srgb, var(--fg) 12%, transparent), transparent 1.5rem), var(--skin-panel-texture);
}

[data-style="plasma"] :where(.mat-mdc-unelevated-button, .mat-mdc-raised-button) {
  background-color: var(--skin-primary-fill);
  border: var(--skin-primary-edge);
  backdrop-filter: blur(var(--skin-primary-blur));
}

[data-style="plasma"] :where(.mat-mdc-button-base, .mat-mdc-form-field):focus-within {
  box-shadow: var(--skin-glow);
}

[data-style="alianza-shadow"] {
  --skin-panel-edge: 1px solid color-mix(in srgb, var(--border) 55%, transparent);
  --skin-panel-shadow: 0 8px 24px color-mix(in srgb, var(--fg) 12%, transparent);
  --skin-control-fill: var(--bg-muted);
  --skin-control-edge: 1px solid transparent;
  --skin-control-shadow: inset 0 0 0 1px color-mix(in srgb, var(--border-input) 45%, transparent);
}

[data-style="alianza-shadow"] :is(.mat-mdc-card, .mat-mdc-dialog-surface, .mat-bottom-sheet-container),
[data-style="alianza-shadow"].mat-mdc-card,
[data-style="alianza-shadow"].mat-mdc-dialog-surface,
[data-style="alianza-shadow"].mat-bottom-sheet-container {
  border-radius: var(--radius-lg);
  box-shadow: var(--skin-panel-shadow);
}

[data-style="alianza-shadow"] .mat-mdc-form-field .mdc-text-field {
  background: var(--skin-control-fill);
  border-radius: var(--radius-md);
  box-shadow: var(--skin-control-shadow);
}

[data-style="alianza-shadow"] .mat-mdc-form-field:focus-within .mdc-text-field {
  box-shadow: inset 0 0 0 2px var(--focus-ring);
}

[data-style="alianza-shadow"] :where(.mat-mdc-button-base) {
  border-radius: var(--radius-lg);
}

[data-style="alianza-shadow"] :where(.mat-mdc-button-base):active {
  transform: translateY(1px);
}