/* ==========================================================================
   FURPHY RETRO THEME: BBS CRT TERMINAL
   Metaphor: 1980s 80-Column Cyberpunk BBS / Teletext Green Phosphor CRT
   Palette:
     - Phosphor CRT Black: #020d04 (Screen chassis)
     - Phosphor Green:     #00ff66 (Main text, 14.59:1 WCAG AA PASS)
     - Phosphor Soft:      #00cc52 (Muted text, 9.19:1 WCAG AA PASS)
     - ANSI Cyan:          #00ffff (Secondary highlight, 15.77:1 WCAG AA PASS)
     - ANSI Yellow:        #ffff33 (Command keys & alerts, 18.46:1 WCAG AA PASS)
   ========================================================================== */

body[data-theme-layout="bbs"] {
  --sky: #020d04;
  --sky-grad: none;
  --card: #041206;
  --ink: #00ff66;
  --ink-soft: #00cc52;
  --slot: #020f05;
  --shadow-1: #003314;
  --shadow-2: #00ff66;
  --ab-cyan: #00ffff;
  --ab-pink: #ffff33;
  --chip-bg: rgba(0, 255, 102, 0.05);
  --dither: transparent;
  --w: #00ff66;

  background-color: #020d04 !important;
  background-image: radial-gradient(circle at 50% 50%, rgba(0, 255, 102, 0.04) 0%, rgba(2, 13, 4, 0.96) 82%, #010702 100%) !important;
  background-attachment: fixed;
  color: #00ff66 !important;
  font-family: 'Press Start 2P', 'Courier New', Courier, monospace !important;
  text-shadow: 0 0 5px rgba(0, 255, 102, 0.65), 0 0 12px rgba(0, 255, 102, 0.25);
  min-height: 100vh;
}

/* Hide ambient city / sunset canvas in BBS terminal mode */
body[data-theme-layout="bbs"] .bg,
body[data-theme-layout="bbs"] #sun,
body[data-theme-layout="bbs"] #moon {
  display: none !important;
}

/* CRT Scanline Overlay */
body[data-theme-layout="bbs"]::before {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 1000;
  pointer-events: none;
  background:
    linear-gradient(rgba(18, 16, 16, 0) 50%, rgba(0, 0, 0, 0.45) 50%),
    linear-gradient(90deg, rgba(0, 255, 102, 0.02), rgba(0, 0, 0, 0.02), rgba(0, 255, 102, 0.02));
  background-size: 100% 3px, 6px 100%;
  opacity: 0.85;
}

/* CRT Screen Glow Vignette */
body[data-theme-layout="bbs"]::after {
  content: "";
  position: fixed;
  inset: 0;
  z-index: 999;
  pointer-events: none;
  background: radial-gradient(ellipse at center, transparent 62%, rgba(0, 0, 0, 0.88) 100%);
  box-shadow: inset 0 0 90px rgba(0, 255, 102, 0.14);
}

/* 80-Column Terminal Chassis Container */
body[data-theme-layout="bbs"] main {
  max-width: 50rem;
  margin: 1.5rem auto 4.5rem;
  padding: 1.5rem 1.4rem 2.5rem;
  background: #030f05;
  border: 2px solid #00ff66;
  border-radius: 4px;
  box-shadow:
    0 0 24px rgba(0, 255, 102, 0.25),
    inset 0 0 32px rgba(0, 255, 102, 0.06);
  position: relative;
  z-index: 1;
}

/* Terminal Node Header Banner */
body[data-theme-layout="bbs"] .player::before {
  content: "================================================\A[NODE 1: 14400 BPS]  [SYSOP: FURPHY]  [ANSI-BBS ON]\A================================================";
  white-space: pre-wrap;
  display: block;
  color: #00ffff;
  font-family: 'Press Start 2P', monospace;
  font-size: clamp(0.42rem, 1.8vw, 0.62rem);
  line-height: 1.55;
  letter-spacing: 0.04em;
  margin-bottom: 1.4rem;
  text-align: center;
  text-shadow: 0 0 6px rgba(0, 255, 255, 0.7);
  overflow: hidden;
  max-width: 100%;
  word-break: break-all;
  box-sizing: border-box;
}

/* Avatar Radar / Biometric Frame */
body[data-theme-layout="bbs"] .avatar-slot {
  width: 106px;
  height: 106px;
  background: #010803 !important;
  border: 2px solid #00ff66 !important;
  box-shadow:
    0 0 12px rgba(0, 255, 102, 0.45),
    inset 0 0 8px rgba(0, 255, 102, 0.2) !important;
  animation: none !important;
  border-radius: 0;
  margin-bottom: 1rem;
}

body[data-theme-layout="bbs"] .avatar-slot img {
  filter: brightness(1.25) sepia(100%) hue-rotate(85deg) saturate(600%) drop-shadow(0 0 4px #00ff66);
  image-rendering: pixelated;
}

/* Header Typography */
body[data-theme-layout="bbs"] h1 {
  color: #00ff66 !important;
  text-shadow:
    0 0 6px #00ff66,
    0 0 18px rgba(0, 255, 102, 0.75) !important;
  font-size: clamp(1.4rem, 5vw, 2rem) !important;
  letter-spacing: 0.18em;
  margin: 0 0 0.4rem;
}

body[data-theme-layout="bbs"] .kana {
  color: #00ffff !important;
  text-shadow: 0 0 6px rgba(0, 255, 255, 0.6) !important;
  font-size: 0.85rem;
  letter-spacing: 0.25em;
  margin: 0 0 0.6rem;
}

body[data-theme-layout="bbs"] .tagline {
  color: #00ff66 !important;
  font-family: 'Press Start 2P', monospace !important;
  font-size: 0.72rem !important;
  line-height: 1.5 !important;
  letter-spacing: 0.06em;
  opacity: 0.95;
  margin: 0 auto 1.25rem;
}

/* Social Buttons: ANSI Terminal Keypad */
body[data-theme-layout="bbs"] .socials {
  gap: 0.55rem;
  flex-wrap: wrap;
  justify-content: center;
}

body[data-theme-layout="bbs"] .slot-btn {
  width: auto;
  min-width: 46px;
  height: 42px;
  padding: 0 0.5rem;
  background: #010a03 !important;
  border: 2px solid #00ff66 !important;
  box-shadow: 0 0 6px rgba(0, 255, 102, 0.3) !important;
  color: #00ff66 !important;
  border-radius: 0;
  transition: background 0.08s, color 0.08s, box-shadow 0.08s !important;
}

body[data-theme-layout="bbs"] .slot-btn canvas {
  filter: brightness(1.2) sepia(100%) hue-rotate(85deg) saturate(600%) drop-shadow(0 0 2px #00ff66);
}

body[data-theme-layout="bbs"] .slot-btn:hover,
body[data-theme-layout="bbs"] .slot-btn:focus-visible {
  background: #00ff66 !important;
  color: #020d04 !important;
  border-color: #00ff66 !important;
  box-shadow: 0 0 14px rgba(0, 255, 102, 0.9) !important;
  transform: none !important;
}

body[data-theme-layout="bbs"] .slot-btn:hover canvas,
body[data-theme-layout="bbs"] .slot-btn:focus-visible canvas {
  filter: invert(1) brightness(0.15);
}

body[data-theme-layout="bbs"] .copytip {
  background: #00ff66 !important;
  color: #020d04 !important;
  border: 1px solid #00ff66 !important;
  font-family: 'Press Start 2P', monospace !important;
  font-size: 0.65rem !important;
  font-weight: 700;
  box-shadow: 0 0 8px rgba(0, 255, 102, 0.8) !important;
}

/* Divider: ASCII Banner */
body[data-theme-layout="bbs"] .divider {
  color: #00ffff !important;
  text-shadow: 0 0 6px rgba(0, 255, 255, 0.6) !important;
  font-size: 0.68rem !important;
  letter-spacing: 0.15em;
  margin: 1.8rem 0 1.2rem;
}

body[data-theme-layout="bbs"] .divider::before,
body[data-theme-layout="bbs"] .divider::after {
  border-top: 1px solid #00ff66 !important;
  opacity: 0.65;
}

body[data-theme-layout="bbs"] .divcat {
  filter: brightness(1.2) sepia(100%) hue-rotate(85deg) saturate(600%);
}

/* Worlds Navigation: BBS Menu Commands */
body[data-theme-layout="bbs"] .worlds {
  gap: 0.8rem;
}

body[data-theme-layout="bbs"] .world {
  background: #010a03 !important;
  border: 1px dashed #00ff66 !important;
  box-shadow: none !important;
  padding: 0.85rem 1rem !important;
  border-radius: 0 !important;
  animation: none !important;
  position: relative;
  transition: background 0.08s, border-color 0.08s, box-shadow 0.08s, transform 0.08s !important;
}

body[data-theme-layout="bbs"] .world:hover,
body[data-theme-layout="bbs"] .world:focus-visible {
  background: rgba(0, 255, 102, 0.08) !important;
  border: 1px solid #00ffff !important;
  box-shadow: 0 0 14px rgba(0, 255, 255, 0.35) !important;
  transform: translateX(4px) !important;
}

body[data-theme-layout="bbs"] a:focus-visible,
body[data-theme-layout="bbs"] .world:focus-visible,
body[data-theme-layout="bbs"] .slot-btn:focus-visible {
  outline: 2px solid #00ffff !important;
  outline-offset: 3px !important;
}

body[data-theme-layout="bbs"] .icon-slot {
  background: #010803 !important;
  border: 1px solid #00ff66 !important;
  box-shadow: 0 0 6px rgba(0, 255, 102, 0.25) !important;
  border-radius: 0;
}

body[data-theme-layout="bbs"] .icon-slot canvas {
  filter: brightness(1.2) sepia(100%) hue-rotate(85deg) saturate(600%) drop-shadow(0 0 3px #00ff66);
}

body[data-theme-layout="bbs"] .wname {
  color: #00ff66 !important;
  font-size: 0.8rem !important;
  text-shadow: 0 0 5px rgba(0, 255, 102, 0.6);
}

/* Numbered Menu Prefixes in ANSI Yellow */
body[data-theme-layout="bbs"] .world:nth-child(1) .wname::before { content: "[1] "; color: #ffff33; text-shadow: 0 0 5px rgba(255, 255, 51, 0.7); }
body[data-theme-layout="bbs"] .world:nth-child(2) .wname::before { content: "[2] "; color: #ffff33; text-shadow: 0 0 5px rgba(255, 255, 51, 0.7); }
body[data-theme-layout="bbs"] .world:nth-child(3) .wname::before { content: "[3] "; color: #ffff33; text-shadow: 0 0 5px rgba(255, 255, 51, 0.7); }
body[data-theme-layout="bbs"] .world:nth-child(4) .wname::before { content: "[4] "; color: #ffff33; text-shadow: 0 0 5px rgba(255, 255, 51, 0.7); }
body[data-theme-layout="bbs"] .world:nth-child(5) .wname::before { content: "[5] "; color: #ffff33; text-shadow: 0 0 5px rgba(255, 255, 51, 0.7); }
body[data-theme-layout="bbs"] .world:nth-child(6) .wname::before { content: "[6] "; color: #ffff33; text-shadow: 0 0 5px rgba(255, 255, 51, 0.7); }

body[data-theme-layout="bbs"] .badge {
  background: transparent !important;
  color: #00ffff !important;
  border: 1px solid #00ffff !important;
  box-shadow: none !important;
  text-shadow: 0 0 5px rgba(0, 255, 255, 0.6);
  font-size: 0.52rem !important;
  padding: 0.25em 0.5em !important;
}

body[data-theme-layout="bbs"] .blurb {
  color: #00ff66 !important;
  opacity: 0.95;
  font-size: 0.72rem !important;
  line-height: 1.55 !important;
  font-family: 'Press Start 2P', monospace !important;
  margin: 0.35rem 0 0.55rem !important;
}

body[data-theme-layout="bbs"] .chips {
  gap: 0.4rem;
}

body[data-theme-layout="bbs"] .chip {
  background: #020c04 !important;
  color: #00cc52 !important;
  border: 1px solid #005522 !important;
  box-shadow: none !important;
  font-size: 0.58rem !important;
  padding: 0.2rem 0.45rem !important;
  border-radius: 0;
}

/* Simulated Bottom Terminal Command Prompt */
body[data-theme-layout="bbs"] .bbs-prompt {
  display: block;
  margin-top: 1.4rem;
  padding: 0.85rem 1rem;
  border: 1px solid #00ff66;
  background: #010803;
  color: #00ff66;
  font-family: 'Press Start 2P', monospace;
  font-size: clamp(0.55rem, 1.8vw, 0.72rem);
  line-height: 1.6;
  letter-spacing: 0.08em;
  box-shadow: 0 0 8px rgba(0, 255, 102, 0.2);
}

body[data-theme-layout="bbs"] .bbs-prompt .prompt-cursor {
  display: inline-block;
  width: 0.6em;
  height: 1em;
  background: #00ff66;
  vertical-align: -0.15em;
  margin-left: 0.3em;
  animation: bbs-cursor-blink 1s steps(2, start) infinite;
  box-shadow: 0 0 6px #00ff66;
}

@keyframes bbs-cursor-blink {
  0%, 100% { opacity: 1; }
  50% { opacity: 0; }
}

/* Non-BBS Hide Prompt */
body:not([data-theme-layout="bbs"]) .bbs-prompt {
  display: none !important;
}

/* Terminal Footer */
body[data-theme-layout="bbs"] footer {
  color: #00ffff !important;
  text-shadow: 0 0 4px rgba(0, 255, 255, 0.4);
  font-size: 0.68rem;
  border-top: 1px dashed #005522;
  padding-top: 1.5rem;
  margin-top: 2rem;
}

body[data-theme-layout="bbs"] .press {
  color: #ffff33 !important;
  text-shadow: 0 0 6px rgba(255, 255, 51, 0.6);
  font-size: 0.72rem;
}

/* Reduced Motion Safety */
@media (prefers-reduced-motion: reduce) {
  body[data-theme-layout="bbs"]::before,
  body[data-theme-layout="bbs"]::after,
  body[data-theme-layout="bbs"] .bbs-prompt .prompt-cursor {
    animation: none !important;
  }
  body[data-theme-layout="bbs"] .world {
    transition: none !important;
  }
}