:root {
  color-scheme: light;
  --theme-background-image: url("background.webp?v=20260429-crt3");
  --theme-background:
    radial-gradient(ellipse at center, rgba(31, 114, 104, 0.34) 0%, rgba(2, 22, 24, 0.68) 58%, rgba(0, 11, 13, 0.9) 100%),
    linear-gradient(90deg, rgba(2, 24, 27, 0.92) 0%, rgba(8, 67, 64, 0.52) 48%, rgba(2, 18, 22, 0.94) 100%),
    var(--theme-background-image) center center / cover no-repeat,
    #04191c;
  --surface: rgba(255, 255, 255, 0.9);
  --surface-strong: #ffffff;
  --surface-border: rgba(255, 255, 255, 0.8);
  --control-background: rgba(255, 255, 255, 0.96);
  --nav-panel-background: rgba(255, 255, 255, 0.98);
  --nav-link-background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(245, 249, 250, 0.96));
  --active-background: linear-gradient(135deg, #0f6d73 0%, #184e58 100%);
  --theme-ink: #183039;
  --theme-muted: #607784;
  --theme-line: #d7e3e7;
  --theme-accent: #0f6d73;
  --theme-accent-deep: #0d3440;
  --theme-accent-contrast: #f4fbfc;
  --theme-accent-soft: #e1eef3;
  --theme-card-soft: #f7fafb;
  --field-background: #ffffff;
  --card-soft: #f7fafb;
  --theme-shadow: 0 24px 60px rgba(24, 48, 57, 0.12);
  --hero-background:
    radial-gradient(circle at 85% 25%, rgba(255, 255, 255, 0.14), transparent 18%),
    linear-gradient(135deg, var(--theme-accent-deep) 0%, var(--theme-accent) 62%, #48656d 100%);
  --hero-ink: var(--theme-accent-contrast);
  --hero-copy: rgba(244, 251, 252, 0.9);
  --focus-outline: 2px solid rgba(15, 109, 115, 0.24);
  --theme-phase-15m-bg: rgba(214, 234, 246, 0.96);
  --theme-phase-15m-line: #5e9fbe;
  --theme-phase-15m-soft: #d6eaf6;
  --theme-phase-15m-text: #134f67;
  --theme-phase-1h-bg: rgba(247, 228, 217, 0.97);
  --theme-phase-1h-line: #c46d3d;
  --theme-phase-1h-soft: #f4dccd;
  --theme-phase-1h-text: #8a431e;
  --theme-phase-2h-bg: rgba(220, 241, 229, 0.96);
  --theme-phase-2h-line: #5fa67e;
  --theme-phase-2h-soft: #d8efe1;
  --theme-phase-2h-text: #285e4b;
  --theme-phase-4h-bg: rgba(249, 237, 203, 0.96);
  --theme-phase-4h-line: #ca9730;
  --theme-phase-4h-soft: #f5e7bc;
  --theme-phase-4h-text: #775d1f;
  --theme-phase-24h-bg: rgba(232, 229, 245, 0.96);
  --theme-phase-24h-line: #8b79bd;
  --theme-phase-24h-soft: #e5dff5;
  --theme-phase-24h-text: #55487b;
}

html,
body {
  background: var(--theme-background);
}

html {
  min-height: 100%;
  background-color: #04191c;
}

body {
  position: relative;
  isolation: isolate;
  background: transparent !important;
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -2;
  pointer-events: none;
  background: var(--theme-background);
  transform: translateZ(0);
}

body::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background-image:
    radial-gradient(ellipse at center, transparent 36%, rgba(0, 13, 15, 0.28) 76%, rgba(0, 5, 7, 0.54) 100%),
    repeating-linear-gradient(0deg, rgba(210, 255, 226, 0.13) 0 1px, rgba(0, 18, 17, 0.08) 1px 3px, transparent 3px 6px),
    repeating-linear-gradient(90deg, rgba(165, 255, 221, 0.045) 0 1px, transparent 1px 6px),
    linear-gradient(90deg, transparent 0%, rgba(166, 255, 211, 0.02) 34%, rgba(202, 255, 229, 0.2) 49%, rgba(157, 255, 209, 0.05) 56%, transparent 72%),
    repeating-linear-gradient(90deg, rgba(165, 255, 221, 0.07) 0 1px, transparent 1px 72px),
    repeating-linear-gradient(0deg, rgba(165, 255, 221, 0.055) 0 1px, transparent 1px 56px),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160' viewBox='0 0 160 160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)' opacity='.32'/%3E%3C/svg%3E"),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 960 230'%3E%3Cg fill='none' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M0 122H130l18-18 18 18h76l26-56 35 122 30-66h124l18-24 20 24h150l28-44 30 88 28-44h229' stroke='%23b9ffd7' stroke-width='3' opacity='.48'/%3E%3Cpath d='M0 122H960' stroke='%238bf3c0' stroke-width='1' opacity='.16'/%3E%3Cpath d='M130 122l18-18 18 18M268 66l35 122 30-66M673 78l30 88 28-44' stroke='%23e7fff0' stroke-width='5' opacity='.12'/%3E%3C/g%3E%3C/svg%3E");
  background-repeat: no-repeat, repeat, repeat, no-repeat, repeat, repeat, repeat, repeat-x;
  background-size: 100% 100%, 100% 6px, 6px 100%, 46% 100%, 360px 360px, 280px 280px, 160px 160px, 960px 230px;
  background-position: 0 0, 0 0, 0 0, -68vw 0, 0 0, 0 0, 0 0, 0 44%;
  opacity: 0.72;
  transform: translateZ(0);
  animation:
    calcusoins-crt-roll 18s linear infinite,
    calcusoins-crt-flicker 6.8s ease-in-out infinite;
}

@keyframes calcusoins-crt-roll {
  0% {
    background-position: 0 0, 0 0, 0 0, -68vw 0, 0 0, 0 0, 0 0, 0 44%;
  }

  100% {
    background-position: 0 0, 0 32px, 6px 0, 125vw 0, 42px 0, -22px 16px, 80px 36px, -960px 44%;
  }
}

@keyframes calcusoins-crt-flicker {
  0%,
  100% {
    opacity: 0.6;
    filter: saturate(1) brightness(0.98) contrast(1.02);
  }

  18% {
    opacity: 0.67;
  }

  48% {
    opacity: 0.7;
    filter: saturate(1.08) brightness(1.04) contrast(1.03);
  }

  52% {
    opacity: 0.64;
  }

  76% {
    opacity: 0.68;
  }
}

@media (prefers-reduced-motion: reduce) {
  body::after {
    animation: none;
    opacity: 0.5;
  }
}

@media print {
  body {
    background: #ffffff !important;
  }

  body::before,
  body::after {
    display: none !important;
  }
}

body .site-nav {
  border-color: rgba(255, 255, 255, 0.88);
  background: rgba(248, 252, 252, 0.96);
}

.site-brand {
  display: inline-flex;
  align-items: flex-start;
  flex: 0 1 auto;
  max-width: calc(100% - 168px);
  margin-left: 20px;
  min-width: 0;
  text-decoration: none;
}

.site-brand:focus-visible {
  outline: var(--focus-outline);
  outline-offset: 4px;
  border-radius: 20px;
}

.site-logo {
  display: block;
  width: auto;
  max-width: 100%;
  height: auto;
}

.nav-menu {
  margin-left: auto;
  flex: 0 0 auto;
}

.site-nav .nav-trigger {
  border-color: rgba(244, 251, 252, 0.16);
  background: linear-gradient(135deg, var(--theme-accent-deep) 0%, var(--theme-accent) 100%);
  color: var(--theme-accent-contrast);
  box-shadow: 0 14px 30px rgba(4, 34, 39, 0.18);
}

.site-nav .nav-trigger:hover,
.site-nav .nav-menu[open] .nav-trigger {
  border-color: rgba(244, 251, 252, 0.32);
  background: linear-gradient(135deg, #082b35 0%, #0d6369 100%);
  color: #ffffff;
  box-shadow: 0 16px 34px rgba(4, 34, 39, 0.24);
}

.site-nav .nav-trigger-icon {
  color: currentColor;
  opacity: 0.78;
}

@media (max-width: 560px) {
  .site-brand {
    max-width: calc(100% - 142px);
  }
}