/* ************************************************************************** */
/* *****  MYNDEX THEME OVERRIDES for MyndexbDark.css — 2026          ******** */
/* *****  JS-controlled data-theme selectors                         ******** */
/* *****  These duplicate the @media dark block (kept as no-JS       ******** */
/* *****  fallback) and add a light force-override.                  ******** */
/* *****  Copyright © 2026 Andrew Somers. All Rights Reserved.       ******** */
/* ************************************************************************** */


/* ************************************************************************** */
/* *****  JS FORCES DARK — mirrors @media (prefers-color-scheme: dark) ***** */
/* ************************************************************************** */

html[data-theme="dark"] {

      --modeMyndex: #8080ff;
      --modeMyndexBGlite: #cbc2c808;

      --color-brand-1: purple;

      --modeBGbody: #204;
      --modeBGlo: #103;
      --modeBGhi: #40a;

      --modeBGcolor: #234;
      --modeTextColor: #dde8f8;
      --modeBorderColor: var(--modeTextColor);
      --modeTextShadow: #3337;
      --modeBoxShadow:  var(--modeTextShadow);

      --modeTextAlt: #ccc;
      --modeBGinset: #777;
      --modeBGinsetShadow: var(--modeBoxShadow);

      --modeStroke: var(--modeTextColor);
      --modeHRcolor: var(--modeBorderColor);

    /*  HEADINGS  */

      --modeH1color: #83a5ffba;
        --modeH2color: #83a8ff;
        --modeH3color: var(--modeH2color);
        --modeH4color: var(--modeH2color);
        --modeH5color: var(--modeH2color);

      --modeListColor:  var(--modeTextAlt);
      --modeQuoteColor:  var(--modeTextAlt);

    /*  Drop Cap  */
      --modeDropCap:  #b8f;
        --modeDropCapShadow:  var(--modeTextShadow);
        --modeBGdropCap:  var(--modeBGinset);

    /*  LINKS  */

      --modeA: var(--modeTextColor);
        --modeAlink: #cbf;
        --modeAvisited: #bbd;
        --modeAhover: #ddf;
        --modeAvisitedhover: #ddf;
        --modeAfocus: #aaf;
        --modeAaction: #aaf;

      --modeAShadow: var(--modeTextShadow);
        --modeAlinkShadow: var(--modeAShadow);
        --modeAvisitedShadow: var(--modeAShadow);
        --modeAhoverShadow: var(--modeAShadow);

    /*  MAIN and WRAPPER  */

      --modeBGmain: #aaa;
      --modeTextMain: #eee;
      --modeBorderMain: #30a;

      --modeBGwrapper: #234;
      --modeTextWrapper: #cde;
      --modeBorderWrapper: #459;

    /*  DESCRIPTION  */
      --modeBGdesc: #123;
      --modeTextDesc: #bce;
      --modeH1Desc: #abf;

      --modeBGdescInset: #348;

      --modeTextShadowDesc: #88a8;
      --modeTextShadowDescSafari: #9986;
      --modeBoxShadowDesc:  #789a;

      --modeH1ShadowDescA: #64c4;
      --modeH1ShadowDescB: #cdf;
      --modeH1ShadowDescC: #4565;

    /*  Breadcrumbs  */
      --modeTextBread: #cce;
        --modeABread: var(--modeTextBread);

    /*  HEADER and FOOTER */

      --modeBGheader: #459;
      --modeTextHeader: #9af;
        --modeHeaderA: var(--modeTextHeader);

      --modeBGfooter: #459;
      --modeTextFooter: #9af;
        --modeFooterA: var(--modeTextFooter);

    /*  Images  */
      --modeBGimage: #a8a6a4;
        --modeBGimageB: var(--modeBGimage);
        --modeBGimageC: var(--modeBGimage);

    /*  CODE and INPUTS  */

      --modeBGcode: #210;
      --modeTextCode: #cde;
      --modeBorderCode: #678;

      --modePrtystr: #f6f;
      --modePrtykwd: #f99;
      --modePrtycom: #ccc;
      --modePrtytyp: #2e2;
      --modePrtylit: #f55;
      --modePrtypun: #def;
      --modePrtypln: #cde;
      --modePrtytag: #ff0;
      --modePrtyatn: #bb0;
      --modePrtyatv: #f6b;
      --modePrtydec: #5f5;

      --modeBGinput: #552;
      --modeTextInput: #def;
      --modeBorderInput: #5558;

      --modeTextInAr: #005;
      --modeBGinAr: #222200;
      --modeBorderInAr: #96f;

      --modeBGmath: #348;
      --modeTextMath: #000;
      --modeBGpre: #234;
      --modeBGaside: #f3e0f3;

      --modeBGinsetBlue: #124;
      --modeBGinsetBeige: #ffffee;
      --modeBGinsetYellow: #421;

    /*  BUTTONS  */

      --modeButton: var(--modeBGinset);
      --modeTextButton: var(--modeAlink);
      --modeBorderButton: var(--modeBorderColor);
      --modeButtonShadow: var(--modeBoxShadow);

      --modeButtonBlue: #30a;
      --modeTextButtonBlue: var(--modeTextButton);
      --modeBorderButtonBlue: #30a;
      --modeLoGradBlue: #007;
      --modeHiGradBlue: #73d;

      --modeButtonPur: #b2f;
      --modeTextButtonPur: var(--modeTextButton);
      --modeBorderButtonPur: #b2f;
      --modeLoGradPur: #a4e;
      --modeHiGradPur: #408;

      --modeBorderLo: #ddd;
      --modeBorderHi: #444;

    /*  APCA  */

      --textColor: #bad;
      --bgColor: #bad;

      --tickLabel: #30a;

      --slideLabelBG: #e50;
      --slideLabelText: #222;

      --insideOutLo: #000;
      --insideOutHi: #bcd;
      --insideOutMidLo: #000;
      --insideOutMidHi: #dcb;
      --insideOutLoBG: #642;
      --insideOutHiBG: #fff;
      --insideOutMidLoBG: #248;
      --insideOutMidHiBG: #fff;

      --gradLo: #123;
      --gradHi: #abc;
      
      


body {
  background-color: #206;

  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100%25' opacity='1' %3E%3Cdefs%3E%3ClinearGradient id='a' gradientUnits='userSpaceOnUse' x1='0' x2='0' y1='0' y2='100%25' gradientTransform='rotate(180,200,407)'%3E%3Cstop offset='0' stop-color='%23060020'/%3E%3Cstop offset='1' stop-color='%2310003d'/%3E%3C/linearGradient%3E%3Cpattern patternUnits='userSpaceOnUse' id='b' width='504' height='420' x='0' y='0' viewBox='0 0 1080 900'%3E%3Cg fill-opacity='0.19'%3E%3Cpolygon fill='%23444' points='90 150 0 300 180 300'/%3E%3Cpolygon points='90 150 180 0 0 0'/%3E%3Cpolygon fill='%23AAA' points='270 150 360 0 180 0'/%3E%3Cpolygon fill='%23DDD' points='450 150 360 300 540 300'/%3E%3Cpolygon fill='%23999' points='450 150 540 0 360 0'/%3E%3Cpolygon points='630 150 540 300 720 300'/%3E%3Cpolygon fill='%23DDD' points='630 150 720 0 540 0'/%3E%3Cpolygon fill='%23444' points='810 150 720 300 900 300'/%3E%3Cpolygon fill='%23FFF' points='810 150 900 0 720 0'/%3E%3Cpolygon fill='%23DDD' points='990 150 900 300 1080 300'/%3E%3Cpolygon fill='%23444' points='990 150 1080 0 900 0'/%3E%3Cpolygon fill='%23DDD' points='90 450 0 600 180 600'/%3E%3Cpolygon points='90 450 180 300 0 300'/%3E%3Cpolygon fill='%23666' points='270 450 180 600 360 600'/%3E%3Cpolygon fill='%23AAA' points='270 450 360 300 180 300'/%3E%3Cpolygon fill='%23DDD' points='450 450 360 600 540 600'/%3E%3Cpolygon fill='%23999' points='450 450 540 300 360 300'/%3E%3Cpolygon fill='%23999' points='630 450 540 600 720 600'/%3E%3Cpolygon fill='%23FFF' points='630 450 720 300 540 300'/%3E%3Cpolygon points='810 450 720 600 900 600'/%3E%3Cpolygon fill='%23DDD' points='810 450 900 300 720 300'/%3E%3Cpolygon fill='%23AAA' points='990 450 900 600 1080 600'/%3E%3Cpolygon fill='%23444' points='990 450 1080 300 900 300'/%3E%3Cpolygon fill='%23222' points='90 750 0 900 180 900'/%3E%3Cpolygon points='270 750 180 900 360 900'/%3E%3Cpolygon fill='%23DDD' points='270 750 360 600 180 600'/%3E%3Cpolygon points='450 750 540 600 360 600'/%3E%3Cpolygon points='630 750 540 900 720 900'/%3E%3Cpolygon fill='%23444' points='630 750 720 600 540 600'/%3E%3Cpolygon fill='%23AAA' points='810 750 720 900 900 900'/%3E%3Cpolygon fill='%23666' points='810 750 900 600 720 600'/%3E%3Cpolygon fill='%23999' points='990 750 900 900 1080 900'/%3E%3Cpolygon fill='%23999' points='180 0 90 150 270 150'/%3E%3Cpolygon fill='%23444' points='360 0 270 150 450 150'/%3E%3Cpolygon fill='%23FFF' points='540 0 450 150 630 150'/%3E%3Cpolygon points='900 0 810 150 990 150'/%3E%3Cpolygon fill='%23222' points='0 300 -90 450 90 450'/%3E%3Cpolygon fill='%23FFF' points='0 300 90 150 -90 150'/%3E%3Cpolygon fill='%23FFF' points='180 300 90 450 270 450'/%3E%3Cpolygon fill='%23666' points='180 300 270 150 90 150'/%3E%3Cpolygon fill='%23222' points='360 300 270 450 450 450'/%3E%3Cpolygon fill='%23FFF' points='360 300 450 150 270 150'/%3E%3Cpolygon fill='%23444' points='540 300 450 450 630 450'/%3E%3Cpolygon fill='%23222' points='540 300 630 150 450 150'/%3E%3Cpolygon fill='%23AAA' points='720 300 630 450 810 450'/%3E%3Cpolygon fill='%23666' points='720 300 810 150 630 150'/%3E%3Cpolygon fill='%23FFF' points='900 300 810 450 990 450'/%3E%3Cpolygon fill='%23999' points='900 300 990 150 810 150'/%3E%3Cpolygon points='0 600 -90 750 90 750'/%3E%3Cpolygon fill='%23666' points='0 600 90 450 -90 450'/%3E%3Cpolygon fill='%23AAA' points='180 600 90 750 270 750'/%3E%3Cpolygon fill='%23444' points='180 600 270 450 90 450'/%3E%3Cpolygon fill='%23444' points='360 600 270 750 450 750'/%3E%3Cpolygon fill='%23999' points='360 600 450 450 270 450'/%3E%3Cpolygon fill='%23666' points='540 600 630 450 450 450'/%3E%3Cpolygon fill='%23222' points='720 600 630 750 810 750'/%3E%3Cpolygon fill='%23FFF' points='900 600 810 750 990 750'/%3E%3Cpolygon fill='%23222' points='900 600 990 450 810 450'/%3E%3Cpolygon fill='%23DDD' points='0 900 90 750 -90 750'/%3E%3Cpolygon fill='%23444' points='180 900 270 750 90 750'/%3E%3Cpolygon fill='%23FFF' points='360 900 450 750 270 750'/%3E%3Cpolygon fill='%23AAA' points='540 900 630 750 450 750'/%3E%3Cpolygon fill='%23FFF' points='720 900 810 750 630 750'/%3E%3Cpolygon fill='%23222' points='900 900 990 750 810 750'/%3E%3Cpolygon fill='%23222' points='1080 300 990 450 1170 450'/%3E%3Cpolygon fill='%23FFF' points='1080 300 1170 150 990 150'/%3E%3Cpolygon points='1080 600 990 750 1170 750'/%3E%3Cpolygon fill='%23666' points='1080 600 1170 450 990 450'/%3E%3Cpolygon fill='%23DDD' points='1080 900 1170 750 990 750'/%3E%3C/g%3E%3C/pattern%3E%3C/defs%3E%3Crect x='0' y='0' fill='url(%23a)' width='100%25' height='100%25'/%3E%3Crect x='0' y='0' fill='url(%23b)' width='100%25' height='100%25'/%3E%3C/svg%3E");

    }
}



/* ************************************************************************** */
/* *****  JS FORCES LIGHT — overrides @media dark for users who      ******** */
/* *****  have OS dark but want light on this site                   ******** */
/* ************************************************************************** */

html[data-theme="light"] {

      --modeMyndex: #84c;
      --modeMyndexBGlite: #cbc2c848;
      --color-brand-1: purple;

      --modeBGbody: #fb8;
      --modeBGlo: #a94;
      --modeBGhi: #fea;

      --modeBGcolor: #edc;
      --modeTextColor: #30a;
      --modeBorderColor: var(--modeTextColor);
      --modeTextShadow: #3337;
      --modeBoxShadow:  var(--modeTextShadow);

      --modeTextAlt: #806d0f;
      --modeBGinset: #777;
      --modeBGinsetShadow: var(--modeBoxShadow);

      --modeStroke: var(--modeTextColor);
      --modeHRcolor: var(--modeBorderColor);

    /*  HEADINGS  */
      --modeH1color: #30ac;
        --modeH2color: var(--modeH1color);
        --modeH3color: var(--modeH1color);
        --modeH4color: var(--modeH1color);
        --modeH5color: var(--modeH1color);

      --modeListColor:  var(--modeTextAlt);
      --modeQuoteColor:  var(--modeTextAlt);

    /*  Drop Cap  */
      --modeDropCap:  #30a;
        --modeDropCapShadow:  var(--modeTextShadow);
        --modeBGdropCap:  var(--modeBGinset);

    /*  LINKS  */

      --modeA: var(--modeTextColor);
        --modeAlink: #309;
        --modeAvisited: #608;
        --modeAhover: #44f;
        --modeAvisitedhover: #b0b;
        --modeAfocus: #96d;
        --modeAaction: #96d;

      --modeAShadow: var(--modeTextShadow);
        --modeAlinkShadow: var(--modeAShadow);
        --modeAvisitedShadow: var(--modeAShadow);
        --modeAhoverShadow: var(--modeAShadow);

    /*  MAIN and WRAPPER  */

      --modeBGmain: #aaa;
      --modeTextMain: #eee;
      --modeBorderMain: #30a;

      --modeBGwrapper: #e4ddd0;
      --modeTextWrapper: #000;
      --modeBorderWrapper: #f6faff;

    /*  DESCRIPTION  */
      --modeBGdesc: #cca;
      --modeTextDesc: #207;
      --modeH1Desc: #40c;

      --modeBGdescInset: #fb6;

      --modeTextShadowDesc: #996a;
      --modeTextShadowDescSafari: #8897;
      --modeBoxShadowDesc:  #123a;

      --modeH1ShadowDescA: #64c4;
      --modeH1ShadowDescB: #cdf;
      --modeH1ShadowDescC: #4565;

    /*  Breadcrumbs  */
      --modeTextBread: #60b;
        --modeABread: var(--modeTextBread);

    /*  HEADER and FOOTER */

      --modeBGheader: #459;
      --modeTextHeader: #9af;
        --modeHeaderA: var(--modeTextHeader);

      --modeBGfooter: #103;
      --modeTextFooter: #db6;
        --modeFooterA: var(--modeTextFooter);

    /*  Images  */
      --modeBGimage: #f8f6f4;
        --modeBGimageB: var(--modeBGimage);
        --modeBGimageC: var(--modeBGimage);

    /*  CODE and INPUTS  */

      --modeBGcode: #eda;
      --modeTextCode: #000;
      --modeBorderCode: #0a6;

      --modePrtystr: #A0A;
      --modePrtykwd: #A00;
      --modePrtycom: #666;
      --modePrtytyp: #0A0;
      --modePrtylit: #600;
      --modePrtypun: #000;
      --modePrtypln: #000;
      --modePrtytag: #770;
      --modePrtyatn: #440;
      --modePrtyatv: #D49;
      --modePrtydec: #2C2;

      --modeBGinput: #552;
      --modeTextInput: #def;
      --modeBorderInput: #5558;

      --modeTextInAr: #005;
      --modeBGinAr: #222200;
      --modeBorderInAr: #96f;

      --modeBGmath: #cde;
      --modeBGpre: #eda;
      --modeBGaside: #f3e0f3;

      --modeBGinsetBlue: #def;
      --modeBGinsetBeige: #ffffee;
      --modeBGinsetYellow: #fed;

    /*  BUTTONS  */

      --modeButton: var(--modeBGinset);
      --modeTextButton: var(--modeAlink);
      --modeBorderButton: var(--modeBorderColor);
      --modeButtonShadow: var(--modeBoxShadow);

      --modeButtonBlue: #30a;
      --modeTextButtonBlue: var(--modeTextButton);
      --modeBorderButtonBlue: #30a;
      --modeLoGradBlue: #007;
      --modeHiGradBlue: #73d;

      --modeButtonPur: #80a;
      --modeTextButtonPur: var(--modeTextButton);
      --modeBorderButtonPur: #80a;
      --modeLoGradPur: #406;
      --modeHiGradPur: #a2d;

      --modeBorderLo: #111;
      --modeBorderHi: #eee;

    /*  APCA  */

      --textColor: #bad;
      --bgColor: #bad;

      --tickLabel: #30a;

      --slideLabelBG: #e50;
      --slideLabelText: #222;

      --insideOutLo: #000;
      --insideOutHi: #bcd;
      --insideOutMidLo: #000;
      --insideOutMidHi: #dcb;
      --insideOutLoBG: #642;
      --insideOutHiBG: #fff;
      --insideOutMidLoBG: #248;
      --insideOutMidHiBG: #fff;

      --gradLo: #123;
      --gradHi: #abc;
      

body {
  background-color: #dba;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100%25' opacity='1' %3E%3Cdefs%3E%3ClinearGradient id='a' gradientUnits='userSpaceOnUse' x1='0' x2='0' y1='0' y2='100%25' gradientTransform='rotate(180,200,407)'%3E%3Cstop offset='0' stop-color='%23dd9900'/%3E%3Cstop offset='1' stop-color='%23eee0a0'/%3E%3C/linearGradient%3E%3Cpattern patternUnits='userSpaceOnUse' id='b' width='504' height='420' x='0' y='0' viewBox='0 0 1080 900'%3E%3Cg fill-opacity='0.19'%3E%3Cpolygon fill='%23444' points='90 150 0 300 180 300'/%3E%3Cpolygon points='90 150 180 0 0 0'/%3E%3Cpolygon fill='%23AAA' points='270 150 360 0 180 0'/%3E%3Cpolygon fill='%23DDD' points='450 150 360 300 540 300'/%3E%3Cpolygon fill='%23999' points='450 150 540 0 360 0'/%3E%3Cpolygon points='630 150 540 300 720 300'/%3E%3Cpolygon fill='%23DDD' points='630 150 720 0 540 0'/%3E%3Cpolygon fill='%23444' points='810 150 720 300 900 300'/%3E%3Cpolygon fill='%23FFF' points='810 150 900 0 720 0'/%3E%3Cpolygon fill='%23DDD' points='990 150 900 300 1080 300'/%3E%3Cpolygon fill='%23444' points='990 150 1080 0 900 0'/%3E%3Cpolygon fill='%23DDD' points='90 450 0 600 180 600'/%3E%3Cpolygon points='90 450 180 300 0 300'/%3E%3Cpolygon fill='%23666' points='270 450 180 600 360 600'/%3E%3Cpolygon fill='%23AAA' points='270 450 360 300 180 300'/%3E%3Cpolygon fill='%23DDD' points='450 450 360 600 540 600'/%3E%3Cpolygon fill='%23999' points='450 450 540 300 360 300'/%3E%3Cpolygon fill='%23999' points='630 450 540 600 720 600'/%3E%3Cpolygon fill='%23FFF' points='630 450 720 300 540 300'/%3E%3Cpolygon points='810 450 720 600 900 600'/%3E%3Cpolygon fill='%23DDD' points='810 450 900 300 720 300'/%3E%3Cpolygon fill='%23AAA' points='990 450 900 600 1080 600'/%3E%3Cpolygon fill='%23444' points='990 450 1080 300 900 300'/%3E%3Cpolygon fill='%23222' points='90 750 0 900 180 900'/%3E%3Cpolygon points='270 750 180 900 360 900'/%3E%3Cpolygon fill='%23DDD' points='270 750 360 600 180 600'/%3E%3Cpolygon points='450 750 540 600 360 600'/%3E%3Cpolygon points='630 750 540 900 720 900'/%3E%3Cpolygon fill='%23444' points='630 750 720 600 540 600'/%3E%3Cpolygon fill='%23AAA' points='810 750 720 900 900 900'/%3E%3Cpolygon fill='%23666' points='810 750 900 600 720 600'/%3E%3Cpolygon fill='%23999' points='990 750 900 900 1080 900'/%3E%3Cpolygon fill='%23999' points='180 0 90 150 270 150'/%3E%3Cpolygon fill='%23444' points='360 0 270 150 450 150'/%3E%3Cpolygon fill='%23FFF' points='540 0 450 150 630 150'/%3E%3Cpolygon points='900 0 810 150 990 150'/%3E%3Cpolygon fill='%23222' points='0 300 -90 450 90 450'/%3E%3Cpolygon fill='%23FFF' points='0 300 90 150 -90 150'/%3E%3Cpolygon fill='%23FFF' points='180 300 90 450 270 450'/%3E%3Cpolygon fill='%23666' points='180 300 270 150 90 150'/%3E%3Cpolygon fill='%23222' points='360 300 270 450 450 450'/%3E%3Cpolygon fill='%23FFF' points='360 300 450 150 270 150'/%3E%3Cpolygon fill='%23444' points='540 300 450 450 630 450'/%3E%3Cpolygon fill='%23222' points='540 300 630 150 450 150'/%3E%3Cpolygon fill='%23AAA' points='720 300 630 450 810 450'/%3E%3Cpolygon fill='%23666' points='720 300 810 150 630 150'/%3E%3Cpolygon fill='%23FFF' points='900 300 810 450 990 450'/%3E%3Cpolygon fill='%23999' points='900 300 990 150 810 150'/%3E%3Cpolygon points='0 600 -90 750 90 750'/%3E%3Cpolygon fill='%23666' points='0 600 90 450 -90 450'/%3E%3Cpolygon fill='%23AAA' points='180 600 90 750 270 750'/%3E%3Cpolygon fill='%23444' points='180 600 270 450 90 450'/%3E%3Cpolygon fill='%23444' points='360 600 270 750 450 750'/%3E%3Cpolygon fill='%23999' points='360 600 450 450 270 450'/%3E%3Cpolygon fill='%23666' points='540 600 630 450 450 450'/%3E%3Cpolygon fill='%23222' points='720 600 630 750 810 750'/%3E%3Cpolygon fill='%23FFF' points='900 600 810 750 990 750'/%3E%3Cpolygon fill='%23222' points='900 600 990 450 810 450'/%3E%3Cpolygon fill='%23DDD' points='0 900 90 750 -90 750'/%3E%3Cpolygon fill='%23444' points='180 900 270 750 90 750'/%3E%3Cpolygon fill='%23FFF' points='360 900 450 750 270 750'/%3E%3Cpolygon fill='%23AAA' points='540 900 630 750 450 750'/%3E%3Cpolygon fill='%23FFF' points='720 900 810 750 630 750'/%3E%3Cpolygon fill='%23222' points='900 900 990 750 810 750'/%3E%3Cpolygon fill='%23222' points='1080 300 990 450 1170 450'/%3E%3Cpolygon fill='%23FFF' points='1080 300 1170 150 990 150'/%3E%3Cpolygon points='1080 600 990 750 1170 750'/%3E%3Cpolygon fill='%23666' points='1080 600 1170 450 990 450'/%3E%3Cpolygon fill='%23DDD' points='1080 900 1170 750 990 750'/%3E%3C/g%3E%3C/pattern%3E%3C/defs%3E%3Crect x='0' y='0' fill='url(%23a)' width='100%25' height='100%25'/%3E%3Crect x='0' y='0' fill='url(%23b)' width='100%25' height='100%25'/%3E%3C/svg%3E");
    }


}