:root {
  color-scheme: light;
  --bg: #f5f7f8;
  --panel: #ffffff;
  --panel-soft: #eef4f5;
  --line: #d7e0e5;
  --text: #17212b;
  --ink: #17212b;
  --muted: #62717d;
  --accent: #4cb9ad;
  --accent-strong: #087f8c;
  --accent-warm: #c28a28;
  --shadow: 0 16px 44px rgba(19, 35, 51, 0.1);
}

body.night-mode {
  color-scheme: dark;
  --bg: #071f25;
  --panel: #0d2e35;
  --panel-soft: #123b43;
  --line: #2f6971;
  --text: #e9fffb;
  --ink: #e9fffb;
  --muted: #9ac6c4;
  --accent: #5fe0c7;
  --accent-strong: #6bb7ff;
  --accent-warm: #ffdf7e;
  --shadow: 0 18px 50px rgba(0, 28, 34, 0.3);
}

body {
  background: var(--bg) !important;
  color: var(--text);
}

body::before,
body::after {
  display: none !important;
}

.sim-shell,
.prod-shell,
.shell,
.home-shell {
  width: min(1440px, 100%);
  margin: 0 auto;
  padding: 28px;
}

.sim-topbar,
.prod-topbar,
.topbar,
.home-topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-bottom: 18px;
  padding: 0;
}

.eyebrow {
  color: var(--accent-strong) !important;
}

.top-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 10px;
  flex-wrap: wrap;
}

.icon-btn,
.home-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  min-width: 42px;
  height: 42px;
  min-height: 42px;
  padding: 0;
  border-radius: 8px;
  font-size: 18px;
  font-family: Arial, "Microsoft YaHei", sans-serif;
  font-weight: 900;
  line-height: 1;
}

.ghost,
.secondary,
.primary,
.nav-link {
  border-color: var(--line) !important;
  color: var(--text) !important;
  background: var(--panel) !important;
}

.ghost:hover,
.secondary:hover,
.primary:hover,
.nav-link:hover {
  border-color: var(--accent-strong) !important;
  box-shadow: 0 8px 18px rgba(76, 185, 173, 0.18) !important;
}

.paper-panel,
.detail-panel,
.check-panel,
.search-band,
.guide-panel,
.paste-panel,
.items-panel,
.editor-panel,
.output-panel,
.modal-card {
  border-color: var(--line) !important;
  background: color-mix(in srgb, var(--panel) 92%, transparent) !important;
  box-shadow: var(--shadow) !important;
}

.status,
.muted,
.empty-state {
  color: var(--muted) !important;
}

input,
select,
textarea,
.rich-note,
.weapon-panel {
  border-color: var(--line) !important;
  color: var(--text) !important;
  background: var(--panel) !important;
}

body.night-mode input,
body.night-mode select,
body.night-mode textarea,
body.night-mode .rich-note,
body.night-mode .weapon-panel {
  background: #092932 !important;
}