.theme-cyber-guide {
  --fg-accent: #78e28e;
  --fg-accent-soft: #e8fff0;
  --fg-border: rgba(92, 204, 120, 0.38);
  --fg-glow: rgba(80, 170, 100, 0.18);
  --fg-panel: rgba(10, 18, 14, 0.9);
}

.theme-cyber-guide .desktop {
  background: #020804 !important;
  position: relative;
}

/* Wallpaper overlay — injected by JS, opacity transitions smoothly */
.theme-cyber-guide .wallpaper-layer {
  position: absolute;
  inset: 0;
  background-image: url("../bg.jpg");
  background-size: cover;
  background-position: center;
  opacity: 0;
  transition: opacity 0.6s ease-in-out, filter 0.6s ease-in-out;
  z-index: 0;
  pointer-events: none;
}
.theme-cyber-guide .wallpaper-layer.visible {
  opacity: 1;
}
.theme-cyber-guide .wallpaper-layer.dim {
  filter: brightness(0.5) contrast(0.7) saturate(0.6);
}
.theme-cyber-guide .wallpaper-layer.bright {
  filter: brightness(1.4) contrast(1.3) saturate(1.2);
}
.theme-cyber-guide .wallpaper-layer.washed {
  filter: brightness(1.2) saturate(0.2) contrast(0.8);
}
.theme-cyber-guide .wallpaper-layer.corrupted {
  filter: brightness(0.8) hue-rotate(120deg) saturate(2) contrast(1.5);
}

.theme-cyber-guide .desktop::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(circle at 20% 16%, rgba(164, 255, 188, 0.09), transparent 25%),
    radial-gradient(circle at 84% 74%, rgba(126, 238, 156, 0.08), transparent 30%),
    linear-gradient(180deg, rgba(8, 16, 11, 0.32), rgba(3, 8, 5, 0.58));
  opacity: 0.55;
  z-index: 1;
}

.theme-cyber-guide .matrix-rain-layer {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 2;
  opacity: 0.42;
  mix-blend-mode: screen;
}

.theme-cyber-guide .taskbar {
  background: linear-gradient(90deg, rgba(4, 14, 8, 0.96), rgba(8, 22, 12, 0.94)) !important;
  border-top: 1px solid var(--fg-border);
  box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.5), inset 0 1px 0 rgba(0, 255, 100, 0.08);
  position: relative;
}

.theme-cyber-guide .taskbar::before {
  content: attr(data-taskbar-label);
  position: absolute;
  right: 96px;
  top: 4px;
  font-size: 9px;
  letter-spacing: 0.09em;
  color: rgba(214, 255, 222, 0.82);
  text-shadow: 0 0 4px rgba(0, 0, 0, 0.8);
  pointer-events: none;
}

.theme-cyber-guide .icons {
  position: relative;
  z-index: 8;
  filter: none !important;
}
.theme-cyber-guide .icon {
  filter: none !important;
}
.theme-cyber-guide .icon img {
  filter: drop-shadow(0 0 3px rgba(0, 255, 100, 0.25)) !important;
}

.theme-cyber-guide .icons::before {
  content: attr(data-desktop-label);
  position: absolute;
  left: 18px;
  top: 6px;
  font-size: 10px;
  letter-spacing: 0.12em;
  color: rgba(228, 255, 233, 0.68);
  text-shadow: 0 0 3px rgba(0, 0, 0, 0.8);
  pointer-events: none;
  z-index: 0;
}

.theme-cyber-guide .start-menu {
  background: var(--fg-panel);
  border: 1px solid var(--fg-border);
  color: var(--fg-accent-soft);
  box-shadow: 0 0 10px var(--fg-glow);
}

.theme-cyber-guide .start-menu-header {
  background: linear-gradient(90deg, rgba(22, 74, 36, 0.86), rgba(35, 112, 54, 0.8));
  color: #effff3;
}

.theme-cyber-guide .first-column,
.theme-cyber-guide .second-column {
  background: rgba(8, 16, 10, 0.95) !important;
  color: #effff3;
}

.theme-cyber-guide .second-column::after {
  background-color: rgba(8, 16, 10, 0.95) !important;
}

.theme-cyber-guide .start-menu-item {
  color: #d0ffd8;
}

.theme-cyber-guide .start-menu-item:hover {
  background: rgba(118, 230, 145, 0.18) !important;
  color: #fff;
}

/* Matrix-themed taskbar buttons */
.theme-cyber-guide .taskbar-button {
  background-image: none !important;
  background-color: rgba(8, 20, 12, 0.85);
  border: 1px solid rgba(0, 255, 100, 0.25);
  color: #a0f0b0;
  font-family: Consolas, 'Lucida Console', monospace;
  font-size: 10px;
  border-radius: 2px;
  margin: 2px 1px;
  height: 22px;
  text-shadow: 0 0 4px rgba(0, 255, 100, 0.3);
}
.theme-cyber-guide .taskbar-button:hover {
  background-color: rgba(12, 32, 18, 0.9);
  border-color: rgba(0, 255, 100, 0.45);
}

/* Matrix-themed taskbar right / clock */
.theme-cyber-guide .taskbar-right {
  color: #78e28e;
}
.theme-cyber-guide #clock {
  color: #78e28e;
  font-family: Consolas, 'Lucida Console', monospace;
  text-shadow: 0 0 4px rgba(0, 255, 100, 0.3);
}

.theme-cyber-guide .icon span {
  color: #f4fff7;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.95);
}

.theme-cyber-guide .window {
  border-color: var(--fg-border);
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.52), 0 0 14px rgba(0, 0, 0, 0.26);
}

.theme-cyber-guide .title-bar {
  background: linear-gradient(90deg, rgba(20, 70, 35, 0.85), rgba(38, 126, 58, 0.75)) !important;
  color: #f0fff4 !important;
  border-bottom: 1px solid rgba(108, 210, 133, 0.36);
}

.theme-cyber-guide .window-content,
.theme-cyber-guide .window-body {
  background: linear-gradient(180deg, rgba(12, 20, 14, 0.9), rgba(8, 15, 10, 0.9)) !important;
  color: #e6ffe8 !important;
}

.theme-cyber-guide .notification {
  border: 1px solid var(--fg-border);
  background: rgba(7, 14, 9, 0.92);
  color: #e9ffed;
  box-shadow: 0 0 8px var(--fg-glow);
}

.theme-cyber-guide .context-menu {
  background: rgba(16, 34, 22, 0.94);
  border: 1px solid var(--fg-border);
  color: #effff3;
}

.theme-cyber-guide .context-menu-item:hover {
  background: rgba(116, 228, 143, 0.18);
  color: #fff;
}

/* ── CRT scanline overlay (always on) ── */
.theme-cyber-guide .desktop::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 3;
  background: repeating-linear-gradient(
    to bottom,
    transparent 0px,
    transparent 2px,
    rgba(0, 0, 0, 0.07) 2px,
    rgba(0, 0, 0, 0.07) 4px
  );
  opacity: 0.5;
}

/* ── CRT distortion keyframes ── */
@keyframes crt-tear {
  0%   { clip-path: inset(0); transform: translate(0, 0); }
  15%  { clip-path: inset(12% 0 80% 0); transform: translate(-3px, 0); }
  30%  { clip-path: inset(40% 0 45% 0); transform: translate(4px, 0); }
  45%  { clip-path: inset(70% 0 20% 0); transform: translate(-2px, 0); }
  60%  { clip-path: inset(0); transform: translate(0, 0); }
  100% { clip-path: inset(0); transform: translate(0, 0); }
}

@keyframes crt-shake {
  0%, 100% { transform: translate(0, 0); }
  10%      { transform: translate(-2px, 1px); }
  20%      { transform: translate(3px, -1px); }
  30%      { transform: translate(-1px, 2px); }
  40%      { transform: translate(2px, -2px); }
  50%      { transform: translate(-3px, 0); }
  60%      { transform: translate(1px, 1px); }
  70%      { transform: translate(-2px, -1px); }
  80%      { transform: translate(2px, 0); }
  90%      { transform: translate(0, 2px); }
}

@keyframes scanline-intensify {
  0%, 100% { opacity: 0.5; }
  50%      { opacity: 0.85; }
}

/* Red menace flash overlay — injected by JS */
.theme-cyber-guide .glitch-flash {
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: 4;
  opacity: 0;
  transition: opacity 0.15s ease-out;
}
.theme-cyber-guide .glitch-flash.red {
  background: radial-gradient(ellipse at center, rgba(255, 0, 0, 0.15), rgba(180, 0, 0, 0.08), transparent 70%);
}
.theme-cyber-guide .glitch-flash.active {
  opacity: 1;
}

/* CRT distortion state — only affects wallpaper + scanlines, never icons */
.theme-cyber-guide .desktop.crt-distort .wallpaper-layer {
  animation: crt-shake 0.15s ease-in-out, crt-tear 0.4s steps(1) forwards;
}
.theme-cyber-guide .desktop.crt-distort::after {
  animation: scanline-intensify 0.3s ease-in-out;
}

/* Matrix rain pulses during wallpaper reveal */
.theme-cyber-guide .desktop.wallpaper-showing .matrix-rain-layer {
  opacity: 0.25;
  transition: opacity 0.5s ease;
}
.theme-cyber-guide .desktop:not(.wallpaper-showing) .matrix-rain-layer {
  opacity: 0.42;
  transition: opacity 0.8s ease;
}

/* Matrix-styled start button (default / matrix state) */
.theme-cyber-guide .start-button {
  background-image: none !important;
  background-color: rgba(6, 18, 10, 0.92);
  border: 1px solid rgba(0, 255, 100, 0.35);
  color: #78e28e;
  font-family: Consolas, 'Lucida Console', monospace;
  font-size: 11px;
  font-weight: bold;
  letter-spacing: 1px;
  text-shadow: 0 0 6px rgba(0, 255, 100, 0.5);
  box-shadow: 0 0 8px rgba(0, 255, 100, 0.1);
  padding: 0 12px;
  transition: background-color 0.5s ease, border-color 0.5s ease, color 0.5s ease, box-shadow 0.5s ease;
}
.theme-cyber-guide .start-button::after {
  content: '\25B6  INIT';
}
.theme-cyber-guide .start-button:hover {
  background-image: none !important;
  background-color: rgba(10, 30, 16, 0.95);
  border-color: rgba(0, 255, 100, 0.55);
  box-shadow: 0 0 14px rgba(0, 255, 100, 0.2);
}
.theme-cyber-guide .start-button:active,
.theme-cyber-guide .start-button.active {
  background-image: none !important;
  background-color: rgba(0, 255, 100, 0.15);
  border-color: rgba(0, 255, 100, 0.7);
}

/* ── Taskbar + start button transition to XP style during wallpaper bleed ── */
.theme-cyber-guide .taskbar {
  transition: background 0.5s ease, border-color 0.5s ease, box-shadow 0.5s ease;
}
.theme-cyber-guide .taskbar.reality-xp {
  background: linear-gradient(to bottom, #1f5fc4 0%, #3a8cf5 8%, #2880f0 40%, #1a6ee5 88%, #0b61de 100%) !important;
  border-top: 1px solid #5eaaff;
  box-shadow: 0 -1px 4px rgba(0, 0, 0, 0.3);
}
.theme-cyber-guide .taskbar.reality-xp .start-button {
  background-color: #3c9a3c;
  border: 1px solid #5ab85a;
  color: #fff;
  text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.5);
  box-shadow: none;
  font-family: Tahoma, sans-serif;
  font-weight: bold;
  letter-spacing: 0;
}
.theme-cyber-guide .taskbar.reality-xp .start-button::after {
  content: 'start';
}
.theme-cyber-guide .taskbar.reality-xp .taskbar-button {
  background-color: #2f7ad3;
  border: 1px solid #5eaaff;
  color: #fff;
  font-family: Tahoma, sans-serif;
  text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.4);
}
.theme-cyber-guide .taskbar.reality-xp #clock {
  color: #fff;
  font-family: Tahoma, sans-serif;
  text-shadow: none;
}