/* generated by build.mjs — edit themes/themes.mjs instead */
:root {
  --bg: #12111b;
  --bg-gradient: radial-gradient(80% 60% at 70% 15%, rgba(183,166,232,0.16), transparent 60%), radial-gradient(70% 50% at 20% 95%, rgba(123,199,199,0.12), transparent 65%);
  --surface: rgba(24,23,36,0.78);
  --ink: #ece9f6;
  --ink-dim: #8d88a8;
  --accent: #b7a6e8;
  --accent-2: #7bc7c7;
  --on-accent: #15121f;
  --line: rgba(183,166,232,0.2);
  --sign-ink: #ece9f6;
  --sign-tracking: 0.06em;
  --card-radius: 18px;
  --card-blur: blur(8px);
  --card-border: 1px solid rgba(255,255,255,0.09);
  --art-radius: 12px;
  --grain-opacity: 0.06;
  --vignette: radial-gradient(120% 100% at 50% 40%, transparent 50%, rgba(0,0,0,0.5) 100%);
  --font-display: "DM Serif Display", Georgia, serif;
  --font-body: "DM Sans", 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");
}
      .window{position:absolute;inset:8vh 6vw;border:1px solid rgba(255,255,255,.07);
        border-radius:10px;
        background:linear-gradient(160deg,rgba(255,255,255,.035),transparent 55%);
        backdrop-filter:blur(1px)}
      .window::after{content:"";position:absolute;left:50%;top:0;bottom:0;width:1px;
        background:rgba(255,255,255,.06)}
      .rain i{position:absolute;top:-14vh;left:var(--x);width:1px;height:12vh;
        background:linear-gradient(180deg,transparent,rgba(183,166,232,.5));
        animation:fall var(--s) linear infinite;animation-delay:var(--d)}
      @keyframes fall{to{transform:translateY(124vh)}}