/* James Monroe Residents — alternative themes ("skins").
   Each skin only restyles: content, structure and behavior are shared.
   Which skin a page uses is set in assets/site-data.js -> THEMES.  "harbor" = the original design (no overrides). */

/* ============ BROWNSTONE: espresso brown + tan, bold condensed uppercase, angled label bars ============ */
:root[data-skin="brownstone"]{
  --paper:#f3ece4;--surface:#fffaf5;--ink:#2c201c;--muted:#6f5d54;--line:#dfd1c3;
  --river:#6b4a3a;--deep:#3a2a25;--river-soft:#efe2d5;--brass:#a36a35;--brass-soft:#f6e7d6;
  --green:#5f6b3c;--green-soft:#e9ecd9;--coral:#a8412c;--coral-soft:#f7e1da;
  --display:"Oswald","Arial Narrow",Arial,sans-serif;--body:"Source Sans 3","Segoe UI",Arial,sans-serif;
  --radius:3px;--hl:#e3cdb5;--ov:36,24,20;--deepbg:#2a1d19;--ctl:rgba(42,29,25,.94);color-scheme:light;
}
[data-skin="brownstone"] h1,[data-skin="brownstone"] h2,[data-skin="brownstone"] .s-h1,[data-skin="brownstone"] .s-h2,[data-skin="brownstone"] .callout,[data-skin="brownstone"] .deckbar .dbt b{text-transform:uppercase;letter-spacing:.01em;font-weight:700}
[data-skin="brownstone"] h3{font-weight:600;letter-spacing:.02em}
[data-skin="brownstone"] .s-h1{line-height:1.05}
[data-skin="brownstone"] :is(.card,.glass,.step,.stat,.tilecard,.topic,.notice,.panel,.event,.help,.photo,.bphoto,.mapframe,.answer,.result,.tablewrap,.yr,.facts6,.checklist label,.azlist details,.btnlink,.mark,.ic,.ti){border-radius:3px}
[data-skin="brownstone"] :is(.kick,.banner .kicker,.eyebrow){display:inline-flex;background:var(--hl);color:#3a2a25;padding:5px 30px 5px 14px;clip-path:polygon(0 0,100% 0,calc(100% - 18px) 100%,0 100%);opacity:1;letter-spacing:.1em}
[data-skin="brownstone"] .kick::before{display:none}
[data-skin="brownstone"] :is(.th-light,.th-white) .kick,[data-skin="brownstone"] .eyebrow{background:#3a2a25;color:#e3cdb5}
[data-skin="brownstone"] .ticker{background:#c8b29e;color:#2c201c}
[data-skin="brownstone"] .ticker b{color:#2c201c}
[data-skin="brownstone"] .ticker a{color:#2c201c}
[data-skin="brownstone"] .top{background:#2a1d19;border-bottom:3px solid #c8b29e}
[data-skin="brownstone"] .top :is(.brand,.topnav a,.menu-btn){color:#f3ece4}
[data-skin="brownstone"] .top .brand small{color:#c8b29e}
[data-skin="brownstone"] .mark{background:#c8b29e;color:#2a1d19}
[data-skin="brownstone"] .topnav a:hover,[data-skin="brownstone"] .topnav a[aria-current="page"]{background:#c8b29e;color:#2a1d19}
[data-skin="brownstone"] .deckbar{border-bottom:3px solid #c8b29e}
[data-skin="brownstone"] .th-river{background:linear-gradient(160deg,#4a362f,#2a1d19)}
[data-skin="brownstone"] .th-brass{background:linear-gradient(160deg,#9a6a45,#5e3a25)}
[data-skin="brownstone"] .th-green{background:linear-gradient(160deg,#6a6a45,#3a3a24)}
[data-skin="brownstone"] .th-coral{background:linear-gradient(160deg,#a3482f,#6a2618)}
[data-skin="brownstone"] .th-ink{background:linear-gradient(160deg,#33262a,#17100f)}
[data-skin="brownstone"] .th-plum{background:linear-gradient(160deg,#7a5552,#4a302f)}
[data-skin="brownstone"] .t-river{background:#3a2a25}
[data-skin="brownstone"] .t-brass{background:#8a5c3a}
[data-skin="brownstone"] .t-green{background:#5c5d3a}
[data-skin="brownstone"] .t-coral{background:#8c3b2a}
[data-skin="brownstone"] .t-ink{background:#1f1614}
[data-skin="brownstone"] .t-sky{background:#7b6253}
[data-skin="brownstone"] .t-plum{background:#6b4a4a}
[data-skin="brownstone"] .topic{border-bottom:5px solid #c8b29e}
[data-skin="brownstone"] .event .date,[data-skin="brownstone"] .event:nth-child(n) .date{background:#3a2a25}
[data-skin="brownstone"] .event:nth-child(even) .date{background:#8a5c3a}
[data-skin="brownstone"] .stat b{letter-spacing:0}

/* ============ SKYLINE: midnight navy + gold, elegant serif headlines ============ */
:root[data-skin="skyline"]{
  --paper:#f5f4f0;--surface:#ffffff;--ink:#15181f;--muted:#5a606c;--line:#dcd9d0;
  --river:#1d2a47;--deep:#0f1728;--river-soft:#e7eaf1;--brass:#9c7a25;--brass-soft:#f5edd8;
  --green:#2c6a59;--green-soft:#e0efea;--coral:#b3402f;--coral-soft:#f9e4df;
  --display:"Playfair Display",Georgia,"Times New Roman",serif;--body:"Source Sans 3","Segoe UI",Arial,sans-serif;
  --radius:6px;--hl:#e3c36e;--ov:10,14,26;--deepbg:#0b1120;--ctl:rgba(11,17,32,.94);color-scheme:light;
}
[data-skin="skyline"] :is(h1,h2,.s-h1,.s-h2,.callout){font-weight:700;letter-spacing:-.01em}
[data-skin="skyline"] .s-h1{font-weight:800}
[data-skin="skyline"] :is(.stat b,.facts6 b,.result .big,.yr b,.event .date b,.help a,.table td.amt){font-family:var(--body);font-weight:700}
[data-skin="skyline"] :is(.card,.glass,.step,.stat,.tilecard,.topic,.notice,.panel,.event,.help,.photo,.bphoto,.mapframe,.answer,.result,.tablewrap,.yr,.facts6){border-radius:6px}
[data-skin="skyline"] .top{border-bottom:2px solid var(--brass)}
[data-skin="skyline"] .mark{background:#0f1728;color:#e3c36e;font-family:"Playfair Display",serif}
[data-skin="skyline"] .deckbar{background:#0f1728;border-bottom:2px solid #c9a544}
[data-skin="skyline"] .deckbar .ti{background:transparent;border:1px solid #c9a544;color:#e3c36e}
[data-skin="skyline"] .ticker{background:#0f1728;border-top:1px solid #c9a544}
[data-skin="skyline"] .th-river{background:radial-gradient(1200px 600px at 85% 10%,#2b3c63 0%,#17223c 50%,#0b1120 100%)}
[data-skin="skyline"] .th-brass{background:radial-gradient(1200px 600px at 85% 10%,#a8862f 0%,#7a5f1c 50%,#463610 100%)}
[data-skin="skyline"] .th-green{background:radial-gradient(1200px 600px at 85% 10%,#2f7565 0%,#1c4d43 50%,#0e2a25 100%)}
[data-skin="skyline"] .th-coral{background:radial-gradient(1200px 600px at 85% 10%,#b9523f 0%,#8a3122 50%,#4d170f 100%)}
[data-skin="skyline"] .th-ink{background:radial-gradient(1200px 600px at 85% 10%,#262b36 0%,#14171e 55%,#07080b 100%)}
[data-skin="skyline"] .th-plum{background:radial-gradient(1200px 600px at 85% 10%,#5a3f6b 0%,#3a2748 50%,#1d1226 100%)}
[data-skin="skyline"] .t-river{background:linear-gradient(135deg,#24345a,#0f1728)}
[data-skin="skyline"] .t-brass{background:linear-gradient(135deg,#a88a35,#6b5318)}
[data-skin="skyline"] .t-green{background:linear-gradient(135deg,#2f7565,#143a32)}
[data-skin="skyline"] .t-coral{background:linear-gradient(135deg,#b9523f,#6e2217)}
[data-skin="skyline"] .t-ink{background:linear-gradient(135deg,#2a2f3a,#0b0d12)}
[data-skin="skyline"] .t-sky{background:linear-gradient(135deg,#3d5a8a,#1d2a47)}
[data-skin="skyline"] .t-plum{background:linear-gradient(135deg,#5a3f6b,#2a1b35)}
[data-skin="skyline"] .topic{border-top:3px solid #c9a544}
[data-skin="skyline"] .event .date,[data-skin="skyline"] .event:nth-child(n) .date{background:#0f1728;border-bottom:2px solid #c9a544}

/* ============ GARDEN: forest green + sand, soft serif, rounded ============ */
:root[data-skin="garden"]{
  --paper:#f4f2e8;--surface:#fffefa;--ink:#1c2a22;--muted:#55645a;--line:#d9dbc9;
  --river:#2f5d46;--deep:#1c3a2c;--river-soft:#e1ecdd;--brass:#b0762a;--brass-soft:#f8ecd6;
  --green:#4c7a3a;--green-soft:#e4efdc;--coral:#bf553a;--coral-soft:#fae6df;
  --display:"DM Serif Display",Georgia,serif;--body:"DM Sans","Segoe UI",Arial,sans-serif;
  --radius:18px;--hl:#f0d48c;--ov:14,30,22;--deepbg:#12261c;--ctl:rgba(20,40,30,.94);color-scheme:light;
}
[data-skin="garden"] :is(h1,h2,h3,.s-h1,.s-h2,.callout,.deckbar .dbt b,.brand b,.topic b,.step b){font-weight:400;letter-spacing:0}
[data-skin="garden"] :is(.stat b,.facts6 b,.result .big,.yr b,.event .date b,.help a,.table td.amt,.mark){font-family:var(--body);font-weight:700}
[data-skin="garden"] :is(.card,.glass,.step,.stat,.tilecard,.topic,.notice,.panel,.event,.help,.photo,.bphoto,.mapframe,.answer,.result,.tablewrap,.yr,.facts6){border-radius:20px}
[data-skin="garden"] .mark{border-radius:50%}
[data-skin="garden"] .th-river{background:radial-gradient(1200px 600px at 85% 10%,#3f7a5c 0%,#285240 50%,#12261c 100%)}
[data-skin="garden"] .th-brass{background:radial-gradient(1200px 600px at 85% 10%,#cf9a45 0%,#a9722a 50%,#6b4514 100%)}
[data-skin="garden"] .th-green{background:radial-gradient(1200px 600px at 85% 10%,#6f9a4f 0%,#4c7a3a 50%,#294a1f 100%)}
[data-skin="garden"] .th-coral{background:radial-gradient(1200px 600px at 85% 10%,#d9755a 0%,#bf553a 50%,#7a2c1a 100%)}
[data-skin="garden"] .th-ink{background:radial-gradient(1200px 600px at 85% 10%,#2c4034 0%,#17261d 55%,#0a130e 100%)}
[data-skin="garden"] .th-plum{background:radial-gradient(1200px 600px at 85% 10%,#8a6a55 0%,#62483a 50%,#35261e 100%)}
[data-skin="garden"] .t-river{background:linear-gradient(135deg,#3a7357,#1c3a2c)}
[data-skin="garden"] .t-brass{background:linear-gradient(135deg,#c98f3c,#8a5a1c)}
[data-skin="garden"] .t-green{background:linear-gradient(135deg,#6a964c,#355a26)}
[data-skin="garden"] .t-coral{background:linear-gradient(135deg,#d06b50,#8c3722)}
[data-skin="garden"] .t-ink{background:linear-gradient(135deg,#2c4034,#101b15)}
[data-skin="garden"] .t-sky{background:linear-gradient(135deg,#4f8f8a,#2a5d59)}
[data-skin="garden"] .t-plum{background:linear-gradient(135deg,#8a6a55,#4d382d)}
[data-skin="garden"] .event .date,[data-skin="garden"] .event:nth-child(n) .date{background:#1c3a2c}
[data-skin="garden"] .event:nth-child(even) .date{background:#4c7a3a}

/* ============ NO WHITE BACKGROUNDS: every skin tints pages, cards and the light slides ============ */
:root:not([data-theme="dark"]){--paper:#d6e6ef;--surface:#ebf3f8;--line:#bcd2df;--tA:#d3e6f1;--tB:#93bdd6}
:root[data-skin="brownstone"]:not([data-theme="dark"]){--paper:#e6d8c8;--surface:#f2e8dc;--line:#d3bfa9;--tA:#efdfcb;--tB:#c9a37f}
:root[data-skin="skyline"]:not([data-theme="dark"]){--paper:#e4e1d6;--surface:#f1ede2;--line:#cfc8b3;--tA:#ece3c8;--tB:#b7c0d6}
:root[data-skin="garden"]:not([data-theme="dark"]){--paper:#e2e8d6;--surface:#eef2e5;--line:#cad3b8;--tA:#e8eed9;--tB:#b4cb9c}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){--tA:#16242e;--tB:#0e161c}}
.th-light{background:radial-gradient(1100px 620px at 88% 8%,var(--tB) 0%,var(--tA) 55%,var(--paper) 100%)}
.th-white{background:linear-gradient(135deg,var(--tA) 0%,var(--tB) 100%)}
.th-light .stat,.th-white .stat,.th-light .card,.th-white .card,.th-light .step,.th-white .step{background:var(--surface)}
