@charset "UTF-8";

/* Personal holiday layer. No selector applies without the root opt-in. */
html[data-pmc-christmas] {
  color-scheme: dark;
  --bg: #141416;
  --surface: #1d1c1f;
  --soft: #29262a;
  --ink: #eee8df;
  --heading: #fffaf2;
  --label: #c5bbb5;
  --muted: #b6ada8;
  --line: #433a3e;
  --accent: #ff9eaa;
  --accent-fill: #b32943;
  --on-accent: #fff9f0;
  --accent-soft: #3c252e;
  --person: #e8c5aa;
  --section: #e1c99e;
  --connector: #746269;
  --backdrop: rgb(16 9 12 / 84%);
  --shadow: 0 4px 18px rgb(0 0 0 / 18%);
  --modal-shadow: 0 24px 80px rgb(0 0 0 / 42%);
  --christmas-panel: #a51f36;
  --christmas-panel-deep: #7f122c;
  --christmas-panel-light: #bd2a40;
  --christmas-sky: #270d17;
  --christmas-snow: #fff6e9;
  --christmas-gold: #e0c79d;
  --christmas-gold-ink: #e0c79d;
  --christmas-gold-soft: #ad8d62;
  --christmas-gold-pale: #f2e2c7;
  --christmas-wire: #927655;
  --christmas-snow-dust: rgb(255 246 233 / 15%);
  --christmas-brand-line: rgb(242 226 199 / 30%);
  --christmas-band: calc(48px / var(--zoom, 1));
  --gradient: linear-gradient(135deg, var(--soft), var(--surface));
}

html[data-pmc-christmas][data-theme="light"] {
  color-scheme: light;
  --bg: #f7f3ed;
  --surface: #fffdf8;
  --soft: #eee7df;
  --ink: #352c2e;
  --heading: #21181b;
  --label: #6f5c5f;
  --muted: #6a5b5e;
  --line: #d9ccc7;
  --accent: #a01130;
  --accent-fill: #a01130;
  --on-accent: #fff9f0;
  --accent-soft: #f4e3e6;
  --person: #825029;
  --section: #805b31;
  --connector: #b5a09f;
  --backdrop: rgb(47 18 27 / 42%);
  --shadow: 0 4px 18px rgb(58 28 35 / 7%);
  --modal-shadow: 0 24px 80px rgb(58 28 35 / 22%);
  --christmas-gold-ink: #805b31;
}

html[data-pmc-christmas] body {
  padding-top: 0;
  background: var(--bg);
}

html[data-pmc-christmas] .topbar {
  position: sticky;
  top: var(--christmas-band);
  background: var(--surface);
  border-bottom-color: var(--line);
  box-shadow: inset 0 -1px color-mix(in srgb, var(--accent) 30%, var(--clear));
}

html[data-pmc-christmas] .app-sidebar {
  background: var(--surface);
}

html[data-pmc-christmas] .app-sidebar .sidebar-heading {
  color: var(--christmas-gold-ink);
}

html[data-pmc-christmas] .app-sidebar .view-tabs button.selected {
  color: var(--heading);
  border-color: var(--line);
  background: var(--accent-soft);
  box-shadow: inset 3px 0 var(--accent-fill);
}

html[data-pmc-christmas] .app-sidebar .view-tabs button.selected::before,
html[data-pmc-christmas] .app-sidebar .view-tabs button.selected::after {
  background-color: var(--accent);
}

html[data-pmc-christmas] :is(.calendar-section-head h3, .mold-list-heading h3, .qm-title-row h2) {
  color: var(--section);
}

/* Original red / amber / green status tokens remain untouched. */
html[data-pmc-christmas] :is(input, select, textarea) {
  accent-color: var(--accent-fill);
  caret-color: var(--ink);
}

html[data-pmc-christmas] :is(button, a, input, select, textarea, summary):focus-visible {
  outline: 3px solid var(--christmas-gold-ink);
  outline-offset: 3px;
}

html[data-pmc-christmas] .chat-view {
  height: calc(100dvh / var(--zoom, 1) - var(--header-h, 90px) - var(--christmas-band));
}

html[data-pmc-christmas] body.immersive .chat-view {
  height: calc(100dvh / var(--zoom, 1) - var(--christmas-band));
}

html[data-pmc-christmas] #fullscreenExit {
  top: calc(var(--christmas-band) + 12px);
}

/* A substantial red editorial moment, followed by the unchanged work tools. */
html[data-pmc-christmas] body[data-view="home"] .chat-scroll {
  padding-top: 12px;
}

html[data-pmc-christmas] body[data-view="home"] .chat-intro {
  max-width: 960px;
  margin: 10px auto 0;
  padding-inline: 12px;
}

html[data-pmc-christmas] .pmc-christmas-home {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr);
  align-items: center;
  min-height: 260px;
  margin: 0 0 22px;
  overflow: hidden;
  isolation: isolate;
  border: 1px solid var(--christmas-brand-line);
  border-radius: 4px;
  background-color: var(--christmas-panel);
  background-image: linear-gradient(110deg, var(--christmas-panel-deep), var(--christmas-panel) 54%, var(--christmas-panel-light));
  color: var(--christmas-snow);
  text-align: left;
}

html[data-pmc-christmas] .pmc-christmas-home::after {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 12px;
  border: 1px solid var(--christmas-brand-line);
  pointer-events: none;
}

html[data-pmc-christmas] .pmc-christmas-home-copy {
  position: relative;
  z-index: 1;
  padding: 34px 0 34px 38px;
  min-width: 0;
}

html[data-pmc-christmas] .pmc-christmas-home-copy > span {
  display: block;
  margin-bottom: 15px;
  color: var(--christmas-gold-pale);
  font-size: 10px;
  font-weight: 500;
  letter-spacing: .22em;
}

html[data-pmc-christmas] .pmc-christmas-home-copy h3 {
  margin: 0;
  color: var(--christmas-snow);
  font-size: clamp(30px, calc(3.1vw / var(--zoom, 1)), 43px);
  font-weight: 500;
  line-height: 1.25;
  letter-spacing: -.045em;
  text-wrap: balance;
}

html[data-pmc-christmas] .chat-intro .pmc-christmas-home-copy p {
  max-width: 320px;
  margin: 16px 0 0;
  color: var(--christmas-snow);
  font-size: 14px;
  line-height: 1.8;
  text-wrap: balance;
}

html[data-pmc-christmas] .pmc-christmas-home-art {
  position: relative;
  z-index: 0;
  display: block;
  width: 116%;
  max-width: none;
  height: 280px;
  margin: -10px 0 -10px -12%;
  object-fit: contain;
  pointer-events: none;
  user-select: none;
}

html[data-pmc-christmas] body[data-view="home"] .chat-intro > h2 {
  margin-bottom: 8px;
  font-size: 22px;
  line-height: 1.4;
}

html[data-pmc-christmas] body[data-view="home"] .chat-intro > p {
  margin-bottom: 16px;
  font-size: 14px;
  line-height: 1.7;
}

/* Sky is reserved space, never an overlay on header hit targets. */
html[data-pmc-christmas] .pmc-christmas-sky {
  height: var(--christmas-band);
  overflow: hidden;
  isolation: isolate;
  pointer-events: none;
  user-select: none;
  background-color: var(--christmas-sky);
  border-bottom: 1px solid var(--christmas-brand-line);
}

html[data-pmc-christmas] body > .pmc-christmas-sky {
  position: sticky;
  z-index: 25;
  top: 0;
  width: 100%;
}

html[data-pmc-christmas] .pmc-christmas-sky::before {
  content: "";
  position: absolute;
  inset: 0;
  background-image:
    radial-gradient(circle, var(--christmas-snow-dust) 1px, var(--clear) 1.5px),
    radial-gradient(circle, var(--christmas-snow-dust) 1px, var(--clear) 1.5px);
  background-size: 137px 73px, 193px 101px;
  background-position: 13px 5px, 44px 19px;
}

html[data-pmc-christmas] .pmc-christmas-flight {
  position: absolute;
  z-index: 1;
  top: 1px;
  left: 0;
  display: block;
  width: clamp(250px, calc(27vw / var(--zoom, 1)), 360px);
  max-width: none;
  height: calc(40px / var(--zoom, 1));
  object-fit: contain;
  object-position: left center;
  animation: pmc-christmas-crossing 30s linear -10s infinite;
}

@keyframes pmc-christmas-crossing {
  from { transform: translate3d(calc(-100% - 24px), 1px, 0); }
  to { transform: translate3d(calc(100vw / var(--zoom, 1) + 24px), -1px, 0); }
}

html[data-pmc-christmas] .pmc-christmas-lights {
  position: absolute;
  inset: auto 0 0;
  display: flex;
  align-items: flex-start;
  justify-content: space-around;
  height: 12px;
}

html[data-pmc-christmas] .pmc-christmas-lights::before {
  content: "";
  position: absolute;
  inset: -4px -2% auto;
  height: 9px;
  border-bottom: 1px solid var(--christmas-wire);
  border-radius: 0 0 50% 50%;
}

html[data-pmc-christmas] .pmc-christmas-lights i {
  position: relative;
  display: block;
  width: 4px;
  height: 5px;
  margin-top: 2px;
  border-radius: 2px 2px 3px 3px;
  background: var(--christmas-gold);
}

html[data-pmc-christmas] .pmc-christmas-lights i:nth-child(3n + 2) {
  background: var(--christmas-gold-soft);
}

html[data-pmc-christmas] .pmc-christmas-lights i:nth-child(3n) {
  background: var(--christmas-gold-pale);
}

html[data-pmc-christmas] .pmc-christmas-lights i:nth-child(2n) {
  margin-top: 5px;
}

/* Red brand panel and dimensional glass ornament artwork, separate from inputs. */
html[data-pmc-christmas] #siteLogin.is-welcome {
  padding: calc(48px / var(--zoom, 1) + 24px) 28px 22px;
  border-color: var(--line);
  border-radius: 4px;
  background: var(--surface);
  box-shadow: var(--modal-shadow);
}

html[data-pmc-christmas] #siteLogin.is-welcome::backdrop {
  background: var(--bg);
}

html[data-pmc-christmas] #siteLogin > .pmc-christmas-sky {
  position: absolute;
  inset: 0 0 auto;
  z-index: 1;
  height: calc(48px / var(--zoom, 1));
  border-radius: 3px 3px 0 0;
}

html[data-pmc-christmas] #siteLogin.is-welcome .pmc-session-brand {
  position: relative;
  display: grid;
  align-content: start;
  justify-items: center;
  min-width: 0;
  min-height: 430px;
  gap: 12px;
  padding: 34px 26px 230px;
  overflow: hidden;
  isolation: isolate;
  text-align: center;
  border: 1px solid var(--christmas-brand-line);
  border-radius: 2px;
  background-color: var(--christmas-panel);
  background-image: url("../assets/christmas/winter-village.svg"), linear-gradient(135deg, var(--christmas-panel-light), var(--christmas-panel-deep));
  background-repeat: no-repeat;
  background-position: center bottom, center;
  background-size: auto 260px, cover;
  animation: none;
}

/* Canonical black MLB becomes white; screen removes any inverted backing. */
html[data-pmc-christmas] #siteLogin.is-welcome .pmc-session-brand-logo {
  width: min(140px, 60%);
  max-height: 56px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: var(--clear);
  filter: invert(1);
  mix-blend-mode: screen;
}

html[data-pmc-christmas] #siteLogin.is-welcome .pmc-session-brand-name {
  font-size: 11px;
  line-height: 1.3;
  letter-spacing: .32em;
  color: var(--christmas-gold-pale);
}

html[data-pmc-christmas] #siteLogin.is-welcome .pmc-christmas-greeting {
  display: grid;
  gap: 12px;
  max-width: 100%;
  margin-top: 14px;
  color: var(--christmas-snow);
  font-size: clamp(22px, calc(2vw / var(--zoom, 1)), 30px);
  font-weight: 500;
  line-height: 1.55;
  letter-spacing: .14em;
  text-wrap: balance;
}

html[data-pmc-christmas] #siteLogin.is-welcome .pmc-christmas-greeting strong {
  font-weight: 500;
}

html[data-pmc-christmas] #siteLogin.is-welcome .pmc-christmas-greeting small {
  color: var(--christmas-snow);
  font-size: 13px;
  font-weight: 500;
  line-height: 1.8;
  letter-spacing: 0;
  text-wrap: balance;
}

html[data-pmc-christmas] #siteLogin.is-welcome .pmc-session-panel {
  gap: 22px;
  padding-block: 12px;
}

html[data-pmc-christmas] #siteLogin.is-welcome .pmc-session-panel > * {
  animation: none;
}

html[data-pmc-christmas] #siteLogin.is-welcome .pmc-session-eyebrow {
  color: var(--christmas-gold-ink);
  font-size: 10px;
  letter-spacing: .12em;
}

html[data-pmc-christmas] #siteLogin.is-welcome h2 {
  margin-top: 12px;
  font-size: 27px;
  line-height: 1.45;
}

html[data-pmc-christmas] #siteLogin.is-welcome .pmc-session-note {
  font-size: 15px;
  line-height: 1.8;
}

html[data-pmc-christmas] #siteLogin.is-welcome .pmc-session-field {
  color: var(--label);
}

html[data-pmc-christmas] #siteLogin.is-welcome .pmc-session-field input {
  background: var(--bg);
  border-color: var(--connector);
  border-radius: 3px;
  color: var(--ink);
}

html[data-pmc-christmas] #siteLogin.is-welcome .pmc-session-field input::placeholder {
  color: var(--muted);
  opacity: 1;
}

html[data-pmc-christmas] #siteLogin.is-welcome .pmc-session-dialog-head .pmc-session-close {
  top: calc(48px / var(--zoom, 1) + 6px);
}

html[data-pmc-christmas] #siteLogin.is-welcome :is(.pmc-session-submit, .pmc-session-language-option) {
  border-radius: 3px;
}

/* Buttons stay above the page and move into normal dialog flow when modal. */
html[data-pmc-christmas] .pmc-christmas-controls {
  position: fixed;
  z-index: 80;
  top: calc(4px / var(--zoom, 1));
  right: calc(10px / var(--zoom, 1));
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 4px 7px;
  max-width: calc(100vw / var(--zoom, 1) - 20px);
  padding: 3px 5px 3px 9px;
  border: 1px solid var(--christmas-brand-line);
  border-radius: 3px;
  background: var(--christmas-sky);
  color: var(--christmas-snow);
  font: 500 11px/1.4 var(--sans);
  pointer-events: auto;
}

html[data-pmc-christmas] .pmc-christmas-controls > :not(button) {
  min-width: 0;
  overflow-wrap: anywhere;
}

html[data-pmc-christmas] .pmc-christmas-controls button {
  flex: 0 0 auto;
  min-height: 30px;
  padding: 5px 9px;
  border: 1px solid var(--christmas-brand-line);
  border-radius: 2px;
  color: var(--christmas-snow);
  background: var(--christmas-sky);
  font: inherit;
  font-weight: 800;
  white-space: normal;
}

html[data-pmc-christmas] .pmc-christmas-controls button:hover,
html[data-pmc-christmas] .pmc-christmas-controls button[aria-pressed="true"] {
  border-color: var(--christmas-gold);
  background: var(--christmas-gold);
  color: var(--christmas-panel-deep);
}

html[data-pmc-christmas] .pmc-christmas-controls button:focus-visible {
  outline-color: var(--christmas-gold);
}

html[data-pmc-christmas] #siteLogin > .pmc-christmas-controls {
  position: relative;
  z-index: 3;
  inset: auto;
  width: fit-content;
  max-width: 100%;
  margin: 16px 0 0 auto;
}

html[data-pmc-christmas][data-pmc-christmas-paused="true"] .pmc-christmas-flight,
html[data-pmc-christmas][data-pmc-christmas-hidden="true"] .pmc-christmas-flight {
  animation: none !important;
  transform: none !important;
  left: 4%;
}

@media (min-width: 761px) {
  html[data-pmc-christmas] body:not(.immersive) .app-sidebar {
    top: calc(var(--header-h, 90px) + var(--christmas-band));
    height: calc(100dvh / var(--zoom, 1) - var(--header-h, 90px) - var(--christmas-band));
    min-height: calc(100dvh / var(--zoom, 1) - var(--header-h, 90px) - var(--christmas-band));
  }
}

@media (min-width: 1100px) {
  html[data-pmc-christmas] #siteLogin.is-welcome {
    width: min(1120px, calc(100vw / var(--zoom, 1) - 48px));
  }

  html[data-pmc-christmas] #siteLogin.is-welcome .pmc-session-brand {
    align-self: stretch;
    min-height: 480px;
    padding: 38px 26px 240px;
    background-size: auto 285px, cover;
    border-right: 1px solid var(--christmas-brand-line);
  }

  html[data-pmc-christmas] #siteLogin.is-welcome :is(.pmc-session-welcome-form, .pmc-session-language) {
    grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr);
    gap: clamp(32px, calc(3vw / var(--zoom, 1)), 52px);
  }

  html[data-pmc-christmas] #siteLogin.is-welcome .pmc-session-panel {
    padding-inline-end: 12px;
  }
}

@media (max-width: 1099px) {
  html[data-pmc-christmas] #siteLogin.is-welcome .pmc-session-brand {
    width: min(480px, 100%);
    min-height: 350px;
    padding-top: 24px;
    padding-bottom: 185px;
    background-size: auto 215px, cover;
  }
}

@media (max-width: 760px) {
  html[data-pmc-christmas] {
    --christmas-band: calc(80px / var(--zoom, 1));
  }

  html[data-pmc-christmas] body[data-view="home"] .chat-intro {
    margin-top: 0;
    padding-inline: 0;
  }

  html[data-pmc-christmas] .pmc-christmas-home {
    grid-template-columns: minmax(0, 1fr) minmax(0, .85fr);
    min-height: 200px;
    margin-bottom: 18px;
  }

  html[data-pmc-christmas] .pmc-christmas-home::after {
    inset: 7px;
  }

  html[data-pmc-christmas] .pmc-christmas-home-copy {
    padding: 24px 0 24px 18px;
  }

  html[data-pmc-christmas] .pmc-christmas-home-copy > span {
    margin-bottom: 12px;
    font-size: 8px;
    letter-spacing: .13em;
  }

  html[data-pmc-christmas] .pmc-christmas-home-copy h3 {
    font-size: 27px;
  }

  html[data-pmc-christmas] .chat-intro .pmc-christmas-home-copy p {
    margin-top: 12px;
    font-size: 11px;
    line-height: 1.75;
  }

  html[data-pmc-christmas] .pmc-christmas-home-art {
    width: 140%;
    height: 200px;
    margin: 0 0 0 -30%;
  }

  html[data-pmc-christmas] body[data-view="home"] .chat-intro > h2 {
    font-size: 20px;
  }

  html[data-pmc-christmas] .pmc-christmas-flight {
    width: 235px;
    height: calc(37px / var(--zoom, 1));
  }

  html[data-pmc-christmas] .pmc-christmas-controls {
    top: calc(42px / var(--zoom, 1));
    right: calc(6px / var(--zoom, 1));
    max-width: calc(100vw / var(--zoom, 1) - 12px);
    font-size: 10px;
    gap: 3px 6px;
    padding: 2px 4px 2px 7px;
  }

  html[data-pmc-christmas] .pmc-christmas-controls button {
    min-height: 28px;
    padding: 4px 7px;
  }

  html[data-pmc-christmas] .pmc-christmas-lights {
    bottom: 37px;
  }

  html[data-pmc-christmas] #siteLogin > .pmc-christmas-sky .pmc-christmas-lights {
    bottom: 0;
  }

  html[data-pmc-christmas] #siteLogin.is-welcome {
    padding: calc(48px / var(--zoom, 1) + 12px) 14px 14px;
  }

  html[data-pmc-christmas] #siteLogin.is-welcome :is(.pmc-session-welcome-form, .pmc-session-language) {
    gap: 16px;
  }

  html[data-pmc-christmas] #siteLogin.is-welcome .pmc-session-brand {
    min-height: 220px;
    padding: 18px 155px 18px 18px;
    gap: 6px;
    justify-items: start;
    align-content: center;
    text-align: left;
    background-position: right -65px bottom -6px, center;
    background-size: auto 180px, cover;
  }

  html[data-pmc-christmas] #siteLogin.is-welcome .pmc-session-brand-logo {
    width: 90px;
    max-width: 100%;
    max-height: 34px;
  }

  html[data-pmc-christmas] #siteLogin.is-welcome .pmc-session-brand-name {
    font-size: 9px;
  }

  html[data-pmc-christmas] #siteLogin.is-welcome .pmc-christmas-greeting {
    margin-top: 8px;
    gap: 8px;
    font-size: 17px;
    line-height: 1.5;
    letter-spacing: .06em;
  }

  html[data-pmc-christmas] #siteLogin.is-welcome .pmc-christmas-greeting small {
    font-size: 11px;
    line-height: 1.65;
  }

  html[data-pmc-christmas] #siteLogin.is-welcome .pmc-session-panel {
    gap: 14px;
    padding-block: 0;
  }

  html[data-pmc-christmas] #siteLogin.is-welcome h2 {
    margin-top: 8px;
    font-size: 22px;
  }

  html[data-pmc-christmas] #siteLogin.is-welcome .pmc-session-note {
    font-size: 14px;
  }

  html[data-pmc-christmas] #siteLogin > .pmc-christmas-controls {
    margin-top: 14px;
    font-size: 10px;
  }

  html[data-pmc-christmas] .chat-view {
    height: calc(100dvh / var(--zoom, 1) - var(--header-h, 110px) - var(--sidebar-h, 0px) - var(--christmas-band));
  }

  html[data-pmc-christmas] .display-options-panel,
  html[data-pmc-christmas] .notification-panel {
    top: calc(var(--header-h, 110px) + var(--christmas-band) + 6px);
    max-height: calc(100dvh / var(--zoom, 1) - var(--header-h, 110px) - var(--christmas-band) - 24px);
  }

  html[data-pmc-christmas] .notification-list {
    max-height: calc(100dvh / var(--zoom, 1) - var(--header-h, 110px) - var(--christmas-band) - 180px);
  }
}

@media (prefers-reduced-motion: reduce) {
  html[data-pmc-christmas] .pmc-christmas-flight {
    animation: none !important;
    transform: none !important;
    left: 4%;
  }
}

@media (forced-colors: active) {
  html[data-pmc-christmas] .pmc-christmas-home,
  html[data-pmc-christmas] .pmc-christmas-controls,
  html[data-pmc-christmas] .pmc-christmas-controls button {
    border: 1px solid;
    forced-color-adjust: auto;
  }
}