:root {
  --primary: #9b5de5;

  --purple-glow:         #9b5de5;
  --purple-bright:       #c77dff;
  --purple-soft:         #d5a3ff;
  --purple-3:            #6b3fb3;
  --purple-2:            #3a1f66;
  --auth-accent:         #4b2a86;
  --auth-accent-deep:    #3a1f69;
  --auth-accent-hi:      #53308f;
  --purple-1:            #1b0f33;
  --purple-pale:         #e3c9ff;
  --bg-deep:             #0c0616;
  --bg-panel:            #150c26;
  --bg-raised:           #1c1132;
  --bg-sunken:           #0a0512;
  --bg-void:             #05020b;
  --bg-well:             #06020e;
  --bg-scrim:            #06030c;
  --bg-dock:             #0f081c;
  --bg-card-2:           #160d26;
  --bg-halo-1:           #1a0f2b;
  --bg-halo-2:           #180d28;
  --bg-halo-3:           #201233;
  --bg-glass-top:        #2e1852;
  --auth-bg:             #0b0713;
  --auth-well:           #07040d;
  --auth-edge-dark:      #1c0f33;
  --auth-seg-on:         #2a1848;
  --text-hi:             #f3ecff;
  --text-mid:            #b7a6d9;
  --text-low:            #9483bd;
  --text-faint:          #6c5c8a;
  --auth-text:           #ece4fa;
  --auth-text-hi:        #f4eefc;
}

@supports (color: oklch(from red l c h)) {
  :root {
    --purple-glow: oklch(from var(--primary) clamp(0.58128, calc(l + 0), 0.73128) min(calc(c * 1), 0.37) calc(h + 0));
    --purple-bright: oklch(from var(--primary) clamp(0.6897, calc(l + 0.10842), 0.8397) min(calc(c * 0.96707), 0.37) calc(h + 6.8123));
    --purple-soft: oklch(from var(--primary) clamp(0.76463, calc(l + 0.18335), 0.91463) min(calc(c * 0.6847), 0.37) calc(h + 6.70238));
    --purple-3: oklch(from var(--primary) clamp(0.36236, calc(l + -0.12893), 0.48236) min(calc(c * 0.87807), 0.37) calc(h + -5.06782));
    --purple-2: oklch(from var(--primary) clamp(0.19815, calc(l + -0.29314), 0.31815) min(calc(c * 0.59339), 0.37) calc(h + -5.26505));
    --auth-accent: oklch(from var(--primary) clamp(0.26129, calc(l + -0.22999), 0.38129) min(calc(c * 0.72951), 0.37) calc(h + -6.74943));
    --auth-accent-deep: oklch(from var(--primary) clamp(0.20073, calc(l + -0.29055), 0.32073) min(calc(c * 0.6131), 0.37) calc(h + -6.39513));
    --auth-accent-hi: oklch(from var(--primary) clamp(0.2864, calc(l + -0.20488), 0.4064) min(calc(c * 0.74812), 0.37) calc(h + -5.78397));
    --purple-1: oklch(from var(--primary) 0.20813 min(calc(c * 0.34102), 0.11292) calc(h + -6.58693));
    --purple-pale: oklch(from var(--primary) 0.87498 min(calc(c * 0.39187), 0.12916) calc(h + 4.8751));
    --bg-deep: oklch(from var(--primary) 0.14221 min(calc(c * 0.17972), 0.0614) calc(h + -1.53666));
    --bg-panel: oklch(from var(--primary) 0.18298 min(calc(c * 0.25942), 0.08686) calc(h + -4.83171));
    --bg-raised: oklch(from var(--primary) 0.21258 min(calc(c * 0.31512), 0.10464) calc(h + -5.80233));
    --bg-sunken: oklch(from var(--primary) 0.13256 min(calc(c * 0.15625), 0.05391) calc(h + 0.38269));
    --bg-void: oklch(from var(--primary) 0.10311 min(calc(c * 0.14864), 0.05147) calc(h + 0.386));
    --bg-well: oklch(from var(--primary) 0.10835 min(calc(c * 0.17811), 0.06089) calc(h + -0.1737));
    --bg-scrim: oklch(from var(--primary) 0.11192 min(calc(c * 0.13315), 0.04653) calc(h + 0.08363));
    --bg-dock: oklch(from var(--primary) 0.15726 min(calc(c * 0.21009), 0.0711) calc(h + -4.0513));
    --bg-card-2: oklch(from var(--primary) 0.18649 min(calc(c * 0.25011), 0.08388) calc(h + -3.77735));
    --bg-halo-1: oklch(from var(--primary) 0.2001 min(calc(c * 0.27573), 0.09206) calc(h + -2.24111));
    --bg-halo-2: oklch(from var(--primary) 0.19076 min(calc(c * 0.269), 0.08991) calc(h + -1.62048));
    --bg-halo-3: oklch(from var(--primary) 0.22055 min(calc(c * 0.31719), 0.10531) calc(h + -0.85961));
    --bg-glass-top: oklch(from var(--primary) 0.27521 min(calc(c * 0.50444), 0.16511) calc(h + -5.13734));
    --auth-bg: oklch(from var(--primary) 0.14174 min(calc(c * 0.13489), 0.04708) calc(h + -2.70599));
    --auth-well: oklch(from var(--primary) 0.11957 min(calc(c * 0.12206), 0.04299) calc(h + -0.27237));
    --auth-edge-dark: oklch(from var(--primary) 0.2094 min(calc(c * 0.34162), 0.11311) calc(h + -5.06464));
    --auth-seg-on: oklch(from var(--primary) 0.26178 min(calc(c * 0.43084), 0.1416) calc(h + -4.3909));
    --text-hi: oklch(from var(--primary) 0.95409 min(calc(c * 0.13185), 0.04611) calc(h + 0.79645));
    --text-mid: oklch(from var(--primary) 0.75716 min(calc(c * 0.372), 0.12281) calc(h + -1.895));
    --text-low: oklch(from var(--primary) 0.64713 min(calc(c * 0.43572), 0.14316) calc(h + -4.41171));
    --text-faint: oklch(from var(--primary) 0.50884 min(calc(c * 0.36924), 0.12193) calc(h + -2.02018));
    --auth-text: oklch(from var(--primary) 0.93167 min(calc(c * 0.15347), 0.05302) calc(h + 0.50696));
    --auth-text-hi: oklch(from var(--primary) 0.95782 min(calc(c * 0.09832), 0.0354) calc(h + 3.47769));
  }

}

:root {
  --gold: #e8c874;
  --gold-dim: #a68a45;
  --line-aspect: #c77dff;
  --extended-point: #b7a6d9;
  --extended-point-transit: #c77dff;


  --star: #50a080;

  --planet-sun: #f6b13a;
  --planet-moon: #e2e8f4;
  --planet-mercury: #c4e26a;
  --planet-venus: #f28cb1;
  --planet-mars: #f0532f;
  --planet-jupiter: #8a86ff;
  --planet-saturn: #9aa3b5;
  --planet-uranus: #38d9e6;
  --planet-neptune: #2f8fd8;
  --planet-pluto: #e0466f;
  --planet-chiron: #c98450;
  --planet-node: #b0a58f;
  --planet-fortune: #b9a56a;
  --planet-lilith: #b05ac8;
  --planet-ceres: #8fa872;
  --planet-pallas: #78a3a3;
  --planet-juno: #b98a8a;
  --planet-vesta: #d5a790;
  --planet-pholus: #927a67;
  --planet-neutral: #b7a6d9;

  --el-fire: color-mix(in srgb, var(--planet-mars) 55%, var(--planet-sun));
  --el-earth: color-mix(in srgb, var(--planet-ceres) 55%, var(--planet-mercury));
  --el-air: color-mix(in srgb, var(--planet-uranus) 60%, var(--planet-moon));
  --el-water: color-mix(in srgb, var(--planet-neptune) 50%, var(--planet-jupiter));

  --aspect-conjunction: #9fe0ee;
  --aspect-sextile: #4f9dff;
  --aspect-trine: #4fd394;
  --aspect-square: #e5534b;
  --aspect-opposition: #f39a3d;
  --aspect-semisextile: #7f9c9c;
  --aspect-semisquare: #a58890;
  --aspect-sesquiquadrate: #a89a7a;
  --aspect-quincunx: #8f88a8;
  --aspect-neutral: #c77dff;
  --rose: #ff7ab8;
  --danger: #ff6b8a;
  --success: #6be5b5;

  --white: #ffffff;
  --black: #000000;
  --neutral-track: #787880;


  --line: color-mix(in srgb, var(--purple-glow) 30%, transparent);
  --line-strong: color-mix(in srgb, var(--purple-glow) 46%, transparent);

  --edge-accent: color-mix(in srgb, var(--purple-bright) 32%, transparent);
  --glass-edge: var(--line-strong);
  --glass-highlight: inset 0 1px 0 color-mix(in srgb, var(--white) 8%, transparent);
  --glass: color-mix(in srgb, var(--white) 3.5%, transparent);
  --glass-2: color-mix(in srgb, var(--white) 6%, transparent);

  --glass-intensity: 2.4px;
  --glass-alpha: 57%;
  --glass-filter: blur(var(--glass-intensity)) saturate(1.3);
  --glass-fill: color-mix(in srgb, var(--bg-panel) var(--glass-alpha), transparent);

  --font-sans: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, system-ui, sans-serif;
  --font-serif: 'Cormorant Garamond', Georgia, 'Times New Roman', serif;
  --font-glyph: 'Segoe UI Symbol', 'Apple Symbols', 'Noto Sans Symbols 2', Georgia, serif;

  --r-sm: 10px;
  --r-md: 14px;
  --r-lg: 20px;
  --r-xl: 26px;

  --pad: 18px;
  --shell-max: 480px;
  --tabbar-h: 65px;

  --ease: cubic-bezier(0.22, 1, 0.36, 1);
  --dur: 260ms;
}

* { box-sizing: border-box; -webkit-tap-highlight-color: transparent; }

html, body {
  margin: 0;
  padding: 0;
  min-height: 100%;
  background: var(--bg-deep);
  overscroll-behavior-y: none;
}

:root { --screen-h: 100vh; --pin-bottom: 0px; }
@supports (height: 100dvh) { :root { --screen-h: 100dvh; } }
@media (display-mode: standalone), (display-mode: fullscreen) { :root { --screen-h: 100vh; --pin-bottom: calc(100% - 100vh); } }

body {
  font-family: var(--font-sans);
  color: var(--text-hi);
  font-size: 15px;
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
  overflow-x: clip;
}

html { overflow-x: clip; }

@media (hover: hover) and (pointer: fine) { html { overflow-y: scroll; } }

button, input, select, textarea {
  font-family: inherit;
  font-size: inherit;
  color: inherit;
}

button { cursor: pointer; border: none; background: none; }

::selection { background: color-mix(in srgb, var(--purple-bright) 32%, transparent); color: var(--white); }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
  }
}