html[data-theme="retroMuseum"] {
  --theme-bg: #f6f1e8;
  --theme-panel: #ffffff;
  --theme-surface: #fbf8f2;
  --theme-card: #ffffff;
  --theme-border: #d6cbb8;
  --theme-text: #2b231b;
  --theme-muted: #7b6b5b;
  --theme-accent: #8a5a2b;
  --theme-accent-dark: #6f4421;
  --theme-button-bg: #f1e7d8;
  --theme-button-text: #2b231b;
  --theme-input-bg: #ffffff;
  --theme-badge-bg: #e8ddcc;
  --theme-chip-bg: transparent;
  --theme-chip-active-bg: #8a5a2b;
  --theme-chip-active-text: #ffffff;
  --theme-placeholder-bg: #efe7da;
  --theme-modal-bg: #ffffff;
  --theme-info-bg: #fbf8f2;
  --theme-topbar-bg: #f9f4ec;
  --theme-shadow: 0 2px 8px rgba(40, 28, 16, 0.08);
  --theme-shadow-card: 0 2px 6px rgba(40, 28, 16, 0.08);
  --theme-radius: 14px;
  --theme-radius-card: 12px;
  --theme-radius-small: 8px;
  --theme-radius-pill: 999px;
  --theme-focus: 0 0 0 3px rgba(138, 90, 43, 0.35);
}

html[data-theme="retroMuseum"] body {
  font-family: "Georgia", "Times New Roman", serif;
}

html[data-theme="retroMuseum"] .topbar,
html[data-theme="retroMuseum"] .topbar .app-title,
html[data-theme="retroMuseum"] .topbar .app-version,
html[data-theme="retroMuseum"] .topbar .btn {
  color: #6f4c2f;
}

html[data-theme="retroMuseum"] .topbar .app-title {
  text-shadow: 0 2px 10px rgba(42, 25, 10, 0.28);
  letter-spacing: 0.02em;
}

html[data-theme="retroMuseum"] .btn,
html[data-theme="retroMuseum"] .btn.ghost,
html[data-theme="retroMuseum"] .chip,
html[data-theme="retroMuseum"] .search-bar .btn,
html[data-theme="retroMuseum"] .actions .btn,
html[data-theme="retroMuseum"] .letter-bar .chip {
  background: color-mix(in srgb, var(--theme-card) 92%, #f3eadb 8%);
  border-color: var(--theme-border);
  color: var(--theme-text);
  box-shadow: var(--theme-shadow-card);
}

html[data-theme="retroMuseum"] .btn:hover,
html[data-theme="retroMuseum"] .btn.ghost:hover,
html[data-theme="retroMuseum"] .chip:hover,
html[data-theme="retroMuseum"] .search-bar .btn:hover,
html[data-theme="retroMuseum"] .actions .btn:hover,
html[data-theme="retroMuseum"] .letter-bar .chip:hover {
  background: color-mix(in srgb, var(--theme-button-bg) 88%, #ffffff 12%);
  border-color: var(--theme-accent);
  color: var(--theme-accent-dark);
}

html[data-theme="retroMuseum"] .chip.active,
html[data-theme="retroMuseum"] .letter-bar .chip.active,
html[data-theme="retroMuseum"] .actions .btn.active {
  background: var(--theme-accent);
  border-color: var(--theme-accent-dark);
  color: #fff;
}

html[data-theme="retroMuseum"] .topbar .btn,
html[data-theme="retroMuseum"] .topbar .btn.ghost {
  background: rgba(249, 244, 236, 0.18);
  backdrop-filter: blur(2px);
  border-color: rgba(235, 221, 201, 0.85);
  color: #6f4c2f;
}

html[data-theme="retroMuseum"] .topbar .btn:hover,
html[data-theme="retroMuseum"] .topbar .btn.ghost:hover {
  background: rgba(249, 244, 236, 0.28);
  color: #5b3c22;
}

html[data-theme="retroMuseum"] .panel {
  background: transparent;
  border-color: transparent;
  box-shadow: none;
}

html[data-theme="retroMuseum"] .panel-header h1 {
  display: inline-flex;
  align-items: center;
  min-height: 56px;
  padding: 10px 22px;
  background: var(--theme-card);
  border: 1px solid var(--theme-border);
  border-radius: var(--theme-radius-pill);
  box-shadow: var(--theme-shadow-card);
}

html[data-theme="retroMuseum"] .panel-header .page-title {
  display: inline-flex;
  align-items: center;
  padding: 10px 18px;
  background: var(--theme-card);
  border: 1px solid var(--theme-border);
  border-radius: var(--theme-radius-pill);
  box-shadow: var(--theme-shadow-card);
}

html[data-theme="retroMuseum"] .panel-header .page-title img {
  display: block;
}

html[data-theme="retroMuseum"] .panel > h2,
html[data-theme="retroMuseum"] .edit-form > h2,
html[data-theme="retroMuseum"] .upload-section > h3,
html[data-theme="retroMuseum"] .settings-section > h2,
html[data-theme="retroMuseum"] .settings-section > h4,
html[data-theme="retroMuseum"] .field-label,
html[data-theme="retroMuseum"] .file-meta {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: fit-content;
  max-width: 100%;
  padding: 4px 10px;
  background: color-mix(in srgb, var(--theme-card) 94%, #f3eadb 6%);
  border: 1px solid var(--theme-border);
  border-radius: var(--theme-radius-pill);
  box-shadow: var(--theme-shadow-card);
  color: var(--theme-text);
}

html[data-theme="retroMuseum"] .panel > h2,
html[data-theme="retroMuseum"] .edit-form > h2,
html[data-theme="retroMuseum"] .settings-section > h2,
html[data-theme="retroMuseum"] .settings-section > h4 {
  margin-bottom: 8px;
}

html[data-theme="retroMuseum"] .upload-section > h3 {
  margin-bottom: 10px;
}

html[data-theme="retroMuseum"] .field-label {
  font-weight: 600;
  line-height: 1.2;
}

html[data-theme="retroMuseum"] .file-meta {
  font-size: 12px;
  color: var(--theme-muted);
}

html[data-theme="retroMuseum"] .image-card {
  align-content: start;
  justify-items: center;
  gap: 6px;
}

html[data-theme="retroMuseum"] .image-card > span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-top: -2px;
  padding: 6px 12px;
  background: color-mix(in srgb, var(--theme-card) 94%, #f3eadb 6%);
  border: 1px solid var(--theme-border);
  border-radius: var(--theme-radius-pill);
  box-shadow: var(--theme-shadow-card);
  color: var(--theme-text);
  font-weight: 600;
  line-height: 1.25;
}

html[data-theme="retroMuseum"] .image-actions {
  margin-top: 2px;
}

html[data-theme="retroMuseum"] .preview-form .toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 6px 12px;
  background: color-mix(in srgb, var(--theme-card) 94%, #f3eadb 6%);
  border: 1px solid var(--theme-border);
  border-radius: var(--theme-radius-pill);
  box-shadow: var(--theme-shadow-card);
  color: var(--theme-text);
  font-weight: 600;
  line-height: 1.2;
}

html[data-theme="retroMuseum"] .stats,
html[data-theme="retroMuseum"] .success,
html[data-theme="retroMuseum"] .error,
html[data-theme="retroMuseum"] .empty,
html[data-theme="retroMuseum"] .muted,
html[data-theme="retroMuseum"] .info-card,
html[data-theme="retroMuseum"] .panel > p,
html[data-theme="retroMuseum"] .settings-section > p {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  max-width: 100%;
  padding: 6px 12px;
  background: color-mix(in srgb, var(--theme-card) 94%, #f3eadb 6%);
  border: 1px solid var(--theme-border);
  border-radius: var(--theme-radius-pill);
  box-shadow: var(--theme-shadow-card);
  color: var(--theme-text);
}

html[data-theme="retroMuseum"] .info-callouts {
  gap: 12px;
}

html[data-theme="retroMuseum"] .info-card {
  display: flex;
  align-items: center;
  background: color-mix(in srgb, var(--theme-card) 94%, #f3eadb 6%);
}

html[data-theme="retroMuseum"] .empty {
  justify-content: center;
}

html[data-theme="retroMuseum"] .success {
  color: #225a2f;
}

html[data-theme="retroMuseum"] .error {
  color: #7b3321;
}

html[data-theme="retroMuseum"] .detail-field-value,
html[data-theme="retroMuseum"] .game-form-column input,
html[data-theme="retroMuseum"] .game-form-column select,
html[data-theme="retroMuseum"] .game-form-wide textarea,
html[data-theme="retroMuseum"] .game-form-meta input,
html[data-theme="retroMuseum"] .battery-date-row,
html[data-theme="retroMuseum"] .date-picker > input {
  background: color-mix(in srgb, var(--theme-card) 96%, #f8f1e5 4%);
  border-color: var(--theme-border);
  box-shadow: var(--theme-shadow-card);
}

html[data-theme="retroMuseum"] .battery-date-row {
  border: 1px solid var(--theme-border);
  border-radius: 8px;
  padding: 10px 12px;
}
