

:root {
  
  color-scheme: dark;

--color-deep:      #031111;  
  --color-brunswick: #0C4137;  
  --color-emerald:   #06D6A0;  
  --color-polar:     #E6FBF6;  
  
  --color-ink:       #070707;  
  --color-white:     #FFFFFF;

--color-emerald-deep: #048060;

--color-accent-azul: #ADBEFF;
  
  --color-accent-azul-subtle: rgb(173 190 255 / 0.14);

--color-brand-whatsapp: #00BC39;

--color-bg:          var(--color-deep);
  --color-bg-elevated: var(--color-brunswick);
  --color-bg-light:    var(--color-polar);
  --color-bg-ink:      var(--color-ink);
  
  --color-bg-subtle:   rgb(230 251 246 / 0.03);
  
  --color-bg-pill:     rgb(230 251 246 / 0.06);
  
  --color-header-wash:       color-mix(in srgb, var(--world-ink, var(--world-ink-floor)) 78%, transparent);
  --color-header-wash-light: rgb(230 251 246 / 0.78);

--world-ink-floor:   #0A1413;

--color-node-pending: #728481;
  --color-nav-panel:   var(--world-ink, var(--world-ink-floor));

  --color-text:        var(--color-polar);
  
  --color-text-muted:  rgb(230 251 246 / 0.72);

  --color-accent:      var(--color-emerald);

--color-accent-lilac: #C4B5FD;
  
  --color-accent-lilac-subtle: rgb(196 181 253 / 0.14);

--color-accent-sky: #7DC4FC;

--color-route:       #77B6E8;
  
  --shadow-route-glow: 0 0 48px rgb(119 182 232 / 0.18);
  --color-route-mark:  rgb(119 182 232 / 0.30);
  
  --shadow-route-glow-verde: 0 0 48px rgb(from var(--world-verde-profundo-glow) r g b / 0.18);
  --color-accent-subtle: rgb(6 214 160 / 0.14);

--color-accent-cool: #5AA9FF;

--color-mark-fill:   rgb(6 214 160 / 0.30);

--color-mark-fill-azul: rgb(58 91 224 / 0.65);

--color-proof-mark:  rgb(124 75 216 / 0.65);

--color-border:        rgb(230 251 246 / 0.12);
  
  --color-border-faint:  rgb(230 251 246 / 0.07);
  
  --color-border-strong: rgb(230 251 246 / 0.42);

--color-focus-ring:  var(--color-polar);

--gradient-report-pane: linear-gradient(
    152deg,
    #2b2440 0%,
    #1a1729 46%,
    #121120 100%
  );

  --gradient-report-card: linear-gradient(
    152deg,
    #3a3155 0%,
    #241f38 52%,
    #1a1729 100%
  );

  --color-mac-close: #FF5F57;
  --color-mac-min:   #FEBC2E;
  --color-mac-zoom:  #28C840;

--color-mac-chrome:      #2A2C30;
  --color-mac-chrome-lip:  #3A3D42;
  --color-mac-chrome-edge: #17181B;
  --color-mac-bezel:       #1B1B1E;
  --color-mac-bezel-lip:   #34343A;

--gradient-mac-chrome: linear-gradient(
    180deg,
    var(--color-mac-chrome-lip) 0%,
    var(--color-mac-chrome) 100%
  );

  --color-success: #21C08A;
  --color-error:   #F0685C;

--card-lift:       0.045;
  
  --card-lift-step:  0.034;
  --card-sink:       0.612;
  --card-edge-w:     1px;
  --card-edge-a:     0.045;
  --card-edge-top-a: 0.3;
  --card-edge-bot-a: 0;

  --glass-fill:        rgb(230 251 246 / var(--card-lift));
  --glass-fill-strong: rgb(230 251 246 / calc(var(--card-lift) + var(--card-lift-step)));
  --glass-edge:        rgb(230 251 246 / var(--card-edge-a));
  --glass-edge-lit:    rgb(230 251 246 / var(--card-edge-top-a));
  --glass-edge-bottom: rgb(230 251 246 / var(--card-edge-bot-a));

--color-orbit-line:  rgb(230 251 246 / 0.22);
  
  --color-orbit-near:  rgb(230 251 246 / 0.44);
  --color-orbit-far:   rgb(230 251 246 / 0.07);

--color-orbit-active: rgb(230 251 246 / 0.45);

--color-mast-node:    rgb(230 251 246 / 0.95);

--shadow-node-live:   0 0 11px 2px rgb(6 214 160 / 0.60);
  --shadow-node-soft:   0 0 6px 1px rgb(6 214 160 / 0.34);

--shadow-node-soft-azul: 0 0 6px 1px rgb(173 190 255 / 0.34);
  --shadow-node-live-azul: 0 0 11px 2px rgb(173 190 255 / 0.60);
  
  --shadow-accent-glow-azul: 0 0 48px rgb(125 196 252 / 0.18);

--shadow-node-cool:   0 0 6px 1px rgb(90 169 255 / 0.34);

  --gradient-mast-line: linear-gradient(to top, rgb(230 251 246 / 0.80), rgb(230 251 246 / 0.30));

--gradient-fact-halo:
    radial-gradient(
      closest-side at 50% 50%,
      rgb(6 214 160 / 0.22) 0%,
      rgb(6 214 160 / 0.09) 42%,
      rgb(6 214 160 / 0) 100%
    );

--gradient-fact-rule:
    linear-gradient(
      to right,
      rgb(230 251 246 / 0) 0%,
      rgb(230 251 246 / 0.34) 50%,
      rgb(230 251 246 / 0) 100%
    );

--gradient-verdict-horizon:
    radial-gradient(
      closest-side at 50% 50%,
      rgb(6 214 160 / 0.16) 0%,
      rgb(6 214 160 / 0.07) 38%,
      rgb(6 214 160 / 0) 100%
    );

--gradient-about-light:
    radial-gradient(
      ellipse 58% 50% at 50% 44%,
      rgb(6 214 160 / 0.10) 0%,
      rgb(6 214 160 / 0.042) 40%,
      rgb(6 214 160 / 0) 72%
    );

--card-glow-rgb:     230 251 246;
  --card-glow-a:       0.06;
  --card-glow-mid-a:   0.02;
  --card-glow-x:       6%;
  --card-glow-y:       16%;
  --card-glow-w:       88%;
  --card-glow-h:       78%;
  --card-glow-falloff: 38%;
  --card-glow-reach:   72%;

  --gradient-glass-bloom: radial-gradient(
    var(--card-glow-w) var(--card-glow-h) at var(--card-glow-x) var(--card-glow-y),
    rgb(var(--card-glow-rgb) / var(--card-glow-a)) 0%,
    rgb(var(--card-glow-rgb) / var(--card-glow-mid-a)) var(--card-glow-falloff),
    rgb(var(--card-glow-rgb) / 0) var(--card-glow-reach)
  );

--gradient-glass-bloom-accent: radial-gradient(
    var(--card-glow-w) var(--card-glow-h) at var(--card-glow-x) var(--card-glow-y),
    rgb(var(--card-glow-accent-rgb) / var(--card-glow-accent-a)) 0%,
    rgb(var(--card-glow-accent-rgb) / var(--card-glow-accent-mid-a)) var(--card-glow-falloff),
    rgb(var(--card-glow-accent-rgb) / 0) var(--card-glow-reach)
  );

  --card-glow-accent-rgb:   6 214 160;
  --card-glow-accent-a:     0.1;
  --card-glow-accent-mid-a: 0.035;

--shadow-accent-halo:
    0 0 0 1px rgb(6 214 160 / 0.16),
    0 1.5rem 3.5rem -1.25rem rgb(6 214 160 / 0.20);

--shadow-avatar-glow:
    0 0 0.5em rgb(6 214 160 / 0.34),
    0 0 1.15em rgb(6 214 160 / 0.18);

--shadow-avatar-glow-lilac:
    0 0 0.5em rgb(196 181 253 / 0.34),
    0 0 1.15em rgb(196 181 253 / 0.18);

--gradient-avatar-sphere: radial-gradient(
    circle at 30% 78%,
    var(--color-polar) 0%,
    var(--color-accent) 34%,
    var(--color-emerald-deep) 78%,
    var(--color-brunswick) 100%
  );
  --shadow-avatar-frame:
    inset 0 0 0 1px rgb(230 251 246 / 0.34),
    inset 0 0.14em 0.3em rgb(230 251 246 / 0.18);

--gradient-check-glow: radial-gradient(
    closest-side at 50% 50%,
    rgb(6 214 160 / 0.09) 0%,
    rgb(6 214 160 / 0.045) 34%,
    rgb(6 214 160 / 0.012) 62%,
    rgb(6 214 160 / 0) 100%
  );

--gradient-beam-across: linear-gradient(
    180deg,
    rgb(6 214 160 / 0) 0%,
    rgb(6 214 160 / 0.06) 18%,
    rgb(6 214 160 / 0.18) 34%,
    rgb(6 214 160 / 0.42) calc(50% - 9px),
    rgb(6 214 160 / 0.62) calc(50% - 2.5px),
    rgb(230 251 246 / 0.92) calc(50% - 2px),
    rgb(230 251 246 / 0.92) calc(50% + 2px),
    rgb(6 214 160 / 0.62) calc(50% + 2.5px),
    rgb(6 214 160 / 0.42) calc(50% + 9px),
    rgb(6 214 160 / 0.18) 66%,
    rgb(6 214 160 / 0.06) 82%,
    rgb(6 214 160 / 0) 100%
  );

--gradient-beam-in: linear-gradient(
    90deg,
    rgb(230 251 246 / 0) 0%,
    rgb(230 251 246 / 0.55) 34%,
    var(--color-polar) 100%
  );

  --gradient-beam-out: linear-gradient(
    90deg,
    var(--color-polar) 0%,
    rgb(230 251 246 / 0.55) 66%,
    rgb(230 251 246 / 0) 100%
  );

--gradient-check-scan: linear-gradient(
    180deg,
    rgb(6 214 160 / 0) 0%,
    rgb(6 214 160 / 0.105) 20%,
    rgb(6 214 160 / 0.245) 40%,
    rgb(6 214 160 / 0.333) calc(50% - 11px),
    rgb(6 214 160 / 0.333) calc(50% - 3px),
    rgb(230 251 246 / 0.28) calc(50% - 2.5px),
    rgb(230 251 246 / 0.28) calc(50% + 2.5px),
    rgb(6 214 160 / 0.333) calc(50% + 3px),
    rgb(6 214 160 / 0.333) calc(50% + 11px),
    rgb(6 214 160 / 0.245) 60%,
    rgb(6 214 160 / 0.105) 80%,
    rgb(6 214 160 / 0) 100%
  );

--gradient-scan-across: linear-gradient(
    90deg,
    rgb(230 251 246 / 0) 0%,
    rgb(230 251 246 / 1) 30%,
    rgb(230 251 246 / 1) 70%,
    rgb(230 251 246 / 0) 100%
  );

--gradient-mesh-layers:
    url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAVCAIAAACor3u9AAADCUlEQVR42m3UiZKqMBAF0JCwq8Owqrjggvvs8/7/297tdAjoWNVFoSUnl05HIaR8LKWc0Hfi0IkCx3X78lCe4+sKfKowkKNIpi8yf5V5Il/GchxTTUa4V68vqngVT3Q8D30U4XmNPqexvIxDsvJEFanCGlgAH40+UVmiymywgJIOdFgIPo6ccexEoUEfaASPQhlHFBYQ9CrDAiqZKNCJ1tME37i0gNKpUa6imHge2ScxFb8Eu3d0SJ2BDg4u9GmOblBPQOPKepHSAn1A7juy0zvqwg0giLaQGt+M0GjdBzQB+iynwnvARWW9rhfgdo90T5Ca6LFMuuK2QuTqNlAmk04v1Lx0cS1pG7iMXuUoYVyTmt0JOkuF8UDxfWKKOpDpXa0QvHDrkgo3EOEaWuvTAt+Le3rcuxkqoQnpclGXy9R0HCKC15W7qOiKjzqvdg2NH3h1JQaTO+oXsDSSAi0z66r5gF5M6apbRCi7s5JpbzH1ljNBIxHz7sU8GJJH2OjZIDI3xNLTLn5pCu6A9lZzr6mFGTsej+EhpGOSDrrxjGbRuj0989Zzv1n4u5Ug2upjGk19WPRJKWiBviHLKRV0oquOrv7SCO5vSPcPjejmOuZTbnR7WLBpyA53NUPR84DAWXdIoyfrmoJvl6wHl52wtGTa6hntAQ0c3qDLRVdY1n2kdXDoe6MHt1b0tDnluvuZPi9lSm+APoDY1N524W0WZAHl+ksj+H4dQD/vgrdD8H4UA9qc8sFRzGjyeAHou5W3W9J7ACX3gdZ6y/oWevhxDD9PYkjbP5DuyNBQUzcQFkS7psJNU5vqU+vgbRMcNsFpi86EH6fw64wSduS7yPmT87KaEXRo/OPGrMHFdMt0Exy1ftlTdujfF71A/wfSRR4ONW8jhhoc9POWrkDv6I2hWUdzoP9caIHPs+jo3P57aHQ4Hnxklj6ev+5pNhC2be5So+nYVehozucp/LlGv9fo+xLRAl1DHg/L+r7R+xUpt5YK4rFLTa6mr1p/P4bf1+jfLfq9RV+X6Ov8Hx92dwAUW86+AAAAAElFTkSuQmCC");

  --gradient-mesh: var(--gradient-mesh-layers), var(--color-deep);

--gradient-glass:
    linear-gradient(
      180deg,
      rgb(3 17 17 / var(--card-sink)) 0%,
      rgb(3 17 17 / 0) 62%
    ),
    linear-gradient(
      180deg,
      rgb(230 251 246 / var(--card-ramp-top)) 0%,
      rgb(230 251 246 / var(--card-ramp-mid)) var(--card-ramp-midpoint),
      rgb(230 251 246 / var(--card-ramp-bottom)) 100%
    );

  --card-ramp-top:      0.06;
  --card-ramp-mid:      0.015;
  --card-ramp-midpoint: 42%;
  --card-ramp-bottom:   0;

--frost-fill:       rgb(230 251 246 / 0.098);
  --frost-fill-dense: rgb(230 251 246 / 0.133);

--frost-edge:     rgb(230 251 246 / 0.08);
  --frost-edge-lit: rgb(230 251 246 / 0.16);

--frost-lip:       rgb(230 251 246 / 0.11);
  --frost-lip-under: rgb(230 251 246 / 0.03);

--frost-blur:       20px;
  --frost-blur-dense: 26px;
  
  --frost-blur-panel: 40px;

--frost-dim: 0.45;

--gradient-frost-haze: linear-gradient(
    170deg,
    rgb(230 251 246 / 0.075) 0%,
    rgb(230 251 246 / 0.03) 45%,
    rgb(230 251 246 / 0.008) 100%
  );

--mask-solid: rgb(0 0 0 / 1);
  --mask-dim:   rgb(0 0 0 / 0.78);
  --mask-clear: rgb(0 0 0 / 0);

--glow-node:
    0 0 0 5px rgb(6 214 160 / 0.22),
    0 0 20px 7px rgb(6 214 160 / 0.30);

--gradient-head-glow: radial-gradient(circle closest-side,
    rgb(255 255 255 / 0.58) 0%,
    rgb(255 255 255 / 0.18) 38%,
    rgb(255 255 255 / 0) 72%);

--gradient-accent: linear-gradient(135deg, var(--color-emerald) 0%, #05B588 100%);

--gradient-fade-deep: linear-gradient(180deg, rgb(3 17 17 / 0) 0%, var(--color-deep) 100%);

--gradient-card-shine: linear-gradient(
    125deg,
    rgb(230 251 246 / 0.40) 0%,
    rgb(230 251 246 / 0.08) 38%,
    rgb(230 251 246 / 0) 64%
  );

--gradient-scrim-up:
    linear-gradient(0deg, var(--color-deep) 0%, rgb(3 17 17 / 0.72) 42%, rgb(3 17 17 / 0) 100%);

--world-verde-base: var(--color-deep);
  --world-verde-mass: var(--color-brunswick);
  --world-verde-glow: var(--color-emerald);

--world-verde-profundo-base: #020C0C;
  --world-verde-profundo-mass: #072B24;
  --world-verde-profundo-glow: #05A87E;

  --world-azul-base: #050A24;
  --world-azul-mass: #1E3080;
  --world-azul-glow: #3A5BE0;

--world-azul-profundo-base: #04081D;
  --world-azul-profundo-mass: #16225C;
  --world-azul-profundo-glow: var(--world-azul-glow);

--world-violeta-base: #120726;
  --world-violeta-mass: #3A1E6E;
  --world-violeta-glow: #7C4BD8;

--world-violeta-profundo-base: #0E061E;
  --world-violeta-profundo-mass: #2E1858;
  --world-violeta-profundo-glow: var(--world-violeta-glow);

--world-calido-base: #1C0D06;
  --world-calido-mass: #6B2F14;
  --world-calido-glow: #D97A34;

  --world-negro-base: var(--color-ink);
  --world-negro-mass: var(--color-ink);
  --world-negro-glow: var(--color-ink);

--world-noche-base: #010808;
  --world-noche-mass: #05201B;
  --world-noche-glow: var(--color-emerald-deep);

--world-grafito-base: #040406;
  --world-grafito-mass: #24262D;
  --world-grafito-glow: var(--color-emerald-deep);

  --immersive-a-base: var(--color-deep);
  --immersive-a-mass: var(--color-brunswick);
  --immersive-a-glow: var(--color-emerald);

--immersive-b-base: #04191C;
  --immersive-b-mass: #0A4E58;
  --immersive-b-glow: #14C8D8;

--immersive-c-base: #050A24;
  --immersive-c-mass: #1E3080;
  --immersive-c-glow: #3A5BE0;

--immersive-grain-tile: 240px;

--world-fade: 35svh;

--world-fade-far: 90svh;
  --world-lead: 20svh;

--world-ring-freq: 52;
  
  --world-ring-mix: 0;
  
  --world-ring-flow: 0.22;
  
  --world-ring-reach: 0.62;

--world-relief: 0;

--world-depth: 0.1;

  --world-zoom-scale: 1.499;
  --world-warp-scale: 1.403;
  --world-glow-scale: 1;

  --world-band: 0.048;
  --world-bias: 0.714;
  --world-mass-scale: 0.108;
  --world-mass-soft: 2.49;
  --world-contrast: 1;
  --world-floor: 0;
  --world-bloom: 0.489;

  --world-grain-immersive: 0;
  --world-grain-void: 0;

  --immersive-exit: 20svh;

--font-family-base: "DM Sans", system-ui, -apple-system, "Segoe UI", sans-serif;

  --font-weight-regular:  400;
  --font-weight-medium:   500;
  --font-weight-semibold: 600;
  --font-weight-bold:     700;

--font-size-xs:   clamp(0.75rem, 0.72rem + 0.12vw, 0.8125rem);     
  --font-size-sm:   clamp(0.875rem, 0.84rem + 0.15vw, 0.9375rem);   
  --font-size-base: 1rem;                                            
  --font-size-md:   clamp(1.125rem, 1.08rem + 0.20vw, 1.25rem);      
  
  --font-size-lead: clamp(1.0625rem, 1.03rem + 0.14vw, 1.1875rem);   
  --font-size-lg:   clamp(1.3125rem, 1.22rem + 0.40vw, 1.5625rem);   
  --font-size-xl:   clamp(1.5rem, 1.35rem + 0.65vw, 1.9375rem);      
  --font-size-2xl:  clamp(1.75rem, 1.50rem + 1.10vw, 2.4375rem);     
  
  --font-size-3xl:  clamp(1.75rem, 1.245rem + 2.02vw, 3.0625rem);    
  
  --font-size-4xl: clamp(1.75rem, 1.16rem + 2.95vw, 3.8125rem);     
  
  --font-size-5xl: clamp(2.25rem, 1.40rem + 4.20vw, 5rem);          

--font-size-suffix: 1.2em;

  --line-height-tight:   1.1;
  --line-height-heading: 1.2;
  --line-height-base:    1.65;

--letter-spacing-display: -0.03em;
  --letter-spacing-heading: -0.02em;
  --letter-spacing-base:     0;
  --letter-spacing-caption:  0.06em;

--space-1:  0.25rem;   
  --space-2:  0.5rem;    
  --space-3:  0.75rem;   
  --space-4:  1rem;      
  --space-5:  1.5rem;    
  --space-6:  2rem;      
  --space-7:  3rem;      
  --space-8:  4rem;      
  --space-9:  6rem;      
  --space-10: 8rem;      
  
  --space-11: 12rem;     

--container-max-width: 1440px;
  --container-padding: clamp(1rem, 3vw, 2rem);
  
  --section-padding-y: clamp(5rem, 11vw, 10rem);   

--card-halo-rgb:  6 214 160;
  --card-halo-a:    0;
  --card-halo-blur: 48px;
  --card-halo-y:    18px;
  --card-halo-spread: -8px;

  --shadow-card-halo:
    0 var(--card-halo-y) var(--card-halo-blur) var(--card-halo-spread)
    rgb(var(--card-halo-rgb) / var(--card-halo-a));

--card-radius-scale: 1;

  --radius-sm:   6px;
  --radius-md:   calc(10px * var(--card-radius-scale));
  --radius-lg:   calc(16px * var(--card-radius-scale));
  --radius-xl:   calc(24px * var(--card-radius-scale));
  --radius-pill: 999px;

--sys-fill:      rgb(230 251 246 / 0.045);
  --sys-edge:      rgb(230 251 246 / 0.045);
  --sys-edge-w:    1px;
  --sys-radius:    999px;
  
  --sys-blur:      0px;

--duration-fast:   150ms;
  --duration-base:   250ms;
  --duration-slow:   400ms;
  --duration-slower: 600ms;

--duration-page:   560ms;

--enter-floor: 0;

--page-blur: 6px;

--easing-premium:  cubic-bezier(0.16, 1, 0.3, 1);
  
  --easing-standard: cubic-bezier(0.4, 0, 0.2, 1);
  
  --easing-journey:  cubic-bezier(0.65, 0, 0.35, 1);

--easing-page: linear(
    0%      0%,
    0.97%   5%,
    2.62%   10%,
    5.04%   15%,
    8.36%   20%,
    12.69%  25%,
    18.19%  30%,
    25%     35%,
    33.2%   40%,
    42.74%  45%,
    53.26%  50%,
    63.98%  55%,
    73.87%  60%,
    82%     65%,
    86.78%  70%,
    90.67%  75%,
    93.79%  80%,
    96.26%  85%,
    98.12%  90%,
    99.39%  95%,
    100%    100%
  );

--shadow-sm: 0 1px 2px rgb(0 0 0 / 0.30);
  --shadow-md: 0 8px 24px rgb(0 0 0 / 0.36);
  --shadow-lg: 0 24px 64px rgb(0 0 0 / 0.44);
  --shadow-accent-glow: 0 0 48px rgb(6 214 160 / 0.18);

--header-height: 2.875rem;   
  
  --header-inset: clamp(0.75rem, 1.4vw, 1.25rem);   
  
  --mark-height: 1.75rem;                                
  --mark-width: calc(var(--mark-height) * 220 / 185);    
  --tap-target: 44px;

  --z-sticky:  100;
  --z-overlay: 200;
  --z-modal:   300;
  --z-toast:   400;
}

@property --enter-out {
  syntax: '<length>';
  inherits: false;
  initial-value: 0px;
}

@property --enter-pop {
  syntax: '<number>';
  inherits: false;
  initial-value: 1;
}

@property --enter-fade {
  syntax: '<number>';
  inherits: false;
  initial-value: 1;
}

@property --descent-trace { syntax: '<number>'; inherits: false; initial-value: 1; }
@property --descent-fill  { syntax: '<number>'; inherits: false; initial-value: 1; }
@property --descent-mark  { syntax: '<number>'; inherits: false; initial-value: 1; }
@property --descent-end   { syntax: '<number>'; inherits: false; initial-value: 1; }

@property --orbit-draw  { syntax: '<number>'; inherits: false; initial-value: 1; }
@property --orbit-node  { syntax: '<number>'; inherits: false; initial-value: 1; }
@property --orbit-label { syntax: '<number>'; inherits: false; initial-value: 1; }

@property --node-lift   { syntax: '<number>'; inherits: true;  initial-value: 1; }

@property --intake-draw   { syntax: '<number>'; inherits: false; initial-value: 1; }
@property --intake-throat { syntax: '<number>'; inherits: false; initial-value: 1; }
@property --intake-out    { syntax: '<number>'; inherits: false; initial-value: 1; }
@property --intake-card   { syntax: '<number>'; inherits: false; initial-value: 1; }

@property --throat-breath { syntax: '<number>'; inherits: true;  initial-value: 1; }

@property --core-twinkle  { syntax: '<number>'; inherits: true;  initial-value: 1; }

@property --board-row   { syntax: '<number>'; inherits: false; initial-value: 1; }
@property --board-feed  { syntax: '<number>'; inherits: false; initial-value: 1; }
@property --board-bus   { syntax: '<number>'; inherits: false; initial-value: 1; }
@property --board-panel { syntax: '<number>'; inherits: false; initial-value: 1; }
@property --board-arc   { syntax: '<number>'; inherits: false; initial-value: 1; }
@property --board-pill  { syntax: '<number>'; inherits: false; initial-value: 1; }

@property --board-bar   { syntax: '<number>'; inherits: false; initial-value: 1; }

@property --board-cycle { syntax: '<number>'; inherits: false; initial-value: 1; }

@property --strata-band  { syntax: '<number>'; inherits: false; initial-value: 1; }
@property --strata-shaft { syntax: '<number>'; inherits: false; initial-value: 1; }
@property --strata-beam  { syntax: '<number>'; inherits: false; initial-value: 1; }
@property --strata-rule  { syntax: '<number>'; inherits: false; initial-value: 1; }
@property --strata-mark  { syntax: '<number>'; inherits: false; initial-value: 1; }

@property --seam-draw { syntax: '<number>'; inherits: true; initial-value: 1; }
@property --seam-glow { syntax: '<number>'; inherits: true; initial-value: 0; }

@property --enter-scale {
  syntax: '<number>';
  inherits: false;
  initial-value: 1;
}

@property --spin {
  syntax: '<angle>';
  inherits: true;
  initial-value: 0deg;
}

@property --ring-lift {
  syntax: '<number>';
  inherits: true;
  initial-value: 1;
}

@property --breath-scale {
  syntax: '<number>';
  inherits: true;
  initial-value: 1;
}

@property --breath {
  syntax: '<number>';
  inherits: true;
  initial-value: 1;
}

@property --orbit-shift {
  syntax: '<number>';
  inherits: true;
  initial-value: 0;
}

@property --verdict-glow {
  syntax: '<number>';
  inherits: true;
  initial-value: 1;
}

@property --mast-live {
  syntax: '<number>';
  inherits: true;
  initial-value: 1;
}

@property --mast-ping {
  syntax: '<number>';
  inherits: true;
  initial-value: 1;
}

@property --mast-dot {
  syntax: '<number>';
  inherits: true;
  initial-value: 1;
}

@property --mast-head {
  syntax: '<number>';
  inherits: true;
  initial-value: 1;
}

@property --mast-draw {
  syntax: '<number>';
  inherits: true;
  initial-value: 1;
}

@property --spine-draw {
  syntax: '<number>';
  inherits: true;
  initial-value: 1;
}

@property --spine-fade {
  syntax: '<number>';
  inherits: true;
  initial-value: 1;
}

@property --curve-draw {
  syntax: '<number>';
  inherits: true;
  initial-value: 1;
}

@property --dot-at {
  syntax: '<length>';
  inherits: true;
  initial-value: 0px;
}

@property --point-at {
  syntax: '<number>';
  
  inherits: true;
  initial-value: 0;
}

@property --node-build {
  syntax: '<number>';
  inherits: false;
  initial-value: 1;
}

@property --ring-sweep {
  syntax: '<angle>';
  inherits: false;
  initial-value: 0deg;
}

@property --spark-draw {
  syntax: '<number>';
  inherits: true;
  initial-value: 1;
}

@property --flow-node {
  syntax: '<number>';
  inherits: true;
  initial-value: 1;
}

@property --flow-line {
  syntax: '<number>';
  inherits: true;
  initial-value: 1;
}

@property --shine-angle {
  syntax: "<angle>";
  initial-value: 0deg;
  inherits: false;
}

@property --shine-angle-offset {
  syntax: "<angle>";
  initial-value: 0deg;
  inherits: false;
}

@property --shine-arc {
  syntax: "<percentage>";
  initial-value: 5%;
  inherits: false;
}

@property --shine-glint {
  syntax: "<color>";
  initial-value: #E6FBF6;
  inherits: false;
}

@property --shine-sweep {
  syntax: "<angle>";
  initial-value: 22deg;
  inherits: false;
}

.surface--light {
  color-scheme: light;

  --color-bg:          var(--color-polar);
  --color-bg-elevated: var(--color-white);
  
  --color-bg-pill:     rgb(12 65 55 / 0.05);

  --color-text:        var(--color-deep);        
  --color-text-muted:  rgb(12 65 55 / 0.78);     

--color-accent:        var(--color-emerald-deep);
  --color-accent-subtle: rgb(4 128 96 / 0.10);
  
  --color-mark-fill:     rgb(4 128 96 / 0.20);
  
  --color-nav-panel:     var(--color-white);

  --color-border:        rgb(12 65 55 / 0.14);
  
  --color-border-faint:  rgb(12 65 55 / 0.07);
  
  --color-border-strong: rgb(12 65 55 / 0.56);

  --color-focus-ring:  var(--color-brunswick);   

--color-success: #167F5B;   
  --color-error:   #B64F46;   
}

.about__facet,
.artifact, .button, .card, .channel, .check-run__address,
.converge__report, .converge__system,
.flow--strip, .flow__node, .flow__pill, .form, .intake__card, .ki-check__report,
.module__pill, .package, .ring__pill, .segmented, .symptom, .symptom__quote,
.symptom__shape-body, .symptom__shape-lit, .testimonial, .testimonials__arrow,
.tile {
  --glass-fill:        rgb(230 251 246 / var(--card-lift));
  --glass-fill-strong: rgb(230 251 246 / calc(var(--card-lift) + var(--card-lift-step)));
  --glass-edge:        rgb(230 251 246 / var(--card-edge-a));
  --glass-edge-lit:    rgb(230 251 246 / var(--card-edge-top-a));
  --glass-edge-bottom: rgb(230 251 246 / var(--card-edge-bot-a));

  --gradient-glass:
    linear-gradient(180deg, rgb(3 17 17 / var(--card-sink)) 0%, rgb(3 17 17 / 0) 62%),
    linear-gradient(
      180deg,
      rgb(230 251 246 / var(--card-ramp-top)) 0%,
      rgb(230 251 246 / var(--card-ramp-mid)) var(--card-ramp-midpoint),
      rgb(230 251 246 / var(--card-ramp-bottom)) 100%
    );

  --gradient-glass-bloom: radial-gradient(
    var(--card-glow-w) var(--card-glow-h) at var(--card-glow-x) var(--card-glow-y),
    rgb(var(--card-glow-rgb) / var(--card-glow-a)) 0%,
    rgb(var(--card-glow-rgb) / var(--card-glow-mid-a)) var(--card-glow-falloff),
    rgb(var(--card-glow-rgb) / 0) var(--card-glow-reach)
  );

  --gradient-glass-bloom-accent: radial-gradient(
    var(--card-glow-w) var(--card-glow-h) at var(--card-glow-x) var(--card-glow-y),
    rgb(var(--card-glow-accent-rgb) / var(--card-glow-accent-a)) 0%,
    rgb(var(--card-glow-accent-rgb) / var(--card-glow-accent-mid-a)) var(--card-glow-falloff),
    rgb(var(--card-glow-accent-rgb) / 0) var(--card-glow-reach)
  );

  --shadow-card-halo:
    0 var(--card-halo-y) var(--card-halo-blur) var(--card-halo-spread)
    rgb(var(--card-halo-rgb) / var(--card-halo-a));
}

.package,
.testimonial,
.ki-check__report {
  --card-glow-rgb: 6 214 160;
}

.symptom__quote {
  --card-glow-rgb: 6 214 160;
}

.symptom__quote {
  --card-lift: 0;
  --card-lift-step: 0.026;
  --card-edge-a: 0;
  --card-edge-top-a: 0.22;
  --card-glow-a: 0.042;
  --card-ramp-top: 0.019;
  --card-ramp-bottom: 0.062;
}

.testimonial {
  --card-ramp-top: 0.016;
  --card-ramp-mid: 0.067;
  --card-ramp-midpoint: 55%;
  --card-ramp-bottom: 0.079;
  --card-lift: 0;
  --card-lift-step: 0.042;
  --card-sink: 0.75;
  --card-edge-a: 0;
  --card-edge-top-a: 0.041;
  --card-glow-a: 0.3;
  --card-glow-mid-a: 0.023;
  --card-glow-y: 93%;
  --card-glow-w: 178%;
  --card-glow-h: 137%;
  --card-glow-falloff: 49%;
  --card-glow-reach: 74%;
  --card-radius-scale: 1.35;
}

.flow__pill,
.segmented {
  --card-edge-a: 0;
  --card-radius-scale: 0.882;
  --card-edge-w: 0px;
}

.package {
  --card-glow-y: 77%;
  --card-glow-a: 0.187;
  --card-glow-mid-a: 0.113;
  --card-glow-w: 82%;
  --card-glow-h: 81%;
  --card-glow-falloff: 41%;
  --card-glow-reach: 77%;
  --card-ramp-mid: 0.01;
  --card-ramp-midpoint: 5%;
  --card-ramp-bottom: 0.001;
  --card-lift: 0.014;
  --card-lift-step: 0.019;
  --card-sink: 0.75;
  --card-edge-a: 0.111;
  --card-halo-y: 17px;
}

.ki-check__report {
  --card-glow-y: 93%;
  --card-glow-a: 0.272;
  --card-glow-mid-a: 0.159;
  --card-glow-falloff: 21%;
  --card-glow-reach: 80%;
  --card-lift: 0;
  --card-sink: 0.75;
  --card-edge-w: 0px;
  --card-halo-blur: 20px;
}

@media (max-width: 47.99rem) {
  :root {
    
    --font-size-4xl: clamp(1.75rem, 0.607rem + 5.71vw, 2rem);
    
    --font-size-3xl: clamp(1.375rem, 0.804rem + 2.86vw, 1.5rem);
    
    --font-size-2xl: clamp(1.25rem, 0.804rem + 2.23vw, 1.375rem);
  }
}
