/* ONLY Roman Imperial Table formatting  */
/* Self-contained blocks, order: Republic / Imperatorial / Imperial / Dominate  */
/* NOTE: --tabl-opaq now lives in Headers-Fonts-P_all_2a.css (global). Link that file too. */

/* used for div.header-panel like a 1-cell table to hide background map  */
    .header-panel-light {
      display: flex;
      flex-direction: column;   /* stack children vertically */
      align-items: flex-start;  /* keep text left-aligned */
      gap: .3rem;    /*  vertical spacing */
      background-color: rgba(248, 247, 247, var(--tabl-opaq));
      padding: 1rem;
      border-radius: 10px;
    }

    .header-panel-dark {
      display: flex;
      flex-direction: column;   /* stack children vertically */
      align-items: flex-start;  /* keep text left-aligned */
      gap: .3rem;    /*  vertical spacing */
      background-color: rgba(20, 20, 20, var(--tabl-opaq));
      padding: 1rem;
      border-radius: 10px;
    }

  /* THEME TUNING VARIABLES
     bg = table/cell backgrounds
     p  = paragraph colors
     pfl = paragraph first-letter colors
  */


/* #############################################################################
   ===========================================================================
   REPUBLIC  (self-contained block)
   ===========================================================================
   ############################################################################# */

 /* ---- geometry ---- */
   .Republic {
     height: auto;
     border-collapse: separate;
     border-spacing: 0.5rem;
     vertical-align: top;
     display: block;
   }
   .Republic th,
   .Republic td {
     padding: 1rem;
     text-align: center;
   }

 /* ---- TABLE + CELL BORDERS ---- */
   .Republic {
     border: 4px solid rgba(82,82,84, var(--tabl-opaq));    /* entire-table border */
   }
   .Republic th,
   .Republic td {
     border: 2px solid rgba(109,21,29, var(--tabl-opaq));   /* dk red cell border */
   }

 /* ---- VARIABLES ---- */
   .Republic {
     /* CONVERTED: interstitial was literal rgba(114,114,29, 0.1) -> now var(--tabl-opaq). */
     /* Effect: gap-tint opacity 0.1 -> 0.64 (~6x), olive now clearly visible AND slider-driven. */
     /* To restore the old faint tint, hard-code 0.1 in place of var(--tabl-opaq) below. */
     background-color: rgba(114,114,29, var(--tabl-opaq));  /* interstitial table color */

     --bg-odd: 255,238,238;            /* pale pink  */
     --bg-firstcol-odd: 255,10,10;     /* bright red */

     --bg-even: 110,133,33;            /* olive      */
     --bg-firstcol-even: 11,33,33;     /* dk teal    */

     --p-odd: 0,0,0;
     --p-firstcol-odd: 105,105,105;    /* DimGrey */

     --p-even: 0,0,0;
     --p-firstcol-even: 105,105,105;   /* DimGrey */

     /* --pfl-* are NEW (Republic had none) -- invented, tune freely */
     --pfl-odd: 131,13,20;             /* deep red          */
     --pfl-firstcol-odd: 247,231,168;  /* warm cream on red */
     --pfl-even: 40,40,10;             /* dk olive-brown    */
     --pfl-firstcol-even: 200,200,180; /* pale on dk teal   */
   }

 /* ---- BACKGROUND + BASE TEXT ---- */
   .Republic tr:nth-child(odd) td {
     background-color: rgba(var(--bg-odd), var(--tabl-opaq));
     color: rgb(var(--p-odd));
   }
   .Republic tr:nth-child(odd) td:nth-child(3n+1) {
     background-color: rgba(var(--bg-firstcol-odd), var(--tabl-opaq));
     color: rgb(var(--p-firstcol-odd));
   }
   .Republic tr:nth-child(even) td {
     background-color: rgba(var(--bg-even), var(--tabl-opaq));
     color: rgb(var(--p-even));
   }
   .Republic tr:nth-child(even) td:nth-child(3n+1) {
     background-color: rgba(var(--bg-firstcol-even), var(--tabl-opaq));
     color: rgb(var(--p-firstcol-even));
   }

 /* ---- PARAGRAPH COLORS ---- */
   .Republic tr:nth-child(odd) td p:not([class]) { color: rgb(var(--p-odd)); }
   .Republic tr:nth-child(odd) td:nth-child(3n+1) p:not([class]) { color: rgb(var(--p-firstcol-odd)); }
   .Republic tr:nth-child(even) td p:not([class]) { color: rgb(var(--p-even)); }
   .Republic tr:nth-child(even) td:nth-child(3n+1) p:not([class]) { color: rgb(var(--p-firstcol-even)); }

 /* ---- PARAGRAPH 1st LETTER ---- */
   .Republic tr:nth-child(odd) td p:not([class])::first-letter {
     color: rgb(var(--pfl-odd)); font-size: 2.0em;
   }
   .Republic tr:nth-child(odd) td:nth-child(3n+1) p:not([class])::first-letter {
     color: rgb(var(--pfl-firstcol-odd)); font-size: 2.4em;
   }
   .Republic tr:nth-child(even) td p:not([class])::first-letter {
     color: rgb(var(--pfl-even)); font-size: 2.0em;
   }
   .Republic tr:nth-child(even) td:nth-child(3n+1) p:not([class])::first-letter {
     color: rgb(var(--pfl-firstcol-even)); font-size: 2.4em;
   }


/* #############################################################################
   ===========================================================================
   IMPERATORIAL  (self-contained block)
   *** PLACEHOLDER PALETTE: black/white inverting checkerboard -- tune later ***
   ===========================================================================
   ############################################################################# */

 /* ---- geometry ---- */
   .Imperatorial {
     height: auto;
     border-collapse: separate;
     border-spacing: 0.5rem;
     vertical-align: top;
     display: block;
   }
   .Imperatorial th,
   .Imperatorial td {
     padding: 1rem;
     text-align: center;
   }

 /* ---- TABLE + CELL BORDERS ---- */
   .Imperatorial {
     border: 4px solid rgba(82,82,84, var(--tabl-opaq));    /* entire-table border (from source table{}) */
   }
   .Imperatorial th,
   .Imperatorial td {
     /* source cells were 4px navy (31,31,84); normalized to 2px to match pattern */
     border: 2px solid rgba(31,31,84, var(--tabl-opaq));    /* navy cell border */
   }

 /* ---- VARIABLES ---- */
   .Imperatorial {
     /* source interstitial was rgba(114,114,29, 0.1) -> converted to var(--tabl-opaq) */
     background-color: rgba(114,114,29, var(--tabl-opaq));  /* interstitial table color */

     /* PLACEHOLDER B/W inverting checkerboard: cell-1 is opposite of its row */
     --bg-odd: 255,255,255;            /* white */
     --bg-firstcol-odd: 0,0,0;         /* black */

     --bg-even: 0,0,0;                 /* black */
     --bg-firstcol-even: 255,255,255;  /* white */

     --p-odd: 0,0,0;                   /* black on white */
     --p-firstcol-odd: 255,255,255;    /* white on black */

     --p-even: 255,255,255;            /* white on black */
     --p-firstcol-even: 0,0,0;         /* black on white */

     /* pfl mirrors p for now (placeholder) */
     --pfl-odd: 0,0,0;
     --pfl-firstcol-odd: 255,255,255;
     --pfl-even: 255,255,255;
     --pfl-firstcol-even: 0,0,0;
   }

 /* ---- BACKGROUND + BASE TEXT ---- */
   .Imperatorial tr:nth-child(odd) td {
     background-color: rgba(var(--bg-odd), var(--tabl-opaq));
     color: rgb(var(--p-odd));
   }
   .Imperatorial tr:nth-child(odd) td:nth-child(3n+1) {
     background-color: rgba(var(--bg-firstcol-odd), var(--tabl-opaq));
     color: rgb(var(--p-firstcol-odd));
   }
   .Imperatorial tr:nth-child(even) td {
     background-color: rgba(var(--bg-even), var(--tabl-opaq));
     color: rgb(var(--p-even));
   }
   .Imperatorial tr:nth-child(even) td:nth-child(3n+1) {
     background-color: rgba(var(--bg-firstcol-even), var(--tabl-opaq));
     color: rgb(var(--p-firstcol-even));
   }

 /* ---- PARAGRAPH COLORS ---- */
   .Imperatorial tr:nth-child(odd) td p:not([class]) { color: rgb(var(--p-odd)); }
   .Imperatorial tr:nth-child(odd) td:nth-child(3n+1) p:not([class]) { color: rgb(var(--p-firstcol-odd)); }
   .Imperatorial tr:nth-child(even) td p:not([class]) { color: rgb(var(--p-even)); }
   .Imperatorial tr:nth-child(even) td:nth-child(3n+1) p:not([class]) { color: rgb(var(--p-firstcol-even)); }

 /* ---- PARAGRAPH 1st LETTER ---- */
   .Imperatorial tr:nth-child(odd) td p:not([class])::first-letter {
     color: rgb(var(--pfl-odd)); font-size: 2.0em;
   }
   .Imperatorial tr:nth-child(odd) td:nth-child(3n+1) p:not([class])::first-letter {
     color: rgb(var(--pfl-firstcol-odd)); font-size: 2.4em;
   }
   .Imperatorial tr:nth-child(even) td p:not([class])::first-letter {
     color: rgb(var(--pfl-even)); font-size: 2.0em;
   }
   .Imperatorial tr:nth-child(even) td:nth-child(3n+1) p:not([class])::first-letter {
     color: rgb(var(--pfl-firstcol-even)); font-size: 2.4em;
   }


/* #############################################################################
   ===========================================================================
   IMPERIAL  (self-contained block -- carried byte-identical from vars-2e)
   ===========================================================================
   ############################################################################# */

 /* ---- geometry ---- */
   .Imperial {
     height: auto;
     border-collapse: separate;
     border-spacing: 0.5rem;
     vertical-align: top;
     display: block;
   }
   .Imperial th,
   .Imperial td {
     padding: 1rem;
     text-align: center;
   }

 /* ---- TABLE + CELL BORDERS ---- */
   .Imperial {
     border: 4px solid rgba(241,191,49, var(--tabl-opaq));   /* Vivid Gold border */
   }
   .Imperial th,
   .Imperial td {
    /*    border: 2px solid rgba(88,58,98, var(--tabl-opaq));    /* purple cell borders */
      border: 2px solid rgba(202,169,105, var(--tabl-opaq));    /* bronze cell borders */
   }

 /* ---- VARIABLES ---- */
   .Imperial {
     background-color: rgba(42,42,40, var(--tabl-opaq));   /*interstitial table color */

     --bg-odd: 202,84,78;
     --bg-firstcol-odd: 131,13,20;

     --bg-even: 73,73,73;
     --bg-firstcol-even: 60,15,18;

     --p-odd: 55,23,94;
     --p-firstcol-odd: 255,255,255;

     --p-even: 255,255,255;
     --p-firstcol-even: 255,51,51;

     --pfl-odd: 60,15,18;
     --pfl-firstcol-odd: 143,143,159;

     --pfl-even: 241,241,76;
     --pfl-firstcol-even: 241,241,76;
   }

 /* ---- BACKGROUND + BASE TEXT ---- */
   .Imperial tr:nth-child(odd) td {
     background-color: rgba(var(--bg-odd), var(--tabl-opaq));
     color: rgb(var(--p-odd));
   }
   .Imperial tr:nth-child(odd) td:nth-child(3n+1) {
     background-color: rgba(var(--bg-firstcol-odd), var(--tabl-opaq));
     color: rgb(var(--p-firstcol-odd));
   }
   .Imperial tr:nth-child(even) td {
     background-color: rgba(var(--bg-even), var(--tabl-opaq));
     color: rgb(var(--p-even));
   }
   .Imperial tr:nth-child(even) td:nth-child(3n+1) {
     background-color: rgba(var(--bg-firstcol-even), var(--tabl-opaq));
     color: rgb(var(--p-firstcol-even));
   }

 /* ---- PARAGRAPH COLORS ---- */
   .Imperial tr:nth-child(odd) td p:not([class]) { color: rgb(var(--p-odd)); }
   .Imperial tr:nth-child(odd) td:nth-child(3n+1) p:not([class]) { color: rgb(var(--p-firstcol-odd)); }
   .Imperial tr:nth-child(even) td p:not([class]) { color: rgb(var(--p-even)); }
   .Imperial tr:nth-child(even) td:nth-child(3n+1) p:not([class]) { color: rgb(var(--p-firstcol-even)); }

 /* ---- PARAGRAPH 1st LETTER ---- */
   .Imperial tr:nth-child(odd) td p:not([class])::first-letter {
     color: rgb(var(--pfl-odd)); font-size: 2.0em;
   }
   .Imperial tr:nth-child(odd) td:nth-child(3n+1) p:not([class])::first-letter {
     color: rgb(var(--pfl-firstcol-odd)); font-size: 2.4em;
   }
   .Imperial tr:nth-child(even) td p:not([class])::first-letter {
     color: rgb(var(--pfl-even)); font-size: 2.0em;
   }
   .Imperial tr:nth-child(even) td:nth-child(3n+1) p:not([class])::first-letter {
     color: rgb(var(--pfl-firstcol-even)); font-size: 2.4em;
   }


/* #############################################################################
   ===========================================================================
   DOMINATE  (self-contained block -- carried byte-identical from vars-2e)
   pfl = <p>:: 1st letter is not dynamically editable thru Dev Tools (F12)
   ===========================================================================
   ############################################################################# */

 /* ---- geometry ---- */
   .Dominate {
     height: auto;
     border-collapse: separate;
     border-spacing: 0.5rem;
     vertical-align: top;
     display: block;
   }
   .Dominate th,
   .Dominate td {
     padding: 1rem;
     text-align: center;
   }

 /* ---- TABLE + CELL BORDERS ---- */
   .Dominate {
     border: 5px solid rgba(104,77,10, var(--tabl-opaq));     /* dark red border */
   }
   .Dominate th,
   .Dominate td {
     border: 2px solid rgba(40,10,10, var(--tabl-opaq));     /* dark cell borders */
   }

 /* ---- VARIABLES ---- */
   .Dominate {
     background-color: rgba(88, 58, 98, var(--tabl-opaq));   /* Interstitial  purple base -  */

     /* ===== Background Colors ===== */
     --bg-odd: 226,218,196;          /* warm ivory stone */
     --bg-firstcol-odd:  92,64,122;  /* purple */
     --bg-even: 196,184,156;         /* darker warm stone */
     --bg-firstcol-even: 65,45,90; /* deeper purple 126,96,154;*/

     /* ===== Paragraph Colors ===== */
     --p-odd: 61,43,31;              /* dark bronze-brown */
     --p-firstcol-odd: 247,231,168;  /* pale gold */
     --p-even: 47,33,24;             /* deep brown */
     --p-firstcol-even: 255,210,74;  /* stronger gold */

     /* ===== First Letter ===== */
     --pfl-odd: 138,106,31;          /* bronze-gold */
     --pfl-firstcol-odd: 255,242,168;/* bright gold */
     --pfl-even: 110,79,22;          /* darker bronze */
     --pfl-firstcol-even: 255,224,102;/* imperial gold */
   }

 /* ---- BACKGROUND + BASE TEXT ---- */
   .Dominate tr:nth-child(odd) td {
     background-color: rgba(var(--bg-odd), var(--tabl-opaq));
     color: rgb(var(--p-odd));
   }
   .Dominate tr:nth-child(odd) td:nth-child(3n+1) {
     background-color: rgba(var(--bg-firstcol-odd), var(--tabl-opaq));
     color: rgb(var(--p-firstcol-odd));
   }
   .Dominate tr:nth-child(even) td {
     background-color: rgba(var(--bg-even), var(--tabl-opaq));
     color: rgb(var(--p-even));
   }
   .Dominate tr:nth-child(even) td:nth-child(3n+1) {
     background-color: rgba(var(--bg-firstcol-even), var(--tabl-opaq));
     color: rgb(var(--p-firstcol-even));
   }

 /* ---- PARAGRAPH COLORS ---- */
   .Dominate tr:nth-child(odd) td p:not([class]) { color: rgb(var(--p-odd)); }
   .Dominate tr:nth-child(odd) td:nth-child(3n+1) p:not([class]) { color: rgb(var(--p-firstcol-odd)); }
   .Dominate tr:nth-child(even) td p:not([class]) { color: rgb(var(--p-even)); }
   .Dominate tr:nth-child(even) td:nth-child(3n+1) p:not([class]) { color: rgb(var(--p-firstcol-even)); }

 /* ---- PARAGRAPH 1st LETTER ---- */
   .Dominate tr:nth-child(odd) td p:not([class])::first-letter {
     color: rgb(var(--pfl-odd)); font-size: 2.0em;
   }
   .Dominate tr:nth-child(odd) td:nth-child(3n+1) p:not([class])::first-letter {
     color: rgb(var(--pfl-firstcol-odd)); font-size: 2.4em;
   }
   .Dominate tr:nth-child(even) td p:not([class])::first-letter {
     color: rgb(var(--pfl-even)); font-size: 2.0em;
   }
   .Dominate tr:nth-child(even) td:nth-child(3n+1) p:not([class])::first-letter {
     color: rgb(var(--pfl-firstcol-even)); font-size: 2.4em;
   }
