/**
 * Page II: Scale Without Curation Creates Sameness
 * Layout: Uniform blocks and spacing
 */


/* Create immersive "landscape" container */
.site-main {
  position: relative;
  /* Add subtle border that repeats the pattern theme */
  border: 1px solid rgba(255, 255, 255, 0.03);
  border-radius: var(--radius-lg);
  padding: var(--spacing-6);
  /* Subtle shadow for depth */
  box-shadow: 
    0 8px 32px rgba(0, 0, 0, 0.3),
    inset 0 1px 0 rgba(255, 255, 255, 0.02);
}

[data-theme="light"] .site-main {
  border-color: rgba(0, 0, 0, 0.05);
  box-shadow: 
    0 8px 32px rgba(0, 0, 0, 0.08),
    inset 0 1px 0 rgba(255, 255, 255, 0.5);
}

/* ============================================================================
 * UNIFORM CONTENT FLOW
 * ============================================================================ */

/* Reading panel wrapper - improves legibility while maintaining aesthetic */
.reading-panel {
  position: relative;
  background: rgba(0, 0, 0, 0.2);
  border-radius: var(--radius-2xl); /* 20px */
  padding: var(--spacing-8) var(--spacing-8); /* 32px */
  box-shadow: 
    0 4px 16px rgba(0, 0, 0, 0.1),
    inset 0 1px 0 rgba(255, 255, 255, 0.1);
}

[data-theme="light"] .reading-panel {
  background: rgba(255, 255, 255, 0.3);
  box-shadow: 
    0 4px 16px rgba(0, 0, 0, 0.1),
    inset 0 1px 0 rgba(255, 255, 255, 0.1);
}

.content-uniform {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-6); /* Uniform spacing */
  padding-bottom: var(--spacing-4);
}

/* ============================================================================
 * UNIFORM SECTIONS - Identical styling, no variation
 * ============================================================================ */

.uniform-section {
  padding-bottom: var(--spacing-4);
  display: flex;
  flex-direction: column;
  gap: var(--spacing-2); /* Uniform paragraph spacing */
  position: relative;
  border-bottom: 3px solid transparent;
  border-image: repeating-linear-gradient(
    90deg,
    rgba(6, 158, 252, 0.25) 0px,
    rgba(6, 158, 252, 0.25) 20px,
    transparent 20px,
    transparent 40px,
    rgba(124, 58, 237, 0.22) 40px,
    rgba(124, 58, 237, 0.22) 60px,
    transparent 60px,
    transparent 80px,
    rgba(245, 158, 11, 0.22) 80px,
    rgba(245, 158, 11, 0.22) 100px,
    transparent 100px,
    transparent 120px
  ) 1;
}

.uniform-section:last-of-type {
  border-bottom: none;
  padding-bottom: 0;
}

.uniform-section__title {
  font-family: var(--font-display);
  font-size: var(--font-size-20);
  font-weight: var(--font-weight-medium);
  color: var(--color-text-primary);
  margin: 0 0 8px 0;
  letter-spacing: -0.025em;
  /* Add subtle depth shadow to create layered "landscape" effect */
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
}

[data-theme="light"] .uniform-section__title {
  color: var(--color-text-light-primary);
}

.uniform-section p {
  font-size: var(--font-size-16);
  line-height: 1.6;
  color: var(--color-text-secondary); /* Higher contrast */
  margin: 0;
}

[data-theme="light"] .uniform-section {
  border-image: repeating-linear-gradient(
    90deg,
    rgba(6, 158, 252, 0.35) 0px,
    rgba(6, 158, 252, 0.35) 20px,
    transparent 20px,
    transparent 40px,
    rgba(124, 58, 237, 0.32) 40px,
    rgba(124, 58, 237, 0.32) 60px,
    transparent 60px,
    transparent 80px,
    rgba(245, 158, 11, 0.32) 80px,
    rgba(245, 158, 11, 0.32) 100px,
    transparent 100px,
    transparent 120px
  ) 1;
}

[data-theme="light"] .uniform-section p {
  color: rgba(0, 0, 0, 0.82); /* Higher contrast for light theme */
}

/* ============================================================================
 * CLOSING SECTION - Same as others (no special treatment)
 * ============================================================================ */

/* .uniform-section--closing - Intentionally no special styling */

/* ============================================================================
 * INTENSIVE GAME-LIKE TEXTURE LAYERS - Procedural terrain-style patterns
 * Multiple overlapping noise maps like 3D game world textures
 * ============================================================================ */

/* Layer 1: Base terrain grid - like Minecraft or voxel game structure */
body::before {
  content: '';
  position: fixed;
  inset: 0;
  background-image: 
    /* Primary grid - game tile structure */
    repeating-linear-gradient(
      0deg,
      transparent,
      transparent 20px,
      rgba(6, 158, 252, 0.08) 20px,
      rgba(6, 158, 252, 0.08) 21px,
      transparent 21px,
      transparent 40px,
      rgba(124, 58, 237, 0.07) 40px,
      rgba(124, 58, 237, 0.07) 41px,
      transparent 41px,
      transparent 60px,
      rgba(245, 158, 11, 0.07) 60px,
      rgba(245, 158, 11, 0.07) 61px
    ),
    repeating-linear-gradient(
      90deg,
      transparent,
      transparent 20px,
      rgba(245, 158, 11, 0.08) 20px,
      rgba(245, 158, 11, 0.08) 21px,
      transparent 21px,
      transparent 40px,
      rgba(6, 158, 252, 0.07) 40px,
      rgba(6, 158, 252, 0.07) 41px,
      transparent 41px,
      transparent 60px,
      rgba(124, 58, 237, 0.07) 60px,
      rgba(124, 58, 237, 0.07) 61px
    ),
    /* Diagonal noise pattern 1 */
    repeating-linear-gradient(
      30deg,
      transparent,
      transparent 15px,
      rgba(6, 158, 252, 0.05) 15px,
      rgba(6, 158, 252, 0.05) 16px,
      transparent 16px,
      transparent 30px,
      rgba(124, 58, 237, 0.04) 30px,
      rgba(124, 58, 237, 0.04) 31px,
      transparent 31px,
      transparent 45px,
      rgba(245, 158, 11, 0.04) 45px,
      rgba(245, 158, 11, 0.04) 46px
    ),
    /* Diagonal noise pattern 2 */
    repeating-linear-gradient(
      -30deg,
      transparent,
      transparent 15px,
      rgba(245, 158, 11, 0.05) 15px,
      rgba(245, 158, 11, 0.05) 16px,
      transparent 16px,
      transparent 30px,
      rgba(6, 158, 252, 0.04) 30px,
      rgba(6, 158, 252, 0.04) 31px,
      transparent 31px,
      transparent 45px,
      rgba(124, 58, 237, 0.04) 45px,
      rgba(124, 58, 237, 0.04) 46px
    ),
    /* Cross-hatch for texture depth */
    repeating-linear-gradient(
      60deg,
      transparent,
      transparent 25px,
      rgba(6, 158, 252, 0.03) 25px,
      rgba(6, 158, 252, 0.03) 26px
    ),
    repeating-linear-gradient(
      -60deg,
      transparent,
      transparent 25px,
      rgba(124, 58, 237, 0.03) 25px,
      rgba(124, 58, 237, 0.03) 26px
    );
  pointer-events: none;
  z-index: -1;
}

/* Layer 2: Procedural noise dots - like game texture maps */
body::after {
  content: '';
  position: fixed;
  inset: 0;
  background-image:
    /* Dense dot grid - primary noise */
    radial-gradient(circle at 0% 0%, rgba(6, 158, 252, 0.12) 0.5px, transparent 1px),
    radial-gradient(circle at 50% 0%, rgba(124, 58, 237, 0.10) 0.5px, transparent 1px),
    radial-gradient(circle at 0% 50%, rgba(245, 158, 11, 0.10) 0.5px, transparent 1px),
    /* Medium dots - secondary layer */
    radial-gradient(circle at 25% 25%, rgba(6, 158, 252, 0.08) 1px, transparent 2px),
    radial-gradient(circle at 75% 25%, rgba(124, 58, 237, 0.08) 1px, transparent 2px),
    radial-gradient(circle at 25% 75%, rgba(245, 158, 11, 0.08) 1px, transparent 2px),
    radial-gradient(circle at 75% 75%, rgba(6, 158, 252, 0.07) 1px, transparent 2px),
    /* Larger dots - tertiary detail */
    radial-gradient(circle at 33% 33%, rgba(124, 58, 237, 0.10) 1.5px, transparent 3px),
    radial-gradient(circle at 66% 33%, rgba(245, 158, 11, 0.09) 1.5px, transparent 3px),
    radial-gradient(circle at 33% 66%, rgba(6, 158, 252, 0.09) 1.5px, transparent 3px),
    radial-gradient(circle at 66% 66%, rgba(124, 58, 237, 0.08) 1.5px, transparent 3px),
    /* Extra large accent dots */
    radial-gradient(circle at 50% 50%, rgba(6, 158, 252, 0.06) 2px, transparent 4px),
    radial-gradient(circle at 10% 90%, rgba(245, 158, 11, 0.06) 2px, transparent 4px),
    radial-gradient(circle at 90% 10%, rgba(124, 58, 237, 0.06) 2px, transparent 4px);
  background-size: 
    12px 12px, 12px 12px, 12px 12px,
    24px 24px, 24px 24px, 24px 24px, 24px 24px,
    36px 36px, 36px 36px, 36px 36px, 36px 36px,
    60px 60px, 60px 60px, 60px 60px;
  background-position: 
    0 0, 6px 0, 0 6px,
    0 0, 12px 0, 0 12px, 12px 12px,
    0 0, 18px 0, 0 18px, 18px 18px,
    0 0, 30px 30px, 15px 45px;
  pointer-events: none;
  z-index: -1;
}

/* Layer 3: Atmospheric color gradients - game lighting/fog */
.site-main::before {
  content: '';
  position: absolute;
  inset: -48px;
  background: 
    /* Multiple overlapping light sources */
    radial-gradient(ellipse 900px 500px at 50% 0%, rgba(6, 158, 252, 0.12), transparent 65%),
    radial-gradient(ellipse 700px 500px at 15% 25%, rgba(124, 58, 237, 0.10), transparent 60%),
    radial-gradient(ellipse 700px 500px at 85% 30%, rgba(245, 158, 11, 0.10), transparent 60%),
    radial-gradient(ellipse 800px 600px at 50% 100%, rgba(6, 158, 252, 0.08), transparent 55%),
    radial-gradient(circle 500px at 25% 50%, rgba(124, 58, 237, 0.07), transparent 65%),
    radial-gradient(circle 500px at 75% 60%, rgba(245, 158, 11, 0.07), transparent 65%),
    radial-gradient(circle 400px at 10% 80%, rgba(6, 158, 252, 0.06), transparent 70%),
    radial-gradient(circle 400px at 90% 75%, rgba(124, 58, 237, 0.06), transparent 70%),
    /* Small accent lights */
    radial-gradient(circle 250px at 40% 40%, rgba(245, 158, 11, 0.05), transparent 75%),
    radial-gradient(circle 250px at 60% 65%, rgba(6, 158, 252, 0.05), transparent 75%);
  pointer-events: none;
  z-index: -1;
  opacity: 1;
}

/* Layer 4: Micro-detail texture on sections - like material shaders */
.uniform-section::before {
  content: '';
  position: absolute;
  inset: -16px;
  background-image:
    /* Ultra-fine grid - pixel-level detail */
    repeating-linear-gradient(
      0deg,
      transparent,
      transparent 2px,
      rgba(6, 158, 252, 0.025) 2px,
      rgba(6, 158, 252, 0.025) 3px,
      transparent 3px,
      transparent 4px,
      rgba(124, 58, 237, 0.020) 4px,
      rgba(124, 58, 237, 0.020) 5px,
      transparent 5px,
      transparent 6px,
      rgba(245, 158, 11, 0.020) 6px,
      rgba(245, 158, 11, 0.020) 7px
    ),
    repeating-linear-gradient(
      90deg,
      transparent,
      transparent 2px,
      rgba(245, 158, 11, 0.025) 2px,
      rgba(245, 158, 11, 0.025) 3px,
      transparent 3px,
      transparent 4px,
      rgba(6, 158, 252, 0.020) 4px,
      rgba(6, 158, 252, 0.020) 5px,
      transparent 5px,
      transparent 6px,
      rgba(124, 58, 237, 0.020) 6px,
      rgba(124, 58, 237, 0.020) 7px
    ),
    /* Diagonal micro-patterns */
    repeating-linear-gradient(
      22.5deg,
      transparent,
      transparent 6px,
      rgba(6, 158, 252, 0.015) 6px,
      rgba(6, 158, 252, 0.015) 7px
    ),
    repeating-linear-gradient(
      -22.5deg,
      transparent,
      transparent 6px,
      rgba(124, 58, 237, 0.015) 6px,
      rgba(124, 58, 237, 0.015) 7px
    ),
    repeating-linear-gradient(
      67.5deg,
      transparent,
      transparent 6px,
      rgba(245, 158, 11, 0.015) 6px,
      rgba(245, 158, 11, 0.015) 7px
    ),
    repeating-linear-gradient(
      -67.5deg,
      transparent,
      transparent 6px,
      rgba(6, 158, 252, 0.012) 6px,
      rgba(6, 158, 252, 0.012) 7px
    );
  pointer-events: none;
  z-index: 0;
  opacity: 0.8;
}

.uniform-section * {
  position: relative;
  z-index: 1;
}

/* Layer 5: Complex tileable pattern - like game terrain tiles */
.content-uniform::before {
  content: '';
  position: absolute;
  inset: -48px;
  background-image:
    /* Hexagonal/honeycomb pattern - common in games */
    repeating-conic-gradient(
      from 0deg at 50% 50%,
      rgba(6, 158, 252, 0.035) 0deg,
      rgba(6, 158, 252, 0.035) 15deg,
      transparent 15deg,
      transparent 30deg,
      rgba(124, 58, 237, 0.030) 30deg,
      rgba(124, 58, 237, 0.030) 45deg,
      transparent 45deg,
      transparent 60deg,
      rgba(245, 158, 11, 0.030) 60deg,
      rgba(245, 158, 11, 0.030) 75deg,
      transparent 75deg,
      transparent 90deg,
      rgba(6, 158, 252, 0.025) 90deg,
      rgba(6, 158, 252, 0.025) 105deg,
      transparent 105deg,
      transparent 120deg,
      rgba(124, 58, 237, 0.025) 120deg,
      rgba(124, 58, 237, 0.025) 135deg,
      transparent 135deg,
      transparent 150deg,
      rgba(245, 158, 11, 0.025) 150deg,
      rgba(245, 158, 11, 0.025) 165deg,
      transparent 165deg,
      transparent 180deg,
      rgba(6, 158, 252, 0.020) 180deg,
      rgba(6, 158, 252, 0.020) 195deg,
      transparent 195deg,
      transparent 210deg,
      rgba(124, 58, 237, 0.020) 210deg,
      rgba(124, 58, 237, 0.020) 225deg,
      transparent 225deg,
      transparent 240deg,
      rgba(245, 158, 11, 0.020) 240deg,
      rgba(245, 158, 11, 0.020) 255deg,
      transparent 255deg,
      transparent 270deg,
      rgba(6, 158, 252, 0.018) 270deg,
      rgba(6, 158, 252, 0.018) 285deg,
      transparent 285deg,
      transparent 300deg,
      rgba(124, 58, 237, 0.018) 300deg,
      rgba(124, 58, 237, 0.018) 315deg,
      transparent 315deg,
      transparent 330deg,
      rgba(245, 158, 11, 0.018) 330deg,
      rgba(245, 158, 11, 0.018) 345deg,
      transparent 345deg
    ),
    /* Concentric rings - terrain height map style */
    repeating-radial-gradient(
      circle at 50% 50%,
      rgba(6, 158, 252, 0.020) 0px,
      rgba(6, 158, 252, 0.020) 2px,
      transparent 2px,
      transparent 20px,
      rgba(124, 58, 237, 0.018) 20px,
      rgba(124, 58, 237, 0.018) 22px,
      transparent 22px,
      transparent 40px,
      rgba(245, 158, 11, 0.018) 40px,
      rgba(245, 158, 11, 0.018) 42px,
      transparent 42px,
      transparent 60px,
      rgba(6, 158, 252, 0.015) 60px,
      rgba(6, 158, 252, 0.015) 62px,
      transparent 62px,
      transparent 80px,
      rgba(124, 58, 237, 0.015) 80px,
      rgba(124, 58, 237, 0.015) 82px,
      transparent 82px,
      transparent 100px,
      rgba(245, 158, 11, 0.015) 100px,
      rgba(245, 158, 11, 0.015) 102px,
      transparent 102px,
      transparent 120px
    ),
    /* Square tile pattern - classic game grid */
    repeating-linear-gradient(
      0deg,
      rgba(6, 158, 252, 0.012) 0px,
      rgba(6, 158, 252, 0.012) 1px,
      transparent 1px,
      transparent 50px,
      rgba(124, 58, 237, 0.012) 50px,
      rgba(124, 58, 237, 0.012) 51px,
      transparent 51px,
      transparent 100px
    ),
    repeating-linear-gradient(
      90deg,
      rgba(245, 158, 11, 0.012) 0px,
      rgba(245, 158, 11, 0.012) 1px,
      transparent 1px,
      transparent 50px,
      rgba(6, 158, 252, 0.012) 50px,
      rgba(6, 158, 252, 0.012) 51px,
      transparent 51px,
      transparent 100px
    );
  background-size: 120px 120px, 160px 160px, 100px 100px, 100px 100px;
  background-position: 0 0, 60px 60px, 0 0, 0 0;
  pointer-events: none;
  z-index: -1;
  opacity: 0.7;
}

/* Light theme - same intensive game-like patterns with adjusted colors */
[data-theme="light"] body::before {
  background-image: 
    repeating-linear-gradient(
      0deg,
      transparent,
      transparent 20px,
      rgba(6, 158, 252, 0.12) 20px,
      rgba(6, 158, 252, 0.12) 21px,
      transparent 21px,
      transparent 40px,
      rgba(124, 58, 237, 0.10) 40px,
      rgba(124, 58, 237, 0.10) 41px,
      transparent 41px,
      transparent 60px,
      rgba(245, 158, 11, 0.10) 60px,
      rgba(245, 158, 11, 0.10) 61px
    ),
    repeating-linear-gradient(
      90deg,
      transparent,
      transparent 20px,
      rgba(245, 158, 11, 0.12) 20px,
      rgba(245, 158, 11, 0.12) 21px,
      transparent 21px,
      transparent 40px,
      rgba(6, 158, 252, 0.10) 40px,
      rgba(6, 158, 252, 0.10) 41px,
      transparent 41px,
      transparent 60px,
      rgba(124, 58, 237, 0.10) 60px,
      rgba(124, 58, 237, 0.10) 61px
    ),
    repeating-linear-gradient(
      30deg,
      transparent,
      transparent 15px,
      rgba(6, 158, 252, 0.08) 15px,
      rgba(6, 158, 252, 0.08) 16px,
      transparent 16px,
      transparent 30px,
      rgba(124, 58, 237, 0.07) 30px,
      rgba(124, 58, 237, 0.07) 31px,
      transparent 31px,
      transparent 45px,
      rgba(245, 158, 11, 0.07) 45px,
      rgba(245, 158, 11, 0.07) 46px
    ),
    repeating-linear-gradient(
      -30deg,
      transparent,
      transparent 15px,
      rgba(245, 158, 11, 0.08) 15px,
      rgba(245, 158, 11, 0.08) 16px,
      transparent 16px,
      transparent 30px,
      rgba(6, 158, 252, 0.07) 30px,
      rgba(6, 158, 252, 0.07) 31px,
      transparent 31px,
      transparent 45px,
      rgba(124, 58, 237, 0.07) 45px,
      rgba(124, 58, 237, 0.07) 46px
    ),
    repeating-linear-gradient(
      60deg,
      transparent,
      transparent 25px,
      rgba(6, 158, 252, 0.05) 25px,
      rgba(6, 158, 252, 0.05) 26px
    ),
    repeating-linear-gradient(
      -60deg,
      transparent,
      transparent 25px,
      rgba(124, 58, 237, 0.05) 25px,
      rgba(124, 58, 237, 0.05) 26px
    );
}

[data-theme="light"] body::after {
  background-image:
    radial-gradient(circle at 0% 0%, rgba(6, 158, 252, 0.18) 0.5px, transparent 1px),
    radial-gradient(circle at 50% 0%, rgba(124, 58, 237, 0.15) 0.5px, transparent 1px),
    radial-gradient(circle at 0% 50%, rgba(245, 158, 11, 0.15) 0.5px, transparent 1px),
    radial-gradient(circle at 25% 25%, rgba(6, 158, 252, 0.12) 1px, transparent 2px),
    radial-gradient(circle at 75% 25%, rgba(124, 58, 237, 0.12) 1px, transparent 2px),
    radial-gradient(circle at 25% 75%, rgba(245, 158, 11, 0.12) 1px, transparent 2px),
    radial-gradient(circle at 75% 75%, rgba(6, 158, 252, 0.10) 1px, transparent 2px),
    radial-gradient(circle at 33% 33%, rgba(124, 58, 237, 0.14) 1.5px, transparent 3px),
    radial-gradient(circle at 66% 33%, rgba(245, 158, 11, 0.13) 1.5px, transparent 3px),
    radial-gradient(circle at 33% 66%, rgba(6, 158, 252, 0.13) 1.5px, transparent 3px),
    radial-gradient(circle at 66% 66%, rgba(124, 58, 237, 0.12) 1.5px, transparent 3px),
    radial-gradient(circle at 50% 50%, rgba(6, 158, 252, 0.10) 2px, transparent 4px),
    radial-gradient(circle at 10% 90%, rgba(245, 158, 11, 0.10) 2px, transparent 4px),
    radial-gradient(circle at 90% 10%, rgba(124, 58, 237, 0.10) 2px, transparent 4px);
  background-size: 
    12px 12px, 12px 12px, 12px 12px,
    24px 24px, 24px 24px, 24px 24px, 24px 24px,
    36px 36px, 36px 36px, 36px 36px, 36px 36px,
    60px 60px, 60px 60px, 60px 60px;
  background-position: 
    0 0, 6px 0, 0 6px,
    0 0, 12px 0, 0 12px, 12px 12px,
    0 0, 18px 0, 0 18px, 18px 18px,
    0 0, 30px 30px, 15px 45px;
}

[data-theme="light"] .site-main::before {
  background: 
    radial-gradient(ellipse 900px 500px at 50% 0%, rgba(6, 158, 252, 0.15), transparent 65%),
    radial-gradient(ellipse 700px 500px at 15% 25%, rgba(124, 58, 237, 0.13), transparent 60%),
    radial-gradient(ellipse 700px 500px at 85% 30%, rgba(245, 158, 11, 0.13), transparent 60%),
    radial-gradient(ellipse 800px 600px at 50% 100%, rgba(6, 158, 252, 0.11), transparent 55%),
    radial-gradient(circle 500px at 25% 50%, rgba(124, 58, 237, 0.10), transparent 65%),
    radial-gradient(circle 500px at 75% 60%, rgba(245, 158, 11, 0.10), transparent 65%),
    radial-gradient(circle 400px at 10% 80%, rgba(6, 158, 252, 0.09), transparent 70%),
    radial-gradient(circle 400px at 90% 75%, rgba(124, 58, 237, 0.09), transparent 70%),
    radial-gradient(circle 250px at 40% 40%, rgba(245, 158, 11, 0.08), transparent 75%),
    radial-gradient(circle 250px at 60% 65%, rgba(6, 158, 252, 0.08), transparent 75%);
}

[data-theme="light"] .uniform-section::before {
  background-image:
    repeating-linear-gradient(
      0deg,
      transparent,
      transparent 2px,
      rgba(6, 158, 252, 0.040) 2px,
      rgba(6, 158, 252, 0.040) 3px,
      transparent 3px,
      transparent 4px,
      rgba(124, 58, 237, 0.035) 4px,
      rgba(124, 58, 237, 0.035) 5px,
      transparent 5px,
      transparent 6px,
      rgba(245, 158, 11, 0.035) 6px,
      rgba(245, 158, 11, 0.035) 7px
    ),
    repeating-linear-gradient(
      90deg,
      transparent,
      transparent 2px,
      rgba(245, 158, 11, 0.040) 2px,
      rgba(245, 158, 11, 0.040) 3px,
      transparent 3px,
      transparent 4px,
      rgba(6, 158, 252, 0.035) 4px,
      rgba(6, 158, 252, 0.035) 5px,
      transparent 5px,
      transparent 6px,
      rgba(124, 58, 237, 0.035) 6px,
      rgba(124, 58, 237, 0.035) 7px
    ),
    repeating-linear-gradient(
      22.5deg,
      transparent,
      transparent 6px,
      rgba(6, 158, 252, 0.025) 6px,
      rgba(6, 158, 252, 0.025) 7px
    ),
    repeating-linear-gradient(
      -22.5deg,
      transparent,
      transparent 6px,
      rgba(124, 58, 237, 0.025) 6px,
      rgba(124, 58, 237, 0.025) 7px
    ),
    repeating-linear-gradient(
      67.5deg,
      transparent,
      transparent 6px,
      rgba(245, 158, 11, 0.025) 6px,
      rgba(245, 158, 11, 0.025) 7px
    ),
    repeating-linear-gradient(
      -67.5deg,
      transparent,
      transparent 6px,
      rgba(6, 158, 252, 0.022) 6px,
      rgba(6, 158, 252, 0.022) 7px
    );
}

[data-theme="light"] .content-uniform::before {
  background-image:
    repeating-conic-gradient(
      from 0deg at 50% 50%,
      rgba(6, 158, 252, 0.050) 0deg,
      rgba(6, 158, 252, 0.050) 15deg,
      transparent 15deg,
      transparent 30deg,
      rgba(124, 58, 237, 0.045) 30deg,
      rgba(124, 58, 237, 0.045) 45deg,
      transparent 45deg,
      transparent 60deg,
      rgba(245, 158, 11, 0.045) 60deg,
      rgba(245, 158, 11, 0.045) 75deg,
      transparent 75deg,
      transparent 90deg,
      rgba(6, 158, 252, 0.040) 90deg,
      rgba(6, 158, 252, 0.040) 105deg,
      transparent 105deg,
      transparent 120deg,
      rgba(124, 58, 237, 0.040) 120deg,
      rgba(124, 58, 237, 0.040) 135deg,
      transparent 135deg,
      transparent 150deg,
      rgba(245, 158, 11, 0.040) 150deg,
      rgba(245, 158, 11, 0.040) 165deg,
      transparent 165deg,
      transparent 180deg,
      rgba(6, 158, 252, 0.035) 180deg,
      rgba(6, 158, 252, 0.035) 195deg,
      transparent 195deg,
      transparent 210deg,
      rgba(124, 58, 237, 0.035) 210deg,
      rgba(124, 58, 237, 0.035) 225deg,
      transparent 225deg,
      transparent 240deg,
      rgba(245, 158, 11, 0.035) 240deg,
      rgba(245, 158, 11, 0.035) 255deg,
      transparent 255deg,
      transparent 270deg,
      rgba(6, 158, 252, 0.030) 270deg,
      rgba(6, 158, 252, 0.030) 285deg,
      transparent 285deg,
      transparent 300deg,
      rgba(124, 58, 237, 0.030) 300deg,
      rgba(124, 58, 237, 0.030) 315deg,
      transparent 315deg,
      transparent 330deg,
      rgba(245, 158, 11, 0.030) 330deg,
      rgba(245, 158, 11, 0.030) 345deg,
      transparent 345deg
    ),
    repeating-radial-gradient(
      circle at 50% 50%,
      rgba(6, 158, 252, 0.035) 0px,
      rgba(6, 158, 252, 0.035) 2px,
      transparent 2px,
      transparent 20px,
      rgba(124, 58, 237, 0.032) 20px,
      rgba(124, 58, 237, 0.032) 22px,
      transparent 22px,
      transparent 40px,
      rgba(245, 158, 11, 0.032) 40px,
      rgba(245, 158, 11, 0.032) 42px,
      transparent 42px,
      transparent 60px,
      rgba(6, 158, 252, 0.028) 60px,
      rgba(6, 158, 252, 0.028) 62px,
      transparent 62px,
      transparent 80px,
      rgba(124, 58, 237, 0.028) 80px,
      rgba(124, 58, 237, 0.028) 82px,
      transparent 82px,
      transparent 100px,
      rgba(245, 158, 11, 0.028) 100px,
      rgba(245, 158, 11, 0.028) 102px,
      transparent 102px,
      transparent 120px
    ),
    repeating-linear-gradient(
      0deg,
      rgba(6, 158, 252, 0.022) 0px,
      rgba(6, 158, 252, 0.022) 1px,
      transparent 1px,
      transparent 50px,
      rgba(124, 58, 237, 0.022) 50px,
      rgba(124, 58, 237, 0.022) 51px,
      transparent 51px,
      transparent 100px
    ),
    repeating-linear-gradient(
      90deg,
      rgba(245, 158, 11, 0.022) 0px,
      rgba(245, 158, 11, 0.022) 1px,
      transparent 1px,
      transparent 50px,
      rgba(6, 158, 252, 0.022) 50px,
      rgba(6, 158, 252, 0.022) 51px,
      transparent 51px,
      transparent 100px
    );
  background-size: 120px 120px, 160px 160px, 100px 100px, 100px 100px;
  background-position: 0 0, 60px 60px, 0 0, 0 0;
}

/* ============================================================================
 * NO INTERACTIONS - Everything visible, nothing special
 * ============================================================================ */

/* No hover states */
/* No transitions */
/* No discoveries */
/* Intentionally monotonous */