/* ExpansionTales palette switcher and site-wide color tokens. */
.et-palette-logo {
  display: block;
  width: 94px;
  height: 46px;
  flex: 0 0 94px;
  overflow: visible;
}

.et-palette-logo-type {
  font-family: "Arial Black", Impact, Arial, sans-serif;
  font-size: 79px;
  font-weight: 900;
}

.et-palette-logo-e { fill: var(--et-text, #eee8da); }
.et-palette-logo-t { fill: var(--et-primary, #b994d6); }
.et-palette-logo-shadow { fill: var(--et-depth, #305d4d); }

.top-logo::after {
  display: none;
  content: none;
}

@media (max-width: 700px) {
  .et-palette-logo {
    width: 81px;
    height: 40px;
    flex-basis: 81px;
  }
}

@media (max-width: 350px) {
  .et-palette-logo {
    width: 53px;
    height: 30px;
    flex-basis: 53px;
  }
}

@media (max-width: 700px) {
  .et2-home .et2-teaser-carousel { order: 1; }
  .et2-home .et2-reader-desk { order: 2; }
}

:root,
html[data-et-palette="01"] {
  --et-bg: #08110e;
  --et-panel: #14211b;
  --et-panel-strong: #1c2c25;
  --et-text: #eee8da;
  --et-muted: #aab8ad;
  --et-primary: #b994d6;
  --et-secondary: #d7b85b;
  --et-depth: #305d4d;
  --et-line: #496256;
  --et-member: #60476d;
  --et-shadow-color: #030806;
}

html[data-et-palette="02"] {
  --et-bg: #080808; --et-panel: #191919; --et-panel-strong: #262626;
  --et-text: #f4efe6; --et-muted: #a5a19a; --et-primary: #e34b36;
  --et-secondary: #d9b44a; --et-depth: #3a3a3a; --et-line: #55514b;
  --et-member: #8f2f29; --et-shadow-color: #020202;
}

html[data-et-palette="03"] {
  --et-bg: #080e1c; --et-panel: #111b30; --et-panel-strong: #1b2944;
  --et-text: #f2e8dc; --et-muted: #aeb8c8; --et-primary: #e7815f;
  --et-secondary: #f2c879; --et-depth: #28516a; --et-line: #405570;
  --et-member: #854b5d; --et-shadow-color: #030711;
}

html[data-et-palette="04"] {
  --et-bg: #120a16; --et-panel: #28162c; --et-panel-strong: #36203c;
  --et-text: #f4e9dd; --et-muted: #bfaec4; --et-primary: #6fd0b0;
  --et-secondary: #e6a65d; --et-depth: #5b2e50; --et-line: #6e4a67;
  --et-member: #694e82; --et-shadow-color: #070409;
}

html[data-et-palette="05"] {
  --et-bg: #140d08; --et-panel: #2a1910; --et-panel-strong: #382318;
  --et-text: #f6e5ca; --et-muted: #bba995; --et-primary: #69b7c8;
  --et-secondary: #dc6c79; --et-depth: #7a5535; --et-line: #6a4b38;
  --et-member: #7a3d48; --et-shadow-color: #070402;
}

html[data-et-palette="06"] {
  --et-bg: #0b1014; --et-panel: #182029; --et-panel-strong: #232f3a;
  --et-text: #ece7df; --et-muted: #aab3b9; --et-primary: #c77a52;
  --et-secondary: #a9c2b0; --et-depth: #3f5968; --et-line: #4c5c66;
  --et-member: #6d4638; --et-shadow-color: #030609;
}

html[data-et-palette="07"] {
  --et-bg: #061116; --et-panel: #0e2530; --et-panel-strong: #173743;
  --et-text: #f1e7d1; --et-muted: #a9bec2; --et-primary: #d7a95a;
  --et-secondary: #d87965; --et-depth: #2e6670; --et-line: #3e6570;
  --et-member: #37596b; --et-shadow-color: #02080b;
}

html[data-et-palette="08"] {
  --et-bg: #07100d; --et-panel: #13221b; --et-panel-strong: #1d3127;
  --et-text: #f3e7da; --et-muted: #adb9ae; --et-primary: #ce768b;
  --et-secondary: #c5a75a; --et-depth: #3d6552; --et-line: #4a6659;
  --et-member: #6b4050; --et-shadow-color: #020705;
}

html[data-et-palette="09"] {
  --et-bg: #08090d; --et-panel: #151822; --et-panel-strong: #222634;
  --et-text: #f4ebd9; --et-muted: #aeb0ba; --et-primary: #c9a34f;
  --et-secondary: #7fa8c9; --et-depth: #343c54; --et-line: #4e5363;
  --et-member: #6a542d; --et-shadow-color: #020205;
}

html[data-et-palette="10"] {
  --et-bg: #0d0d10; --et-panel: #1d1c23; --et-panel-strong: #2a2832;
  --et-text: #eeeaf2; --et-muted: #aba6b2; --et-primary: #a98ccb;
  --et-secondary: #d6b56d; --et-depth: #4d4961; --et-line: #595665;
  --et-member: #5e4a73; --et-shadow-color: #030304;
}

html[data-et-palette="11"] {
  --et-bg: #120b07; --et-panel: #26170f; --et-panel-strong: #332117;
  --et-text: #f4e5d3; --et-muted: #b9a997; --et-primary: #64b89a;
  --et-secondary: #d29b58; --et-depth: #315c4e; --et-line: #655243;
  --et-member: #5e4639; --et-shadow-color: #060301;
}

html[data-et-palette="12"] {
  --et-bg: #070d18; --et-panel: #111c2e; --et-panel-strong: #1b2940;
  --et-text: #f0e7d5; --et-muted: #a8b2c0; --et-primary: #d6b34c;
  --et-secondary: #c8795c; --et-depth: #294c6a; --et-line: #445570;
  --et-member: #5c4772; --et-shadow-color: #02050c;
}

html[data-et-palette="13"] {
  --et-bg: #130a12; --et-panel: #291829; --et-panel-strong: #3a2338;
  --et-text: #f5e8de; --et-muted: #c1acbb; --et-primary: #e79a78;
  --et-secondary: #b88bc8; --et-depth: #62405d; --et-line: #70536a;
  --et-member: #7b435a; --et-shadow-color: #070307;
}

html[data-et-palette="14"] {
  --et-bg: #0d1109; --et-panel: #1e2617; --et-panel-strong: #2a3420;
  --et-text: #efe8d6; --et-muted: #afb6a1; --et-primary: #c87557;
  --et-secondary: #d0b566; --et-depth: #536445; --et-line: #626a51;
  --et-member: #795342; --et-shadow-color: #040603;
}

html[data-et-palette="15"] {
  --et-bg: #0b0e11; --et-panel: #1a2025; --et-panel-strong: #273139;
  --et-text: #eaf0ee; --et-muted: #a5b1b5; --et-primary: #67b5c8;
  --et-secondary: #d09a64; --et-depth: #385e69; --et-line: #506168;
  --et-member: #465a72; --et-shadow-color: #030405;
}

html[data-et-palette="16"] {
  --et-bg: #10070b; --et-panel: #251218; --et-panel-strong: #351b24;
  --et-text: #f5e8e6; --et-muted: #bda8ae; --et-primary: #c85a78;
  --et-secondary: #d8b765; --et-depth: #5e3040; --et-line: #674a54;
  --et-member: #77283f; --et-shadow-color: #050203;
}

html[data-et-palette="17"] {
  --et-bg: #090b17; --et-panel: #181c31; --et-panel-strong: #252a42;
  --et-text: #ede9d9; --et-muted: #aaafc0; --et-primary: #a58ed4;
  --et-secondary: #b6b85d; --et-depth: #42496d; --et-line: #555b76;
  --et-member: #5f4975; --et-shadow-color: #03040a;
}

html[data-et-palette="18"] {
  --et-bg: #071111; --et-panel: #122424; --et-panel-strong: #1c3433;
  --et-text: #f0e9dd; --et-muted: #a7b8b5; --et-primary: #d5789a;
  --et-secondary: #d0aa55; --et-depth: #2e6460; --et-line: #426a66;
  --et-member: #6c3f57; --et-shadow-color: #020707;
}

html[data-et-palette="19"] {
  --et-bg: #120d0c; --et-panel: #251b19; --et-panel-strong: #342623;
  --et-text: #f4e9de; --et-muted: #b8aba5; --et-primary: #9a82c5;
  --et-secondary: #d38465; --et-depth: #65473f; --et-line: #6c5650;
  --et-member: #5b466f; --et-shadow-color: #060403;
}

html[data-et-palette="20"] {
  --et-bg: #0b0d0f; --et-panel: #1a1e21; --et-panel-strong: #272d31;
  --et-text: #f1eee6; --et-muted: #acb2b4; --et-primary: #d99a4e;
  --et-secondary: #7fa8a0; --et-depth: #47565c; --et-line: #596267;
  --et-member: #6a4c31; --et-shadow-color: #030405;
}

html[data-et-palette] {
  --paper: var(--et-bg);
  --paper-light: var(--et-panel);
  --ink: var(--et-text);
  --blue: var(--et-depth);
  --orange: var(--et-primary);
  --acid: var(--et-secondary);
  --pink: var(--et-primary);
  --line: var(--et-line);
  --text: var(--et-text);
  --muted: var(--et-muted);
  --panel: var(--et-panel);
  --panel-strong: var(--et-panel-strong);
  --coral: var(--et-primary);
  --mint: var(--et-depth);
  --gold: var(--et-secondary);
  --teal: var(--et-depth);
  --shadow: 14px 14px 0 var(--et-shadow-color);
  background: var(--et-bg);
  color-scheme: dark;
}

html[data-et-palette] body,
html[data-et-palette] body.missexpansion-inner-page,
html[data-et-palette] body.missexpansion-reader-page {
  background: var(--et-bg) !important;
  color: var(--et-text);
}

html[data-et-palette] body::before {
  background-image: radial-gradient(color-mix(in srgb, var(--et-text) 15%, transparent) .8px, transparent 1px);
}

html[data-et-palette] .button,
html[data-et-palette] .button-soft,
html[data-et-palette] .button-outline,
html[data-et-palette] .archive-card,
html[data-et-palette] .legal-panel,
html[data-et-palette] .faq-item,
html[data-et-palette] .comments-panel,
html[data-et-palette] .reader-finish-panel,
html[data-et-palette] .member-status-list span,
html[data-et-palette] .comment-locked,
html[data-et-palette] .comment-list li,
html[data-et-palette] .reader-stat,
html[data-et-palette] .reader-bottom-nav a,
html[data-et-palette] .disabled-link { background: var(--et-panel); }

html[data-et-palette] .button-primary,
html[data-et-palette] .game-float,
html[data-et-palette] .archive-button,
html[data-et-palette] .release-button,
html[data-et-palette] .reader-locked-page a,
html[data-et-palette] .comment-locked a {
  background: var(--et-primary);
  color: var(--et-bg);
}

html[data-et-palette] .patreon-float {
  border-color: var(--et-secondary);
  background: var(--et-panel-strong);
  color: var(--et-secondary);
}

html[data-et-palette] .top-action { border-color: var(--et-text); }
html[data-et-palette] .et-palette-logo-e { fill: var(--et-text); }
html[data-et-palette] .et-palette-logo-t { fill: var(--et-primary); }
html[data-et-palette] .et-palette-logo-shadow { fill: var(--et-depth); }
html[data-et-palette] .et2-masthead h1 span:first-child { text-shadow: 7px 7px 0 var(--et-depth); }
html[data-et-palette] .et2-masthead h1 span:last-child { color: var(--et-primary); text-shadow: 6px 6px 0 var(--et-member); }

html[data-et-palette] .et2-intro {
  background: linear-gradient(135deg, transparent 0 74%, color-mix(in srgb, var(--et-depth) 44%, transparent) 74% 100%), var(--et-panel);
  box-shadow: 10px 10px 0 var(--et-depth);
}

html[data-et-palette] .et2-data { background: var(--et-panel-strong); }
html[data-et-palette] .et2-desk-top i,
html[data-et-palette] .et2-burst,
html[data-et-palette] .et2-teaser-dots button.is-active,
html[data-et-palette] .et2-newswire,
html[data-et-palette] .et2-section-head > a,
html[data-et-palette] .et2-story-index,
html[data-et-palette] .archive-cover-badge,
html[data-et-palette] .release-label,
html[data-et-palette] .tag,
html[data-et-palette] .status-pill,
html[data-et-palette] .et2-screen-bar,
html[data-et-palette] .et2-pixel-moon,
html[data-et-palette] .et2-membership-stamp { background: var(--et-secondary); color: var(--et-bg); }

html[data-et-palette] .et2-desk-label,
html[data-et-palette] .et2-desk-links span,
html[data-et-palette] .et2-desk-member b { color: var(--et-primary); }
html[data-et-palette] .et2-desk-meta,
html[data-et-palette] .et2-desk-links small,
html[data-et-palette] .et2-desk-member span { color: var(--et-secondary); }
html[data-et-palette] .et2-desk-links a { background: color-mix(in srgb, var(--et-bg) 78%, transparent); }
html[data-et-palette] .et2-desk-links a:hover { border-color: var(--et-secondary); background: var(--et-panel-strong); }
html[data-et-palette] .et2-desk-member { border-color: var(--et-secondary); background: color-mix(in srgb, var(--et-secondary) 10%, transparent); }
html[data-et-palette] .et2-desk-member.is-unlocked { border-color: var(--et-depth); background: color-mix(in srgb, var(--et-depth) 30%, transparent); }

html[data-et-palette] .et2-lead { background: var(--et-panel); box-shadow: 11px 11px 0 var(--et-member); }
html[data-et-palette] .et2-lead:hover { box-shadow: 6px 6px 0 var(--et-member); }
html[data-et-palette] .et2-lead-label,
html[data-et-palette] .et2-teaser-control { background: var(--et-primary); color: var(--et-bg); }
html[data-et-palette] .et2-teaser-count { color: var(--et-text); }
html[data-et-palette] .et2-teaser-count-current { color: var(--et-secondary); }
html[data-et-palette] .et2-teaser-count i { color: var(--et-muted); }
html[data-et-palette] .et2-teaser-control:hover,
html[data-et-palette] .et2-teaser-control:focus-visible { background: var(--et-secondary); }
html[data-et-palette] .et2-lead-art,
html[data-et-palette] .et2-story-cover { background: var(--et-depth); }

html[data-et-palette] .et2-story-card,
html[data-et-palette] .et2-story-copy,
html[data-et-palette] .et2-story-1 .et2-story-copy,
html[data-et-palette] .et2-story-2 .et2-story-copy,
html[data-et-palette] .et2-story-3 .et2-story-copy,
html[data-et-palette] .et2-story-4 .et2-story-copy { background: var(--et-panel); }
html[data-et-palette] .et2-story-card { border-color: var(--et-text); box-shadow: 9px 9px 0 var(--et-shadow-color); }
html[data-et-palette] .et2-story-1,
html[data-et-palette] .et2-story-2 { --story-accent: var(--et-primary); }
html[data-et-palette] .et2-story-3 { --story-accent: var(--et-depth); }
html[data-et-palette] .et2-story-4 { --story-accent: var(--et-secondary); }
html[data-et-palette] .et2-story-copy small { color: var(--et-secondary); }
html[data-et-palette] .et2-story-copy b { border-color: var(--et-line); color: var(--et-primary); }

html[data-et-palette] .et2-game { background: var(--et-panel); box-shadow: 12px 12px 0 var(--et-depth); }
html[data-et-palette] .et2-game-screen { background: var(--et-panel-strong); }
html[data-et-palette] .et2-screen-body {
  background: radial-gradient(circle at 52% 24%, color-mix(in srgb, var(--et-primary) 34%, transparent), transparent 24%), linear-gradient(150deg, var(--et-panel), var(--et-member) 58%, var(--et-depth));
}
html[data-et-palette] .et2-pixel-figure {
  background: radial-gradient(circle at 50% 13%, #c7987c 0 11%, var(--et-panel) 11.5% 16%, transparent 16.5%), radial-gradient(circle at 34% 48%, var(--et-primary) 0 20%, transparent 20.5%), radial-gradient(circle at 66% 48%, var(--et-primary) 0 20%, transparent 20.5%), linear-gradient(165deg, transparent 0 24%, var(--et-panel) 25% 100%);
}
html[data-et-palette] .et2-choice-box { background: color-mix(in srgb, var(--et-bg) 96%, transparent); }
html[data-et-palette] .et2-game-copy { background: linear-gradient(145deg, transparent 0 76%, color-mix(in srgb, var(--et-depth) 28%, transparent) 76%), var(--et-panel); }
html[data-et-palette] .et2-vertical-word { color: color-mix(in srgb, var(--et-depth) 24%, transparent); }

html[data-et-palette] .et2-membership {
  background: linear-gradient(135deg, color-mix(in srgb, var(--et-secondary) 12%, transparent), transparent 36%), var(--et-member);
  box-shadow: 11px 11px 0 var(--et-shadow-color);
}
html[data-et-palette] .et2-membership .button-primary { background: var(--et-text); color: var(--et-bg); }
html[data-et-palette] .et2-membership .et2-text-link { border-color: var(--et-text); color: var(--et-text); }
html[data-et-palette] .reader-locked-page { background: var(--et-panel-strong); }
html[data-et-palette] .et-build-placeholder,
html[data-et-palette] .age-panel { background: var(--et-panel); box-shadow: 11px 11px 0 var(--et-depth); }
html[data-et-palette] .site-footer { background: color-mix(in srgb, var(--et-bg) 88%, black); }

.et-palette-toggle {
  display: inline-flex;
  min-height: 44px;
  align-items: center;
  justify-content: center;
  gap: 9px;
  border: 1px solid var(--et-line);
  border-radius: 3px;
  padding: 0 14px;
  background: var(--et-panel);
  color: var(--et-text);
  font: inherit;
  font-size: .76rem;
  font-weight: 900;
  letter-spacing: .06em;
  text-transform: uppercase;
  white-space: nowrap;
  cursor: pointer;
}

.et-palette-toggle:hover,
.et-palette-toggle[aria-expanded="true"] { border-color: var(--et-primary); background: var(--et-panel-strong); }

.et-palette-toggle-icon,
.et-palette-option-swatch {
  flex: 0 0 auto;
  border: 1px solid color-mix(in srgb, var(--et-text) 55%, transparent);
  border-radius: 50%;
  background: conic-gradient(var(--swatch-a) 0 34%, var(--swatch-b) 34% 67%, var(--swatch-c) 67%);
}

.et-palette-toggle-icon { width: 20px; height: 20px; }

.et-palette-panel {
  position: fixed;
  z-index: 95;
  top: 76px;
  right: max(16px, calc((100vw - 1180px) / 2));
  width: min(430px, calc(100vw - 32px));
  max-height: min(680px, calc(100vh - 94px));
  overflow: auto;
  border: 2px solid var(--et-text);
  border-radius: 3px;
  padding: 16px;
  background: color-mix(in srgb, var(--et-panel) 96%, transparent);
  color: var(--et-text);
  box-shadow: 10px 10px 0 var(--et-shadow-color);
  backdrop-filter: blur(14px);
}

.et-palette-panel[hidden] { display: none; }

.et-palette-panel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  border-bottom: 1px solid var(--et-line);
  padding: 0 0 12px;
}

.et-palette-panel-head strong { font-size: 1rem; text-transform: uppercase; }
.et-palette-panel-head span { color: var(--et-muted); font-size: .7rem; font-weight: 800; }

.et-palette-options {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  margin-top: 12px;
}

.et-palette-option {
  display: grid;
  min-width: 0;
  min-height: 54px;
  grid-template-columns: 30px minmax(0, 1fr) 16px;
  gap: 9px;
  align-items: center;
  border: 1px solid var(--et-line);
  border-radius: 2px;
  padding: 7px 9px;
  background: var(--et-panel-strong);
  color: var(--et-text);
  font: inherit;
  text-align: left;
  cursor: pointer;
}

.et-palette-option:hover { border-color: var(--et-primary); transform: translateY(-1px); }
.et-palette-option[aria-pressed="true"] { border-color: var(--et-secondary); box-shadow: inset 0 0 0 1px var(--et-secondary); }
.et-palette-option-swatch { width: 30px; height: 30px; }
.et-palette-option-name { overflow: hidden; font-size: .72rem; font-weight: 900; line-height: 1.1; text-overflow: ellipsis; white-space: nowrap; }
.et-palette-option-check { color: var(--et-secondary); font-weight: 900; opacity: 0; }
.et-palette-option[aria-pressed="true"] .et-palette-option-check { opacity: 1; }

@media (max-width: 700px) {
  .et-palette-toggle { width: 40px; min-height: 40px; padding: 0; }
  .et-palette-toggle-label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .et-palette-panel { top: 62px; right: 10px; left: 10px; width: auto; max-height: calc(100dvh - 76px); padding: 12px; }
  .et-palette-options { gap: 6px; }
  .et-palette-option { min-height: 50px; grid-template-columns: 26px minmax(0, 1fr) 12px; gap: 7px; padding: 6px 7px; }
  .et-palette-option-swatch { width: 26px; height: 26px; }
  .et-palette-option-name { font-size: .66rem; }
}

@media (prefers-reduced-motion: reduce) {
  .et-palette-option { transition: none; }
}