/* generated by build.mjs — edit themes/themes.mjs instead */
:root {
  --bg: #17100a;
  --bg-gradient: radial-gradient(75% 55% at 50% 110%, rgba(227,176,75,0.20), transparent 62%), radial-gradient(60% 45% at 12% 0%, rgba(201,111,74,0.12), transparent 60%);
  --surface: rgba(34,24,14,0.82);
  --ink: #f5ead8;
  --ink-dim: #a8917a;
  --accent: #e3b04b;
  --accent-2: #c96f4a;
  --on-accent: #201204;
  --line: rgba(227,176,75,0.24);
  --sign-ink: #e3b04b;
  --sign-tracking: 0.12em;
  --sign-shadow: 0 0 34px rgba(227,176,75,0.4);
  --card-radius: 4px;
  --card-border: 1px solid rgba(227,176,75,0.26);
  --grain-opacity: 0.07;
  --font-display: "Limelight", Georgia, serif;
  --font-body: "Jost", 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");
}
      .vinyl{position:absolute;left:50%;bottom:-34vh;transform:translateX(-50%);
        width:min(620px,96vw);opacity:.85;filter:drop-shadow(0 0 40px rgba(227,176,75,.18))}
      .spin{transform-box:fill-box;transform-origin:center;animation:spin 14s linear infinite}
      @keyframes spin{to{transform:rotate(360deg)}}
      .glow{position:absolute;left:8vw;top:10vh;width:120px;height:120px;border-radius:50%;
        background:radial-gradient(circle,#e3b04b55,transparent 70%);filter:blur(14px)}
      .motes b{position:absolute;bottom:-4vh;left:var(--x);width:5px;height:5px;border-radius:50%;
        background:#e3b04b66;animation:mote 12s linear infinite;animation-delay:var(--d)}
      @keyframes mote{to{transform:translate(-14px,-114vh);opacity:0}}
      @media(max-width:640px){.vinyl{bottom:-40vh}}