/* generated by build.mjs — edit themes/themes.mjs instead */
:root {
  --bg: #08120c;
  --bg-gradient: linear-gradient(180deg, rgba(23,164,78,0.16), transparent 45%), radial-gradient(80% 60% at 50% 110%, rgba(255,212,0,0.12), transparent 70%);
  --surface: rgba(11,26,17,0.8);
  --ink: #f1f7ee;
  --ink-dim: #93ab9b;
  --accent: #ffd400;
  --accent-2: #17a44e;
  --on-accent: #0a1a10;
  --line: rgba(255,212,0,0.2);
  --sign-ink: #ffd400;
  --sign-shadow: 0 3px 0 #17a44e;
  --card-radius: 14px;
  --card-border: 2px solid rgba(255,212,0,0.28);
  --grain-opacity: 0.06;
  --font-display: "Baloo Bhai 2", Georgia, serif;
  --font-body: "Inter", 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");
}
      .trinket{position:absolute;top:0;right:24vw;width:104px;opacity:1;
        filter:drop-shadow(0 0 18px rgba(255,212,0,.25))}
      .stripe{position:absolute;left:0;right:0;bottom:0;height:22vh;
        background:linear-gradient(180deg,transparent,#17a44e33 60%,#17a44e55),
        repeating-linear-gradient(90deg,#0000 0 22px,#ffd4000f 22px 44px)}
      .fare{position:absolute;right:5vw;top:22vh;font-family:var(--font-display);
        font-size:clamp(20px,5vw,38px);color:#ffd400;opacity:.35;letter-spacing:.08em;
        text-shadow:0 0 26px rgba(255,212,0,.5)}
      @media(max-width:640px){.trinket{right:6vw;width:56px}.fare{opacity:.18}}
