/* Cyberpunk uses the same component geometry, with restrained signal colors. */
@font-face {
  font-family: 'Cyberpunk Plex Sans';
  src: url('/assets/IBMPlexSans-SemiBold.woff2') format('woff2');
  font-weight: 600;
  font-display: swap;
}
@font-face {
  font-family: 'Cyberpunk Plex Mono';
  src: url('/assets/IBMPlexMono-Regular.woff2') format('woff2');
  font-weight: 400;
  font-display: swap;
}
body[data-style='cyberpunk'] {
  color-scheme: dark;
  --bg: #11191d;
  --surface: #19242a;
  --glass: #19242aeb;
  --field: #121e23;
  --ink: #e1ecea;
  --muted: #a2b5bc;
  --border: #8fb4bd2b;
  --accent: #63dda5;
  --accent-solid: #53c395;
  --teal: #7cced9;
  --danger: #efacbf;
  --shadow: none;
  font-family: 'Cyberpunk Plex Mono', monospace;
  background: var(--bg);
}
body[data-style='cyberpunk'] :is(h1, h2, h3) {
  font-family: 'Cyberpunk Plex Sans', sans-serif;
  font-weight: 600;
  color: #f2faf7;
  letter-spacing: -0.02em;
}
body[data-style='cyberpunk'] :is(button, input, select, textarea) {
  font-family: inherit;
}
body[data-style='cyberpunk']
  :is(
    .glass,
    dialog,
    .composer,
    .emoji-panel,
    .file-card,
    .poll-card,
    .request-card,
    .account-banner,
    .auth-modes button
  ) {
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 5px;
  box-shadow: none;
  backdrop-filter: none;
}
body[data-style='cyberpunk'] :is(input, select, textarea) {
  background: var(--field);
  border-color: var(--border);
  color: var(--ink);
  border-radius: 5px;
}
body[data-style='cyberpunk']
  :is(.button, .icon-button, .send-button, .reaction) {
  border-radius: 5px;
  box-shadow: none;
}
body[data-style='cyberpunk'] :is(.button, .icon-button) {
  background: transparent;
  color: var(--ink);
  border-color: var(--border);
}
body[data-style='cyberpunk'] :is(.button.primary, .send-button) {
  background: var(--accent-solid);
  color: #0c1b16;
  border-color: transparent;
}
body[data-style='cyberpunk'] .text-button {
  background: transparent;
  border: 0;
  color: var(--muted);
  padding: 5px 8px;
}
body[data-style='cyberpunk'] .text-button:hover {
  color: var(--ink);
  background: #63dda50b;
}
body[data-style='cyberpunk'] .nav-button.selected {
  background: #63dda50c;
  color: var(--accent);
  border-left: 2px solid var(--accent);
}
body[data-style='cyberpunk']
  :is(
    .message-name,
    .feature-icon,
    .file-symbol,
    .welcome-mark,
    .code-mark,
    .intro h1 > span
  ) {
  color: var(--accent);
}
body[data-style='cyberpunk'] .message-content {
  color: var(--ink);
  line-height: 1.65;
}
body[data-style='cyberpunk']
  :is(.avatar, .room-symbol, .square-icon, .welcome-mark) {
  background: #63dda508;
  color: var(--accent);
  border: 1px solid var(--border);
  border-radius: 5px;
}
body[data-style='cyberpunk'] :is(.site-header, .room-header) {
  background: #11191de8;
  border-bottom: 1px solid var(--border);
}
body[data-style='cyberpunk'] .brand {
  border-left: 2px solid #7cced9;
  padding-left: 9px;
}
body[data-style='cyberpunk'] .room-welcome {
  border-bottom: 1px solid var(--border);
}
body[data-style='cyberpunk'] .encryption-chip {
  border-color: #63dda530;
  background: transparent;
  color: var(--accent);
}
body[data-style='cyberpunk'] .ambient {
  background: radial-gradient(ellipse at 5% 0, #49717d0d, transparent 55%);
}