/* LOG11DX time-of-day background.
   Remove this stylesheet and /js/ambient_background.js to restore the original canvas. */

@property --lx-ambient-bg {
  syntax: "<color>";
  inherits: true;
  initial-value: #667997;
}

@property --lx-ambient-center-1 {
  syntax: "<color>";
  inherits: true;
  initial-value: rgba(185, 215, 255, .34);
}

@property --lx-ambient-center-2 {
  syntax: "<color>";
  inherits: true;
  initial-value: rgba(130, 175, 240, .20);
}

@property --lx-ambient-center-3 {
  syntax: "<color>";
  inherits: true;
  initial-value: rgba(85, 130, 210, .11);
}

@property --lx-ambient-center-4 {
  syntax: "<color>";
  inherits: true;
  initial-value: rgba(35, 75, 145, .04);
}

@property --lx-ambient-top-1 {
  syntax: "<color>";
  inherits: true;
  initial-value: rgba(205, 225, 255, .12);
}

@property --lx-ambient-top-2 {
  syntax: "<color>";
  inherits: true;
  initial-value: rgba(120, 170, 250, .06);
}

@property --lx-ambient-bottom-1 {
  syntax: "<color>";
  inherits: true;
  initial-value: rgba(110, 160, 245, .07);
}

@property --lx-ambient-bottom-2 {
  syntax: "<color>";
  inherits: true;
  initial-value: rgba(70, 120, 210, .04);
}

@property --lx-ambient-vignette-1 {
  syntax: "<color>";
  inherits: true;
  initial-value: rgba(18, 36, 74, .70);
}

@property --lx-ambient-vignette-2 {
  syntax: "<color>";
  inherits: true;
  initial-value: rgba(9, 21, 48, .84);
}

@property --lx-ambient-base-1 {
  syntax: "<color>";
  inherits: true;
  initial-value: #ddca9b;
}

@property --lx-ambient-base-2 {
  syntax: "<color>";
  inherits: true;
  initial-value: #d9bca1;
}

@property --lx-ambient-base-3 {
  syntax: "<color>";
  inherits: true;
  initial-value: #d1b892;
}

@property --lx-ambient-base-4 {
  syntax: "<color>";
  inherits: true;
  initial-value: #b3a48d;
}

@property --lx-ambient-base-5 {
  syntax: "<color>";
  inherits: true;
  initial-value: #dbc797;
}

@property --lx-ambient-base-6 {
  syntax: "<color>";
  inherits: true;
  initial-value: #d3c09d;
}

html[data-lx-ambient-active] {
  transition:
    --lx-ambient-bg 3s ease,
    --lx-ambient-center-1 3s ease,
    --lx-ambient-center-2 3s ease,
    --lx-ambient-center-3 3s ease,
    --lx-ambient-center-4 3s ease,
    --lx-ambient-top-1 3s ease,
    --lx-ambient-top-2 3s ease,
    --lx-ambient-bottom-1 3s ease,
    --lx-ambient-bottom-2 3s ease,
    --lx-ambient-vignette-1 3s ease,
    --lx-ambient-vignette-2 3s ease,
    --lx-ambient-base-1 3s ease,
    --lx-ambient-base-2 3s ease,
    --lx-ambient-base-3 3s ease,
    --lx-ambient-base-4 3s ease,
    --lx-ambient-base-5 3s ease,
    --lx-ambient-base-6 3s ease;
}

/* Classic: the original static LOG11DX blue canvas. */
html[data-lx-ambient-active="classic"] {
  --lx-ambient-photo: none;
  --lx-ambient-photo-wash-top: transparent;
  --lx-ambient-photo-wash-bottom: transparent;
  --lx-ambient-bg: #1f4e98;
  --lx-ambient-center-1: rgba(185, 215, 255, .34);
  --lx-ambient-center-2: rgba(130, 175, 240, .20);
  --lx-ambient-center-3: rgba(85, 130, 210, .11);
  --lx-ambient-center-4: rgba(35, 75, 145, .04);
  --lx-ambient-top-1: rgba(205, 225, 255, .12);
  --lx-ambient-top-2: rgba(120, 170, 250, .06);
  --lx-ambient-bottom-1: rgba(110, 160, 245, .07);
  --lx-ambient-bottom-2: rgba(70, 120, 210, .04);
  --lx-ambient-vignette-1: rgba(18, 36, 74, .70);
  --lx-ambient-vignette-2: rgba(9, 21, 48, .84);
  --lx-ambient-base-1: #2d63b7;
  --lx-ambient-base-2: #295cad;
  --lx-ambient-base-3: #24539f;
  --lx-ambient-base-4: #214b92;
  --lx-ambient-base-5: #1c427c;
  --lx-ambient-base-6: #163764;
}

/* Calm Dark: a static, low-contrast option with no photographic texture. */
html[data-lx-ambient-active="calm"] {
  --lx-ambient-photo: none;
  --lx-ambient-photo-wash-top: transparent;
  --lx-ambient-photo-wash-bottom: transparent;
  --lx-ambient-bg: #182335;
  --lx-ambient-center-1: rgba(145, 174, 207, .07);
  --lx-ambient-center-2: rgba(99, 135, 177, .04);
  --lx-ambient-center-3: rgba(66, 101, 145, .02);
  --lx-ambient-center-4: rgba(42, 72, 111, .01);
  --lx-ambient-top-1: rgba(166, 194, 224, .055);
  --lx-ambient-top-2: rgba(91, 129, 174, .025);
  --lx-ambient-bottom-1: rgba(75, 109, 151, .025);
  --lx-ambient-bottom-2: rgba(48, 77, 116, .015);
  --lx-ambient-vignette-1: rgba(10, 21, 38, .32);
  --lx-ambient-vignette-2: rgba(5, 12, 25, .52);
  --lx-ambient-base-1: #2b3749;
  --lx-ambient-base-2: #273345;
  --lx-ambient-base-3: #232e40;
  --lx-ambient-base-4: #1e293a;
  --lx-ambient-base-5: #192334;
  --lx-ambient-base-6: #141d2c;
}

/* Morning: apricot-coral sunrise fading into a darker blue-grey dawn. */
html[data-lx-ambient-active="morning"] {
  --lx-ambient-photo: url("/images/backgrounds/ambient-morning-v1.webp");
  --lx-ambient-photo-wash-top: rgba(3, 10, 22, .08);
  --lx-ambient-photo-wash-bottom: rgba(3, 10, 22, .28);
  --lx-ambient-bg: #565e70;
  --lx-ambient-center-1: rgba(224, 198, 190, .08);
  --lx-ambient-center-2: rgba(174, 153, 177, .045);
  --lx-ambient-center-3: rgba(108, 128, 170, .02);
  --lx-ambient-center-4: rgba(57, 96, 143, .01);
  --lx-ambient-top-1: rgba(255, 190, 126, .28);
  --lx-ambient-top-2: rgba(235, 126, 106, .12);
  --lx-ambient-bottom-1: rgba(112, 153, 190, .04);
  --lx-ambient-bottom-2: rgba(69, 108, 151, .02);
  --lx-ambient-vignette-1: rgba(35, 38, 61, .34);
  --lx-ambient-vignette-2: rgba(17, 24, 45, .54);
  --lx-ambient-base-1: #a97868;
  --lx-ambient-base-2: #8c6f71;
  --lx-ambient-base-3: #706873;
  --lx-ambient-base-4: #596270;
  --lx-ambient-base-5: #4b5868;
  --lx-ambient-base-6: #414d5d;
}

/* Day: restrained blue-grey daylight without a bright oval behind the content. */
html[data-lx-ambient-active="day"] {
  --lx-ambient-photo: url("/images/backgrounds/ambient-day-v1.webp");
  --lx-ambient-photo-wash-top: rgba(3, 10, 22, .20);
  --lx-ambient-photo-wash-bottom: rgba(3, 10, 22, .38);
  --lx-ambient-bg: #48566b;
  --lx-ambient-center-1: rgba(178, 205, 235, .08);
  --lx-ambient-center-2: rgba(126, 166, 213, .05);
  --lx-ambient-center-3: rgba(83, 126, 180, .025);
  --lx-ambient-center-4: rgba(45, 83, 137, .01);
  --lx-ambient-top-1: rgba(196, 218, 244, .08);
  --lx-ambient-top-2: rgba(116, 158, 209, .035);
  --lx-ambient-bottom-1: rgba(99, 139, 190, .035);
  --lx-ambient-bottom-2: rgba(63, 101, 153, .02);
  --lx-ambient-vignette-1: rgba(24, 38, 63, .38);
  --lx-ambient-vignette-2: rgba(12, 24, 45, .58);
  --lx-ambient-base-1: #59677c;
  --lx-ambient-base-2: #546277;
  --lx-ambient-base-3: #4e5c71;
  --lx-ambient-base-4: #475367;
  --lx-ambient-base-5: #3f4b5e;
  --lx-ambient-base-6: #374255;
}

/* Sunset: peach and dusty rose held together by a plum-blue vignette. */
html[data-lx-ambient-active="sunset"] {
  --lx-ambient-photo: url("/images/backgrounds/ambient-sunset-v1.webp");
  --lx-ambient-photo-wash-top: rgba(3, 8, 20, .12);
  --lx-ambient-photo-wash-bottom: rgba(3, 8, 20, .34);
  --lx-ambient-bg: #68647b;
  --lx-ambient-center-1: rgba(244, 207, 190, .30);
  --lx-ambient-center-2: rgba(207, 145, 164, .17);
  --lx-ambient-center-3: rgba(139, 100, 160, .11);
  --lx-ambient-center-4: rgba(75, 58, 121, .06);
  --lx-ambient-top-1: rgba(255, 204, 158, .14);
  --lx-ambient-top-2: rgba(225, 137, 128, .06);
  --lx-ambient-bottom-1: rgba(137, 105, 181, .09);
  --lx-ambient-bottom-2: rgba(72, 67, 139, .06);
  --lx-ambient-vignette-1: rgba(49, 35, 79, .68);
  --lx-ambient-vignette-2: rgba(20, 17, 52, .86);
  --lx-ambient-base-1: #c99c86;
  --lx-ambient-base-2: #b87f88;
  --lx-ambient-base-3: #a97586;
  --lx-ambient-base-4: #80657e;
  --lx-ambient-base-5: #8f687f;
  --lx-ambient-base-6: #5e5875;
}

/* Night: moonlit cyan over deep indigo. */
html[data-lx-ambient-active="night"] {
  --lx-ambient-photo: url("/images/backgrounds/ambient-night-v1.webp");
  --lx-ambient-photo-wash-top: rgba(1, 7, 18, .06);
  --lx-ambient-photo-wash-bottom: rgba(1, 7, 18, .20);
  --lx-ambient-bg: #142c50;
  --lx-ambient-center-1: rgba(128, 194, 255, .25);
  --lx-ambient-center-2: rgba(68, 137, 224, .16);
  --lx-ambient-center-3: rgba(46, 93, 180, .10);
  --lx-ambient-center-4: rgba(25, 58, 128, .05);
  --lx-ambient-top-1: rgba(157, 207, 255, .10);
  --lx-ambient-top-2: rgba(73, 139, 227, .06);
  --lx-ambient-bottom-1: rgba(57, 125, 213, .08);
  --lx-ambient-bottom-2: rgba(43, 84, 169, .05);
  --lx-ambient-vignette-1: rgba(8, 24, 55, .76);
  --lx-ambient-vignette-2: rgba(3, 10, 29, .93);
  --lx-ambient-base-1: #244f86;
  --lx-ambient-base-2: #204777;
  --lx-ambient-base-3: #1c3f6c;
  --lx-ambient-base-4: #18365d;
  --lx-ambient-base-5: #142f54;
  --lx-ambient-base-6: #102744;
}

html[data-lx-ambient-active][data-lx-ambient-mode],
html[data-lx-ambient-active][data-lx-ambient-mode] body,
html[data-lx-ambient-active][data-lx-ambient-mode] body[class] {
  background-color: var(--lx-ambient-bg) !important;
  background-image:
    radial-gradient(ellipse at center, var(--lx-ambient-center-1) 0%, var(--lx-ambient-center-2) 18%, var(--lx-ambient-center-3) 34%, var(--lx-ambient-center-4) 52%, transparent 64%),
    radial-gradient(ellipse at 50% 0%, var(--lx-ambient-top-1) 0%, var(--lx-ambient-top-2) 30%, transparent 58%),
    radial-gradient(ellipse at 50% 100%, var(--lx-ambient-bottom-1) 0%, var(--lx-ambient-bottom-2) 28%, transparent 58%),
    radial-gradient(ellipse at center, transparent 42%, var(--lx-ambient-vignette-1) 68%, var(--lx-ambient-vignette-2) 100%),
    linear-gradient(135deg, rgba(255, 255, 255, .018) 0%, rgba(255, 255, 255, .018) 25%, transparent 25%, transparent 50%, rgba(0, 0, 0, .03) 50%, rgba(0, 0, 0, .03) 75%, transparent 75%, transparent 100%),
    linear-gradient(180deg, var(--lx-ambient-photo-wash-top), var(--lx-ambient-photo-wash-bottom)),
    var(--lx-ambient-photo),
    linear-gradient(180deg, var(--lx-ambient-base-1) 0%, var(--lx-ambient-base-2) 18%, var(--lx-ambient-base-3) 38%, var(--lx-ambient-base-4) 58%, var(--lx-ambient-base-5) 80%, var(--lx-ambient-base-6) 100%) !important;
  background-size: auto, auto, auto, auto, 5px 5px, cover, cover, auto !important;
  background-position: center, center top, center bottom, center, center, center, center center, center !important;
  background-repeat: no-repeat, no-repeat, no-repeat, no-repeat, repeat, no-repeat, no-repeat, no-repeat !important;
  background-attachment: fixed !important;
}

.lx-ambient-picker {
  position: relative;
  flex: 0 0 auto;
}

.lx-ambient-trigger {
  width: 38px !important;
  min-width: 38px !important;
  height: 38px !important;
  padding: 0 !important;
  border-radius: 12px !important;
  border: 1px solid rgba(134, 194, 255, .28) !important;
  color: #dbeafe !important;
  background: linear-gradient(180deg, rgba(255, 255, 255, .08), rgba(255, 255, 255, .035)) !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.lx-ambient-trigger:hover,
.lx-ambient-trigger:focus-visible,
.lx-ambient-trigger[aria-expanded="true"] {
  color: #fff !important;
  border-color: rgba(134, 194, 255, .55) !important;
  background: linear-gradient(180deg, rgba(35, 124, 245, .28), rgba(35, 124, 245, .14)) !important;
}

.lx-ambient-trigger i { font-size: 16px; }

.lx-ambient-menu {
  position: absolute;
  z-index: 4000;
  top: calc(100% + 10px);
  right: 0;
  width: 190px;
  padding: 7px;
  border: 1px solid rgba(134, 194, 255, .22);
  border-radius: 14px;
  background: rgba(8, 18, 34, .96);
  box-shadow: 0 18px 42px rgba(0, 0, 0, .42);
  backdrop-filter: blur(18px);
}

.lx-ambient-menu[hidden] { display: none !important; }

.lx-ambient-menu-title {
  padding: 5px 9px 7px;
  color: rgba(226, 238, 252, .62);
  font: 600 10px/1.2 system-ui, sans-serif;
  letter-spacing: .09em;
  text-transform: uppercase;
}

.lx-ambient-menu-divider {
  height: 1px;
  margin: 6px 7px;
  background: rgba(134, 194, 255, .16);
}

.lx-ambient-option {
  width: 100%;
  min-height: 34px;
  padding: 7px 9px;
  border: 0;
  border-radius: 9px;
  color: #dceafa;
  background: transparent;
  display: flex;
  align-items: center;
  gap: 9px;
  font: 600 13px/1.2 "Rajdhani", system-ui, sans-serif;
  letter-spacing: .045em;
  text-align: left;
  text-transform: uppercase;
}

.lx-ambient-option:hover,
.lx-ambient-option:focus-visible { background: rgba(74, 146, 235, .17); }
.lx-ambient-option[aria-checked="true"] { color: #fff; background: rgba(52, 132, 235, .24); }
.lx-ambient-option .lx-ambient-check { margin-left: auto; opacity: 0; }
.lx-ambient-option[aria-checked="true"] .lx-ambient-check { opacity: 1; }

.lx-ambient-swatch {
  width: 12px;
  height: 12px;
  flex: 0 0 12px;
  border: 1px solid rgba(255, 255, 255, .26);
  border-radius: 50%;
  box-shadow: inset 0 1px 1px rgba(255, 255, 255, .18);
}

.lx-ambient-swatch--auto { background: linear-gradient(135deg, #efc99d 0 35%, #c77f8c 35% 65%, #18365d 65%); }
.lx-ambient-swatch--classic { background: linear-gradient(135deg, #2d63b7, #163764); }
.lx-ambient-swatch--calm { background: linear-gradient(135deg, #2b3749, #141d2c); }
.lx-ambient-swatch--morning { background: linear-gradient(135deg, #c58a6b, #596270); }
.lx-ambient-swatch--day { background: #4e5c71; }
.lx-ambient-swatch--sunset { background: #9a6b83; }
.lx-ambient-swatch--night { background: #18365d; }

.lx-ambient-mobile {
  padding: 12px 14px;
  border-top: 1px solid rgba(255, 255, 255, .09);
}

.lx-ambient-mobile label {
  display: flex;
  align-items: center;
  gap: 7px;
  margin-bottom: 7px;
  color: rgba(232, 237, 245, .78);
  font: 600 12px/1.2 "Rajdhani", system-ui, sans-serif;
  letter-spacing: .055em;
  text-transform: uppercase;
}

.lx-ambient-mobile select {
  width: 100%;
  min-height: 38px;
  padding: 7px 34px 7px 10px;
  border: 1px solid rgba(134, 194, 255, .25);
  border-radius: 10px;
  color: #eef5ff;
  background-color: rgba(9, 23, 43, .88);
}

html.theme-light .lx-ambient-trigger {
  color: #1f3b5b !important;
  border-color: rgba(91, 116, 148, .28) !important;
  background: linear-gradient(180deg, #fff, #eaf4ff) !important;
}

html.theme-light .lx-ambient-menu {
  border-color: rgba(91, 116, 148, .22);
  background: rgba(250, 253, 255, .97);
  box-shadow: 0 18px 42px rgba(54, 84, 126, .22);
}

html.theme-light .lx-ambient-menu-title { color: #68809a; }
html.theme-light .lx-ambient-option { color: #29415e; }
html.theme-light .lx-ambient-option:hover,
html.theme-light .lx-ambient-option:focus-visible,
html.theme-light .lx-ambient-option[aria-checked="true"] { color: #0969da; background: rgba(224, 239, 255, .88); }
html.theme-light .lx-ambient-mobile label { color: #29415e; }
html.theme-light .lx-ambient-mobile select { color: #29415e; background-color: rgba(255, 255, 255, .94); border-color: rgba(91, 116, 148, .28); }

@media (max-width: 1199.98px) {
  .lx-ambient-picker { display: none !important; }
}

@media (prefers-reduced-motion: reduce) {
  html[data-lx-ambient-active] { transition: none !important; }
}