/* Replace the green/teal dark-mode surfaces with warm walnut browns. */
.app-shell:not(.shelf-visual-light):is([data-theme="dark"], [data-theme="midnightLibrary"]) {
  --panel: #1b100a;
  --panel-soft: #29170d;
  --surface: #1b100a;
  --surface-2: #29170d;
  --accent: #9b5b30;
  --teal: #b8783e;
  --teal-soft: #3a2112;
  --green: #a66a38;
  --green-soft: #352014;
  --dark-box-bg: radial-gradient(circle at 14% 0%, rgba(224, 166, 91, .11), transparent 30%), linear-gradient(145deg, rgba(43, 24, 14, .97) 0%, rgba(29, 15, 9, .98) 58%, rgba(15, 8, 5, .99) 100%);
  --dark-box-bg-soft: linear-gradient(145deg, rgba(52, 29, 17, .94), rgba(30, 16, 10, .97));
}

.app-shell.home-app-mode:not(.shelf-visual-light):is([data-theme="dark"], [data-theme="midnightLibrary"]) {
  --home-panel: rgba(42, 23, 13, .96);
  --home-panel-soft: rgba(25, 13, 8, .96);
  --home-accent: #a96536;
  --home-button-text: #211006;
}

.app-shell.home-app-mode:not(.shelf-visual-light):is([data-theme="dark"], [data-theme="midnightLibrary"]) :is(.home-app-main, .home-app-scroll) {
  background: radial-gradient(circle at 76% 0%, rgba(217, 150, 78, .12), transparent 34%), radial-gradient(circle at 15% 14%, rgba(116, 62, 28, .18), transparent 30%), linear-gradient(180deg, #1a0c06, #0d0603 58%, #050201) !important;
}

.app-shell.home-app-mode:not(.shelf-visual-light):is([data-theme="dark"], [data-theme="midnightLibrary"]) .series-tracker-home-panel {
  --series-card-a: #2c190f;
  --series-card-b: #1b0e08;
  --series-card-c: #0f0805;
}

.app-shell.home-app-mode:not(.shelf-visual-light):is([data-theme="dark"], [data-theme="midnightLibrary"]) .online-recommendations-panel {
  --read-next-panel: radial-gradient(circle at 82% 18%, rgba(194, 132, 40, .08), transparent 32%), linear-gradient(145deg, #25140c 0%, #130a06 100%);
  --read-next-card: linear-gradient(110deg, rgba(45, 25, 14, .97), rgba(25, 13, 8, .98));
}

.app-shell.home-app-mode:not(.shelf-visual-light):is([data-theme="dark"], [data-theme="midnightLibrary"]) .home-community-card {
  background: radial-gradient(circle at 50% 12%, rgba(220, 166, 83, .1), transparent 30%), linear-gradient(180deg, #24140c, #140a06) !important;
}
