
* { box-sizing: border-box; }
body { margin: 0; font-family: 'Special Elite', 'Courier New', monospace; color: #eee;
  background-color: #000;
  background-image:
    radial-gradient(1px 1px at 12% 22%, #fff 100%, transparent),
    radial-gradient(1px 1px at 32% 68%, #ddd 100%, transparent),
    radial-gradient(2px 2px at 55% 12%, #fff 100%, transparent),
    radial-gradient(1px 1px at 71% 44%, #ccc 100%, transparent),
    radial-gradient(1px 1px at 88% 78%, #fff 100%, transparent),
    radial-gradient(2px 2px at 5% 82%, #ddd 100%, transparent),
    radial-gradient(1px 1px at 44% 38%, #fff 100%, transparent),
    radial-gradient(1px 1px at 63% 90%, #ccc 100%, transparent),
    radial-gradient(1px 1px at 25% 52%, #fff 100%, transparent),
    radial-gradient(1px 1px at 80% 18%, #ddd 100%, transparent);
  background-attachment: fixed; line-height: 1.6; }
nav { background: rgba(0,0,0,0.9); padding: 14px 18px; text-align: center; border-bottom: 1px solid #444; }
nav a { color: #eee; margin: 0 6px; text-decoration: none; }
nav a:hover { text-decoration: underline; }
main { max-width: 900px; margin: 0 auto; padding: 24px 16px 48px; }
.panel { background: rgba(8,8,10,0.92); border: 1px solid #555; padding: 22px; margin: 22px 0; }
h1, h2, h3 { line-height: 1.3; }
a { color: #eee; }
.logo { display: block; max-width: 420px; width: 90%; margin: 10px auto; }
.hero { text-align: center; }
.hero h1 { font-size: 2.2em; }
.tagline { font-size: 1.3em; color: #eee; }
.showcard { border: 1px solid #666; padding: 18px; margin: 16px 0; background: rgba(15,15,18,0.92); }
.showcard img { max-width: 280px; width: 100%; display: block; margin: 0 auto 10px; }
.ep-list { list-style: none; padding: 0; }
.ep-list li { border-bottom: 1px solid #333; padding: 12px 4px; }
.ep-list a { font-size: 1.05em; }
.ep-list p { margin: 6px 0 0; color: #ccc; }
footer { border-top: 1px solid #444; background: rgba(0,0,0,0.9); padding: 24px 16px; }
.footgrid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 16px; max-width: 1000px; margin: 0 auto; }
.footgrid h3 { margin: 0 0 6px; font-size: 1em; color: #979797; }
.footgrid p { margin: 4px 0; font-size: 0.92em; }
.theme-be .panel, .theme-be .showcard { border-color: #2e7d4f; }
.theme-be a, .theme-be .footgrid h3 { color: #9fd8b4; }
.theme-bi .panel, .theme-bi .showcard { border-color: #6b5bb5; }
.theme-bi a, .theme-bi .footgrid h3 { color: #b8f35a; }
.theme-ior .panel, .theme-ior .showcard { border-color: #888; }
.theme-report .panel, .theme-news .panel { background: rgba(245,236,215,0.96); color: #111; border: 2px solid #111; }
.theme-report .panel a, .theme-news .panel a { color: #8a1111; }
.theme-report nav a, .theme-news nav a { color: #eee; }
.theme-report h1, .theme-report h2 { color: #111; }
.theme-news h1, .theme-news h2 { color: #111; }
.stamp { display: inline-block; border: 3px solid #a11111; color: #a11111; padding: 4px 12px; letter-spacing: 2px; }
img.article-logo { max-width: 340px; width: 100%; display: block; margin: 0 auto 12px; }
img.about-photo { max-width: 380px; width: 100%; display: block; margin: 0 auto; }
/* Homepage follows the original BRM logo: black, logo red, logo grey. Red is
   brightened from the logo's deep red (#9d1719) so links stay readable on black;
   grey (#979797) is sampled from the logo's halftone. Applies to brand pages
   using theme-home (homepage, about, contact, support, articles). */
.theme-home a { color: #e5484d; }
.theme-home .tagline { color: #e5484d; }
.theme-home nav a { color: #eee; }
.theme-home .footgrid h3 { color: #979797; }

/* Inquiries of our Reality: neutral black/white/grey scheme (no cream, no cosmic colors). */
.theme-ior a { color: #eee; }
.theme-ior nav a { color: #eee; }
.theme-ior .footgrid h3 { color: #979797; }
.footlogo-wrap { text-align: center; margin-top: 18px; }
.footlogo { max-width: 220px; width: 60%; }
.player { margin: 16px 0; }
.player iframe { width: 100%; height: 400px; border: 0; }
