#christmas .christmasShell {
  --christmasInk: #f4efe5;
  --christmasCream: #1d2731;
  --christmasGold: #e8c878;
  --christmasGoldLight: #ffe8aa;
  color: var(--christmasInk);
  background: #151d26;
  border-color: rgba(232, 200, 120, 0.24);
  box-shadow: 0 20px 58px rgba(0, 0, 0, 0.42);
}
#christmas .christmasCalendar {
  background: linear-gradient(rgba(29, 39, 49, 0.96), rgba(24, 33, 42, 0.98)), radial-gradient(circle at 25% 20%, rgba(232, 200, 120, 0.2) 0 1px, transparent 1.5px);
  background-size: auto, 24px 24px;
}
#christmas .christmasNotification {
  box-shadow: 0 10px 26px rgba(0, 0, 0, 0.3);
}
#christmas .christmasNotificationAction,
#christmas button.christmasNotificationAction {
  color: #193c39;
  background: #f5e3b2;
}
#christmas .christmasNotificationAction:hover,
#christmas button.christmasNotificationAction:hover {
  color: #132f2c;
  background: var(--christmasGoldLight);
}
#christmas .christmasDoor {
  color: #f4efe5;
}
#christmas .christmasDoorFrame {
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.38);
}
#christmas .christmasDoorAvailable:hover .christmasDoorFrame,
#christmas .christmasDoorAvailable:focus-visible .christmasDoorFrame,
#christmas a.christmasDoorOpened:hover .christmasDoorFrame,
#christmas a.christmasDoorOpened:focus-visible .christmasDoorFrame {
  box-shadow: 0 14px 24px rgba(0, 0, 0, 0.46), 0 0 20px color-mix(in srgb, var(--doorAccent) 38%, transparent);
}
#christmas .christmasDoorOpened .christmasDoorFrame {
  box-shadow: 0 9px 18px rgba(0, 0, 0, 0.42), 0 0 0 2px color-mix(in srgb, var(--doorAccent) 34%, transparent);
}
#christmas .christmasChapter {
  color: #f4efe5;
  background: #202a34;
  border-color: rgba(232, 200, 120, 0.2);
  box-shadow: 0 16px 38px rgba(0, 0, 0, 0.36);
}
#christmas .christmasStoryBeat {
  border-bottom-color: rgba(255, 255, 255, 0.12);
}
#christmas .christmasChapterTeaser {
  color: #d9ceb9;
}
#christmas .christmasPanelButton {
  border: 1px solid rgba(232, 200, 120, 0.22);
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.4);
}
#christmas .christmasStoryNote {
  color: #f2ddb1;
  background-color: #3a3027;
  background-image: linear-gradient(90deg, rgba(190, 82, 69, 0.7) 0 15px, transparent 15px), radial-gradient(circle at 18% 28%, rgba(232, 200, 120, 0.16) 0 0.8px, transparent 1px), radial-gradient(circle at 76% 72%, rgba(255, 255, 255, 0.12) 0 0.8px, transparent 1.1px), linear-gradient(145deg, rgba(112, 83, 48, 0.3), rgba(18, 24, 31, 0.12));
  border-color: rgba(232, 200, 120, 0.58);
  box-shadow: inset 0 0 0 3px rgba(255, 239, 196, 0.06), 0 3px 10px rgba(0, 0, 0, 0.24);
}
#christmas .christmasStoryNote::before {
  background: #d8bd7e;
  border-color: #8e6028;
  box-shadow: 0 0 0 1px rgba(255, 232, 170, 0.42), inset 1px 1px 2px rgba(53, 31, 9, 0.5);
}
#christmas .christmasStoryNote::after {
  background: linear-gradient(225deg, #6b5840 0 47%, #bd9854 48% 51%, rgba(189, 152, 84, 0.2) 52% 70%, transparent 71%);
}
#christmas .christmasChapterNavigation {
  background: #1a232c;
  border-top-color: rgba(255, 255, 255, 0.12);
}
#christmas .christmasChapterOverview {
  color: #f1d994;
  background: #2a3742;
}
#christmas .christmasChapterDisabled {
  color: rgba(255, 255, 255, 0.52);
  background: #343c45;
  border-color: rgba(255, 255, 255, 0.16);
}
