body[data-theme="sipwoonggi"] {
  --bg: #080c0a;
  --panel: #0d1714;
  --panel-soft: #07100d;
  --line: #246c7a;
  --text: #e3fff9;
  --muted: #7fb8c4;
  --accent: #7ed7ff;
  --accent-strong: #b8f0ff;
  --button: #11242a;
  --cyan: #7ed7ff;
  --red: #ff7777;
  --green: #8fe28f;
  --fishing: #ffd86b;
  --fishing-strong: #fff2b8;
  --theme-top: #10242d;
  --theme-bar: #0c1411;
  --theme-terminal: #010607;
  --theme-input: #020403;
  --theme-form: #0b1411;
  --theme-scanline: rgba(255, 255, 255, 0.022);
  --theme-scanline-dark: rgba(0, 0, 0, 0.045);
}

body[data-theme="campfire"] {
  --bg: #100906;
  --panel: #17100b;
  --panel-soft: #120a06;
  --line: #7b4d22;
  --text: #fff2d1;
  --muted: #c9a06e;
  --accent: #ffb14a;
  --accent-strong: #ffe39a;
  --button: #24170c;
  --cyan: #ffc46b;
  --red: #ff7b66;
  --green: #b7d879;
  --fishing: #ffd86b;
  --fishing-strong: #fff2b8;
  --theme-top: #2a180c;
  --theme-bar: #160d08;
  --theme-terminal: #070301;
  --theme-input: #080401;
  --theme-form: #130b07;
  --theme-scanline: rgba(255, 220, 160, 0.028);
  --theme-scanline-dark: rgba(0, 0, 0, 0.052);
}

body[data-theme="hitel"] {
  --bg: #000817;
  --panel: #06132c;
  --panel-soft: #020b1d;
  --line: #2a65c8;
  --text: #dbe9ff;
  --muted: #8eb1e8;
  --accent: #4ea1ff;
  --accent-strong: #b9d9ff;
  --button: #071b3f;
  --cyan: #63c8ff;
  --red: #ff7777;
  --green: #8fe28f;
  --fishing: #ffe071;
  --fishing-strong: #fff5bf;
  --theme-top: #08205a;
  --theme-bar: #061125;
  --theme-terminal: #000611;
  --theme-input: #000611;
  --theme-form: #050e21;
  --theme-scanline: rgba(120, 180, 255, 0.03);
  --theme-scanline-dark: rgba(0, 0, 0, 0.055);
}

body[data-theme="chollian"] {
  --bg: #030b22;
  --panel: #081530;
  --panel-soft: #030d22;
  --line: #3f55a6;
  --text: #e8ebff;
  --muted: #9ea9d6;
  --accent: #8b9cff;
  --accent-strong: #d8dcff;
  --button: #101947;
  --cyan: #8fbfff;
  --red: #ff8585;
  --green: #9bdc9b;
  --fishing: #f1d36f;
  --fishing-strong: #fff2b4;
  --theme-top: #121a56;
  --theme-bar: #070d25;
  --theme-terminal: #020717;
  --theme-input: #020717;
  --theme-form: #070d25;
  --theme-scanline: rgba(160, 170, 255, 0.028);
  --theme-scanline-dark: rgba(0, 0, 0, 0.052);
}

body[data-theme="green"] {
  --bg: #020b05;
  --panel: #07150b;
  --panel-soft: #021008;
  --line: #2a7f44;
  --text: #dcffe4;
  --muted: #83c896;
  --accent: #58ff85;
  --accent-strong: #bdffca;
  --button: #0a2111;
  --cyan: #86ffd5;
  --red: #ff7777;
  --green: #58ff85;
  --fishing: #d6ff7a;
  --fishing-strong: #efffbd;
  --theme-top: #0b2f14;
  --theme-bar: #061108;
  --theme-terminal: #000703;
  --theme-input: #000703;
  --theme-form: #061108;
  --theme-scanline: rgba(120, 255, 150, 0.026);
  --theme-scanline-dark: rgba(0, 0, 0, 0.055);
}

body {
  background:
    linear-gradient(var(--theme-scanline) 50%, var(--theme-scanline-dark) 50%),
    radial-gradient(circle at 50% 0%, var(--theme-top) 0, var(--bg) 58%) !important;
  background-size: 100% 4px, auto !important;
}

.topbar,
.map-topbar,
.panel-head,
.room-toolbar {
  background: var(--theme-bar) !important;
  box-shadow: inset 0 -1px 0 color-mix(in srgb, var(--line) 65%, transparent) !important;
}

#terminal,
.graph-stage,
.compass-cell {
  background:
    linear-gradient(var(--theme-scanline) 50%, var(--theme-scanline-dark) 50%),
    var(--theme-terminal) !important;
  background-size: 100% 4px, auto !important;
}

#command,
.room-toolbar input {
  background: var(--theme-input) !important;
}

#command-form {
  background: var(--theme-form) !important;
}

.font-family-select,
.theme-select {
  min-height: 36px;
  border: 1px solid var(--line);
  border-radius: 2px;
  background: var(--button);
  color: var(--text);
  padding: 0 28px 0 10px;
  font: inherit;
  outline: none;
}

.theme-select:focus {
  border-color: var(--accent);
  color: var(--accent-strong);
}