.rps-app[data-rps-theme="light"] {
  --rps-bg: #f6f5ee;
  --rps-bg-grid: rgba(16, 21, 19, 0.08);
  --rps-panel-bg: #fffefa;
  --rps-panel-bg-strong: #e9ece6;
  --rps-panel-border: #111613;
  --rps-panel-muted: #9da49d;
  --rps-acid: #d8ff00;
  --rps-cyan: #006d77;
  --rps-magenta: #d31373;
  --rps-orange: #ff7a00;
  --rps-thermal-blue: #c4d7f2;
  --rps-thermal-purple: #e2d0ff;
  --rps-text: #111613;
  --rps-muted: #505a54;
  --rps-dark: #111613;
  --rps-shadow: 8px 8px 0 #111613;
  --rps-glitch-strength: 4px;
  --rps-camera-filter: grayscale(1) contrast(1.18) brightness(1.08);
  --rps-camera-overlay-opacity: 0.1;
  --rps-motif-opacity: 0.22;
}

.rps-app[data-rps-theme="light"] .rps-background-grid {
  background:
    linear-gradient(90deg, transparent 23px, var(--rps-bg-grid) 24px),
    linear-gradient(transparent 23px, var(--rps-bg-grid) 24px);
  background-color: var(--rps-bg);
  background-size: 24px 24px;
}

.rps-app[data-rps-theme="light"] .rps-status-wrap {
  background:
    repeating-linear-gradient(135deg, var(--rps-panel-border) 0 9px, var(--rps-acid) 9px 18px) left top / 58px 100% no-repeat,
    var(--rps-panel-bg);
}

.rps-app[data-rps-theme="light"][data-rps-phase="countdown"] .rps-status-wrap,
.rps-app[data-rps-theme="light"][data-rps-phase="reveal"] .rps-status-wrap {
  background:
    repeating-linear-gradient(135deg, var(--rps-acid) 0 9px, var(--rps-panel-border) 9px 18px) left top / 58px 100% no-repeat,
    var(--rps-panel-border);
  animation: rps-light-countdown-hit 180ms steps(2, end);
}

.rps-app[data-rps-theme="light"][data-rps-phase="countdown"] .rps-status-text,
.rps-app[data-rps-theme="light"][data-rps-phase="reveal"] .rps-status-text {
  color: #fffefa;
}

.rps-app[data-rps-theme="light"] .rps-panel,
.rps-app[data-rps-theme="light"] .rps-footer,
.rps-app[data-rps-theme="light"] .rps-status-wrap {
  border-width: 2px;
}

.rps-app[data-rps-theme="light"] .rps-panel-label {
  border-bottom-color: var(--rps-panel-border);
  color: var(--rps-panel-border);
}

.rps-app[data-rps-theme="light"] .rps-bot-hand,
.rps-app[data-rps-theme="light"] .rps-selection-box {
  background: var(--rps-panel-bg);
  color: var(--rps-text);
}

.rps-app[data-rps-theme="dark"] {
  --rps-bg: #080b0a;
  --rps-bg-grid: rgba(0, 229, 255, 0.08);
  --rps-panel-bg: #d6d9d2;
  --rps-panel-bg-strong: #f2f2eb;
  --rps-panel-border: #101513;
  --rps-panel-muted: #7b827c;
  --rps-acid: #d8ff00;
  --rps-cyan: #0067ff;
  --rps-magenta: #ff2a96;
  --rps-orange: #ff8a00;
  --rps-thermal-blue: #1c3fff;
  --rps-thermal-purple: #7b2cff;
  --rps-text: #101513;
  --rps-muted: #303934;
  --rps-dark: #101513;
  --rps-shadow: 10px 10px 0 rgba(0, 0, 0, 0.74);
  --rps-glitch-strength: 5px;
  --rps-camera-filter: contrast(1.08) saturate(0.9);
  --rps-camera-overlay-opacity: 0.06;
  --rps-motif-opacity: 0.2;
}

.rps-app[data-rps-theme="dark"] .rps-background-grid {
  background:
    linear-gradient(90deg, transparent 31px, var(--rps-bg-grid) 32px),
    linear-gradient(transparent 31px, var(--rps-bg-grid) 32px),
    linear-gradient(135deg, #111613, #1c2420 48%, #08100d);
  background-size: 32px 32px, 32px 32px, auto;
}

.rps-app[data-rps-theme="dark"] .rps-kicker,
.rps-app[data-rps-theme="dark"] .rps-title,
.rps-app[data-rps-theme="dark"] .rps-theme-label {
  color: #edf7f2;
}

.rps-app[data-rps-theme="dark"] .rps-panel,
.rps-app[data-rps-theme="dark"] .rps-footer,
.rps-app[data-rps-theme="dark"] .rps-status-wrap {
  border: 2px solid var(--rps-panel-border);
  background: var(--rps-panel-bg);
}

.rps-app[data-rps-theme="dark"] .rps-panel-label {
  position: relative;
  min-height: 38px;
  border-bottom: 2px solid var(--rps-panel-border);
  background: var(--rps-cyan);
  color: #ffffff;
}

.rps-app[data-rps-theme="dark"] .rps-status-wrap {
  background:
    linear-gradient(90deg, var(--rps-cyan) 0 44px, transparent 44px),
    var(--rps-panel-bg);
}

.rps-app[data-rps-theme="dark"] .rps-status-text {
  color: var(--rps-text);
}

.rps-app[data-rps-theme="dark"] .rps-camera-stage {
  border-top: 2px solid var(--rps-panel-border);
  background: var(--rps-panel-bg-strong);
}

.rps-app[data-rps-theme="dark"] .rps-bot-hand {
  background: var(--rps-panel-bg-strong);
  color: var(--rps-text);
}

.rps-app[data-rps-theme="dark"] .rps-selection-box {
  background: var(--rps-panel-bg-strong);
  color: var(--rps-text);
}

.rps-app[data-rps-theme="dark"][data-rps-phase="countdown"] .rps-video-fx {
  opacity: calc(var(--rps-camera-overlay-opacity) + 0.16);
}

@keyframes rps-light-countdown-hit {
  0% {
    transform: translateX(-2px);
  }
  100% {
    transform: translateX(0);
  }
}