[data-palette="peach"] {
  --bg: #fff5e9;
  --surface: #fffaf3;
  --raised: #f9e1d3;
  --ink: #482b24;
  --muted: #725046;
  --accent: #a34334;
  --accent-ink: #fff8ee;
  --line: #d3a28f;
  --detail: #8a372b;
}
body {
  background: url("apricot-background.svg") center top / min(100%, 1100px) auto no-repeat var(--bg);
}
.nav, .sticky-bar { background: var(--bg); }
.featured { border: 1px solid var(--line); }
.feature-label { background: var(--surface); color: var(--detail); }
.list-arrow, .closing { background: var(--raised); }
.list-arrow svg, .brand svg { stroke: var(--detail); }
.section-head > button, .age-brand span { color: var(--detail); }
:focus-visible, input:focus-visible { outline-color: var(--detail); }
.overlay, dialog::backdrop { background: #482b24a8; }
.age {
  background-image: linear-gradient(#482b2430, #482b2480), var(--age-img);
}

.list-channel-icons {
  gap: 6px;
  color: var(--detail);
}
.list-channel-icons svg {
  box-sizing: content-box;
  width: 20px;
  height: 20px;
  padding: 8px;
  border-radius: 50%;
  stroke-width: 2;
  background: #f6d4c7;
}
.list-channel-icons svg:last-child {
  background: #f6e0ba;
  color: #75451e;
}
@media (max-width: 350px) {
  .list-channel-icons { gap: 4px; }
  .list-channel-icons svg { padding: 5px; }
}
