.theme-layout {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(280px, .7fr);
  gap: 1rem;
  align-items: start;
}

.theme-form {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .8rem;
}

.theme-form > label {
  display: grid;
  gap: .35rem;
  color: var(--muted);
  font-size: .75rem;
  font-weight: 700;
}

.theme-form input,
.theme-form select {
  width: 100%;
  min-height: 44px;
  border: 1px solid var(--line);
  border-radius: 10px;
  background: #fff;
  padding: .55rem;
  color: var(--ink);
}

.theme-form input[type="color"] { padding: .25rem; }
.theme-form .wide,
.theme-toggle { grid-column: 1 / -1; }
.theme-toggle label { display: inline-flex; align-items: center; gap: .55rem; font-weight: 800; }
.theme-toggle input { width: 1.15rem; height: 1.15rem; min-height: 0; accent-color: var(--green); }
.theme-actions { display: flex; gap: .55rem; flex-wrap: wrap; }
.theme-actions #saveThemeButton { margin-left: auto; }

.theme-preview {
  --theme-primary: #9f1734;
  --theme-secondary: #0f5132;
  --theme-accent: #d7b45a;
  --theme-background: #f7f2e8;
  --theme-surface: #fffdf8;
  --theme-text: #172217;
  --theme-muted: #667064;
  --theme-hero: #082e23;
  position: sticky;
  top: 1rem;
  overflow: hidden;
  min-height: 470px;
  border: 1px solid var(--theme-accent);
  border-radius: 28px;
  padding: 2rem 1.25rem;
  background: linear-gradient(160deg, var(--theme-hero) 0 38%, var(--theme-background) 38%);
  color: #fff;
  box-shadow: var(--shadow);
}

.theme-preview.disabled { filter: saturate(.35); }
.theme-preview-decor { text-align: center; color: var(--theme-accent); min-height: 28px; letter-spacing: .2em; }
.theme-preview-eyebrow { margin: 1rem 0 .35rem; color: var(--theme-accent); font-size: .68rem; font-weight: 800; letter-spacing: .17em; }
.theme-preview h3 { font-family: Georgia, serif; font-size: 1.75rem; max-width: 12ch; }
.theme-preview > p:not(.theme-preview-eyebrow) { color: #e9eee9; font-size: .8rem; }
.theme-preview-card { display: grid; gap: .55rem; margin-top: 4.2rem; border: 1px solid var(--theme-accent); border-radius: 18px; padding: 1rem; background: var(--theme-surface); color: var(--theme-text); }
.theme-preview-card span { color: var(--theme-muted); font-size: .75rem; }
.theme-preview-card button { margin-top: .45rem; background: var(--theme-primary); pointer-events: none; }

@media (max-width: 900px) {
  .theme-layout { grid-template-columns: 1fr; }
  .theme-preview { position: relative; top: auto; }
}

@media (max-width: 520px) {
  .theme-form { grid-template-columns: 1fr; }
  .theme-form .wide,
  .theme-toggle { grid-column: auto; }
  .theme-actions { display: grid; }
  .theme-actions #saveThemeButton { margin-left: 0; }
  .admin-nav { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
