/* Space Western */

:root {
	/* Colors */
	--ag-bg: #070904;
	--ag-bg-soft: #0d110a;
	--ag-title: #f2e1bb;
	--ag-text: #e2d6bf;
	--ag-text-soft: #cab692;
	--ag-brand: #d96f1f;
	--ag-accent: #b8832f;
	--ag-earth: #8f8950;
	--ag-ghost: #828d88;
	--ag-green: #78b44a;
	--ag-brown: #6e4f28;

	/* Contrast colors */
	--ag-on-brand: #180d06;
	--ag-on-accent: #100b04;
	--ag-on-earth: #0d1008;
	--ag-on-ghost: #061013;
	--ag-on-green: #081004;
	--ag-on-brown: #120b05;

	/* RGB channels */
	--ag-rgb-brand: 217 111 31;
	--ag-rgb-accent: 184 131 47;
	--ag-rgb-earth: 143 137 80;
	--ag-rgb-ghost: 130 141 136;
	--ag-rgb-green: 120 180 74;
	--ag-rgb-brown: 110 79 40;

	/* States and lines */
	--ag-brand-hover: #eb7b24;
	--ag-accent-hover: #c99135;
	--ag-earth-hover: #a39d63;
	--ag-ghost-hover: #96a19c;
	--ag-brand-line: rgb(var(--ag-rgb-brand) / .66);
	--ag-accent-line: rgb(var(--ag-rgb-accent) / .56);
	--ag-earth-line: rgb(var(--ag-rgb-earth) / .56);
	--ag-ghost-line: rgb(var(--ag-rgb-ghost) / .44);
	--ag-line: rgb(var(--ag-rgb-accent) / .52);
	--ag-divider: rgb(var(--ag-rgb-accent) / .22);
	--ag-divider-strong: rgb(var(--ag-rgb-accent) / .30);
	--ag-divider-brand: rgb(var(--ag-rgb-brand) / .22);
	--ag-divider-brand-strong: rgb(var(--ag-rgb-brand) / .32);
	--ag-divider-accent: rgb(var(--ag-rgb-accent) / .22);
	--ag-divider-accent-strong: rgb(var(--ag-rgb-accent) / .30);
	--ag-divider-earth: rgb(var(--ag-rgb-earth) / .22);
	--ag-divider-earth-strong: rgb(var(--ag-rgb-earth) / .30);
	--ag-divider-ghost: rgb(var(--ag-rgb-ghost) / .20);
	--ag-divider-ghost-strong: rgb(var(--ag-rgb-ghost) / .28);

	/* Typography */
	--ag-font: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	--ag-mono: "IBM Plex Mono", "Roboto Mono", "Space Mono", ui-monospace, monospace;
	--ag-txt-hero-size: clamp(42px, 6vw, 86px);
	--ag-txt-hero-line-height: .98;
	--ag-txt-section-size: clamp(28px, 4vw, 46px);
	--ag-txt-section-line-height: 1.18;
	--ag-txt-title-size: clamp(28px, 4vw, 48px);
	--ag-txt-title-line-height: 1.08;
	--ag-txt-body-size: 16px;
	--ag-txt-body-line-height: 1.35;
	--ag-txt-small-size: 15px;
	--ag-txt-small-line-height: 1.45;
	--ag-txt-meta-size: 14px;
	--ag-txt-meta-line-height: 1.36;
	--ag-txt-control-size: 13px;
	--ag-txt-button-size: 12px;
	--ag-txt-label-size: 13px;
	--ag-txt-label-inside-size: 12px;
	--ag-txt-code-size: 14px;

	/* Geometry */
	--ag-card-padding-y: clamp(22px, 3vw, 34px);
	--ag-card-padding-x: clamp(22px, 3vw, 34px);
	--ag-card-padding-compact-y: 16px;
	--ag-card-padding-compact-x: 18px;
	--ag-card-padding-large-y: clamp(30px, 4vw, 52px);
	--ag-card-padding-large-x: clamp(28px, 4vw, 52px);
	--ag-frame-cut: 10px;
	--ag-cut-xs: 5px;
	--ag-cut-sm: 8px;
	--ag-cut-md: 12px;
	--ag-cut-lg: 18px;
	--ag-size-control-height: 48px;
	--ag-size-input-inside-height: 62px;
	--ag-size-textarea-height: 126px;
	--ag-size-textarea-inside-height: 130px;
	--ag-size-choice-box: 24px;
	--ag-size-switch-width: 50px;
	--ag-size-switch-height: 26px;

	/* Card surfaces */
	--ag-card-frame-default-fill-b: rgba(27, 22, 13, .94);
	--ag-card-frame-default-fill-c: rgba(10, 9, 6, .98);
	--ag-card-frame-brand-fill-b: rgba(34, 20, 10, .96);
	--ag-card-frame-brand-fill-c: rgba(12, 9, 6, .98);
	--ag-card-frame-brand-light-b: rgba(184, 84, 29, .039);
	--ag-card-frame-earth-fill-b: rgba(25, 25, 14, .96);
	--ag-card-frame-earth-fill-c: rgba(9, 11, 6, .98);
	--ag-card-frame-earth-light-b: rgba(108, 103, 60, .038);
	--ag-card-frame-ghost-fill-a: rgba(78, 90, 87, .08);
	--ag-card-frame-ghost-fill-b: rgba(14, 17, 23, .88);
	--ag-card-frame-ghost-fill-c: rgba(8, 10, 15, .94);
	--ag-card-frame-ghost-border-glow: rgb(96 128 119 / .072);
	--ag-card-frame-default-light-c: rgb(231 217 184 / .011);
	--ag-card-frame-brand-light-c: rgb(231 217 184 / .020);
	--ag-card-frame-earth-light-c: rgb(231 217 184 / .011);
	--ag-card-frame-ghost-light-c: rgb(231 217 184 / .010);
	--ag-card-glow-filter: drop-shadow(0 22px 64px rgb(0 0 0 / .42));
	--ag-card-glow-opacity: .89;
	--ag-card-glow-overlay-top: rgb(255 255 255 / .014);
	--ag-card-glow-overlay-bottom: rgb(0 0 0 / .13);
	--ag-card-glow-highlight: rgb(231 217 184 / .052);
	--ag-card-glow-highlight-top: rgb(231 217 184 / .042);
	--ag-card-glow-shadow-bottom: rgb(0 0 0 / .18);
	--ag-button-overlay-color: rgb(255 255 255 / .06);
	--ag-status-ring-color: rgb(0 0 0 / .28);
	--ag-card-texture-base-line-a: rgb(231 217 184 / .064);
	--ag-card-texture-base-line-b: rgb(231 217 184 / .048);
	--ag-card-texture-soft-line-a: rgb(231 217 184 / .082);
	--ag-card-texture-soft-line-b: rgb(231 217 184 / .062);
	--ag-card-texture-flat-line-a: rgb(231 217 184 / .080);
	--ag-card-texture-flat-line-b: rgb(231 217 184 / .060);

	/* Frames and effects */
	--ag-frame-glow-width: 4.5;
	--ag-frame-glow-filter: blur(3.4px);
	--ag-frame-line-width: 1;
	--ag-frame-inner-width: 1;
	--ag-compact-solid-shadow: inset 0 1px 0 rgba(255, 255, 255, .14), inset 0 -1px 0 rgba(0, 0, 0, .28);
	--ag-switch-thumb-shadow: 0 0 0 1px rgba(0, 0, 0, .24);
	--ag-terminal-ok-shadow: 0 0 10px rgba(120, 180, 74, .20);
	--ag-terminal-warn-shadow: 0 0 10px rgb(var(--ag-rgb-brand) / .16);
	--ag-brand-mark-shadow: drop-shadow(0 0 16px rgba(217, 111, 31, .12));

	/* Type roles */
	--ag-txt-hero-weight: 760;
	--ag-txt-hero-letter-spacing: -.055em;
	--ag-txt-section-weight: 800;
	--ag-txt-section-letter-spacing: -.04em;
	--ag-txt-title-weight: 800;
	--ag-txt-title-letter-spacing: -.035em;
	--ag-txt-body-weight: 400;
	--ag-txt-meta-weight: 700;
	--ag-txt-meta-letter-spacing: .14em;
	--ag-txt-small-weight: 400;
	--ag-txt-label-weight: 700;
	--ag-txt-label-line-height: 1.1;
	--ag-txt-label-letter-spacing: .14em;
	--ag-txt-code-weight: 500;
	--ag-txt-code-line-height: 1.58;
	--ag-txt-code-letter-spacing: .06em
}