.theme-heading { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-bottom: 24px; }
.theme-heading h2 { margin: 0; }
.theme-scroll-controls { display: flex; gap: 8px; flex: none; }
.theme-scroll-controls button { width: 36px; height: 36px; padding: 0; border: 1px solid var(--line); color: var(--text); background: var(--page); }
.theme-scroll-controls button:hover:not(:disabled) { background: var(--panel); }
.theme-scroll-controls button:disabled { color: var(--muted); opacity: .35; cursor: default; }
.theme-palette { display: grid; grid-auto-flow: column; grid-template-rows: repeat(2, auto); grid-auto-columns: max(104px, calc((100% - 56px) / 8)); gap: 8px; overflow-x: auto; overscroll-behavior-x: contain; scrollbar-width: thin; scrollbar-color: var(--line) transparent; padding: 3px 3px 12px; margin: -3px -3px 24px; }
.theme-choice { display: flex; flex-direction: column; min-width: 0; padding: 0; text-align: left; }
.theme-sample { display: flex; align-items: center; gap: 4px; width: 100%; height: 36px; padding: 8px; background: var(--demo-bg); border-bottom: 1px solid var(--demo-border); color: var(--demo-text); }
.theme-sample-text { margin-right: auto; font: 400 16px/1 var(--mono); }
.theme-sample i { width: 8px; height: 18px; background: var(--demo-accent); }
.theme-sample i:nth-of-type(2) { background: var(--demo-success); }
.theme-sample i:nth-of-type(3) { background: var(--demo-yellow); }
.theme-sample i:nth-of-type(4) { background: var(--demo-error); }
.theme-choice-name { display: flex; align-items: center; justify-content: space-between; width: 100%; min-height: 40px; padding: 4px 8px; gap: 4px; font-size: 11px; line-height: 1.35; }
.theme-choice-name svg { width: 10px; height: 10px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.5; visibility: hidden; }
.theme-choice[aria-checked='true'] .theme-choice-name svg { visibility: visible; }
@media (max-width: 600px) {
  .theme-heading { gap: 12px; align-items: start; }
}