/* Theme: Old Typewriter */
body[data-theme="typewriter"] {
  font-family: 'Courier Prime', monospace;
  background-color: #f5f1e8;
  color: #2c2c2c;
  text-transform: lowercase;
}

body[data-theme="typewriter"] .cipher-letter {
  color: rgba(122, 122, 122, 0.5);
}

body[data-theme="typewriter"] .solution-letter.solved {
  color: #2c2c2c;
}

body[data-theme="typewriter"] .letter-line {
  background-color: #8b7355;
}

body[data-theme="typewriter"] .solution-letter.selected::before {
  border-color: #8b7355;
  background-color: rgba(139, 115, 85, 0.1);
}

body[data-theme="typewriter"] .solution-letter.selected {
  text-decoration: underline;
  text-decoration-color: #8b7355;
  text-decoration-thickness: 3px;
  text-underline-offset: 4px;
}

/* Theme: Future Spaceship */
body[data-theme="spaceship"] {
  font-family: 'Ubuntu Sans Mono', monospace;
  background-color: #0a0e1a;
  color: #e0e6f0;
  text-transform: uppercase;
}

body[data-theme="spaceship"] .cipher-letter {
  color: rgba(74, 85, 104, 0.5);
}

body[data-theme="spaceship"] .solution-letter.solved {
  color: #60a5fa;
}

body[data-theme="spaceship"] .letter-line {
  background-color: #f59e0b;
}

body[data-theme="spaceship"] .solution-letter.selected::before {
  border-color: #f59e0b;
  background-color: rgba(245, 158, 11, 0.1);
}

body[data-theme="spaceship"] .solution-letter.selected {
  text-decoration: underline;
  text-decoration-color: #f59e0b;
  text-decoration-thickness: 3px;
  text-underline-offset: 4px;
}

/* Theme: Chalk on Slate */
body[data-theme="chalk"] {
  font-family: 'Fuzzy Bubbles', cursive;
  background-color: #1a1f2e;
  color: #f5f5f5;
}

body[data-theme="chalk"] .cipher-letter {
  color: rgba(156, 163, 175, 0.4);
}

body[data-theme="chalk"] .solution-letter.solved {
  color: #f5f5f5;
}

body[data-theme="chalk"] .letter-line {
  background-color: #e5e5e5;
}

body[data-theme="chalk"] .solution-letter.selected::before {
  border-color: #e5e5e5;
  background-color: rgba(229, 229, 229, 0.1);
}

body[data-theme="chalk"] .solution-letter.selected {
  text-decoration: underline;
  text-decoration-color: #e5e5e5;
  text-decoration-thickness: 3px;
  text-underline-offset: 4px;
}

/* Theme: Fantasy */
body[data-theme="fantasy"] {
  font-family: 'Cinzel Decorative', cursive;
  background-color: #f9f5ed;
  color: #4a2511;
}

body[data-theme="fantasy"] .cipher-letter {
  color: rgba(139, 115, 85, 0.5);
}

body[data-theme="fantasy"] .solution-letter.solved {
  color: #6b4423;
}

body[data-theme="fantasy"] .letter-line {
  background-color: #c19a6b;
}

body[data-theme="fantasy"] .solution-letter.selected::before {
  border-color: #c19a6b;
  background-color: rgba(193, 154, 107, 0.1);
}

body[data-theme="fantasy"] .solution-letter.selected {
  text-decoration: underline;
  text-decoration-color: #c19a6b;
  text-decoration-thickness: 3px;
  text-underline-offset: 4px;
}