/* generated by build.mjs — edit themes/themes.mjs instead */
:root {
  --bg: #06070d;
  --bg-gradient: radial-gradient(70% 50% at 50% 0%, rgba(143,123,255,0.14), transparent 60%), radial-gradient(60% 45% at 85% 90%, rgba(69,224,200,0.08), transparent 65%);
  --surface: rgba(13,15,26,0.82);
  --ink: #eaecf5;
  --ink-dim: #767c9c;
  --accent: #8f7bff;
  --accent-2: #45e0c8;
  --on-accent: #12081f;
  --line: rgba(143,123,255,0.24);
  --sign-ink: #8f7bff;
  --sign-tracking: 0.1em;
  --sign-shadow: 0 0 30px rgba(143,123,255,0.6);
  --card-radius: 16px;
  --art-radius: 10px;
  --card-blur: blur(6px);
  --grain-opacity: 0.05;
  --font-display: "Syne", Georgia, serif;
  --font-body: "Outfit", system-ui, -apple-system, sans-serif;
  --grain-url: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}
      .glass{position:absolute;inset:0;
        background:repeating-linear-gradient(90deg,rgba(255,255,255,.012) 0 2px,transparent 2px 9px),
                   radial-gradient(120% 80% at 50% 110%, rgba(143,123,255,.07), transparent 60%)}
      .rain i{position:absolute;top:-12vh;left:calc(var(--x) + 2vw);width:1px;height:11vh;
        background:linear-gradient(180deg,transparent,rgba(143,123,255,.55));
        animation:drip var(--s) cubic-bezier(.4,.1,.6,.9) infinite;animation-delay:var(--d)}
      @keyframes drip{
        0%{transform:translateY(0);opacity:0}
        12%{opacity:1}
        82%{transform:translateY(96vh);opacity:1}
        100%{transform:translateY(104vh);opacity:0}}
      .bokeh b{position:absolute;left:var(--x);top:var(--y);width:26px;height:26px;
        border-radius:50%;background:var(--c);opacity:.14;filter:blur(7px)}
      .bokeh b:nth-child(even){width:16px;height:16px}