/* Easy Bake Content Oven — triple theme: Easy Bake, Creepy Crawlers, Stanley */

/* ── Shared tokens ── */
:root {
  --radius: 14px;
  --radius-sm: 8px;
  --font-body: 'Nunito', system-ui, sans-serif;
  --font-pixel: 'Press Start 2P', monospace;
  --font-lcd: 'VT323', 'Orbitron', 'Courier New', monospace;
  --font-creepster: 'Creepster', cursive;
  --font-poppins: 'Poppins', system-ui, sans-serif;
  --font-inconsolata: 'Inconsolata', 'Courier New', Courier, monospace;
  --highlight-red: #ffd4d4;
  --highlight-red-border: #ee8888;
}

/* ── 90s Easy Bake Oven (default) ── */
[data-theme='easy-bake'] {
  --bg-1: #fdf0ff;
  --bg-2: #f5e4ff;
  --bg-3: #e8f0ff;
  --bg-glow-a: rgba(255, 105, 180, 0.22);
  --bg-glow-b: rgba(107, 184, 255, 0.25);

  --text: #4a1942;
  --text-muted: #8e4a8a;
  --text-heading: #6b1f6e;

  --panel-bg: rgba(255, 252, 255, 0.94);
  --panel-border: #b86fd4;
  --panel-shadow: #e8a0f0;
  --panel-shadow-deep: rgba(107, 31, 110, 0.2);

  --surface: #fff5ff;
  --surface-border: #d98fd8;
  --surface-focus: rgba(255, 105, 180, 0.35);

  --btn-primary-top: #ffb3e0;
  --btn-primary-bottom: #ff69b4;
  --btn-primary-text: #5c1050;
  --btn-primary-shadow: #c04090;

  --btn-secondary-top: #8ec8ff;
  --btn-secondary-bottom: #4a90d9;
  --btn-secondary-text: #fff;
  --btn-secondary-shadow: #2a5a99;

  --approve: #7b68ee;
  --approve-dark: #5a4fcf;
  --approve-bg: #ebe8fc;
  --reject: #ff69b4;
  --reject-dark: #d93670;
  --reject-bg: #ffe8f4;

  --review-border: #c9a0dc;
  --output-border: #6bb8ff;

  --toggle-bg: linear-gradient(135deg, #ff6600 0%, #39ff14 100%);
  --toggle-text: #1a1a1a;
}

/* ── Creepy Crawlers ── */
[data-theme='creepy-crawlers'] {
  --bg-1: #39ff14;
  --bg-2: #32ef10;
  --bg-3: #2ad10e;
  --bg-glow-a: rgba(255, 102, 0, 0.14);
  --bg-glow-b: rgba(0, 0, 0, 0.08);

  --text: #1a0a00;
  --text-muted: #1a0a00;
  --text-heading: #1a0a00;

  --panel-bg: #ff6600;
  --panel-border: #993300;
  --panel-shadow: #cc5500;
  --panel-shadow-deep: rgba(255, 102, 0, 0.25);

  --surface: #0a1808;
  --surface-border: #ff6600;
  --surface-focus: rgba(255, 102, 0, 0.35);

  --btn-primary-top: #55ff55;
  --btn-primary-bottom: #39ff14;
  --btn-primary-text: #1a0a00;
  --btn-primary-shadow: #006622;

  --btn-secondary-top: #55ff55;
  --btn-secondary-bottom: #00cc33;
  --btn-secondary-text: #0a1408;
  --btn-secondary-shadow: #006622;

  --approve: #39ff14;
  --approve-dark: #22aa0a;
  --approve-bg: #152a12;
  --reject: #ff6600;
  --reject-dark: #cc5500;
  --reject-bg: #2a1508;

  --highlight-red: #3a1515;
  --highlight-red-border: #ff4500;

  --review-border: #ff6600;
  --output-border: #ff6600;

  --toggle-bg: linear-gradient(135deg, #ff69b4 0%, #9b59b6 50%, #6bb8ff 100%);
  --toggle-text: #fff;

  --font-content: 'Questrial', sans-serif;
  --font-heading: 'Roboto Condensed', sans-serif;
}

/* ── Stanley Parable ── */
[data-theme='stanley'] {
  --bg-1: #141820;
  --bg-2: #1a1f28;
  --bg-3: #222832;
  --bg-glow-a: rgba(212, 175, 55, 0.08);
  --bg-glow-b: rgba(80, 90, 110, 0.2);

  --text: #2e2e2e;
  --text-muted: #5c5c5c;
  --text-heading: #ececec;

  --panel-bg: #ddd8ce;
  --panel-border: #a8a295;
  --panel-shadow: #8f8a7d;
  --panel-shadow-deep: rgba(0, 0, 0, 0.45);

  --surface: #050505;
  --surface-border: #2a2a2a;
  --surface-focus: rgba(51, 255, 51, 0.25);

  --beige-frame: #e8e4d9;
  --beige-frame-dark: #b8b4a8;
  --terminal-bg: #050505;
  --terminal-text: #33ff33;
  --terminal-heading: color-mix(in srgb, #5dff5d 80%, #ffffff 20%);
  --terminal-glow: rgba(51, 255, 51, 0.45);
  --terminal-heading-glow: rgba(93, 255, 93, 0.55);

  --btn-primary-top: #f0ece3;
  --btn-primary-bottom: #cfc9bc;
  --btn-primary-text: #2a2a2a;
  --btn-primary-shadow: #8f8a7d;

  --btn-secondary-top: #ece8df;
  --btn-secondary-bottom: #c5c0b5;
  --btn-secondary-text: #2a2a2a;
  --btn-secondary-shadow: #7a756a;

  --approve: #c9a227;
  --approve-dark: #9a7b18;
  --approve-bg: #2a2410;
  --reject: #a83232;
  --reject-dark: #7a2424;
  --reject-bg: #2a1010;

  --highlight-red: #331818;
  --highlight-red-border: #a83232;

  --review-border: #3a3a3a;
  --output-border: #3a3a3a;

  --toggle-bg: linear-gradient(180deg, #e8e4d9 0%, #b8b4a8 100%);
  --toggle-text: #2a2a2a;

  --font-terminal: 'VT323', 'Courier New', Courier, monospace;
  --font-output: var(--font-inconsolata);
}

/* ── Whitespace ── */
[data-theme='whitespace'] {
  --bg-1: #fff;
  --bg-2: #fff;
  --bg-3: #fff;
  --bg-glow-a: transparent;
  --bg-glow-b: transparent;

  --text: #000;
  --text-muted: #666;
  --text-heading: #000;

  --panel-bg: transparent;
  --panel-border: transparent;
  --panel-shadow: transparent;
  --panel-shadow-deep: transparent;

  --surface: #fff;
  --surface-border: transparent;
  --surface-focus: transparent;

  --btn-primary-top: transparent;
  --btn-primary-bottom: transparent;
  --btn-primary-text: #000;
  --btn-primary-shadow: transparent;

  --btn-secondary-top: transparent;
  --btn-secondary-bottom: transparent;
  --btn-secondary-text: #000;
  --btn-secondary-shadow: transparent;

  --approve: #000;
  --approve-dark: #000;
  --approve-bg: #f5f5f5;
  --reject: #666;
  --reject-dark: #333;
  --reject-bg: #f5f5f5;

  --highlight-red: #f5f5f5;
  --highlight-red-border: #ccc;

  --review-border: #ddd;
  --output-border: #ddd;

  --toggle-bg: #fff;
  --toggle-text: #000;

  --font-body: 'Manrope', sans-serif;
}

*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  min-height: 100vh;
  font-family: var(--font-body);
  font-size: 16px;
  line-height: 1.6;
  color: var(--text);
  background:
    radial-gradient(ellipse at 15% 0%, var(--bg-glow-a) 0%, transparent 55%),
    radial-gradient(ellipse at 85% 100%, var(--bg-glow-b) 0%, transparent 55%),
    linear-gradient(160deg, var(--bg-1) 0%, var(--bg-2) 45%, var(--bg-3) 100%);
  background-attachment: fixed;
  transition: background 0.4s ease, color 0.3s ease;
}

html[data-theme='creepy-crawlers'] body {
  color: #1a0a00;
  background-image:
    radial-gradient(ellipse at 15% 0%, var(--bg-glow-a) 0%, transparent 55%),
    radial-gradient(ellipse at 85% 100%, var(--bg-glow-b) 0%, transparent 55%),
    linear-gradient(160deg, var(--bg-1) 0%, var(--bg-2) 45%, var(--bg-3) 100%);
}

html[data-theme='stanley'] body {
  background:
    radial-gradient(ellipse at 50% 0%, rgba(212, 175, 55, 0.07) 0%, transparent 45%),
    radial-gradient(ellipse at 50% 100%, rgba(0, 0, 0, 0.55) 0%, transparent 70%),
    linear-gradient(180deg, var(--bg-1) 0%, var(--bg-2) 50%, #0e1116 100%);
}

.app {
  position: relative;
  max-width: 820px;
  margin: 0 auto;
  padding: 1.25rem 1rem 2rem;
}

/* ── Theme switcher ── */
.theme-switcher {
  position: fixed;
  top: 1rem;
  right: 1rem;
  z-index: 100;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 0.35rem;
  max-width: min(100% - 1.5rem, 22rem);
}

.theme-switcher__btn {
  padding: 0.42rem 0.7rem;
  font-family: var(--font-body);
  font-size: 0.72rem;
  font-weight: 800;
  line-height: 1.2;
  color: var(--text);
  background: var(--panel-bg);
  border: 2px solid var(--panel-border);
  border-radius: 999px;
  cursor: pointer;
  box-shadow: 0 2px 0 rgba(0, 0, 0, 0.25);
  transition: transform 0.15s, box-shadow 0.15s, filter 0.15s, background 0.15s, color 0.15s;
}

.theme-switcher__btn:hover {
  transform: translateY(-1px);
  filter: brightness(1.05);
}

.theme-switcher__btn:active {
  transform: translateY(1px);
  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.25);
}

.theme-switcher__btn[data-theme='creepy-crawlers']:not(.is-active) {
  background: linear-gradient(180deg, #55ff55 0%, #39ff14 100%);
  border-color: #22aa0a;
  color: #000;
}

.theme-switcher__btn.is-active {
  color: #fff;
  box-shadow: 0 2px 0 rgba(0, 0, 0, 0.35), 0 0 12px rgba(255, 255, 255, 0.12);
}

.theme-switcher__btn[data-theme='easy-bake'].is-active {
  background: linear-gradient(180deg, #ffb3e0 0%, #ff69b4 100%);
  border-color: #9b59b6;
  color: #4a1042;
}

.theme-switcher__btn[data-theme='creepy-crawlers'].is-active {
  background: linear-gradient(180deg, #55ff55 0%, #39ff14 100%);
  border-color: #22aa0a;
  color: #000;
}

.theme-switcher__btn[data-theme='stanley'].is-active {
  background: linear-gradient(180deg, #f0ece3 0%, #c9a227 100%);
  border-color: #9a7b18;
  color: #1a1408;
}

.theme-switcher__btn[data-theme='whitespace']:not(.is-active) {
  background: #fff;
  border-color: #ccc;
  color: #333;
}

.theme-switcher__btn[data-theme='whitespace'].is-active {
  background: #fff;
  border-color: #000;
  color: #000;
}

/* ── Header & oven icons ── */
.header {
  text-align: center;
  padding: 2.5rem 0 2rem;
}

.hero-icon {
  display: flex;
  justify-content: center;
  margin-bottom: 1.25rem;
  min-height: 130px;
}

.oven {
  position: relative;
  display: none;
}

[data-theme='easy-bake'] .oven--easy-bake { display: block; }
[data-theme='creepy-crawlers'] .oven--creepy { display: block; }
[data-theme='stanley'] .oven--stanley { display: block; }

/* ── Easy-Bake 90s microwave oven ── */
.oven--easy-bake {
  width: 168px;
  height: 118px;
}

.eb-oven {
  position: relative;
  width: 100%;
  height: 100%;
  background: linear-gradient(180deg, #fafafa 0%, #ececec 100%);
  border: 2px solid #d8d8d8;
  border-radius: 6px;
  box-shadow:
    0 6px 0 #c8c8c8,
    0 10px 24px rgba(0, 0, 0, 0.18);
  overflow: hidden;
}

.eb-oven__top {
  height: 16px;
  background:
    repeating-linear-gradient(
      90deg,
      #f0f0f0 0,
      #f0f0f0 8px,
      #e3e3e3 8px,
      #e3e3e3 10px
    );
  border-bottom: 1px solid #d0d0d0;
}

.eb-oven__top::after {
  content: '';
  display: block;
  width: 42%;
  height: 6px;
  margin: 4px auto 0;
  background: #e8e8e8;
  border-radius: 2px;
}

.eb-oven__face {
  display: grid;
  grid-template-columns: 1fr 62px;
  gap: 0;
  height: calc(100% - 16px);
}

.eb-oven__door {
  position: relative;
  background: #111;
  border-right: 2px solid #2a2a2a;
  padding: 10px 8px 8px;
}

.eb-oven__window {
  width: 72%;
  height: 42px;
  margin: 0 auto;
  background: linear-gradient(180deg, #1a1a1a 0%, #050505 100%);
  border: 2px solid #333;
  border-radius: 2px;
  box-shadow: inset 0 0 12px rgba(255, 180, 100, 0.15);
  overflow: hidden;
}

.eb-oven__glow {
  width: 100%;
  height: 100%;
  background: radial-gradient(circle at 50% 60%, rgba(255, 170, 90, 0.55) 0%, rgba(255, 120, 40, 0.12) 55%, transparent 75%);
  animation: bake-glow 2.5s ease-in-out infinite;
}

.eb-oven__stripe {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 16px;
  height: 14px;
  background: linear-gradient(180deg, #ff4da6 0%, #e6007a 100%);
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding-right: 8px;
}

.eb-oven__brand {
  font-family: Georgia, 'Times New Roman', serif;
  font-style: italic;
  font-size: 0.62rem;
  font-weight: 700;
  color: #fff;
  letter-spacing: 0.02em;
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.25);
}

.eb-oven__panel {
  background: #f7f7f7;
  border-left: 2px solid #8e24aa;
  padding: 6px 5px 5px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.eb-oven__display {
  height: 14px;
  background: #0a0a0a;
  border: 1px solid #222;
  border-radius: 1px;
  color: #ff3b7a;
  font-family: 'Orbitron', 'Courier New', monospace;
  font-size: 0.48rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  line-height: 14px;
  text-align: center;
  text-shadow: 0 0 4px rgba(255, 59, 122, 0.8);
}

.eb-oven__keys {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2px;
}

.eb-oven__actions {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 2px;
  margin-top: auto;
}

.eb-oven__key {
  display: block;
  min-height: 8px;
  border-radius: 1px;
  border: 1px solid rgba(0, 0, 0, 0.12);
}

.eb-oven__key--blue {
  background: linear-gradient(180deg, #9adcf0 0%, #6ec5e8 100%);
}

.eb-oven__key--pink {
  background: linear-gradient(180deg, #ff6eb4 0%, #e6007a 100%);
}

.eb-oven__key--wide {
  min-height: 9px;
  font-size: 0.28rem;
  font-weight: 800;
  color: #fff;
  line-height: 9px;
  text-align: center;
  letter-spacing: 0.04em;
}

/* ── Creepy Crawlers oven ── */
.oven--creepy {
  width: 132px;
  height: 128px;
}

.cc-oven {
  position: relative;
  width: 100%;
  height: 100%;
}

.cc-oven__lid {
  position: absolute;
  top: 0;
  left: 4px;
  right: 4px;
  height: 14px;
  background: linear-gradient(180deg, #5dff2b 0%, #39ff14 100%);
  border: 2px solid #2dcc12;
  border-radius: 3px 3px 0 0;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.35);
}

.cc-oven__lid::after {
  content: '';
  position: absolute;
  top: 3px;
  left: 50%;
  transform: translateX(-50%);
  width: 34px;
  height: 6px;
  background: #45ef20;
  border-radius: 2px;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25);
}

.cc-oven__body {
  position: absolute;
  top: 12px;
  left: 8px;
  right: 8px;
  bottom: 18px;
  background: linear-gradient(180deg, #ff7a1a 0%, #ff6600 55%, #e85a00 100%);
  border: 2px solid #cc5500;
  border-radius: 2px 2px 0 0;
  box-shadow: inset 0 1px 0 rgba(255, 200, 120, 0.35);
}

.cc-oven__slot-hood {
  position: absolute;
  top: 8px;
  left: 10px;
  right: 10px;
  height: 8px;
  background: linear-gradient(180deg, #ff8833 0%, #ff6600 100%);
  border-radius: 2px 2px 0 0;
  box-shadow: 0 2px 0 #cc5500;
}

.cc-oven__slot {
  position: absolute;
  top: 14px;
  left: 12px;
  right: 12px;
  height: 7px;
  background: #1a0800;
  border-radius: 0 0 2px 2px;
  box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.65);
}

.cc-oven__dial-wrap {
  position: absolute;
  top: 30px;
  left: 50%;
  transform: translateX(-50%);
  width: 46px;
  height: 46px;
}

.cc-oven__dial-arc {
  position: absolute;
  top: -2px;
  left: 50%;
  transform: translateX(-50%);
  width: 34px;
  height: 16px;
  background: linear-gradient(180deg, #9c27b0 0%, #7b1fa2 100%);
  border: 1px solid #4a148c;
  border-radius: 18px 18px 0 0;
  color: #fff;
  font-size: 0.34rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  line-height: 18px;
  text-align: center;
}

.cc-oven__dial {
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 38px;
  height: 38px;
  background:
    repeating-linear-gradient(
      90deg,
      #45ef20 0,
      #45ef20 2px,
      #39ff14 2px,
      #39ff14 4px
    );
  border: 2px solid #2dcc12;
  border-radius: 50%;
  box-shadow:
    inset 0 2px 0 rgba(255, 255, 255, 0.35),
    0 2px 0 #1f9908;
}

.cc-oven__dial::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 8px;
  height: 8px;
  margin: -4px 0 0 -4px;
  background: #2dcc12;
  border-radius: 50%;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.35);
}

.cc-oven__temp {
  position: absolute;
  top: 38px;
  right: 8px;
  width: 18px;
  height: 34px;
  background: rgba(255, 255, 255, 0.22);
  border: 1px solid rgba(0, 0, 0, 0.2);
  border-radius: 2px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
  padding: 2px 1px;
  font-size: 0.28rem;
  font-weight: 800;
  color: #1a0a00;
  letter-spacing: 0.02em;
}

.cc-oven__temp-indicator {
  width: 10px;
  height: 6px;
  background: #39ff14;
  border: 1px solid #1f9908;
  border-radius: 1px;
  box-shadow: 0 0 4px rgba(57, 255, 20, 0.55);
}

.cc-oven__logo {
  position: absolute;
  left: 6px;
  bottom: 6px;
  width: 38px;
  padding: 2px 3px;
  background: linear-gradient(180deg, #111 0%, #000 100%);
  border: 1px solid #39ff14;
  border-radius: 2px;
  text-align: center;
  line-height: 1.05;
}

.cc-oven__logo span {
  display: block;
  font-family: var(--font-creepster);
  font-size: 0.42rem;
  color: #39ff14;
  text-shadow:
    0 0 4px rgba(57, 255, 20, 0.8),
    1px 1px 0 #6a1b9a;
  letter-spacing: 0.04em;
}

.cc-oven__base {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 18px;
  background: linear-gradient(180deg, #39ff14 0%, #2dcc12 100%);
  border: 2px solid #22aa0a;
  border-radius: 0 0 4px 4px;
  box-shadow: 0 3px 0 #1a8808;
}

@keyframes bake-glow {
  0%, 100% { opacity: 0.7; }
  50% { opacity: 1; }
}

/* Stanley CRT hero */
.oven--stanley {
  width: 108px;
  height: 92px;
}

.stanley-monitor {
  position: relative;
  width: 108px;
  margin: 0 auto;
}

.stanley-monitor__bezel {
  padding: 8px;
  background: linear-gradient(180deg, #ece8df 0%, #d4cfc4 55%, #c5c0b5 100%);
  border: 3px solid #a8a295;
  border-radius: 6px 6px 2px 2px;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.65),
    0 4px 0 #8f8a7d,
    0 8px 20px rgba(0, 0, 0, 0.45);
}

.stanley-monitor__screen {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 0.15rem;
  min-height: 52px;
  padding: 0.45rem 0.55rem;
  background: #050505;
  border: 2px inset #2a2a2a;
  box-shadow: inset 0 0 18px rgba(51, 255, 51, 0.12);
}

.stanley-monitor__line,
.stanley-monitor__prompt {
  display: block;
  font-family: var(--font-terminal, 'VT323', monospace);
  font-size: 0.72rem;
  line-height: 1.1;
  color: #33ff33;
  text-shadow: 0 0 6px rgba(51, 255, 51, 0.55);
}

.stanley-monitor__chin {
  height: 6px;
  margin: 0 12px;
  background: #c5c0b5;
  border-left: 2px solid #a8a295;
  border-right: 2px solid #a8a295;
}

.stanley-monitor__base {
  width: 72px;
  height: 8px;
  margin: 0 auto;
  background: linear-gradient(180deg, #d4cfc4, #a8a295);
  border-radius: 0 0 4px 4px;
  box-shadow: 0 3px 0 #7a756a;
}

@keyframes stanley-blink {
  0%, 49% { opacity: 1; }
  50%, 100% { opacity: 0; }
}

[data-theme='stanley'] .stanley-monitor__prompt::after {
  content: '▮';
  margin-left: 0.1rem;
  animation: stanley-blink 1.1s step-end infinite;
}

.title {
  margin: 0 0 0.5rem;
  font-family: var(--font-pixel);
  font-size: clamp(0.75rem, 3.2vw, 1.05rem);
  line-height: 1.6;
  color: var(--text-heading);
  text-shadow: 2px 2px 0 var(--panel-shadow);
}

[data-theme='easy-bake'] .title {
  text-shadow: 2px 2px 0 #ffb3e0, 3px 3px 0 rgba(155, 89, 182, 0.3);
}

[data-theme='creepy-crawlers'] .title {
  color: #1a0a00;
  text-shadow: 2px 2px 0 #ff6600;
}

[data-theme='creepy-crawlers'] .subtitle--creepy,
[data-theme='creepy-crawlers'] .footer-text--creepy {
  color: #1a0a00;
}

[data-theme='creepy-crawlers'] .footer {
  color: #1a0a00;
  opacity: 0.85;
}

[data-theme='creepy-crawlers'] .theme-switcher__btn:not([data-theme='creepy-crawlers']) {
  color: #1a0a00;
}

[data-theme='stanley'] .title {
  font-family: var(--font-body);
  font-size: clamp(1rem, 3.8vw, 1.55rem);
  font-weight: 700;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: #f2f2f2;
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.6);
}

[data-theme='stanley'] .title--stanley {
  background: linear-gradient(180deg, #fffef5 0%, #ffe135 45%, #ffd700 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  text-shadow: none;
  filter: drop-shadow(0 1px 2px rgba(0, 0, 0, 0.35));
}

[data-theme='stanley'] .subtitle {
  color: #9aa3b2;
  font-weight: 500;
  letter-spacing: 0.04em;
}

.stanley-narrative {
  display: none;
}

[data-theme='stanley'] .review-content > .stanley-narrative,
[data-theme='stanley'] .output-preview > .stanley-narrative {
  display: block;
  margin: 0 0 1rem;
  padding-bottom: 1rem;
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
  color: inherit;
  text-shadow: inherit;
  letter-spacing: inherit;
  user-select: none;
}

[data-theme='stanley'] .stanley-narrative__divider {
  display: block;
  margin-top: 0.75rem;
  opacity: 0.85;
}

.subtitle {
  margin: 0;
  font-size: 1rem;
  color: var(--text-muted);
  font-weight: 600;
}

.title--easy-bake,
.title--creepy,
.title--stanley,
.subtitle--easy-bake,
.subtitle--creepy,
.subtitle--stanley,
.footer-text--easy-bake,
.footer-text--creepy,
.footer-text--stanley,
.panel-desc--review-easy-bake,
.panel-desc--review-creepy,
.panel-desc--review-stanley,
.panel-desc--output-easy-bake,
.panel-desc--output-creepy,
.panel-desc--output-stanley {
  display: none;
}

[data-theme='easy-bake'] .title--easy-bake,
[data-theme='easy-bake'] .subtitle--easy-bake,
[data-theme='easy-bake'] .footer-text--easy-bake,
[data-theme='easy-bake'] .panel-desc--review-easy-bake,
[data-theme='easy-bake'] .panel-desc--output-easy-bake,
[data-theme='creepy-crawlers'] .title--creepy,
[data-theme='creepy-crawlers'] .subtitle--creepy,
[data-theme='creepy-crawlers'] .footer-text--creepy,
[data-theme='creepy-crawlers'] .panel-desc--review-creepy,
[data-theme='creepy-crawlers'] .panel-desc--output-creepy,
[data-theme='stanley'] .title--stanley,
[data-theme='stanley'] .subtitle--stanley,
[data-theme='stanley'] .footer-text--stanley,
[data-theme='stanley'] .panel-desc--review-stanley,
[data-theme='stanley'] .panel-desc--output-stanley {
  display: block;
}

[data-theme='creepy-crawlers'] .panel-desc--review-creepy,
[data-theme='creepy-crawlers'] .panel-desc--output-creepy {
  display: inline-block;
}

/* ── Theme-specific labels & icons ── */
.panel-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 1.4rem;
  line-height: 1;
  vertical-align: middle;
}

.panel-icon__art,
.btn-icon__art {
  display: none;
}

[data-theme='easy-bake'] .panel-icon--input::before { content: '🥣'; }
[data-theme='easy-bake'] .panel-icon--review::before { content: '🍪'; }
[data-theme='easy-bake'] .panel-icon--output::before { content: '🧊'; }

[data-theme='creepy-crawlers'] .panel-icon {
  display: none;
}

[data-theme='creepy-crawlers'] .panel-label--input::after { content: 'Bug Goo'; }
[data-theme='creepy-crawlers'] .panel-label--review::after { content: 'Bug Tray'; }
[data-theme='creepy-crawlers'] .panel-label--output::after { content: 'Cooling Slime'; }

[data-theme='creepy-crawlers'] .panel-label--input,
[data-theme='creepy-crawlers'] .panel-label--review,
[data-theme='creepy-crawlers'] .panel-label--output {
  font-size: 0;
}

[data-theme='creepy-crawlers'] .panel-label--input::after,
[data-theme='creepy-crawlers'] .panel-label--review::after,
[data-theme='creepy-crawlers'] .panel-label--output::after {
  font-family: var(--font-creepster);
  font-size: 2.475rem;
  font-weight: 400;
  line-height: 1.1;
  color: #9b59b6;
  -webkit-text-stroke: 7.5px #fff;
  paint-order: stroke fill;
}

[data-theme='creepy-crawlers'] .btn-label--mix::after { content: 'Mould it!'; }
[data-theme='creepy-crawlers'] .btn-label--mix { font-size: 0; }
[data-theme='creepy-crawlers'] .btn-label--mix::after { font-size: 1rem; }

[data-theme='creepy-crawlers'] .btn-label--accept::after { content: "Cook 'em!"; }
[data-theme='creepy-crawlers'] .btn-label--accept { font-size: 0; }
[data-theme='creepy-crawlers'] .btn-label--accept::after { font-size: 1rem; }

[data-theme='easy-bake'] .btn-icon--mix::before { content: '🥄'; }
[data-theme='easy-bake'] .btn-icon--accept::before { content: '✓'; }
[data-theme='easy-bake'] .btn-icon--copy::before { content: '🍪'; }
[data-theme='easy-bake'] .btn-icon--rebake::before { content: '♨️'; }

[data-theme='creepy-crawlers'] .btn-icon--mix::before,
[data-theme='creepy-crawlers'] .btn-icon--accept::before { content: none; }

[data-theme='creepy-crawlers'] .btn-icon--copy::before { content: '🕷️'; }
[data-theme='creepy-crawlers'] .btn-icon--rebake::before { content: '🧪'; }

[data-theme='creepy-crawlers'] .btn-icon__art--scorpion {
  display: block;
  width: 1.35rem;
  height: auto;
  filter: drop-shadow(0 0 2px #39ff14) drop-shadow(0 0 4px rgba(57, 255, 20, 0.75));
}

.btn-icon__art--floppy {
  display: none;
  width: 1.35rem;
  height: auto;
}

.btn-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 1.1rem;
  line-height: 1;
}

.btn-icon::before {
  display: inline-block;
}

#copy-btn {
  position: relative;
  overflow: visible;
}

.output-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  align-items: stretch;
  margin-top: 15px;
}

.output-actions .btn {
  flex: 1 1 12rem;
}

#copy-btn .btn-icon--copy {
  position: relative;
  z-index: 1;
  transform-origin: center center;
}

#copy-btn .btn-icon--copy.is-flying {
  animation: copy-icon-fly-off 0.55s ease-in forwards;
  pointer-events: none;
}

@keyframes copy-icon-fly-off {
  0% {
    transform: scale(1) translateY(0);
    opacity: 1;
  }
  35% {
    transform: scale(1.8) translateY(-10px);
    opacity: 1;
  }
  100% {
    transform: scale(3) translateY(-28px);
    opacity: 0;
  }
}

/* ── Panels ── */
.panel {
  background: var(--panel-bg);
  border: 3px solid var(--panel-border);
  border-radius: var(--radius);
  padding: 1.25rem 1.25rem 1.5rem;
  margin-bottom: 1.5rem;
  box-shadow:
    0 4px 0 var(--panel-shadow),
    0 8px 24px var(--panel-shadow-deep);
  transition: background 0.3s, border-color 0.3s, box-shadow 0.3s;
}

.panel.hidden {
  display: none;
}

.panel-title {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin: 0 0 0.75rem;
  font-size: 1.25rem;
  font-weight: 800;
  color: var(--text-heading);
}

.panel-desc {
  margin: 0 0 1rem;
  font-size: 0.9rem;
  color: var(--text-muted);
}

[data-theme='creepy-crawlers'] .panel-desc:not(.panel-desc--review-easy-bake):not(.panel-desc--review-stanley):not(.panel-desc--output-easy-bake):not(.panel-desc--output-stanley) {
  display: inline-block;
  max-width: 100%;
  padding: 0.35rem 0.65rem;
  font-family: 'Courier New', Courier, monospace;
  font-size: 0.9rem;
  font-weight: 700;
  line-height: 1.45;
  color: #000;
  background: #39ff14;
  border-radius: 4px;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.35);
}

[data-theme='creepy-crawlers'] .panel-desc--review {
  transform: rotate(2deg);
}

[data-theme='creepy-crawlers'] .panel-desc--output {
  transform: rotate(-2deg);
}

/* ── Input ── */
.raw-textarea {
  width: 100%;
  min-height: 200px;
  padding: 1rem;
  font-family: var(--font-body);
  font-size: 0.95rem;
  line-height: 1.6;
  color: var(--text);
  background: var(--surface);
  border: 2px solid var(--surface-border);
  border-radius: var(--radius-sm);
  resize: vertical;
  transition: border-color 0.2s, box-shadow 0.2s, background 0.3s;
}

.raw-textarea:focus {
  outline: none;
  border-color: var(--panel-border);
  box-shadow: 0 0 0 3px var(--surface-focus);
}

[data-theme='easy-bake'] .raw-textarea {
  font-family: var(--font-poppins);
}

[data-theme='creepy-crawlers'] .raw-textarea {
  font-family: var(--font-content);
  caret-color: #fff;
}

[data-theme='creepy-crawlers'] .raw-textarea::placeholder {
  color: rgba(255, 255, 255, 0.45);
}

/* ── Buttons ── */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  margin-top: 1rem;
  padding: 0.75rem 1.5rem;
  font-family: var(--font-body);
  font-size: 1rem;
  font-weight: 700;
  border: none;
  border-radius: var(--radius-sm);
  cursor: pointer;
  transition: transform 0.15s, box-shadow 0.15s, filter 0.15s;
}

.btn:active {
  transform: translateY(2px);
}

.btn-primary {
  background: linear-gradient(180deg, var(--btn-primary-top) 0%, var(--btn-primary-bottom) 100%);
  color: var(--btn-primary-text);
  box-shadow: 0 4px 0 var(--btn-primary-shadow), 0 6px 12px var(--panel-shadow-deep);
}

.btn-primary:hover {
  filter: brightness(1.08);
}

.btn-secondary {
  background: linear-gradient(180deg, var(--btn-secondary-top) 0%, var(--btn-secondary-bottom) 100%);
  color: var(--btn-secondary-text);
  box-shadow: 0 4px 0 var(--btn-secondary-shadow), 0 6px 12px var(--panel-shadow-deep);
}

.btn-secondary:hover {
  filter: brightness(1.08);
}

[data-theme='creepy-crawlers'] .btn-primary {
  box-shadow:
    0 4px 0 var(--btn-primary-shadow),
    0 0 16px rgba(57, 255, 20, 0.35);
}

[data-theme='creepy-crawlers'] .btn-secondary {
  box-shadow:
    0 4px 0 var(--btn-secondary-shadow),
    0 0 16px rgba(57, 255, 20, 0.25);
}

/* ── Easy Bake: flat LCD toy buttons ── */
[data-theme='easy-bake'] .panel .btn {
  font-family: var(--font-lcd);
  font-size: 1.45rem;
  font-weight: 400;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  border-radius: 5px;
  border: 3px solid #9b4d8a;
  background: #2a1430;
  color: #ff8fd8;
  box-shadow:
    inset 0 3px 6px rgba(0, 0, 0, 0.55),
    inset 0 0 14px rgba(255, 105, 180, 0.12),
    0 1px 0 rgba(255, 255, 255, 0.18);
  text-shadow: 0 0 10px rgba(255, 105, 180, 0.65);
  transition: box-shadow 0.15s, transform 0.1s, filter 0.15s;
}

[data-theme='easy-bake'] .panel .btn-primary,
[data-theme='easy-bake'] .panel .btn-secondary {
  background: #2a1430;
  color: #ff8fd8;
  box-shadow:
    inset 0 3px 6px rgba(0, 0, 0, 0.55),
    inset 0 0 14px rgba(255, 105, 180, 0.12),
    0 1px 0 rgba(255, 255, 255, 0.18);
}

[data-theme='easy-bake'] .panel .btn:hover {
  filter: brightness(1.12);
  color: #ffc4ef;
}

[data-theme='easy-bake'] .panel .btn:active {
  transform: translateY(1px);
  box-shadow:
    inset 0 4px 8px rgba(0, 0, 0, 0.65),
    inset 0 0 8px rgba(255, 105, 180, 0.08);
}

[data-theme='easy-bake'] .panel .btn-icon {
  display: none;
}

[data-theme='easy-bake'] #copy-btn .btn-icon {
  display: inline-flex;
}

/* ── Creepy Crawlers: centered action buttons ── */
[data-theme='creepy-crawlers'] .panel .btn {
  margin-left: auto;
  margin-right: auto;
}

[data-theme='creepy-crawlers'] .panel-input,
[data-theme='creepy-crawlers'] .panel-review,
[data-theme='creepy-crawlers'] .panel-output {
  text-align: center;
}

[data-theme='creepy-crawlers'] .panel-input .raw-textarea,
[data-theme='creepy-crawlers'] .panel-review .review-content,
[data-theme='creepy-crawlers'] .panel-output .output-preview {
  text-align: left;
  color: #fff;
  background: #0a1808;
  border-color: #ff6600;
}

[data-theme='creepy-crawlers'] .panel-review .review-content p,
[data-theme='creepy-crawlers'] .panel-review .review-content li,
[data-theme='creepy-crawlers'] .panel-output .output-preview p,
[data-theme='creepy-crawlers'] .panel-output .output-preview li,
[data-theme='creepy-crawlers'] .panel-review .no-edits {
  font-family: var(--font-content);
}

[data-theme='creepy-crawlers'] .panel-review .review-content h1,
[data-theme='creepy-crawlers'] .panel-review .review-content h2,
[data-theme='creepy-crawlers'] .panel-review .review-content h3,
[data-theme='creepy-crawlers'] .panel-output .output-preview h1,
[data-theme='creepy-crawlers'] .panel-output .output-preview h2,
[data-theme='creepy-crawlers'] .panel-output .output-preview h3,
[data-theme='creepy-crawlers'] .panel-review .review-content p > .edit-heading {
  font-family: var(--font-heading);
}

[data-theme='creepy-crawlers'] .panel-review .review-content h1,
[data-theme='creepy-crawlers'] .panel-review .review-content p > .edit-heading[data-heading-level='1'] {
  font-size: 1.75rem;
}

[data-theme='creepy-crawlers'] .panel-review .review-content h2,
[data-theme='creepy-crawlers'] .panel-review .review-content p > .edit-heading[data-heading-level='2'] {
  font-size: 1.5625rem;
}

[data-theme='creepy-crawlers'] .panel-review .review-content h3,
[data-theme='creepy-crawlers'] .panel-review .review-content p > .edit-heading[data-heading-level='3'] {
  font-size: 1.375rem;
}

[data-theme='creepy-crawlers'] .panel-output .output-preview h1 {
  font-size: 1.625rem;
}

[data-theme='creepy-crawlers'] .panel-output .output-preview h2 {
  font-size: 1.4375rem;
}

[data-theme='creepy-crawlers'] .panel-output .output-preview h3 {
  font-size: 1.3125rem;
}

[data-theme='creepy-crawlers'] .panel-review .review-content h1,
[data-theme='creepy-crawlers'] .panel-review .review-content h2,
[data-theme='creepy-crawlers'] .panel-review .review-content h3,
[data-theme='creepy-crawlers'] .panel-output .output-preview h1,
[data-theme='creepy-crawlers'] .panel-output .output-preview h2,
[data-theme='creepy-crawlers'] .panel-output .output-preview h3,
[data-theme='creepy-crawlers'] .panel-review .review-content p,
[data-theme='creepy-crawlers'] .panel-review .review-content li,
[data-theme='creepy-crawlers'] .panel-output .output-preview p,
[data-theme='creepy-crawlers'] .panel-output .output-preview li,
[data-theme='creepy-crawlers'] .panel-review .no-edits {
  color: #fff;
}

[data-theme='creepy-crawlers'] .panel-title,
[data-theme='creepy-crawlers'] .panel-desc {
  justify-content: center;
  text-align: center;
}

[data-theme='creepy-crawlers'] .panel-title {
  color: var(--btn-primary-text);
}

/* ── Creepy Crawlers: cook knob ── */
[data-theme='creepy-crawlers'] #accept-btn.btn--knob {
  position: relative;
  z-index: 0;
  width: 150px;
  height: 150px;
  margin-top: 2rem;
  padding: 0;
  border: 10px solid #39ff14;
  border-radius: 50%;
  flex-direction: column;
  gap: 0;
  background: linear-gradient(180deg, #16880c 0%, #2dcc18 42%, #39ff14 100%);
  color: #000;
  box-shadow:
    0 8px 20px rgba(0, 0, 0, 0.45),
    0 0 18px rgba(57, 255, 20, 0.35);
  transform: rotate(0deg);
  transition: transform 0.35s ease-in-out, box-shadow 0.2s, filter 0.2s;
}

[data-theme='creepy-crawlers'] #accept-btn.btn--knob::before {
  display: none;
}

[data-theme='creepy-crawlers'] #accept-btn.btn--knob::after {
  display: none;
}

[data-theme='creepy-crawlers'] #accept-btn.btn--knob.is-turned {
  transform: rotate(70deg);
}

[data-theme='creepy-crawlers'] #accept-btn.btn--knob .btn-icon {
  display: none;
}

[data-theme='creepy-crawlers'] #accept-btn.btn--knob .btn-label--accept::after {
  display: block;
  max-width: 7.5rem;
  font-size: 0.82rem;
  font-weight: 800;
  line-height: 1.15;
  letter-spacing: 0.02em;
  text-align: center;
  text-transform: uppercase;
  color: #000;
}

[data-theme='creepy-crawlers'] #accept-btn.btn--knob:hover {
  filter: brightness(1.05);
  box-shadow:
    0 8px 22px rgba(0, 0, 0, 0.5),
    0 0 24px rgba(57, 255, 20, 0.5);
}

[data-theme='creepy-crawlers'] #accept-btn.btn--knob:active {
  box-shadow:
    0 4px 12px rgba(0, 0, 0, 0.5),
    0 0 14px rgba(57, 255, 20, 0.4);
}

/* ── Stanley Parable UI ── */
[data-theme='stanley'] .panel {
  background: linear-gradient(180deg, #ece8df 0%, #d4cfc4 100%);
  border: 3px solid var(--beige-frame-dark);
  border-radius: 4px;
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.55),
    0 4px 0 var(--panel-shadow),
    0 10px 28px var(--panel-shadow-deep);
}

[data-theme='stanley'] .panel-title {
  color: #2e2e2e;
  font-size: 0.92rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

[data-theme='stanley'] .panel-desc {
  color: #5c5c5c;
  font-size: 0.85rem;
}

[data-theme='stanley'] .panel-icon--input::before { content: '⌨'; }
[data-theme='stanley'] .panel-icon--review::before { content: '☰'; }
[data-theme='stanley'] .panel-icon--output::before { content: '▣'; }

[data-theme='stanley'] .panel-label--input,
[data-theme='stanley'] .panel-label--review,
[data-theme='stanley'] .panel-label--output {
  font-size: 0;
}

[data-theme='stanley'] .panel-label--input::after { content: 'Input Terminal'; font-size: 1.25rem; }
[data-theme='stanley'] .panel-label--review::after { content: 'Review Console'; font-size: 1.25rem; }
[data-theme='stanley'] .panel-label--output::after { content: 'Output Terminal'; font-size: 1.25rem; }

[data-theme='stanley'] .panel-label--input::after,
[data-theme='stanley'] .panel-label--review::after,
[data-theme='stanley'] .panel-label--output::after {
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: #2e2e2e;
}

[data-theme='stanley'] .raw-textarea {
  color: var(--terminal-text);
  background: var(--terminal-bg);
  font-family: var(--font-inconsolata);
  font-size: calc(1.15rem * 0.85);
  line-height: 1.55;
  text-shadow: 0 0 5px var(--terminal-glow);
  border: 10px solid var(--beige-frame);
  border-radius: 2px;
  outline: 2px solid var(--beige-frame-dark);
  outline-offset: -12px;
  box-shadow:
    inset 0 0 28px rgba(51, 255, 51, 0.08),
    inset 0 0 2px rgba(51, 255, 51, 0.2);
  caret-color: var(--terminal-text);
}

[data-theme='stanley'] .review-content {
  color: var(--terminal-text);
  background: var(--terminal-bg);
  font-family: var(--font-inconsolata);
  font-size: 1.08rem;
  line-height: 1.45;
  text-shadow: 0 0 5px var(--terminal-glow);
  border: 10px solid var(--beige-frame);
  border-radius: 2px;
  outline: 2px solid var(--beige-frame-dark);
  outline-offset: -12px;
  box-shadow:
    inset 0 0 28px rgba(51, 255, 51, 0.08),
    inset 0 0 2px rgba(51, 255, 51, 0.2);
  border-style: solid;
}

[data-theme='stanley'] .output-preview {
  color: var(--terminal-text);
  background: var(--terminal-bg);
  font-family: var(--font-inconsolata);
  font-size: 1.15rem;
  line-height: 1.55;
  text-shadow: 0 0 5px var(--terminal-glow);
  border: 10px solid var(--beige-frame);
  border-radius: 2px;
  outline: 2px solid var(--beige-frame-dark);
  outline-offset: -12px;
  box-shadow:
    inset 0 0 28px rgba(51, 255, 51, 0.08),
    inset 0 0 2px rgba(51, 255, 51, 0.2);
}

[data-theme='stanley'] .raw-textarea::placeholder {
  color: rgba(51, 255, 51, 0.45);
}

[data-theme='stanley'] .review-content h1,
[data-theme='stanley'] .review-content h2,
[data-theme='stanley'] .review-content h3 {
  color: var(--terminal-heading);
  font-family: var(--font-inconsolata);
  font-weight: 600;
  text-shadow: 0 0 8px var(--terminal-heading-glow);
}

[data-theme='stanley'] .output-preview h1,
[data-theme='stanley'] .output-preview h2,
[data-theme='stanley'] .output-preview h3 {
  color: var(--terminal-heading);
  font-family: var(--font-inconsolata);
  font-weight: 600;
  text-shadow: 0 0 8px var(--terminal-heading-glow);
}

[data-theme='stanley'] .output-preview h1 {
  font-size: 1.495rem;
}

[data-theme='stanley'] .output-preview h2 {
  font-size: 1.3225rem;
}

[data-theme='stanley'] .output-preview h3 {
  font-size: 1.2075rem;
}

/* Visual-only heading tag labels (CSS pseudo-elements — not in copied HTML) */
[data-theme='stanley'] .review-content h1:not(:has(.edit-heading))::before,
[data-theme='stanley'] .review-content h1 .edit-highlight::before,
[data-theme='stanley'] .output-preview h1::before,
[data-theme='stanley'] .review-content p > .edit-heading:not([data-heading-rejected='true']):not(.is-rejected)[data-heading-level='1'] .edit-highlight::before {
  content: '<h1>';
}

[data-theme='stanley'] .review-content h1:not(:has(.edit-heading))::after,
[data-theme='stanley'] .review-content h1 .edit-highlight::after,
[data-theme='stanley'] .output-preview h1::after,
[data-theme='stanley'] .review-content p > .edit-heading:not([data-heading-rejected='true']):not(.is-rejected)[data-heading-level='1'] .edit-highlight::after {
  content: '</h1>';
}

[data-theme='stanley'] .review-content h2:not(:has(.edit-heading))::before,
[data-theme='stanley'] .review-content h2 .edit-highlight::before,
[data-theme='stanley'] .output-preview h2::before,
[data-theme='stanley'] .review-content p > .edit-heading:not([data-heading-rejected='true']):not(.is-rejected)[data-heading-level='2'] .edit-highlight::before {
  content: '<h2>';
}

[data-theme='stanley'] .review-content h2:not(:has(.edit-heading))::after,
[data-theme='stanley'] .review-content h2 .edit-highlight::after,
[data-theme='stanley'] .output-preview h2::after,
[data-theme='stanley'] .review-content p > .edit-heading:not([data-heading-rejected='true']):not(.is-rejected)[data-heading-level='2'] .edit-highlight::after {
  content: '</h2>';
}

[data-theme='stanley'] .review-content h3:not(:has(.edit-heading))::before,
[data-theme='stanley'] .review-content h3 .edit-highlight::before,
[data-theme='stanley'] .output-preview h3::before,
[data-theme='stanley'] .review-content p > .edit-heading:not([data-heading-rejected='true']):not(.is-rejected)[data-heading-level='3'] .edit-highlight::before {
  content: '<h3>';
}

[data-theme='stanley'] .review-content h3:not(:has(.edit-heading))::after,
[data-theme='stanley'] .review-content h3 .edit-highlight::after,
[data-theme='stanley'] .output-preview h3::after,
[data-theme='stanley'] .review-content p > .edit-heading:not([data-heading-rejected='true']):not(.is-rejected)[data-heading-level='3'] .edit-highlight::after {
  content: '</h3>';
}

[data-theme='stanley'] .review-content h1:not(:has(.edit-heading))::before,
[data-theme='stanley'] .review-content h1:not(:has(.edit-heading))::after,
[data-theme='stanley'] .review-content h2:not(:has(.edit-heading))::before,
[data-theme='stanley'] .review-content h2:not(:has(.edit-heading))::after,
[data-theme='stanley'] .review-content h3:not(:has(.edit-heading))::before,
[data-theme='stanley'] .review-content h3:not(:has(.edit-heading))::after,
[data-theme='stanley'] .review-content h1 .edit-highlight::before,
[data-theme='stanley'] .review-content h1 .edit-highlight::after,
[data-theme='stanley'] .review-content h2 .edit-highlight::before,
[data-theme='stanley'] .review-content h2 .edit-highlight::after,
[data-theme='stanley'] .review-content h3 .edit-highlight::before,
[data-theme='stanley'] .review-content h3 .edit-highlight::after,
[data-theme='stanley'] .output-preview h1::before,
[data-theme='stanley'] .output-preview h1::after,
[data-theme='stanley'] .output-preview h2::before,
[data-theme='stanley'] .output-preview h2::after,
[data-theme='stanley'] .output-preview h3::before,
[data-theme='stanley'] .output-preview h3::after,
[data-theme='stanley'] .review-content p > .edit-heading:not([data-heading-rejected='true']):not(.is-rejected) .edit-highlight::before,
[data-theme='stanley'] .review-content p > .edit-heading:not([data-heading-rejected='true']):not(.is-rejected) .edit-highlight::after {
  color: rgba(51, 255, 51, 0.42);
  font-weight: 400;
  font-size: 0.82em;
  user-select: none;
  pointer-events: none;
}

[data-theme='stanley'] .review-content h1:not(:has(.edit-heading))::before,
[data-theme='stanley'] .review-content h2:not(:has(.edit-heading))::before,
[data-theme='stanley'] .review-content h3:not(:has(.edit-heading))::before,
[data-theme='stanley'] .review-content h1 .edit-highlight::before,
[data-theme='stanley'] .review-content h2 .edit-highlight::before,
[data-theme='stanley'] .review-content h3 .edit-highlight::before,
[data-theme='stanley'] .output-preview h1::before,
[data-theme='stanley'] .output-preview h2::before,
[data-theme='stanley'] .output-preview h3::before,
[data-theme='stanley'] .review-content p > .edit-heading:not([data-heading-rejected='true']):not(.is-rejected) .edit-highlight::before {
  margin-right: 0.35em;
}

[data-theme='stanley'] .review-content h1:not(:has(.edit-heading))::after,
[data-theme='stanley'] .review-content h2:not(:has(.edit-heading))::after,
[data-theme='stanley'] .review-content h3:not(:has(.edit-heading))::after,
[data-theme='stanley'] .review-content h1 .edit-highlight::after,
[data-theme='stanley'] .review-content h2 .edit-highlight::after,
[data-theme='stanley'] .review-content h3 .edit-highlight::after,
[data-theme='stanley'] .output-preview h1::after,
[data-theme='stanley'] .output-preview h2::after,
[data-theme='stanley'] .output-preview h3::after,
[data-theme='stanley'] .review-content p > .edit-heading:not([data-heading-rejected='true']):not(.is-rejected) .edit-highlight::after {
  margin-left: 0.35em;
}

[data-theme='stanley'] .review-content p,
[data-theme='stanley'] .review-content li,
[data-theme='stanley'] .output-preview p,
[data-theme='stanley'] .output-preview li {
  color: var(--terminal-text);
  font-size: 0.85em;
}

[data-theme='stanley'] .review-content hr,
[data-theme='stanley'] .output-preview hr {
  border-top-color: rgba(51, 255, 51, 0.45);
}

[data-theme='stanley'] .no-edits {
  color: rgba(51, 255, 51, 0.7);
}

[data-theme='stanley'] .edit-highlight {
  background: rgba(201, 162, 39, 0.22);
  border-bottom-color: #c9a227;
  color: #5dff5d;
  box-shadow: none;
}

[data-theme='stanley'] .edit-rejected,
[data-theme='stanley'] .is-rejected .edit-rejected {
  color: inherit;
}

[data-theme='stanley'] .edit-btn {
  background: linear-gradient(180deg, #f0ece3 0%, #cfc9bc 100%);
  border-color: #a8a295;
  color: #2e2e2e;
  box-shadow:
    0 2px 0 #8f8a7d,
    inset 0 1px 0 rgba(255, 255, 255, 0.55);
}

[data-theme='stanley'] .edit-btn--approve,
[data-theme='stanley'] .edit-btn--level1,
[data-theme='stanley'] .edit-btn--level2,
[data-theme='stanley'] .edit-btn--level3 {
  border-color: #9a7b18;
  color: #5a4510;
  background: linear-gradient(180deg, #f3e3a8 0%, #c9a227 100%);
}

[data-theme='stanley'] .edit-btn--reject {
  border-color: #7a2424;
  color: #5c1010;
  background: linear-gradient(180deg, #e8b0b0 0%, #a83232 100%);
}

[data-theme='stanley'] .edit-btn--approve.is-active,
[data-theme='stanley'] .edit-btn--level1.is-active,
[data-theme='stanley'] .edit-btn--level2.is-active,
[data-theme='stanley'] .edit-btn--level3.is-active {
  background: #c9a227;
  border-color: #7a5f10;
  color: #1a1408;
}

[data-theme='stanley'] .edit-btn--reject.is-active {
  background: #a83232;
  border-color: #5c1010;
  color: #fff;
}

[data-theme='stanley'] .edit-btn--approve:not(.is-active),
[data-theme='stanley'] .edit-btn--level1:not(.is-active),
[data-theme='stanley'] .edit-btn--level2:not(.is-active),
[data-theme='stanley'] .edit-btn--level3:not(.is-active),
[data-theme='stanley'] .edit-btn--reject:not(.is-active) {
  filter: brightness(0.75);
}

[data-theme='stanley'] .edit-btn--approve.is-active,
[data-theme='stanley'] .edit-btn--level1.is-active,
[data-theme='stanley'] .edit-btn--level2.is-active,
[data-theme='stanley'] .edit-btn--level3.is-active,
[data-theme='stanley'] .edit-btn--reject.is-active {
  filter: brightness(1.25);
}

[data-theme='stanley'] .option-choice__column {
  background: #0a0a0a;
  border-color: #3a3a3a;
  color: var(--terminal-text);
}

[data-theme='stanley'] .option-choice__title,
[data-theme='stanley'] .option-choice__label,
[data-theme='stanley'] .option-choice__content {
  color: var(--terminal-text);
  font-family: var(--font-inconsolata);
}

[data-theme='stanley'] .option-choice__column.is-selected {
  border-color: #c9a227;
  box-shadow: 0 0 0 2px rgba(201, 162, 39, 0.35);
}

[data-theme='stanley'] .panel .btn {
  font-family: var(--font-body);
  font-size: 0.82rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  border-radius: 3px;
  border: 2px solid #a8a295;
  background: linear-gradient(180deg, #f0ece3 0%, #cfc9bc 55%, #c5c0b5 100%);
  color: #2a2a2a;
  box-shadow:
    0 3px 0 #8f8a7d,
    inset 0 1px 0 rgba(255, 255, 255, 0.6);
}

[data-theme='stanley'] .panel .btn:hover {
  filter: brightness(1.04);
}

[data-theme='stanley'] .panel .btn:active {
  box-shadow:
    0 1px 0 #8f8a7d,
    inset 0 1px 0 rgba(255, 255, 255, 0.45);
}

[data-theme='stanley'] .btn-label--mix { font-size: 0; }
[data-theme='stanley'] .btn-label--mix::after { content: 'Process Input'; font-size: 0.82rem; }

[data-theme='stanley'] .btn-label--accept { font-size: 0; }
[data-theme='stanley'] .btn-label--accept::after { content: 'Continue'; font-size: 0.82rem; }

[data-theme='stanley'] .btn-label--rebake { font-size: 0; }
[data-theme='stanley'] .btn-label--rebake::after { content: 'Return to Input'; font-size: 0.82rem; }

[data-theme='stanley'] .btn-icon--mix::before { content: '►'; }
[data-theme='stanley'] .btn-icon--accept::before { content: '►'; }
[data-theme='stanley'] .btn-icon--copy::before { content: none; }
[data-theme='stanley'] .btn-icon--rebake::before { content: '↺'; }

[data-theme='stanley'] .btn-icon__art--floppy {
  display: block;
}

[data-theme='stanley'] .btn-icon__art--scorpion,
[data-theme='stanley'] .panel-icon__art--goo,
[data-theme='stanley'] .panel-icon__art--scorpion {
  display: none !important;
}

[data-theme='stanley'] #accept-btn.btn--knob {
  width: auto;
  height: auto;
  min-width: 10rem;
  border-radius: 3px;
  border-width: 2px;
  transform: none;
}

[data-theme='stanley'] .raw-list,
[data-theme='stanley'] .option-choice__rejected-text {
  color: var(--terminal-text);
  font-family: var(--font-inconsolata);
}

[data-theme='stanley'] .footer {
  color: #7a8494;
}

/* ── Review ── */
.review-content {
  position: relative;
  padding: 1rem;
  background: var(--surface);
  border: 2px dashed var(--review-border);
  border-radius: var(--radius-sm);
  font-size: 0.95rem;
  line-height: 1.7;
  transition: background 0.3s;
}

.review-content h1,
.review-content h2,
.review-content h3 {
  margin: 1.25rem 0 0.5rem;
  font-weight: 400;
  color: var(--text-heading);
}

.review-content h1 {
  font-size: 1.4rem;
}

.review-content h2 {
  font-size: 1.25rem;
}

.review-content h3 {
  font-size: 1.1rem;
}

.review-content h1:first-child,
.review-content h2:first-child,
.review-content h3:first-child {
  margin-top: 0;
}

.review-content p {
  margin: 0 0 0.75rem;
}

.review-content p:has(.edit-inline:not(.edit-heading)) {
  margin-bottom: 1rem;
  line-height: 1.85;
}

.review-content ul,
.review-content ol {
  margin: 0.5rem 0 1rem;
  padding-left: 1.5rem;
}

.review-content li {
  margin-bottom: 0.35rem;
}

.review-content hr,
.output-preview hr {
  border: none;
  border-top: 2px solid var(--review-border);
  margin: 1rem 0;
}

.no-edits {
  color: var(--text-muted);
  font-weight: 600;
  text-align: center;
  padding: 1rem;
}

/* ── Edit controls ── */
.edit-inline,
.edit-block,
.edit-wrapper,
.option-choice {
  --edit-btn-h: 28px;
  --edit-control-clearance: 35px;
}

.edit-inline,
.edit-block {
  position: relative;
  z-index: 1;
}

.edit-inline {
  display: inline-block;
  max-width: 100%;
  margin-top: var(--edit-control-clearance);
  padding-right: 0;
  vertical-align: baseline;
}

.edit-inline:hover,
.edit-inline:focus-within,
.edit-block:hover,
.edit-block:focus-within {
  z-index: 3;
}

.edit-block {
  display: inline-block;
  max-width: 100%;
  vertical-align: top;
  margin: calc(0.75rem + var(--edit-control-clearance)) 0 0.75rem;
  padding-right: 0;
}

.edit-wrapper {
  position: relative;
  margin: calc(0.75rem + var(--edit-control-clearance)) 0 0.75rem;
}

.edit-wrapper:has(> .option-choice) {
  margin-top: 0.75rem;
}

.edit-wrapper > .edit-block:not(.option-choice) {
  margin: 0;
}

.edit-inline.edit-heading {
  display: inline-block;
  max-width: 100%;
  width: auto;
  padding-right: 0;
}

.review-content h1:has(.edit-heading),
.review-content h2:has(.edit-heading),
.review-content h3:has(.edit-heading) {
  overflow: visible;
}

/* ── Option A / B choice ── */
.option-choice {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 0.35rem;
  max-width: 100%;
  margin-top: var(--edit-control-clearance);
  padding-right: 0;
}

.option-choice__columns {
  flex: 1 1 100%;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 1rem;
}

.option-choice__column {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  padding: 0.85rem;
  background: var(--surface);
  border: 2px solid var(--review-border);
  border-radius: var(--radius-sm);
  text-align: left;
  transition: border-color 0.2s, box-shadow 0.2s;
}

.option-choice__column.is-selected {
  border-color: var(--approve, #39ff14);
  box-shadow: 0 0 0 2px rgba(57, 255, 20, 0.25);
}

[data-theme='easy-bake'] .option-choice__column.is-selected {
  border-color: #4a90d9;
  box-shadow: 0 0 0 2px rgba(74, 144, 217, 0.25);
}

.option-choice__title {
  margin: 0;
  font-size: 1rem;
  font-weight: 800;
  line-height: 1.2;
}

.option-choice__label {
  margin: 0;
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--text-muted);
  line-height: 1.3;
}

.option-choice__content {
  flex: 1;
  font-size: 0.9rem;
  line-height: 1.45;
}

.option-choice__content p {
  margin: 0 0 0.65rem;
}

.option-choice__content ul,
.option-choice__content ol {
  margin: 0;
  padding-left: 1.25rem;
}

.option-choice__content li {
  margin-bottom: 0.3rem;
}

.option-choice__pick {
  display: flex;
  justify-content: center;
  margin-top: 0.25rem;
}

.edit-btn--pick {
  min-width: 2.5rem;
  font-weight: 800;
}

.option-choice__controls {
  position: absolute;
  left: 0;
  top: 0;
  display: inline-flex;
  flex-wrap: nowrap;
  margin-left: 0;
  transform: translateY(calc(var(--edit-btn-h) * -1.2));
}

.option-choice__rejected {
  margin-bottom: 0.5rem;
}

.option-choice__rejected-text {
  margin: 0;
  padding: 0.65rem 0.75rem;
  background: var(--highlight-red);
  border: 2px solid var(--highlight-red-border);
  border-radius: var(--radius-sm);
  font-family: var(--font-body);
  font-size: 0.85rem;
  line-height: 1.45;
  white-space: pre-wrap;
  word-break: break-word;
}

.option-choice.is-rejected .option-choice__controls .edit-btn--approve {
  opacity: 1;
}

.edit-highlight {
  background: var(--highlight-red);
  border-bottom: 2px solid var(--highlight-red-border);
  padding: 0.1em 0.15em;
  border-radius: 3px;
  box-decoration-break: clone;
  -webkit-box-decoration-break: clone;
}

.edit-block > .edit-highlight,
.edit-block > .edit-rejected {
  display: block;
  padding: 0.45em 0.65em;
  margin: 0;
}

.edit-block > .edit-highlight ul,
.edit-block > .edit-highlight ol,
.edit-block > .edit-rejected ul,
.edit-block > .edit-rejected ol {
  margin: 0;
  padding-left: 1.5rem;
}

.edit-block > .edit-highlight li:last-child,
.edit-block > .edit-rejected li:last-child {
  margin-bottom: 0;
}

.edit-rejected-text {
  white-space: pre-wrap;
}

[data-theme='creepy-crawlers'] .edit-highlight {
  box-shadow: 0 0 6px rgba(255, 69, 0, 0.4);
}

[data-theme='creepy-crawlers'] .edit-btn.is-active {
  color: #000;
}

.edit-rejected {
  background: transparent;
  border-bottom: none;
  text-decoration: none;
  opacity: 1;
  box-shadow: none;
  color: inherit;
}

.is-rejected .edit-rejected {
  background: transparent;
  border-bottom: none;
  text-decoration: none;
  opacity: 1;
  box-shadow: none;
  color: inherit;
}

.edit-controls {
  --edit-btn-h: 28px;
  position: absolute;
  left: 0;
  top: 0;
  display: inline-flex;
  flex-wrap: nowrap;
  margin-left: 0;
  transform: translateY(calc(var(--edit-btn-h) * -1.2));
  gap: 0.25rem;
  z-index: 2;
}

.edit-controls--heading {
  gap: 0.2rem;
  flex-wrap: nowrap;
}

.edit-btn {
  width: var(--edit-btn-h);
  height: var(--edit-btn-h);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.85rem;
  font-weight: 700;
  border: 2px solid var(--surface-border);
  border-radius: 6px;
  background: var(--surface);
  color: var(--text-muted);
  cursor: pointer;
  transition: background 0.15s, border-color 0.15s, color 0.15s, filter 0.15s;
  padding: 0;
}

.edit-btn--approve {
  border-color: var(--approve);
  color: var(--approve);
  background: var(--approve-bg);
}

.edit-btn--level1,
.edit-btn--level2,
.edit-btn--level3 {
  min-width: var(--edit-btn-h);
  border-color: var(--approve);
  color: var(--approve);
  background: var(--approve-bg);
  font-size: 0.62rem;
  letter-spacing: -0.02em;
}

.edit-btn--reject {
  border-color: var(--reject);
  color: var(--reject);
  background: var(--reject-bg);
}

.edit-btn--approve.is-active {
  background: var(--approve);
  border-color: var(--approve-dark);
  color: #fff;
}

.edit-btn--level1.is-active,
.edit-btn--level2.is-active,
.edit-btn--level3.is-active {
  background: var(--approve);
  border-color: var(--approve-dark);
  color: #fff;
}

.edit-btn--reject.is-active {
  background: var(--reject);
  border-color: var(--reject-dark);
  color: #fff;
}

.is-rejected .edit-btn--approve:not(.is-active) {
  background: var(--approve-bg);
  border-color: var(--approve);
  color: var(--approve);
}

.is-rejected .edit-btn--level1:not(.is-active),
.is-rejected .edit-btn--level2:not(.is-active),
.is-rejected .edit-btn--level3:not(.is-active) {
  background: var(--approve-bg);
  border-color: var(--approve);
  color: var(--approve);
}

.is-rejected .edit-btn--reject.is-active {
  background: var(--reject);
  border-color: var(--reject-dark);
  color: #fff;
}

.edit-btn:hover:not(.is-active) {
  filter: brightness(1.06);
}

[data-theme='stanley'] .edit-btn--approve:not(.is-active):hover,
[data-theme='stanley'] .edit-btn--level1:not(.is-active):hover,
[data-theme='stanley'] .edit-btn--level2:not(.is-active):hover,
[data-theme='stanley'] .edit-btn--level3:not(.is-active):hover,
[data-theme='stanley'] .edit-btn--reject:not(.is-active):hover {
  filter: brightness(0.82);
}

.edit-btn--approve.is-active:hover,
.edit-btn--level1.is-active:hover,
.edit-btn--level2.is-active:hover,
.edit-btn--level3.is-active:hover,
.edit-btn--reject.is-active:hover {
  filter: brightness(1.08);
}

[data-theme='stanley'] .edit-btn--approve.is-active:hover,
[data-theme='stanley'] .edit-btn--level1.is-active:hover,
[data-theme='stanley'] .edit-btn--level2.is-active:hover,
[data-theme='stanley'] .edit-btn--level3.is-active:hover,
[data-theme='stanley'] .edit-btn--reject.is-active:hover {
  filter: brightness(1.32);
}

/* ── Output ── */
.output-content {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.output-preview {
  padding: 1rem;
  background: var(--surface);
  border: 2px solid var(--output-border);
  border-radius: var(--radius-sm);
}

.output-preview h1,
.output-preview h2,
.output-preview h3 {
  margin: 0 0 0.5rem;
  font-weight: 400;
  color: var(--text-heading);
}

.output-preview h1 {
  font-size: 1.3rem;
}

.output-preview h2 {
  font-size: 1.15rem;
}

.output-preview h3 {
  font-size: 1.05rem;
}

.output-preview p {
  margin: 0 0 0.75rem;
}

.output-preview ul,
.output-preview ol {
  margin: 0.5rem 0;
  padding-left: 1.5rem;
}

.raw-list {
  font-family: inherit;
  font-size: 0.9rem;
  white-space: pre-wrap;
  background: transparent;
  border: none;
  margin: 0;
  padding: 0;
  color: var(--text);
}

/* ── Footer ── */
.footer {
  text-align: center;
  padding: 1rem 0;
  font-size: 16px;
  color: var(--text-muted);
  opacity: 0.85;
}

.footer p {
  margin: 0;
}

/* ── Whitespace: no chrome, text only ── */
html[data-theme='whitespace'] body {
  background: #fff;
  color: #000;
  font-family: 'Manrope', sans-serif;
}

[data-theme='whitespace'] .header,
[data-theme='whitespace'] .footer,
[data-theme='whitespace'] .panel-title,
[data-theme='whitespace'] .panel-desc,
[data-theme='whitespace'] .panel-icon,
[data-theme='whitespace'] .btn-icon {
  display: none !important;
}

[data-theme='whitespace'] .app {
  max-width: 48rem;
  padding: 3rem 1.5rem 4rem;
}

[data-theme='whitespace'] .theme-switcher__btn {
  padding: 0;
  font-family: 'Manrope', sans-serif;
  font-size: 0.8125rem;
  font-weight: 400;
  line-height: 1.4;
  color: #999;
  background: none;
  border: none;
  border-radius: 0;
  box-shadow: none;
}

[data-theme='whitespace'] .theme-switcher__btn:hover {
  transform: none;
  filter: none;
  color: #000;
}

[data-theme='whitespace'] .theme-switcher__btn:active {
  transform: none;
  box-shadow: none;
}

[data-theme='whitespace'] .theme-switcher__btn.is-active {
  color: #000;
  background: none;
  border: none;
  box-shadow: none;
  text-decoration: underline;
  text-underline-offset: 0.2em;
}

[data-theme='whitespace'] .theme-switcher__btn[data-theme='easy-bake'],
[data-theme='whitespace'] .theme-switcher__btn[data-theme='creepy-crawlers'],
[data-theme='whitespace'] .theme-switcher__btn[data-theme='stanley'],
[data-theme='whitespace'] .theme-switcher__btn[data-theme='whitespace'] {
  color: #999;
  background: none;
  border: none;
  box-shadow: none;
}

[data-theme='whitespace'] .theme-switcher__btn[data-theme='easy-bake'].is-active,
[data-theme='whitespace'] .theme-switcher__btn[data-theme='creepy-crawlers'].is-active,
[data-theme='whitespace'] .theme-switcher__btn[data-theme='stanley'].is-active,
[data-theme='whitespace'] .theme-switcher__btn[data-theme='whitespace'].is-active {
  color: #000;
  background: none;
  border: none;
  box-shadow: none;
}

[data-theme='whitespace'] .panel {
  background: none;
  border: none;
  border-radius: 0;
  padding: 0;
  margin-bottom: 0;
  box-shadow: none;
}

[data-theme='whitespace'] .panel-review:not(.hidden),
[data-theme='whitespace'] .panel-output:not(.hidden) {
  margin-top: 100px;
  padding-top: 100px;
  border-top: 3px solid #000;
}

[data-theme='whitespace'] .raw-textarea,
[data-theme='whitespace'] .review-content,
[data-theme='whitespace'] .output-preview {
  font-family: 'Manrope', sans-serif;
  font-size: 1.2rem;
  line-height: 1.65;
  color: #000;
  background: #fff;
}

[data-theme='whitespace'] .raw-textarea {
  min-height: 16.8rem;
  padding: 0;
  border: none;
  border-radius: 0;
  resize: vertical;
  box-shadow: none;
}

[data-theme='whitespace'] .raw-textarea:focus {
  outline: none;
  border: none;
  box-shadow: none;
}

[data-theme='whitespace'] .raw-textarea::placeholder {
  color: #aaa;
}

[data-theme='whitespace'] .review-content,
[data-theme='whitespace'] .output-preview {
  padding: 0;
  border: none;
  border-radius: 0;
}

[data-theme='whitespace'] .review-content h1,
[data-theme='whitespace'] .output-preview h1 {
  font-size: 1.68rem;
}

[data-theme='whitespace'] .review-content h2,
[data-theme='whitespace'] .output-preview h2 {
  font-size: 1.5rem;
}

[data-theme='whitespace'] .review-content h3,
[data-theme='whitespace'] .output-preview h3 {
  font-size: 1.32rem;
}

[data-theme='whitespace'] .review-content h1,
[data-theme='whitespace'] .review-content h2,
[data-theme='whitespace'] .review-content h3,
[data-theme='whitespace'] .output-preview h1,
[data-theme='whitespace'] .output-preview h2,
[data-theme='whitespace'] .output-preview h3 {
  font-family: 'Manrope', sans-serif;
  font-weight: 700;
  color: #000;
}

[data-theme='whitespace'] .review-content hr,
[data-theme='whitespace'] .output-preview hr {
  border: none;
  border-top: 1px solid #ddd;
}

[data-theme='whitespace'] .no-edits {
  color: #666;
  font-weight: 400;
  padding: 0;
}

[data-theme='whitespace'] .btn {
  display: inline-block;
  width: auto;
  margin-top: 1.8rem;
  padding: 0;
  font-family: 'Manrope', sans-serif;
  font-size: 1.2rem;
  font-weight: 400;
  line-height: 1.4;
  color: #000;
  background: none;
  border: none;
  border-radius: 0;
  box-shadow: none;
  cursor: pointer;
  text-decoration: underline;
  text-underline-offset: 0.2em;
}

[data-theme='whitespace'] .btn:hover,
[data-theme='whitespace'] .btn:active {
  transform: none;
  filter: none;
  box-shadow: none;
}

[data-theme='whitespace'] .btn-label--mix {
  font-size: 0;
}

[data-theme='whitespace'] .btn-label--mix::after {
  content: 'Clean';
  font-size: 1.2rem;
}

[data-theme='whitespace'] .btn-label--accept {
  font-size: 0;
}

[data-theme='whitespace'] .btn-label--accept::after {
  content: 'Accept';
  font-size: 1.2rem;
}

[data-theme='whitespace'] .btn-label--rebake {
  font-size: 0;
}

[data-theme='whitespace'] .btn-label--rebake::after {
  content: 'Another Cycle';
  font-size: 1.2rem;
}

[data-theme='whitespace'] #copy-btn {
  font-size: 0;
}

[data-theme='whitespace'] #copy-btn::after {
  content: 'Copy';
  font-size: 1.2rem;
}

[data-theme='whitespace'] #accept-btn.btn--knob {
  width: auto;
  height: auto;
  min-width: 0;
  margin-top: 1.8rem;
  padding: 0;
  border: none;
  border-radius: 0;
  background: none;
  box-shadow: none;
  transform: none;
}

[data-theme='whitespace'] #accept-btn.btn--knob::before,
[data-theme='whitespace'] #accept-btn.btn--knob::after {
  display: none;
}

[data-theme='whitespace'] .output-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 1.5rem;
}

[data-theme='whitespace'] .output-actions .btn {
  margin-top: 0;
}

[data-theme='whitespace'] .edit-highlight {
  background: #f5f5f5;
  border-bottom: 1px solid #bbb;
  border-radius: 0;
  box-shadow: none;
  color: #000;
}

[data-theme='whitespace'] .edit-rejected,
[data-theme='whitespace'] .is-rejected .edit-rejected {
  color: inherit;
}

[data-theme='whitespace'] .edit-btn {
  width: auto;
  height: auto;
  min-width: 0;
  padding: 0 0.4rem;
  font-family: 'Manrope', sans-serif;
  font-size: 0.825rem;
  font-weight: 400;
  line-height: 1.6;
  color: #000;
  background: #fff;
  border: 1px solid #000;
  border-radius: 0;
  box-shadow: none;
}

[data-theme='whitespace'] .edit-btn.is-active,
[data-theme='whitespace'] .edit-btn--approve.is-active,
[data-theme='whitespace'] .edit-btn--level1.is-active,
[data-theme='whitespace'] .edit-btn--level2.is-active,
[data-theme='whitespace'] .edit-btn--level3.is-active,
[data-theme='whitespace'] .edit-btn--reject.is-active {
  background: #000;
  color: #fff;
  border-color: #000;
}

[data-theme='whitespace'] .edit-btn:hover:not(.is-active) {
  background: #f5f5f5;
}

[data-theme='whitespace'] .option-choice__column {
  padding: 0.75rem;
  background: #fff;
  border: 1px solid #ddd;
  border-radius: 0;
  box-shadow: none;
}

[data-theme='whitespace'] .option-choice__column.is-selected {
  border-color: #000;
}

[data-theme='whitespace'] .option-choice__label,
[data-theme='whitespace'] .option-choice__content {
  color: #000;
}

[data-theme='whitespace'] .option-choice__rejected-text {
  background: #f5f5f5;
  border: 1px solid #ddd;
  color: #000;
}

/* ── Responsive ── */
@media (max-width: 600px) {
  .option-choice__columns {
    grid-template-columns: 1fr;
  }

  .app {
    padding: 0.75rem 0.75rem 1.5rem;
  }

  .theme-switcher {
    top: 0.5rem;
    right: 0.5rem;
    gap: 0.3rem;
  }

  .theme-switcher__btn {
    padding: 0.35rem 0.55rem;
    font-size: 0.68rem;
  }

  .header {
    padding-top: 3rem;
  }

  .panel {
    padding: 1rem;
  }

  .title {
    font-size: 0.68rem;
  }

  .btn {
    width: 100%;
  }

  [data-theme='creepy-crawlers'] .panel .btn:not(.btn--knob) {
    width: auto;
    min-width: 12rem;
  }

  [data-theme='creepy-crawlers'] #accept-btn.btn--knob {
    width: 150px;
    height: 150px;
  }

  [data-theme='easy-bake'] .panel .btn {
    width: 100%;
  }
}

@media (max-width: 380px) {
  .edit-inline,
  .edit-block,
  .edit-wrapper,
  .option-choice,
  .edit-controls {
    --edit-btn-h: 32px;
  }

  .edit-btn {
    width: var(--edit-btn-h);
    height: var(--edit-btn-h);
  }
}
