/*
 * Zekamashi Display Enhancements v0.2.0
 * Scope: screen only, gray/dark only. White relies entirely on existing CSS.
 * Existing TablePress layout and legacy box geometry are intentionally untouched.
 * Public palette: --zd-*, editable from WordPress Additional CSS.
 */
@media screen {
  :where(html[data-zek-mode="gray"]) {
    --zd-page-bg: #D2D2D2;
    --zd-content-bg: #E5E5E5;
    --zd-text-color: #2C2C2C;
    --zd-muted-text: #565656;
    --zd-link-color: #285A80;
    --zd-border-color: #BCBCBC;
    --zd-heading-bg: #626262;
    --zd-heading-text: #FFFFFF;
    --zd-oldbox-stripe-base: #E3E3E3;
    --zd-list-head-bg: #D1D1D1;
    --zd-list-body-bg: #DEDEDE;
    --zd-list-border: #B2B2B2;
    --zd-triangle-bg: #D9D9D9;
    --zd-marker-yellow-bg: #DCD5B9;
    --zd-marker-orange-bg: #E2D5C4;
    --zd-marker-sky-bg: #CDDADC;
    --zd-marker-green-bg: #D1DDD0;
    --zd-table-head-bg: #C9C9C9;
    --zd-table-head-text: #2C2C2C;
    --zd-table-head-active-bg: #B7B7B7;
    --zd-table-head-active-text: #2C2C2C;
    --zd-table-odd-bg: #E5E5E5;
    --zd-table-even-bg: #D9D9D9;
    --zd-table-hover-bg: #CCCCCC;
    --zd-table-border: #BCBCBC;
    --zd-table-odd-text: #2C2C2C;
    --zd-table-even-text: #2C2C2C;
    --zd-table-hover-text: #2C2C2C;
    --zd-ink-red: #A33A45;
    --zd-ink-blue: #2E5F95;
    --zd-ink-orange: #8D4522;
    --zd-box-info-bg: var(--zd-oldbox-blue-bg);
    --zd-box-warning-bg: var(--zd-oldbox-yellow-bg);
    --zd-box-danger-bg: var(--zd-oldbox-red-bg);
    --zd-box-success-bg: var(--zd-oldbox-green-bg);
    --zd-panel-bg: #E5E5E5;
    --zd-input-bg: #F0F0F0;
    --zd-nav-separator: #B9B9B9;
    --zd-toc-bg: #DEDEDE;
    --zd-disabled-text: #696969;
    --zd-oldbox-blue-bg: #D7DEDF;
    --zd-oldbox-blue-label: #526D73;
    --zd-oldbox-blue-stripe: #92A6AA;
    --zd-oldbox-green-bg: #D8E2D9;
    --zd-oldbox-green-label: #536E59;
    --zd-oldbox-green-stripe: #92A99A;
    --zd-oldbox-orange-bg: #E7DED2;
    --zd-oldbox-orange-label: #795C3F;
    --zd-oldbox-orange-stripe: #B2A08D;
    --zd-oldbox-red-bg: #E5DADB;
    --zd-oldbox-red-label: #804E53;
    --zd-oldbox-red-stripe: #B49BA1;
    --zd-oldbox-pink-bg: #E5D9E1;
    --zd-oldbox-pink-label: #79576E;
    --zd-oldbox-pink-stripe: #B5A0AC;
    --zd-oldbox-yellow-bg: #E7E0D3;
    --zd-oldbox-yellow-label: #76623B;
    --zd-oldbox-yellow-stripe: #B0A48A;
    --zd-oldbox-gray-bg: #D9D9D9;
    --zd-oldbox-gray-label: #646464;
    --zd-oldbox-gray-stripe: #AAAAAA;
    --zd-set01-bg: #D8D8D8;
    --zd-set01-accent: #444444;
    --zd-set02-bg: #D8D8D8;
    --zd-set02-accent: #444444;
    --zd-set03-bg: #D8D8D8;
    --zd-set03-accent: #444444;
    --zd-set04-bg: #D8D8D8;
    --zd-set04-accent: #444444;
  }
  :where(html[data-zek-mode="dark"]) {
    --zd-page-bg: #202020;
    --zd-content-bg: #2E2E2E;
    --zd-text-color: #D8D8D8;
    --zd-muted-text: #B6B6B6;
    --zd-link-color: #B9D8E6;
    --zd-border-color: #505050;
    --zd-heading-bg: #454545;
    --zd-heading-text: #FFFFFF;
    --zd-oldbox-stripe-base: #2A2A2A;
    --zd-list-head-bg: #414141;
    --zd-list-body-bg: #343434;
    --zd-list-border: #666666;
    --zd-triangle-bg: #383838;
    --zd-marker-yellow-bg: #514A36;
    --zd-marker-orange-bg: #514339;
    --zd-marker-sky-bg: #36464A;
    --zd-marker-green-bg: #3B493C;
    --zd-table-head-bg: #424242;
    --zd-table-head-text: #D8D8D8;
    --zd-table-head-active-bg: #535353;
    --zd-table-head-active-text: #D8D8D8;
    --zd-table-odd-bg: #2E2E2E;
    --zd-table-even-bg: #363636;
    --zd-table-hover-bg: #424242;
    --zd-table-border: #505050;
    --zd-table-odd-text: #D8D8D8;
    --zd-table-even-text: #D8D8D8;
    --zd-table-hover-text: #D8D8D8;
    --zd-ink-red: #EFB2B2;
    --zd-ink-blue: #A7C4E6;
    --zd-ink-orange: #EAB08A;
    --zd-box-info-bg: var(--zd-oldbox-blue-bg);
    --zd-box-warning-bg: var(--zd-oldbox-yellow-bg);
    --zd-box-danger-bg: var(--zd-oldbox-red-bg);
    --zd-box-success-bg: var(--zd-oldbox-green-bg);
    --zd-panel-bg: #323232;
    --zd-input-bg: #383838;
    --zd-nav-separator: #505050;
    --zd-toc-bg: #363636;
    --zd-disabled-text: #ABABAB;
    --zd-oldbox-blue-bg: #383B3C;
    --zd-oldbox-blue-label: #526D73;
    --zd-oldbox-blue-stripe: #526368;
    --zd-oldbox-green-bg: #383B38;
    --zd-oldbox-green-label: #536E59;
    --zd-oldbox-green-stripe: #526357;
    --zd-oldbox-orange-bg: #3C3935;
    --zd-oldbox-orange-label: #795C3F;
    --zd-oldbox-orange-stripe: #665B4C;
    --zd-oldbox-red-bg: #3B3738;
    --zd-oldbox-red-label: #804E53;
    --zd-oldbox-red-stripe: #695356;
    --zd-oldbox-pink-bg: #3B383B;
    --zd-oldbox-pink-label: #79576E;
    --zd-oldbox-pink-stripe: #665462;
    --zd-oldbox-yellow-bg: #3C3A35;
    --zd-oldbox-yellow-label: #76623B;
    --zd-oldbox-yellow-stripe: #665D48;
    --zd-oldbox-gray-bg: #383838;
    --zd-oldbox-gray-label: #646464;
    --zd-oldbox-gray-stripe: #5A5A5A;
    --zd-set01-bg: #373737;
    --zd-set01-accent: #C9C9C9;
    --zd-set02-bg: #373737;
    --zd-set02-accent: #C9C9C9;
    --zd-set03-bg: #373737;
    --zd-set03-accent: #C9C9C9;
    --zd-set04-bg: #373737;
    --zd-set04-accent: #C9C9C9;
  }

  /* Bridge the theme's shared variables. --color-main is NOT replaced globally. */
  html[data-zek-mode="gray"], html[data-zek-mode="dark"] {
    --color-background: var(--zd-content-bg);
    --color-background-body: var(--zd-page-bg);
    --color-text: var(--zd-text-color);
    --color-link: var(--zd-link-color);
    --color-main-gradation-custom: var(--zd-heading-bg);
  }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) body {
    color: var(--zd-text-color);
    background-color: var(--zd-page-bg);
  }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) body::after {
    background-image: linear-gradient(to bottom, var(--zd-heading-bg), var(--zd-page-bg));
  }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) :is(.post-content,.main-content,.widget,.ham-menu__inner) {
    color: var(--zd-text-color);
  }
  /* Ordinary text links: keep color specificity at zero so intentionally styled links
   * keep their colors. Raise ONLY the underline specificity so theme resets cannot
   * remove the non-color indication of links (WCAG link identification).
   * Both rules exclude Pochipp and button-like links. */
  :where(html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content :is(p,li,td,th,dd,blockquote) a:not(
    .pochipp-box a, .wp-block-button a, .btn a, [role="button"],
    [class*="btn"], [class*="button"], .wp-block-button__link
  )) {
    color: var(--zd-link-color);
  }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content :is(p,li,td,th,dd,blockquote) a:where(:not(
    .pochipp-box a, .wp-block-button a, .btn a, [role="button"],
    [class*="btn"], [class*="button"], .wp-block-button__link
  )) {
    text-decoration: underline;
    text-underline-offset: 0.14em;
  }
  /* Browsers supporting :has can exempt links displaying only images. */
  @supports selector(a:has(> img)) {
    html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content :is(p,li,td,th,dd,blockquote) a:has(> img, > picture):not(.pochipp-box a) {
      text-decoration: none;
    }
  }
  /* User's Additional CSS has !important for H2 and the TOC heading. */
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content h2,
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .js-toc-head.toc__head {
    color: var(--zd-heading-text) !important;
    background-color: var(--zd-heading-bg) !important;
    background-image: none !important;
  }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content h2 a {
    color: var(--zd-heading-text) !important;
  }
  /* Theme-specific navigation, headings, TOC, pagination, sidebar controls. */
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) :is(.hdr__catchphrase,.toc__head) {
    background: var(--zd-heading-bg);
    color: var(--zd-heading-text);
  }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) :is(.hdr__catchphrase,.toc__head) a {color:inherit;}
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) :is(.toc__main,.tocmodal__inner,.widget-toc .toc__main,.tocmodal) {
    color: var(--zd-text-color);
  }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) :is(.toc__main,.tocmodal__inner,.widget-toc .toc__main) {
    background-color: var(--zd-toc-bg);
  }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .toc__number {
    background: var(--zd-list-head-bg);
    color: var(--zd-muted-text);
  }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .tocmodal__close {
    background: var(--zd-content-bg);
  }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .tocmodal__close::after,
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .tocmodal__close::before {
    background: var(--zd-text-color);
  }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .tocmodal-btn a {
    background: var(--zd-content-bg);
    color: var(--zd-text-color);
    border-color: var(--zd-border-color);
    mix-blend-mode: normal;
  }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) :is(.entry-nav,.post-content__pager,.breadcrumb,.sidebar,.ftr-nav,.ham-menu__inner) {
    border-color: var(--zd-border-color);
  }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) :is(.post-content__pager .post-page-numbers,.entry-nav a,.breadcrumb__list li:last-of-type a) {
    color: var(--zd-text-color);
  }
  /* Additional CSS: non-TOC detail summaries carry a hardcoded white/light background. */
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content details:not(.toc) > summary {
    background: var(--zd-list-head-bg);
    color: var(--zd-text-color);
    border-color: var(--zd-border-color);
  }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content details:not(.toc) > summary::after {
    color: var(--zd-muted-text);
  }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) :is(.post-content,.comment-respond,.search-form,.sidebar) :is(input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]), textarea, select) {
    background-color: var(--zd-input-bg);
    color: var(--zd-text-color);
    border-color: var(--zd-border-color);
  }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) :is(.post-content,.comment-respond,.search-form,.sidebar) :is(input, textarea)::placeholder {
    color: var(--zd-muted-text);
  }
  /* Native form controls may follow the current dark palette; no iframe/advertiser changes. */
  html[data-zek-mode="dark"] :is(.comment-respond,.search-form) :is(input,textarea,select) {
    color-scheme: dark;
  }
  /* No blanket input/button/iframe filters: ad and shop widgets are excluded. */
  /* Legacy Keni: override colors only. Geometry, label offset, stripe size inherited. */
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .box_style_blue {
    background-image: linear-gradient(-45deg, var(--zd-oldbox-stripe-base) 25%, var(--zd-oldbox-blue-stripe) 25%, var(--zd-oldbox-blue-stripe) 50%, var(--zd-oldbox-stripe-base) 50%, var(--zd-oldbox-stripe-base) 75%, var(--zd-oldbox-blue-stripe) 75%, var(--zd-oldbox-blue-stripe));
  }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .box_style_blue .box_inner { background-color: var(--zd-oldbox-blue-bg); color: var(--zd-text-color); }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .box_style_blue .box_style_title span { background-color: var(--zd-oldbox-blue-label); color: #FFFFFF; }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .box_style_blue .box_style_title span::before {
    border-top-color: var(--zd-oldbox-blue-label);
    border-right-color: var(--zd-oldbox-blue-label);
  }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .box_style_green {
    background-image: linear-gradient(-45deg, var(--zd-oldbox-stripe-base) 25%, var(--zd-oldbox-green-stripe) 25%, var(--zd-oldbox-green-stripe) 50%, var(--zd-oldbox-stripe-base) 50%, var(--zd-oldbox-stripe-base) 75%, var(--zd-oldbox-green-stripe) 75%, var(--zd-oldbox-green-stripe));
  }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .box_style_green .box_inner { background-color: var(--zd-oldbox-green-bg); color: var(--zd-text-color); }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .box_style_green .box_style_title span { background-color: var(--zd-oldbox-green-label); color: #FFFFFF; }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .box_style_green .box_style_title span::before {
    border-top-color: var(--zd-oldbox-green-label);
    border-right-color: var(--zd-oldbox-green-label);
  }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .box_style_orange {
    background-image: linear-gradient(-45deg, var(--zd-oldbox-stripe-base) 25%, var(--zd-oldbox-orange-stripe) 25%, var(--zd-oldbox-orange-stripe) 50%, var(--zd-oldbox-stripe-base) 50%, var(--zd-oldbox-stripe-base) 75%, var(--zd-oldbox-orange-stripe) 75%, var(--zd-oldbox-orange-stripe));
  }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .box_style_orange .box_inner { background-color: var(--zd-oldbox-orange-bg); color: var(--zd-text-color); }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .box_style_orange .box_style_title span { background-color: var(--zd-oldbox-orange-label); color: #FFFFFF; }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .box_style_orange .box_style_title span::before {
    border-top-color: var(--zd-oldbox-orange-label);
    border-right-color: var(--zd-oldbox-orange-label);
  }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .box_style_red {
    background-image: linear-gradient(-45deg, var(--zd-oldbox-stripe-base) 25%, var(--zd-oldbox-red-stripe) 25%, var(--zd-oldbox-red-stripe) 50%, var(--zd-oldbox-stripe-base) 50%, var(--zd-oldbox-stripe-base) 75%, var(--zd-oldbox-red-stripe) 75%, var(--zd-oldbox-red-stripe));
  }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .box_style_red .box_inner { background-color: var(--zd-oldbox-red-bg); color: var(--zd-text-color); }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .box_style_red .box_style_title span { background-color: var(--zd-oldbox-red-label); color: #FFFFFF; }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .box_style_red .box_style_title span::before {
    border-top-color: var(--zd-oldbox-red-label);
    border-right-color: var(--zd-oldbox-red-label);
  }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .box_style_pink {
    background-image: linear-gradient(-45deg, var(--zd-oldbox-stripe-base) 25%, var(--zd-oldbox-pink-stripe) 25%, var(--zd-oldbox-pink-stripe) 50%, var(--zd-oldbox-stripe-base) 50%, var(--zd-oldbox-stripe-base) 75%, var(--zd-oldbox-pink-stripe) 75%, var(--zd-oldbox-pink-stripe));
  }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .box_style_pink .box_inner { background-color: var(--zd-oldbox-pink-bg); color: var(--zd-text-color); }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .box_style_pink .box_style_title span { background-color: var(--zd-oldbox-pink-label); color: #FFFFFF; }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .box_style_pink .box_style_title span::before {
    border-top-color: var(--zd-oldbox-pink-label);
    border-right-color: var(--zd-oldbox-pink-label);
  }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .box_style_yellow {
    background-image: linear-gradient(-45deg, var(--zd-oldbox-stripe-base) 25%, var(--zd-oldbox-yellow-stripe) 25%, var(--zd-oldbox-yellow-stripe) 50%, var(--zd-oldbox-stripe-base) 50%, var(--zd-oldbox-stripe-base) 75%, var(--zd-oldbox-yellow-stripe) 75%, var(--zd-oldbox-yellow-stripe));
  }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .box_style_yellow .box_inner { background-color: var(--zd-oldbox-yellow-bg); color: var(--zd-text-color); }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .box_style_yellow .box_style_title span { background-color: var(--zd-oldbox-yellow-label); color: #FFFFFF; }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .box_style_yellow .box_style_title span::before {
    border-top-color: var(--zd-oldbox-yellow-label);
    border-right-color: var(--zd-oldbox-yellow-label);
  }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .box_style_gray {
    background-image: linear-gradient(-45deg, var(--zd-oldbox-stripe-base) 25%, var(--zd-oldbox-gray-stripe) 25%, var(--zd-oldbox-gray-stripe) 50%, var(--zd-oldbox-stripe-base) 50%, var(--zd-oldbox-stripe-base) 75%, var(--zd-oldbox-gray-stripe) 75%, var(--zd-oldbox-gray-stripe));
  }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .box_style_gray .box_inner { background-color: var(--zd-oldbox-gray-bg); color: var(--zd-text-color); }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .box_style_gray .box_style_title span { background-color: var(--zd-oldbox-gray-label); color: #FFFFFF; }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .box_style_gray .box_style_title span::before {
    border-top-color: var(--zd-oldbox-gray-label);
    border-right-color: var(--zd-oldbox-gray-label);
  }
  /* SYN: normal list and outline list keep their different layouts. */
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content .synx-block-dl:not(.is-style-outline) {
    background: var(--zd-list-body-bg);
    border-color: var(--zd-list-border);
  }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content .synx-block-dl:not(.is-style-outline) .synx-block-dl__dt {
    color: var(--zd-text-color);
    background: var(--zd-list-head-bg);
  }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content .synx-block-dl:not(.is-style-outline) .synx-block-dl__dt::before {
    background: var(--zd-heading-bg);
  }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content .synx-block-dl.is-style-outline {
    border-color: var(--zd-list-border);
    background-color: var(--zd-content-bg);
  }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content .synx-block-dl.is-style-outline .synx-block-dl__dt {
    color: var(--zd-text-color);
    background: var(--zd-content-bg);
    border-color: var(--zd-list-border);
  }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content p.is-style-triangle {
    background-color: var(--zd-triangle-bg);
    color: var(--zd-text-color);
  }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content p.is-style-triangle::before {
    background-color: var(--zd-heading-bg);
  }
  /* SYN color set 01: map to theme's actual hue without assuming its name. */
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content .synx-block-dl.is-color01:not(.is-style-outline) { background: var(--zd-set01-bg); }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content .synx-block-dl.is-color01:not(.is-style-outline) .synx-block-dl__dt {
    color: var(--zd-set01-accent);
    background: var(--zd-list-head-bg);
  }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content .synx-block-dl.is-color01:not(.is-style-outline) .synx-block-dl__dt::before { background: var(--zd-set01-accent); }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content .synx-block-dl.is-color01.is-style-outline { border-color: var(--zd-set01-accent); }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content .synx-block-dl.is-color01.is-style-outline .synx-block-dl__dt { color: var(--zd-set01-accent); border-color: var(--zd-set01-accent); }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content p.is-style-triangle.is-color01 { background: var(--zd-set01-bg); }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content p.is-style-triangle.is-color01::before { background: var(--zd-set01-accent); }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content .synx-icon-box.is-color01 { background: var(--zd-set01-bg); --icon-color: var(--zd-set01-accent); }
  /* SYN color set 02: map to theme's actual hue without assuming its name. */
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content .synx-block-dl.is-color02:not(.is-style-outline) { background: var(--zd-set02-bg); }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content .synx-block-dl.is-color02:not(.is-style-outline) .synx-block-dl__dt {
    color: var(--zd-set02-accent);
    background: var(--zd-list-head-bg);
  }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content .synx-block-dl.is-color02:not(.is-style-outline) .synx-block-dl__dt::before { background: var(--zd-set02-accent); }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content .synx-block-dl.is-color02.is-style-outline { border-color: var(--zd-set02-accent); }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content .synx-block-dl.is-color02.is-style-outline .synx-block-dl__dt { color: var(--zd-set02-accent); border-color: var(--zd-set02-accent); }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content p.is-style-triangle.is-color02 { background: var(--zd-set02-bg); }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content p.is-style-triangle.is-color02::before { background: var(--zd-set02-accent); }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content .synx-icon-box.is-color02 { background: var(--zd-set02-bg); --icon-color: var(--zd-set02-accent); }
  /* SYN color set 03: map to theme's actual hue without assuming its name. */
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content .synx-block-dl.is-color03:not(.is-style-outline) { background: var(--zd-set03-bg); }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content .synx-block-dl.is-color03:not(.is-style-outline) .synx-block-dl__dt {
    color: var(--zd-set03-accent);
    background: var(--zd-list-head-bg);
  }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content .synx-block-dl.is-color03:not(.is-style-outline) .synx-block-dl__dt::before { background: var(--zd-set03-accent); }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content .synx-block-dl.is-color03.is-style-outline { border-color: var(--zd-set03-accent); }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content .synx-block-dl.is-color03.is-style-outline .synx-block-dl__dt { color: var(--zd-set03-accent); border-color: var(--zd-set03-accent); }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content p.is-style-triangle.is-color03 { background: var(--zd-set03-bg); }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content p.is-style-triangle.is-color03::before { background: var(--zd-set03-accent); }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content .synx-icon-box.is-color03 { background: var(--zd-set03-bg); --icon-color: var(--zd-set03-accent); }
  /* SYN color set 04: map to theme's actual hue without assuming its name. */
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content .synx-block-dl.is-color04:not(.is-style-outline) { background: var(--zd-set04-bg); }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content .synx-block-dl.is-color04:not(.is-style-outline) .synx-block-dl__dt {
    color: var(--zd-set04-accent);
    background: var(--zd-list-head-bg);
  }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content .synx-block-dl.is-color04:not(.is-style-outline) .synx-block-dl__dt::before { background: var(--zd-set04-accent); }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content .synx-block-dl.is-color04.is-style-outline { border-color: var(--zd-set04-accent); }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content .synx-block-dl.is-color04.is-style-outline .synx-block-dl__dt { color: var(--zd-set04-accent); border-color: var(--zd-set04-accent); }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content p.is-style-triangle.is-color04 { background: var(--zd-set04-bg); }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content p.is-style-triangle.is-color04::before { background: var(--zd-set04-accent); }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content .synx-icon-box.is-color04 { background: var(--zd-set04-bg); --icon-color: var(--zd-set04-accent); }

  /* Mix only if supported; fixed neutral fallbacks above remain usable. */
  @supports (color: color-mix(in srgb, #000000 50%, #ffffff)) {
    :where(html[data-zek-mode="gray"]) {
      --zd-set01-bg: color-mix(in srgb, var(--zd-list-body-bg) 80%, var(--color-elight01, #999999) 20%);
      --zd-set01-accent: color-mix(in srgb, var(--zd-text-color) 85%, var(--color-edark01, #666666) 15%);
      --zd-set02-bg: color-mix(in srgb, var(--zd-list-body-bg) 80%, var(--color-elight02, #999999) 20%);
      --zd-set02-accent: color-mix(in srgb, var(--zd-text-color) 85%, var(--color-edark02, #666666) 15%);
      --zd-set03-bg: color-mix(in srgb, var(--zd-list-body-bg) 80%, var(--color-elight03, #999999) 20%);
      --zd-set03-accent: color-mix(in srgb, var(--zd-text-color) 85%, var(--color-edark03, #666666) 15%);
      --zd-set04-bg: color-mix(in srgb, var(--zd-list-body-bg) 80%, var(--color-elight04, #999999) 20%);
      --zd-set04-accent: color-mix(in srgb, var(--zd-text-color) 85%, var(--color-edark04, #666666) 15%);
    }
    :where(html[data-zek-mode="dark"]) {
      --zd-set01-bg: color-mix(in srgb, var(--zd-triangle-bg) 92%, var(--color-elight01, #999999) 8%);
      --zd-set01-accent: color-mix(in srgb, var(--zd-text-color) 85%, var(--color-edark01, #666666) 15%);
      --zd-set02-bg: color-mix(in srgb, var(--zd-triangle-bg) 92%, var(--color-elight02, #999999) 8%);
      --zd-set02-accent: color-mix(in srgb, var(--zd-text-color) 85%, var(--color-edark02, #666666) 15%);
      --zd-set03-bg: color-mix(in srgb, var(--zd-triangle-bg) 92%, var(--color-elight03, #999999) 8%);
      --zd-set03-accent: color-mix(in srgb, var(--zd-text-color) 85%, var(--color-edark03, #666666) 15%);
      --zd-set04-bg: color-mix(in srgb, var(--zd-triangle-bg) 92%, var(--color-elight04, #999999) 8%);
      --zd-set04-accent: color-mix(in srgb, var(--zd-text-color) 85%, var(--color-edark04, #666666) 15%);
    }
  }

  /* SYN markers: preserve 60%-from-top underline gradient and old marker shape. */
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content .synx-marker.is-yellow {
    background: linear-gradient(transparent 60%, var(--zd-marker-yellow-bg) 60%);
  }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content .synx-marker.is-orange {
    background: linear-gradient(transparent 60%, var(--zd-marker-orange-bg) 60%);
  }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content .synx-marker.is-sky {
    background: linear-gradient(transparent 60%, var(--zd-marker-sky-bg) 60%);
  }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content .synx-marker.is-green {
    background: linear-gradient(transparent 60%, var(--zd-marker-green-bg) 60%);
  }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content .line-yellow {
    background-image: linear-gradient(transparent 60%, var(--zd-marker-yellow-bg) 60%);
  }

  /* TablePress: official properties must be set on .tablepress to honor per-ID overrides.
   * Existing 768px scroll, per-ID widths/font sizes, top margin and 6px padding untouched. */
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .tablepress {
    --head-bg-color: var(--zd-table-head-bg);
    --head-text-color: var(--zd-table-head-text);
    --head-active-bg-color: var(--zd-table-head-active-bg);
    --head-active-text-color: var(--zd-table-head-active-text);
    --odd-bg-color: var(--zd-table-odd-bg);
    --odd-text-color: var(--zd-table-odd-text);
    --even-bg-color: var(--zd-table-even-bg);
    --even-text-color: var(--zd-table-even-text);
    --hover-bg-color: var(--zd-table-hover-bg);
    --hover-text-color: var(--zd-table-hover-text);
    color: var(--zd-text-color);
    border-color: var(--zd-table-border);
  }
  /* Legacy Additional CSS contains table:not(.review-table) thead th { background:#333; color:#fff }.
   * Set a paired override for header/th/links and sorted/hovered headers. */
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) table.tablepress thead th,
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) table.tablepress tfoot th {
    background-color: var(--zd-table-head-bg);
    color: var(--zd-table-head-text);
    border-color: var(--zd-table-border);
  }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) table.tablepress thead th[aria-sort]:not([aria-sort="none"]),
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) table.tablepress thead th.dt-ordering-asc,
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) table.tablepress thead th.dt-ordering-desc {
    background-color: var(--zd-table-head-active-bg);
    color: var(--zd-table-head-active-text);
  }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) table.tablepress thead th > a {
    color: var(--zd-table-head-text);
  }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) table.tablepress thead th:is([aria-sort]:not([aria-sort="none"]),.dt-ordering-asc,.dt-ordering-desc) > a {
    color: var(--zd-table-head-active-text);
  }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) table.tablepress :is(tbody td,tbody th,tfoot td) {
    border-color: var(--zd-table-border);
  }
  /* Deliberate exclusion: .review-table uses its own schema; inspect usage before overrides. */

  /* SYN/standard HTML tables: conservative fallback, not an unconditional cell recolor.
   * The supplied SYN editor_front.css defines stripe colors on tr, and does not
   * force white backgrounds on ordinary tbody td/th; avoid overriding special
   * table cells or legacy table styling until WP STAGING rendering confirms it.
   * Explicit inline, bgcolor, and classed special cells remain untouched. */
  :where(html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content :is(.synx-tbl,.wp-block-table,table:not(.tablepress,.review-table,[style]))) {
    background-color: var(--zd-content-bg);
    color: var(--zd-text-color);
  }
  :where(html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content :is(.synx-tbl,.wp-block-table,table:not(.tablepress,.review-table)) :is(tbody,tfoot) > tr > :is(td,th):not([class],[style],[bgcolor])) {
    background-color: transparent;
  }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content :is(.synx-tbl,.wp-block-table) :is(thead,thead tr) {
    background: var(--zd-table-head-bg);
  }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content :is(.synx-tbl,.wp-block-table) thead th {
    background: var(--zd-table-head-bg);
    color: var(--zd-table-head-text);
  }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content :is(.synx-tbl,.wp-block-table) :is(td,th) {
    border-color: var(--zd-table-border);
  }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content :is(.synx-tbl,.wp-block-table).is-style-stripes tbody tr:nth-child(odd) {
    background: var(--zd-table-odd-bg);
  }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content :is(.synx-tbl,.wp-block-table).is-style-stripes tbody tr:nth-child(even) {
    background: var(--zd-table-even-bg);
  }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content table:not(.tablepress,.review-table) thead th {
    background: var(--zd-table-head-bg);
    color: var(--zd-table-head-text);
    border-color: var(--zd-table-border);
  }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content table:not(.tablepress,.review-table) :is(td,th) {
    border-color: var(--zd-table-border);
  }
  /* Explicitly pair the standard table header background with header link text. */
  :where(html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content table:not(.tablepress,.review-table) thead th > a:not([style])) {
    color: var(--zd-table-head-text);
  }
  /* Attribute matches require a declaration boundary; never match background-color/border-color.
   * Unseen formats may remain; article HTML is never rewritten. */
html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content span[style^="color: #ff0000;" i]:not([style*="background" i]),
html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content span[style^="color:#ff0000;" i]:not([style*="background" i]),
html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content span[style$="; color: #ff0000" i]:not([style*="background" i]),
html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content span[style$=";color: #ff0000" i]:not([style*="background" i]),
html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content span[style="color: #ff0000" i]:not([style*="background" i]),
html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content span[style$="; color:#ff0000" i]:not([style*="background" i]),
html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content span[style$=";color:#ff0000" i]:not([style*="background" i]),
html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content span[style="color:#ff0000" i]:not([style*="background" i]),
html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content span[style*=";color: #ff0000;" i]:not([style*="background" i]),
html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content span[style*="; color: #ff0000;" i]:not([style*="background" i]),
html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content span[style*=";color:#ff0000;" i]:not([style*="background" i]),
html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content span[style*="; color:#ff0000;" i]:not([style*="background" i]) { color: var(--zd-ink-red) !important; }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content span[style^="color: #0000ff;" i],
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content span[style^="color:#0000ff;" i],
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content span[style$="; color: #0000ff" i],
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content span[style$=";color: #0000ff" i],
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content span[style="color: #0000ff" i],
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content span[style$="; color:#0000ff" i],
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content span[style$=";color:#0000ff" i],
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content span[style="color:#0000ff" i],
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content span[style*=";color: #0000ff;" i],
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content span[style*="; color: #0000ff;" i],
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content span[style*=";color:#0000ff;" i],
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content span[style*="; color:#0000ff;" i] { color: var(--zd-ink-blue) !important; }
html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content span[style^="color: rgb(255, 0, 0);" i]:not([style*="background" i]),
html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content span[style^="color:rgb(255, 0, 0);" i]:not([style*="background" i]),
html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content span[style$="; color: rgb(255, 0, 0)" i]:not([style*="background" i]),
html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content span[style$=";color: rgb(255, 0, 0)" i]:not([style*="background" i]),
html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content span[style="color: rgb(255, 0, 0)" i]:not([style*="background" i]),
html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content span[style$="; color:rgb(255, 0, 0)" i]:not([style*="background" i]),
html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content span[style$=";color:rgb(255, 0, 0)" i]:not([style*="background" i]),
html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content span[style="color:rgb(255, 0, 0)" i]:not([style*="background" i]),
html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content span[style*=";color: rgb(255, 0, 0);" i]:not([style*="background" i]),
html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content span[style*="; color: rgb(255, 0, 0);" i]:not([style*="background" i]),
html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content span[style*=";color:rgb(255, 0, 0);" i]:not([style*="background" i]),
html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content span[style*="; color:rgb(255, 0, 0);" i]:not([style*="background" i]) { color: var(--zd-ink-red) !important; }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content span[style^="color: rgb(0, 0, 255);" i],
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content span[style^="color:rgb(0, 0, 255);" i],
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content span[style$="; color: rgb(0, 0, 255)" i],
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content span[style$=";color: rgb(0, 0, 255)" i],
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content span[style="color: rgb(0, 0, 255)" i],
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content span[style$="; color:rgb(0, 0, 255)" i],
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content span[style$=";color:rgb(0, 0, 255)" i],
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content span[style="color:rgb(0, 0, 255)" i],
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content span[style*=";color: rgb(0, 0, 255);" i],
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content span[style*="; color: rgb(0, 0, 255);" i],
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content span[style*=";color:rgb(0, 0, 255);" i],
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content span[style*="; color:rgb(0, 0, 255);" i] { color: var(--zd-ink-blue) !important; }

  /* Confirmed in live post 6824: color:#ff6600; — low-contrast on gray. */
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content span[style^="color: #ff6600;" i],
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content span[style^="color:#ff6600;" i],
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content span[style$="; color: #ff6600" i],
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content span[style$=";color: #ff6600" i],
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content span[style="color: #ff6600" i],
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content span[style$="; color:#ff6600" i],
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content span[style$=";color:#ff6600" i],
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content span[style="color:#ff6600" i],
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content span[style*=";color: #ff6600;" i],
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content span[style*="; color: #ff6600;" i],
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content span[style*=";color:#ff6600;" i],
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content span[style*="; color:#ff6600;" i] { color: var(--zd-ink-orange) !important; }


  /* Final appearance pass (rc5). White mode deliberately remains theme-owned. */
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) {
    --zd-control-bg: #E1E1E1;
    --zd-control-hover: #D2D2D2;
    --zd-control-ink: #242424;
    --zd-control-line: #777777;
    --zd-copy-bg: #DADADA;
    --zd-copy-hover: #CACACA;
    --zd-banner-bg: #285D82;
    --zd-product-bg: #E2E2E2;
    --zd-product-ink: #262626;
    --zd-tag-red: #AC3F3F;
    --zd-tag-orange: #B45B27;
    --zd-tag-cyan: #26747B;
    --zd-tag-lime: #5C7B28;
    --zd-tag-purple: #753E79;
    --zd-tag-green: #287344;
    --zd-flag-orange: #845425;
    --zd-flag-green: #286949;
    --zd-flag-cyan: #2B6578;
    --zd-flag-blue: #3A568C;
    --zd-flag-gray1: #575757;
    --zd-flag-gray2: #616161;
  }
  html[data-zek-mode="dark"] {
    --zd-control-bg: #484848;
    --zd-control-hover: #575757;
    --zd-control-ink: #F1F1F1;
    --zd-control-line: #808080;
    --zd-copy-bg: #484848;
    --zd-copy-hover: #585858;
    --zd-banner-bg: #294D66;
    --zd-product-bg: #D0D0D0;
    --zd-product-ink: #222222;
    --zd-flag-orange: #D6A06C;
    --zd-flag-green: #81B49D;
    --zd-flag-cyan: #8BC3D5;
    --zd-flag-blue: #9CAFEA;
    --zd-flag-gray1: #B9B9B9;
    --zd-flag-gray2: #ABABAB;
  }
  /* The theme hardcodes #fff here; pair button background and text in every state. */
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) :is(.entry-nav__home a,.comment-respond .form-submit .submit) {
    background: var(--zd-control-bg);
    color: var(--zd-control-ink);
    border-color: var(--zd-control-line);
  }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) :is(.entry-nav__home a,.comment-respond .form-submit .submit):is(:hover,:focus-visible) {
    background: var(--zd-control-hover);
    color: var(--zd-control-ink);
  }
  /* v0.2.3: Dark floating TOP button should have a stable, visible hit
   * boundary. No border-width/size/position changes on hover. Disable the
   * theme's difference blend mode and 4px hover lift for this button only. */
  html[data-zek-mode="dark"] .return-top a {
    box-sizing: border-box;
    border: 1px solid #858585;
    background-color: #262626;
    color: #FFFFFF;
    mix-blend-mode: normal;
    transform: none;
    transition: background-color .15s ease, border-color .15s ease;
  }
  html[data-zek-mode="dark"] .return-top a:is(:hover,:focus-visible) {
    border-color: #B2B2B2;
    background-color: #383838;
    color: #FFFFFF;
    transform: none;
  }

  /* Floating share controls: no white flash on X hover or copy button. */
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .common-share-fixed__link--copy {
    background: var(--zd-copy-bg);
    color: var(--zd-control-ink);
    border-color: var(--zd-control-line);
  }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .common-share-fixed__link--copy:is(:hover,:focus-visible,.is-copied) {
    background: var(--zd-copy-hover);
    color: var(--zd-control-ink);
  }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .common-share-fixed__link--copy.is-copied::after {
    color: var(--zd-control-ink);
  }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .common-share-fixed__link--x {
    background: #171717;
    color: #F7F7F7;
    border-color: #777777;
  }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .common-share-fixed__link--x:is(:hover,:focus-visible) {
    background: #333333;
    color: #FFFFFF;
    border-color: #999999;
  }
  /* Site announcement is .hdr-news, while .hdr__catchphrase is a separate theme area. */
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .hdr-news {
    background-color: var(--zd-banner-bg);
    color: #FFFFFF;
  }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .hdr-news a {color: #FFFFFF;}
  /* SYN heading hierarchy: make H3/H4 distinct without changing layout/spacing. */
  html[data-zek-mode="dark"] .post-content :is(h3,h4,h5,h6) {color:#EEEEEE;}
  html[data-zek-mode="dark"] .post-content > h3,
  html[data-zek-mode="dark"] .post-content h3.wp-block-heading {
    background-color: #3B3B3B;
    color: #F2F2F2;
  }
  html[data-zek-mode="dark"] .post-content > h3::before,
  html[data-zek-mode="dark"] .post-content h3.wp-block-heading::before {
    background: #858585;
    height: 3px;
  }
  html[data-zek-mode="dark"] .post-content > h4,
  html[data-zek-mode="dark"] .post-content h4.wp-block-heading {
    border-left-color: #626262;
    border-left-width: 3px;
    color: #EDEDED;
  }
  html[data-zek-mode="dark"] .post-content h2 {
    --zd-heading-bg: #505050;
    border-bottom: 3px solid #909090;
  }
  /* Sidebar's older inline red annotations: never alter unrelated background-color. */
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) :is(.sidebar,.widget) span:is(
    [style^="color: #ff0000" i], [style^="color:#ff0000" i],
    [style*="; color: #ff0000;" i], [style*=";color:#ff0000;" i],
    [style^="color: red" i], [style^="color:red" i]
  ),
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) :is(.sidebar,.widget) font:is([color="#ff0000" i],[color="red" i]) {
    color: var(--zd-ink-red) !important;
  }
  /* Colored fleet-identity tags: exact known inline background hues, not image filters.
   * Map to lower-chroma, high-contrast versions while retaining red/orange/cyan/etc. */
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content span.b:is([style*="background-color: #ff0000;" i],[style*="background-color:#ff0000;" i]) {
    background-color: var(--zd-tag-red) !important;
    color: #FFFFFF !important;
  }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content span.b:is([style*="background-color: #ff6600;" i],[style*="background-color:#ff6600;" i]) {
    background-color: var(--zd-tag-orange) !important;
    color: #FFFFFF !important;
  }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content span.b:is([style*="background-color: #00ffff;" i],[style*="background-color:#00ffff;" i]) {
    background-color: var(--zd-tag-cyan) !important;
    color: #FFFFFF !important;
  }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content span.b:is([style*="background-color: #99cc00;" i],[style*="background-color:#99cc00;" i]) {
    background-color: var(--zd-tag-lime) !important;
    color: #FFFFFF !important;
  }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content span.b:is([style*="background-color: #800080;" i],[style*="background-color:#800080;" i]) {
    background-color: var(--zd-tag-purple) !important;
    color: #FFFFFF !important;
  }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content span.b:is([style*="background-color: #008000;" i],[style*="background-color:#008000;" i]) {
    background-color: var(--zd-tag-green) !important;
    color: #FFFFFF !important;
  }
  /* Fleet labels that use foreground colors rather than backgrounds. */
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content span.b:is([style^="color: #ff9900;" i],[style^="color:#ff9900;" i]) {
    color: var(--zd-flag-orange) !important;
  }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content span.b:is([style^="color: #339966;" i],[style^="color:#339966;" i]) {
    color: var(--zd-flag-green) !important;
  }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content span.b:is([style^="color: #00ccff;" i],[style^="color:#00ccff;" i]) {
    color: var(--zd-flag-cyan) !important;
  }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content span.b:is([style^="color: #3366ff;" i],[style^="color:#3366ff;" i]) {
    color: var(--zd-flag-blue) !important;
  }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content span.b:is([style^="color: #999999;" i],[style^="color:#999999;" i]) {
    color: var(--zd-flag-gray1) !important;
  }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .post-content span.b:is([style^="color: #808080;" i],[style^="color:#808080;" i]) {
    color: var(--zd-flag-gray2) !important;
  }
  /* Pochipp: soften only the product card and branded buttons. No image/iframe filters. */
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .pochipp-box {
    background-color: var(--zd-product-bg);
    color: var(--zd-product-ink);
  }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .pochipp-box[data-btn-style="dflt"] .pochipp-box__btn {
    filter: saturate(.82);
  }

  /* rc6: Additional CSS defines legacy named colors as !important. On dark
   * background some (black/navy/brown) are nearly invisible. Limit the fix to
   * text-level elements without their own background declarations. Intentionally
   * colored labels with inline backgrounds continue to use their badge rules. */
  html[data-zek-mode="dark"] .post-content :is(span,em,strong,b,font).black:not([style*="background" i]) { color:#E0E0E0 !important; }
  html[data-zek-mode="dark"] .post-content :is(span,em,strong,b,font).red:not([style*="background" i]) { color:#E49A9A !important; }
  html[data-zek-mode="dark"] .post-content :is(span,em,strong,b,font).blue:not([style*="background" i]) { color:#A7C4E6 !important; }
  html[data-zek-mode="dark"] .post-content :is(span,em,strong,b,font).green:not([style*="background" i]) { color:#81B49D !important; }
  html[data-zek-mode="dark"] .post-content :is(span,em,strong,b,font).yellow:not([style*="background" i]) { color:#E9D48B !important; }
  html[data-zek-mode="dark"] .post-content :is(span,em,strong,b,font).navy:not([style*="background" i]) { color:#AABCEA !important; }
  html[data-zek-mode="dark"] .post-content :is(span,em,strong,b,font).orange:not([style*="background" i]) { color:#EAB08A !important; }
  html[data-zek-mode="dark"] .post-content :is(span,em,strong,b,font).pink:not([style*="background" i]) { color:#E6A5CE !important; }
  html[data-zek-mode="dark"] .post-content :is(span,em,strong,b,font).purple:not([style*="background" i]) { color:#CAA4E5 !important; }
  html[data-zek-mode="dark"] .post-content :is(span,em,strong,b,font).olive:not([style*="background" i]) { color:#C6D69E !important; }
  html[data-zek-mode="dark"] .post-content :is(span,em,strong,b,font).lime:not([style*="background" i]) { color:#B6D98E !important; }
  html[data-zek-mode="dark"] .post-content :is(span,em,strong,b,font).aqua:not([style*="background" i]) { color:#8FCBDD !important; }
  html[data-zek-mode="dark"] .post-content :is(span,em,strong,b,font).gray:not([style*="background" i]) { color:#BDBDBD !important; }
  html[data-zek-mode="dark"] .post-content :is(span,em,strong,b,font).brown:not([style*="background" i]) { color:#D7B4A6 !important; }
  /* rc7: Named text colors in TablePress THEAD must remain readable when sorted.
   * Keep all 14 rc6 colors on body cells/article text. Only the ten colors that
   * fell below 4.5:1 on the active header (#535353) are lightened here.
   * Explicit inline badge backgrounds are excluded as in the rc6 rule. */
  html[data-zek-mode="dark"] .post-content table.tablepress thead :is(span,em,strong,b,font,th,td).red:not([style*="background" i]) { color:#EFC2C2 !important; }
  html[data-zek-mode="dark"] .post-content table.tablepress thead :is(span,em,strong,b,font,th,td).blue:not([style*="background" i]) { color:#B7CFEB !important; }
  html[data-zek-mode="dark"] .post-content table.tablepress thead :is(span,em,strong,b,font,th,td).green:not([style*="background" i]) { color:#B6D4C6 !important; }
  html[data-zek-mode="dark"] .post-content table.tablepress thead :is(span,em,strong,b,font,th,td).navy:not([style*="background" i]) { color:#BFCDEF !important; }
  html[data-zek-mode="dark"] .post-content table.tablepress thead :is(span,em,strong,b,font,th,td).orange:not([style*="background" i]) { color:#EFC4A7 !important; }
  html[data-zek-mode="dark"] .post-content table.tablepress thead :is(span,em,strong,b,font,th,td).pink:not([style*="background" i]) { color:#EEC0DD !important; }
  html[data-zek-mode="dark"] .post-content table.tablepress thead :is(span,em,strong,b,font,th,td).purple:not([style*="background" i]) { color:#DDC4EE !important; }
  html[data-zek-mode="dark"] .post-content table.tablepress thead :is(span,em,strong,b,font,th,td).aqua:not([style*="background" i]) { color:#A4D5E3 !important; }
  html[data-zek-mode="dark"] .post-content table.tablepress thead :is(span,em,strong,b,font,th,td).gray:not([style*="background" i]) { color:#CDCDCD !important; }
  html[data-zek-mode="dark"] .post-content table.tablepress thead :is(span,em,strong,b,font,th,td).brown:not([style*="background" i]) { color:#E1C8BD !important; }
  /* .white intentionally remains white: many colored labels depend on it. */

  /* rc6: dark TablePress inherited legacy color classes and invisible #000 text.
   * Text-only elements are addressed above; also allow classed cells/links when
   * they themselves have no explicit background. Do not recolor arbitrary badges. */
  html[data-zek-mode="dark"] table.tablepress :is(td,th).black:not([style*="background" i]) { color:#E0E0E0 !important; }
  html[data-zek-mode="dark"] table.tablepress :is(td,th).red:not([style*="background" i]) { color:#E49A9A !important; }

  /* rc6: The article-footer share bar uses separate classes from floating shares.
   * Keep X/copy visible on dark surfaces, with visible focus/active/copy states. */
  html[data-zek-mode="dark"] .common-share__x,
  html[data-zek-mode="dark"] .common-share__copy {
    color: #E0E0E0;
  }
  html[data-zek-mode="dark"] .common-share__x:is(:hover,:focus-visible,:active),
  html[data-zek-mode="dark"] .common-share__copy:is(:hover,:focus-visible,:active,.is-copied) {
    background: #424242;
    color: #F4F4F4;
  }
  html[data-zek-mode="dark"] .common-share__copy.is-copied::after { color:#F4F4F4; }
  html[data-zek-mode="dark"] .common-share__item a:focus-visible {
    outline: 2px solid #ABABAB;
    outline-offset: -2px;
  }
  /* Muted but recognizable Hatena blue; light text on floating buttons and
   * darker standalone icon ink on light-gray article backgrounds. */
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) {
    --zd-hatena-bg: #326E85;
    --zd-hatena-ink: #2D6378;
  }
  html[data-zek-mode="dark"] { --zd-hatena-ink: #8DC3D4; }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .common-share-fixed__link--hatebu,
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .common-share-fixed__link--hatebu:is(:hover,:focus-visible) {
    background: var(--zd-hatena-bg);
    border-color: var(--zd-hatena-bg);
    color: #FFFFFF;
  }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .common-share__hatebu {
    color: var(--zd-hatena-ink);
  }
  html:is([data-zek-mode="gray"],[data-zek-mode="dark"]) .common-share__hatebu:is(:hover,:focus-visible,:active) {
    background: var(--zd-hatena-bg);
    color: #FFFFFF;
  }

  /* Final v0.2.0: dark navigation hover and legacy warning contrast.
   * SYN's .ddmenu__list li a:hover uses --color-main, which is not safe on
   * the dark background. Keep white/gray navigation untouched. */
  html[data-zek-mode="dark"] .ddmenu__list li > a {
    color: var(--zd-text-color);
  }
  /* v0.2.3: Current-page links use the SAME resting appearance as other
   * navigation links. A selected item must not create a permanent highlighted
   * tile; hover remains the same #414141 across all items. */
  html[data-zek-mode="dark"] .ddmenu__list li:is(
    .current-menu-item,.current-menu-ancestor,.current-menu-parent,
    .current_page_item,.current_page_parent,.current_page_ancestor
  ) > a {
    color: var(--zd-text-color);
    background-color: transparent;
    background-image: none;
  }
  html[data-zek-mode="dark"] .ddmenu__list li:is(
    .current-menu-item,.current-menu-ancestor,.current-menu-parent,
    .current_page_item,.current_page_parent,.current_page_ancestor
  ) > a:is(:hover,:focus-visible) {
    color: #F4F4F4;
    background-color: #414141;
  }
  html[data-zek-mode="dark"] .ddmenu__list li > a:is(:hover,:focus-visible) {
    color: #F4F4F4;
    background-color: #414141;
  }
  html[data-zek-mode="dark"] .ddmenu__list > li:has(.sub-menu) li a:is(:hover,:focus-visible) {
    color: #F4F4F4;
    background-color: #414141;
  }
  /* Some legacy notes use .red inside sidebars rather than inline styles.
   * Change text ink only, never badge backgrounds or media. */
  html[data-zek-mode="dark"] :is(.sidebar,.widget) :is(span,em,strong,b,font).red:not([style*="background" i]) {
    color: var(--zd-ink-red) !important;
  }
  html[data-zek-mode="dark"] .post-content :is(span,em,strong,b,font).red:not([style*="background" i]) {
    color: var(--zd-ink-red) !important;
  }

  /* v0.2.1: Inline red within sorted TablePress headings, without painted backgrounds. */
  html[data-zek-mode="dark"] .post-content table.tablepress thead span[style^="color: #ff0000;" i]:not([style*="background" i]),
  html[data-zek-mode="dark"] .post-content table.tablepress thead span[style^="color:#ff0000;" i]:not([style*="background" i]),
  html[data-zek-mode="dark"] .post-content table.tablepress thead span[style$="; color: #ff0000" i]:not([style*="background" i]),
  html[data-zek-mode="dark"] .post-content table.tablepress thead span[style$=";color: #ff0000" i]:not([style*="background" i]),
  html[data-zek-mode="dark"] .post-content table.tablepress thead span[style="color: #ff0000" i]:not([style*="background" i]),
  html[data-zek-mode="dark"] .post-content table.tablepress thead span[style$="; color:#ff0000" i]:not([style*="background" i]),
  html[data-zek-mode="dark"] .post-content table.tablepress thead span[style$=";color:#ff0000" i]:not([style*="background" i]),
  html[data-zek-mode="dark"] .post-content table.tablepress thead span[style="color:#ff0000" i]:not([style*="background" i]),
  html[data-zek-mode="dark"] .post-content table.tablepress thead span[style*=";color: #ff0000;" i]:not([style*="background" i]),
  html[data-zek-mode="dark"] .post-content table.tablepress thead span[style*="; color: #ff0000;" i]:not([style*="background" i]),
  html[data-zek-mode="dark"] .post-content table.tablepress thead span[style*=";color:#ff0000;" i]:not([style*="background" i]),
  html[data-zek-mode="dark"] .post-content table.tablepress thead span[style*="; color:#ff0000;" i]:not([style*="background" i]),
  html[data-zek-mode="dark"] .post-content table.tablepress thead span[style^="color: rgb(255, 0, 0);" i]:not([style*="background" i]),
  html[data-zek-mode="dark"] .post-content table.tablepress thead span[style^="color:rgb(255, 0, 0);" i]:not([style*="background" i]),
  html[data-zek-mode="dark"] .post-content table.tablepress thead span[style$="; color: rgb(255, 0, 0)" i]:not([style*="background" i]),
  html[data-zek-mode="dark"] .post-content table.tablepress thead span[style$=";color: rgb(255, 0, 0)" i]:not([style*="background" i]),
  html[data-zek-mode="dark"] .post-content table.tablepress thead span[style="color: rgb(255, 0, 0)" i]:not([style*="background" i]),
  html[data-zek-mode="dark"] .post-content table.tablepress thead span[style$="; color:rgb(255, 0, 0)" i]:not([style*="background" i]),
  html[data-zek-mode="dark"] .post-content table.tablepress thead span[style$=";color:rgb(255, 0, 0)" i]:not([style*="background" i]),
  html[data-zek-mode="dark"] .post-content table.tablepress thead span[style="color:rgb(255, 0, 0)" i]:not([style*="background" i]),
  html[data-zek-mode="dark"] .post-content table.tablepress thead span[style*=";color: rgb(255, 0, 0);" i]:not([style*="background" i]),
  html[data-zek-mode="dark"] .post-content table.tablepress thead span[style*="; color: rgb(255, 0, 0);" i]:not([style*="background" i]),
  html[data-zek-mode="dark"] .post-content table.tablepress thead span[style*=";color:rgb(255, 0, 0);" i]:not([style*="background" i]),
  html[data-zek-mode="dark"] .post-content table.tablepress thead span[style*="; color:rgb(255, 0, 0);" i]:not([style*="background" i]) {
    color: #EFC2C2 !important;
  }

  /* Switcher: only shown with JS bootstrap; no white-mode palette changes. */
  html:not(.zek-js) .zd-nav-item, html:not(.zek-js) .zd-mobile-settings { display:none !important; }
  .zd-nav-item { position:relative; list-style:none; }
  .zd-menu-trigger, .zd-menu-choice {
    font: inherit;
    border: 0;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
  }
  .zd-menu-trigger {
    display:inline-flex;
    align-items:center;
    padding: .5em 1.2em;
    min-height: 36px;
    color:var(--color-text, #333);
    background:transparent;
    white-space: nowrap;
    line-height:1.4;
  }
  /* Match SYN's .ddmenu__list a:hover instead of underlining Display only. */
  .zd-menu-trigger:is(:hover,:focus-visible) {
    text-decoration: none;
    color: var(--color-main);
    background: color-mix(in srgb,var(--color-text) 4%,var(--color-background));
  }
  .zd-menu-trigger:focus-visible {outline:2px solid currentColor;outline-offset:-2px;}
  html[data-zek-mode="dark"] .ddmenu__list > li.zd-nav-item > .zd-menu-trigger {color:var(--zd-text-color);}
  html[data-zek-mode="dark"] .ddmenu__list > li.zd-nav-item > .zd-menu-trigger:is(:hover,:focus-visible) {
    color:#F4F4F4;
    background:#414141;
  }
  /* v0.2.2: Font-independent chevrons: theme icon font was showing an incorrect glyph on
   * some devices. Draw exactly the same chevron on the theme's dropdown links
   * and on our "Display" control, retaining the theme's link hit area. */
  .ddmenu__list > li:has(.sub-menu) > a::after,
  .ddmenu__list > li.zd-nav-item > .zd-menu-trigger::after {
    content: "";
    display: inline-block;
    box-sizing: border-box;
    flex: 0 0 auto;
    width: .42em;
    height: .42em;
    margin: -.22em 0 0 .75em;
    padding: 0;
    border: 0;
    border-right: 1px solid currentColor;
    border-bottom: 1px solid currentColor;
    color: inherit;
    font-family: inherit !important;
    font-size: 1em;
    line-height: 1;
    transform: rotate(45deg);
  }
  .ddmenu__list > li:has(.sub-menu) > a:is(:hover,:focus-visible)::after,
  .ddmenu__list > li.zd-nav-item > .zd-menu-trigger:is(:hover,:focus-visible)::after {
    transform: translateY(.08em) rotate(45deg);
  }
  .zd-menu-panel {
    position:absolute;
    z-index:50;
    right:0;
    top:100%;
    min-width: 180px;
    display:flex;
    flex-direction:column;
    gap:2px;
    padding:10px;
    border:1px solid var(--zd-border-color, #bdbdbd);
    border-radius:6px;
    background:var(--zd-panel-bg, #fff);
    box-shadow: 0 2px 12px rgba(0,0,0,.18);
    color:var(--zd-text-color, #333);
  }
  .zd-menu-panel[hidden] {display:none!important;}
  .zd-menu-mobile-panel {display:none;}
  .zd-menu-label {font-size:.8em; font-weight:700; padding:4px 8px;}
  .zd-menu-choice {
    padding:8px 10px;
    border-radius:4px;
    text-align:left;
    background:transparent;
    color:inherit;
    min-height:36px;
  }
  .zd-menu-choice:hover, .zd-menu-choice:focus-visible {
    outline:2px solid currentColor;
    outline-offset:-2px;
  }
  .zd-menu-choice[aria-pressed="true"] {
    font-weight:700;
    background:var(--zd-list-head-bg, #e5e5e5);
    color:var(--zd-text-color, #262626);
  }
  .zd-menu-choice[aria-pressed="true"]::before {content:'✓'; margin-right:.3em;}
  @media (max-width:1079.98px) {
    .zd-nav-item {width:100%;}
    .zd-nav-item .zd-menu-trigger, .zd-nav-item .zd-menu-panel {display:none!important;}
    .zd-nav-item .zd-menu-mobile-panel, .zd-mobile-settings {
      position:static;
      min-width:0;
      width:100%;
      box-shadow:none;
      border:0;
      background:transparent;
      padding:0;
      display:flex;
      flex-direction:column;
      gap:3px;
      color:var(--zd-text-color, var(--color-text, #333));
    }
    .zd-mobile-settings {margin-top:10px;}
    .zd-nav-item .zd-menu-choice, .zd-mobile-settings .zd-menu-choice {
      padding:9px 14px;
      width:100%;
      text-align:left;
    }
  }
}
/* Outside @media screen: UI never printed, even if JS is active. Theme's print styles remain authoritative. */
@media print { .zd-nav-item, .zd-mobile-settings { display:none !important; } }