@import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:wght@300;400;500;600&family=Syne:wght@400;600;700;800&display=swap');

/* ─────────────────────────────────────────────
   CalcPad — Theme definitions
   To add a theme: add a CSS block below, then
   add it to THEME_CYCLE and THEME_META in the
   main HTML script.
   ───────────────────────────────────────────── */

/* ── DEFAULT DARK ── */
:root {
  --bg:        #0f0f11;
  --surface:   #17171a;
  --panel:     #1c1c20;
  --border:    #2a2a30;
  --accent:    #c8f060;
  --accent2:   #60d4f0;
  --accent3:   #f0a060;
  --muted:     #4a4a55;
  --text:      #e8e8ee;
  --text-dim:  #8888a0;
  --error:     #f06060;
  --divider:   #222228;
  --font-mono: 'JetBrains Mono', monospace;
  --font-ui:   'Syne', sans-serif;
  --line-h:    28px;
}

/* ── LIGHT — Ledger Green ── */
[data-theme="light"] {
  --bg:       #e8ede5;
  --surface:  #dde3da;
  --panel:    #e2e8df;
  --border:   #c5cec1;
  --divider:  #cdd5c9;
  --accent:   #2d6b3a;
  --accent2:  #1a5c7a;
  --accent3:  #8a4e10;
  --muted:    #8a9888;
  --text:     #1c2419;
  --text-dim: #5a6858;
  --error:    #9e2a2a;
}
[data-theme="light"] #editor::selection       { background: rgba(45,107,58,.18); }
[data-theme="light"] .result-row.highlight    { background: rgba(45,107,58,.06); }
[data-theme="light"] .tb-dropdown-menu        { box-shadow: 0 8px 24px rgba(0,0,0,.12); }
[data-theme="light"] #export-overlay          { background: rgba(0,0,0,.35); }
[data-theme="light"] .tb-btn.accent:hover     { color: #fff; }

/* ── WARM STONE ── */
[data-theme="stone"] {
  --bg:       #ede9df;
  --surface:  #e4e0d4;
  --panel:    #e8e4d8;
  --border:   #ccc5b5;
  --divider:  #d0c9b8;
  --accent:   #5a3e1b;
  --accent2:  #2a4a6b;
  --accent3:  #7a3a10;
  --muted:    #9a9080;
  --text:     #1e1a14;
  --text-dim: #6a6050;
  --error:    #9e2a2a;
}
[data-theme="stone"] #editor::selection       { background: rgba(90,62,27,.18); }
[data-theme="stone"] .result-row.highlight    { background: rgba(90,62,27,.06); }
[data-theme="stone"] .tb-dropdown-menu        { box-shadow: 0 8px 24px rgba(0,0,0,.12); }
[data-theme="stone"] #export-overlay          { background: rgba(0,0,0,.35); }
[data-theme="stone"] .tb-btn.accent:hover     { color: #fff; }

/* ── SOLARIZED LIGHT ── */
[data-theme="solarized"] {
  --bg:       #fdf6e3;
  --surface:  #eee8d5;
  --panel:    #f5f0e4;
  --border:   #d1cbb8;
  --divider:  #ddd8c5;
  --accent:   #268bd2;
  --accent2:  #2aa198;
  --accent3:  #cb4b16;
  --muted:    #93a1a1;
  --text:     #073642;
  --text-dim: #93a1a1;
  --error:    #dc322f;
}
[data-theme="solarized"] #editor::selection       { background: rgba(38,139,210,.2); }
[data-theme="solarized"] .result-row.highlight    { background: rgba(38,139,210,.06); }
[data-theme="solarized"] .tb-dropdown-menu        { box-shadow: 0 8px 24px rgba(0,0,0,.12); }
[data-theme="solarized"] #export-overlay          { background: rgba(0,0,0,.35); }
[data-theme="solarized"] .tb-btn.accent:hover     { color: #fff; }

/* ── NORD ── */
[data-theme="nord"] {
  --bg:       #2e3440;
  --surface:  #3b4252;
  --panel:    #353b49;
  --border:   #4c566a;
  --divider:  #434c5e;
  --accent:   #88c0d0;
  --accent2:  #a3be8c;
  --accent3:  #ebcb8b;
  --muted:    #616e88;
  --text:     #eceff4;
  --text-dim: #9099b0;
  --error:    #bf616a;
}
[data-theme="nord"] #editor::selection    { background: rgba(136,192,208,.2); }
[data-theme="nord"] .result-row.highlight { background: rgba(136,192,208,.06); }

/* ── DRACULA ── */
[data-theme="dracula"] {
  --bg:       #282a36;
  --surface:  #1e2029;
  --panel:    #343746;
  --border:   #44475a;
  --divider:  #44475a;
  --accent:   #bd93f9;
  --accent2:  #8be9fd;
  --accent3:  #ffb86c;
  --muted:    #6272a4;
  --text:     #f8f8f2;
  --text-dim: #6272a4;
  --error:    #ff5555;
}
[data-theme="dracula"] #editor::selection    { background: rgba(189,147,249,.2); }
[data-theme="dracula"] .result-row.highlight { background: rgba(189,147,249,.06); }

/* ── GRUVBOX DARK ── */
[data-theme="gruvbox"] {
  --bg:       #282828;
  --surface:  #1d2021;
  --panel:    #32302f;
  --border:   #504945;
  --divider:  #3c3836;
  --accent:   #fabd2f;
  --accent2:  #8ec07c;
  --accent3:  #fe8019;
  --muted:    #665c54;
  --text:     #ebdbb2;
  --text-dim: #a89984;
  --error:    #fb4934;
}
[data-theme="gruvbox"] #editor::selection    { background: rgba(250,189,47,.2); }
[data-theme="gruvbox"] .result-row.highlight { background: rgba(250,189,47,.06); }

/* ── CATPPUCCIN MOCHA ── */
[data-theme="phantom"] {
  --bg:       #1e1e2e;
  --surface:  #181825;
  --panel:    #313244;
  --border:   #45475a;
  --divider:  #313244;
  --accent:   #cba6f7;
  --accent2:  #89dceb;
  --accent3:  #fab387;
  --muted:    #585b70;
  --text:     #cdd6f4;
  --text-dim: #7f849c;
  --error:    #f38ba8;
}
[data-theme="phantom"] #editor::selection    { background: rgba(203,166,247,.2); }
[data-theme="phantom"] .result-row.highlight { background: rgba(203,166,247,.06); }

/* ────────────────────────────────────────────
   MID-TONE THEMES — testing candidates
   Remove any that don't make the cut
   ──────────────────────────────────────────── */

/* ── CATPPUCCIN FRAPPÉ (mid-tone cool slate) ── */
[data-theme="damascus"] {
  --bg:       #303446;
  --surface:  #292c3c;
  --panel:    #414559;
  --border:   #51576d;
  --divider:  #414559;
  --accent:   #ca9ee6;
  --accent2:  #85c1dc;
  --accent3:  #ef9f76;
  --muted:    #626880;
  --text:     #c6d0f5;
  --text-dim: #949cbb;
  --error:    #e78284;
}
[data-theme="damascus"] #editor::selection    { background: rgba(202,158,230,.2); }
[data-theme="damascus"] .result-row.highlight { background: rgba(202,158,230,.06); }

/* ── DUSK (mid-tone warm mauve) ── */
[data-theme="dusk"] {
  --bg:       #52475e;
  --surface:  #453a52;
  --panel:    #5c5070;
  --border:   #6e6080;
  --divider:  #5a4f6a;
  --accent:   #f9c784;
  --accent2:  #84d1e0;
  --accent3:  #f4a26a;
  --muted:    #8a7a9a;
  --text:     #ede8f5;
  --text-dim: #aa9ab8;
  --error:    #f07878;
}
[data-theme="dusk"] #editor::selection    { background: rgba(249,199,132,.2); }
[data-theme="dusk"] .result-row.highlight { background: rgba(249,199,132,.06); }

/* ── HARBOR (mid-tone teal-slate) ── */
[data-theme="harbor"] {
  --bg:       #3e5062;
  --surface:  #344353;
  --panel:    #465c70;
  --border:   #5a7080;
  --divider:  #4a6070;
  --accent:   #ffd580;
  --accent2:  #7ec8e3;
  --accent3:  #f4a26a;
  --muted:    #7a9aaa;
  --text:     #d5e3f0;
  --text-dim: #9ab5c8;
  --error:    #f07878;
}
[data-theme="harbor"] #editor::selection    { background: rgba(255,213,128,.2); }
[data-theme="harbor"] .result-row.highlight { background: rgba(255,213,128,.06); }

/* ── MIST (mid-tone neutral gray) ── */
[data-theme="mist"] {
  --bg:       #5a6070;
  --surface:  #4e5460;
  --panel:    #646a78;
  --border:   #787e8c;
  --divider:  #606672;
  --accent:   #ff8c69;
  --accent2:  #7ec8a8;
  --accent3:  #ffd060;
  --muted:    #909aa8;
  --text:     #e8ecf2;
  --text-dim: #b0b8c4;
  --error:    #ff6868;
}
[data-theme="mist"] #editor::selection    { background: rgba(255,140,105,.2); }
[data-theme="mist"] .result-row.highlight { background: rgba(255,140,105,.06); }

/* ── EASTER (pink editor, purple toolbar/gutter, pink results — v5) ── */
[data-theme="easter"] {
  --bg:       #f2a8cc;
  --surface:  #5c2090;
  --panel:    #ffffe8;
  --border:   #c878aa;
  --divider:  #9050c0;
  --accent:   #5c2090;
  --accent2:  #5aaa8c;
  --accent3:  #e05808;
  --muted:    #b078a0;
  --text:     #280a3a;
  --text-dim: #785870;
  --error:    #c01818;
}
[data-theme="easter"] #editor::selection    { background: rgba(92,32,144,.2); }
[data-theme="easter"] .result-row.highlight { background: rgba(242,168,204,.28); }
[data-theme="easter"] .tb-dropdown-menu     { box-shadow: 0 8px 24px rgba(0,0,0,.3); }
[data-theme="easter"] #export-overlay       { background: rgba(40,10,58,.5); }
[data-theme="easter"] .tb-btn.accent:hover  { color: #280a3a; }
/* Status bar — pink with dark text, bookends the title bar */
[data-theme="easter"] #statusbar            { background: #f2a8cc !important; border-top-color: #c878aa !important; }
[data-theme="easter"] #statusbar .st-item b { color: #280a3a !important; }
[data-theme="easter"] #statusbar            { color: #785870 !important; }

/* Doc title bar — pink, with dark text since it's a light surface */
[data-theme="easter"] #doc-titlebar           { background: #f2a8cc !important; border-bottom-color: #c878aa !important; }
[data-theme="easter"] #doc-title-input,
[data-theme="easter"] #doc-subtitle-input     { color: #280a3a !important; }
[data-theme="easter"] #doc-titlebar-filename  { color: #785870 !important; }

/* Toolbar sits on dark purple — buttons and text need to be light */
[data-theme="easter"] .tb-btn               { color: #f0d0ff !important; }
[data-theme="easter"] .tb-btn:hover         { color: #ffffff !important; border-color: #f2a8cc !important; background: rgba(255,255,255,.15) !important; }
[data-theme="easter"] #btn-mydocs           { border-color: #f0e040 !important; }
[data-theme="easter"] #btn-quicksave        { color: #f0d0ff !important; border-color: rgba(255,255,255,.25) !important; }
[data-theme="easter"] #btn-quicksave:hover  { color: #ffffff !important; border-color: #f2a8cc !important; background: rgba(255,255,255,.1) !important; }
[data-theme="easter"] #btn-quicksave.dirty  { color: #ffcccc !important; border-color: #ffcccc !important; }
[data-theme="easter"] #doc-title-input,
[data-theme="easter"] #doc-subtitle-input   { color: #f0d0ff; }
[data-theme="easter"] #doc-titlebar-filename { color: rgba(240,208,255,.6); }
/* Modal headings on dark purple surface — need white text */
[data-theme="easter"] #examples-modal h2,
[data-theme="easter"] #snippets-modal h2,
[data-theme="easter"] #mydocs-modal h2,
[data-theme="easter"] #modal h2             { color: #ffffff !important; }
[data-theme="easter"] .snippets-hint        { color: rgba(255,255,255,.6) !important; }
[data-theme="easter"] .ex-category-heading { color: #f2a8cc !important; border-bottom-color: rgba(242,168,204,.4) !important; }
[data-theme="easter"] #modal h2 span        { color: rgba(255,255,255,.6) !important; }

/* Logo — "calc" pink, "pad" white */
[data-theme="easter"] #logo                 { color: #f2a8cc; }
[data-theme="easter"] #logo span            { color: #ffffff; }
/* Small action buttons (results hover + example cards) sit on dark --surface, need white text */
[data-theme="easter"] #results-print-btn,
[data-theme="easter"] #results-copy-btn,
[data-theme="easter"] #results-html-btn,
[data-theme="easter"] #results-md-btn,
[data-theme="easter"] .ex-card-btn          { color: #ffffff !important; border-color: rgba(255,255,255,.35) !important; }
[data-theme="easter"] #results-print-btn:hover,
[data-theme="easter"] #results-copy-btn:hover,
[data-theme="easter"] #results-html-btn:hover,
[data-theme="easter"] #results-md-btn:hover,
[data-theme="easter"] .ex-card-btn:hover    { color: #f2a8cc !important; border-color: #f2a8cc !important; }

/* Editor — spring sky gradient */
[data-theme="easter"] #editor {
  background: linear-gradient(to bottom, #c8e4ff, #ffffff 45%, #fffde0) !important;
}


/* ── HALLOWEEN (night sky editor, pumpkin chrome, candlelight gold text) ── */
[data-theme="halloween"] {
  --bg:       #12100e;
  --surface:  #0a0808;
  --panel:    #c8a870; /* warm tan fall — alt: #9a8468 medium gray-fall */
  --border:   #3a2000;
  --divider:  #2a1400;
  --accent:   #e07020;
  --accent2:  #8040c0;
  --accent3:  #50a820;
  --muted:    #4a3818;
  --text:     #f0c060;
  --text-dim: #906830;
  --error:    #ff4040;
}
[data-theme="halloween"] #editor::selection    { background: rgba(224,112,32,.25); }
[data-theme="halloween"] .result-row.highlight { background: rgba(125,90,55,.22); }
[data-theme="halloween"] .result-val           { color: #0d0500; }
[data-theme="halloween"] .result-val.is-label  { color: #3a1c04; }
[data-theme="halloween"] .result-val.has-inline-label:not(.is-total) .total-row-label { color: #3a2008 !important; }
[data-theme="halloween"] .result-val.is-total .total-row-label { color: #2a1000 !important; }
[data-theme="halloween"] .result-val.is-total  { color: #000000; }
[data-theme="halloween"] .result-val.is-header { color: #3a2008; }
[data-theme="halloween"] .result-val.is-error  { color: #cc1010; }
[data-theme="halloween"] .result-row.is-sum-row { border-top-color: rgba(42,20,0,.35); }
[data-theme="halloween"] .tb-dropdown-menu     { box-shadow: 0 8px 24px rgba(0,0,0,.6); }
[data-theme="halloween"] #export-overlay       { background: rgba(0,0,0,.6); }
[data-theme="halloween"] .tb-btn.accent:hover  { color: #000; }

/* Editor — night sky at top bleeding into bonfire glow at bottom */
[data-theme="halloween"] #editor {
  background: linear-gradient(to bottom, #0a0818, #1e0e00) !important;
}

/* Divider — orange glow */
[data-theme="halloween"] #divider {
  background: #e07020;
  box-shadow: 0 0 6px rgba(224,112,32,.8), 0 0 14px rgba(224,112,32,.4);
}

/* Logo — "calc" orange, "pad" purple */
[data-theme="halloween"] #logo      { color: #e07020; }
[data-theme="halloween"] #logo span { color: #8040c0; }

/* Title bar + status bar — pumpkin orange bookends */
[data-theme="halloween"] #doc-titlebar          { background: #c05010 !important; border-bottom-color: #3a2000 !important; }
[data-theme="halloween"] #doc-title-input,
[data-theme="halloween"] #doc-subtitle-input    { color: #f0c060 !important; }
[data-theme="halloween"] #doc-titlebar-filename { color: rgba(240,192,96,.65) !important; }
[data-theme="halloween"] #statusbar             { background: #c05010 !important; border-top-color: #3a2000 !important; color: #f0c060 !important; }
[data-theme="halloween"] #statusbar .st-item b  { color: #f0c060 !important; }

/* Toolbar buttons on near-black */
[data-theme="halloween"] .tb-btn                { color: #d4a040 !important; }
[data-theme="halloween"] .tb-btn:hover          { color: #e07020 !important; border-color: #e07020 !important; background: rgba(224,112,32,.12) !important; }
[data-theme="halloween"] #btn-quicksave         { color: #d4a040 !important; border-color: rgba(212,160,64,.3) !important; }
[data-theme="halloween"] #btn-quicksave:hover   { color: #e07020 !important; border-color: #e07020 !important; background: rgba(224,112,32,.12) !important; }
[data-theme="halloween"] #btn-quicksave.dirty   { color: #50a820 !important; border-color: #50a820 !important; }

/* Small action buttons */
[data-theme="halloween"] #results-print-btn,
[data-theme="halloween"] #results-copy-btn,
[data-theme="halloween"] #results-html-btn,
[data-theme="halloween"] #results-md-btn,
[data-theme="halloween"] .ex-card-btn           { color: #d4a040 !important; border-color: rgba(212,160,64,.35) !important; }
[data-theme="halloween"] #results-print-btn:hover,
[data-theme="halloween"] #results-copy-btn:hover,
[data-theme="halloween"] #results-html-btn:hover,
[data-theme="halloween"] #results-md-btn:hover,
[data-theme="halloween"] .ex-card-btn:hover     { color: #e07020 !important; border-color: #e07020 !important; }

/* Modal headings + borders — purple matching logo "pad" */
[data-theme="halloween"] #examples-modal h2,
[data-theme="halloween"] #snippets-modal h2,
[data-theme="halloween"] #mydocs-modal h2,
[data-theme="halloween"] #modal h2              { color: #8040c0 !important; }
[data-theme="halloween"] .snippets-hint         { color: rgba(240,192,96,.6) !important; }
[data-theme="halloween"] #modal h2 span         { color: rgba(240,192,96,.6) !important; }
[data-theme="halloween"] #examples-modal,
[data-theme="halloween"] #snippets-modal,
[data-theme="halloween"] #mydocs-modal,
[data-theme="halloween"] #modal                 { border-color: #8040c0 !important; }

/* Print overrides */
@media print {
  [data-theme="halloween"] #results-wrap { background: #ffffff !important; }
  [data-theme="halloween"] #input-wrap   { background: #ffffff !important; }
  [data-theme="halloween"] #editor       { background: #ffffff !important; }
  [data-theme="halloween"] #gutter       { background: #ffffff !important; }
}

/* ── CHRISTMAS (green chrome, white editor, red modals, yellow/white stripe) ── */
[data-theme="christmas"] {
  --bg:       #ffffff;
  --surface:  #1a6b2a;
  --panel:    #ffffff;
  --border:   #2a8a3a;
  --divider:  #1a6b2a;
  --accent:   #c41e1e;
  --accent2:  #1a6b2a;
  --accent3:  #d4a800;
  --muted:    #a8d8b0;
  --text:     #a00000;
  --text-dim: #c84040;
  --error:    #ff0000;
}
[data-theme="christmas"] #editor::selection    { background: rgba(196,30,30,.15); }
[data-theme="christmas"] .result-row.highlight { background: #fffacc; }
[data-theme="christmas"] .tb-dropdown-menu     { box-shadow: 0 8px 24px rgba(0,0,0,.2); }
[data-theme="christmas"] #export-overlay       { background: rgba(0,0,0,.5); }
[data-theme="christmas"] .tb-btn.accent:hover  { color: #ffffff; }

/* Divider — gold */
[data-theme="christmas"] #divider              { background: #d4a800; }
[data-theme="christmas"] #divider:hover,
[data-theme="christmas"] #divider.dragging     { background: #c41e1e; }

/* Logo — "calc" white, "pad" gold */
[data-theme="christmas"] #logo                 { color: #ffffff; }
[data-theme="christmas"] #logo span            { color: #d4a800; }

/* Toolbar buttons on green */
[data-theme="christmas"] .tb-btn               { color: #ffffff !important; }
[data-theme="christmas"] .tb-btn:hover         { color: #d4a800 !important; border-color: #d4a800 !important; background: rgba(255,255,255,.12) !important; }
[data-theme="christmas"] #btn-quicksave        { color: #ffffff !important; border-color: rgba(255,255,255,.3) !important; }
[data-theme="christmas"] #btn-quicksave:hover  { color: #d4a800 !important; border-color: #d4a800 !important; background: rgba(255,255,255,.12) !important; }
[data-theme="christmas"] #btn-quicksave.dirty  { color: #ffd0d0 !important; border-color: #ffd0d0 !important; }

/* Title bar + status bar — red with white text */
[data-theme="christmas"] #doc-titlebar          { background: #c41e1e !important; border-bottom-color: #8b0000 !important; }
[data-theme="christmas"] #doc-title-input,
[data-theme="christmas"] #doc-subtitle-input    { color: #ffffff !important; }
[data-theme="christmas"] #doc-titlebar-filename { color: rgba(255,255,255,.65) !important; }
[data-theme="christmas"] #doc-timestamp-wrap    { color: #ffffff !important; }
[data-theme="christmas"] #doc-titlebar label   { color: #ffffff !important; }
[data-theme="christmas"] #statusbar             { background: #c41e1e !important; border-top-color: #8b0000 !important; color: rgba(255,255,255,.7) !important; }
[data-theme="christmas"] #statusbar .st-item b  { color: #ffffff !important; }

/* Small action buttons */
[data-theme="christmas"] #results-print-btn,
[data-theme="christmas"] #results-copy-btn,
[data-theme="christmas"] #results-html-btn,
[data-theme="christmas"] #results-md-btn        { color: #ffffff !important; border-color: rgba(255,255,255,.4) !important; }
[data-theme="christmas"] #results-print-btn:hover,
[data-theme="christmas"] #results-copy-btn:hover,
[data-theme="christmas"] #results-html-btn:hover,
[data-theme="christmas"] #results-md-btn:hover  { color: #d4a800 !important; border-color: #d4a800 !important; }
[data-theme="christmas"] .ex-card-btn           { color: #ffffff !important; border-color: rgba(255,255,255,.5) !important; }
[data-theme="christmas"] .ex-card-btn:hover     { color: #d4a800 !important; border-color: #d4a800 !important; }

/* Modals — red background, white headings */
[data-theme="christmas"] #examples-modal,
[data-theme="christmas"] #snippets-modal,
[data-theme="christmas"] #mydocs-modal,
[data-theme="christmas"] #modal                 { background: #c41e1e !important; border-color: #8b0000 !important; }
[data-theme="christmas"] #examples-modal h2,
[data-theme="christmas"] #snippets-modal h2,
[data-theme="christmas"] #mydocs-modal h2,
[data-theme="christmas"] #modal h2              { color: #ffffff !important; }
[data-theme="christmas"] .ex-category-heading   { color: rgba(255,255,255,.75) !important; }
[data-theme="christmas"] #examples-modal::-webkit-scrollbar-thumb,
[data-theme="christmas"] #snippets-modal::-webkit-scrollbar-thumb,
[data-theme="christmas"] #mydocs-modal::-webkit-scrollbar-thumb,
[data-theme="christmas"] #modal::-webkit-scrollbar-thumb { background: #d4a800 !important; }
[data-theme="christmas"] #examples-modal::-webkit-scrollbar-thumb:hover,
[data-theme="christmas"] #snippets-modal::-webkit-scrollbar-thumb:hover,
[data-theme="christmas"] #mydocs-modal::-webkit-scrollbar-thumb:hover,
[data-theme="christmas"] #modal::-webkit-scrollbar-thumb:hover { background: #fffacc !important; }
[data-theme="christmas"] .snippets-hint         { color: rgba(255,255,255,.7) !important; }
[data-theme="christmas"] #modal h2 span         { color: rgba(255,255,255,.7) !important; }

/* Print overrides */
@media print {
  [data-theme="christmas"] #results-wrap { background: #ffffff !important; }
  [data-theme="christmas"] #input-wrap   { background: #ffffff !important; }
  [data-theme="christmas"] #editor       { background: #ffffff !important; }
  [data-theme="christmas"] #gutter       { background: #ffffff !important; }
}

/* ── STREIB (all-red chrome, white editor, no green) ── */
[data-theme="streib"] {
  --bg:       #ffffff;
  --surface:  #c41e1e;
  --panel:    #f2f2f2;
  --border:   #e03030;
  --divider:  #a01818;
  --accent:   #8b0000;
  --accent2:  #c41e1e;
  --accent3:  #e05050;
  --muted:    #ffb0b0;
  --text:     #1a0000;
  --text-dim: #8b0000;
  --error:    #ff4040;
}
[data-theme="streib"] #editor::selection    { background: rgba(139,0,0,.15); }
[data-theme="streib"] .result-row.highlight { background: #ebebeb; }

/* Gutter — darker red so line numbers pop */
[data-theme="streib"] #gutter               { background: #7a0a0a !important; }

/* Divider */
[data-theme="streib"] #divider              { background: #e03030; }
[data-theme="streib"] #divider:hover,
[data-theme="streib"] #divider.dragging     { background: #8b0000; }

/* Logo */
[data-theme="streib"] #logo                 { color: #ffffff; }
[data-theme="streib"] #logo span            { color: rgba(255,255,255,.7); }

/* Toolbar buttons on red */
[data-theme="streib"] .tb-btn               { color: #ffffff !important; }
[data-theme="streib"] .tb-btn:hover         { color: #ffffff !important; border-color: rgba(255,255,255,.6) !important; background: rgba(255,255,255,.15) !important; }
[data-theme="streib"] #btn-quicksave        { color: #ffffff !important; border-color: rgba(255,255,255,.3) !important; }
[data-theme="streib"] #btn-quicksave:hover  { color: #ffffff !important; border-color: rgba(255,255,255,.6) !important; background: rgba(255,255,255,.15) !important; }
[data-theme="streib"] #btn-quicksave.dirty  { color: #ffd0d0 !important; border-color: #ffd0d0 !important; }

/* Title bar — slightly darker red */
[data-theme="streib"] #doc-titlebar          { background: #a01818 !important; border-bottom-color: #7a0a0a !important; }
[data-theme="streib"] #doc-title-input,
[data-theme="streib"] #doc-subtitle-input    { color: #ffffff !important; }
[data-theme="streib"] #doc-titlebar-filename { color: rgba(255,255,255,.65) !important; }
[data-theme="streib"] #doc-timestamp-wrap    { color: #ffffff !important; }
[data-theme="streib"] #doc-titlebar label    { color: #ffffff !important; }

/* Status bar — darker red */
[data-theme="streib"] #statusbar             { background: #7a0a0a !important; border-top-color: #5a0000 !important; color: rgba(255,255,255,.7) !important; }
[data-theme="streib"] #statusbar .st-item b  { color: #ffffff !important; }

/* Small action buttons */
[data-theme="streib"] #results-print-btn,
[data-theme="streib"] #results-copy-btn,
[data-theme="streib"] #results-html-btn,
[data-theme="streib"] #results-md-btn        { color: #ffffff !important; background: #000000 !important; border-color: #000000 !important; }
[data-theme="streib"] #results-print-btn:hover,
[data-theme="streib"] #results-copy-btn:hover,
[data-theme="streib"] #results-html-btn:hover,
[data-theme="streib"] #results-md-btn:hover  { color: #ffaaaa !important; background: #c41e1e !important; border-color: #c41e1e !important; }
[data-theme="streib"] .ex-card-btn            { color: #ffffff !important; border-color: rgba(255,255,255,.4) !important; }
[data-theme="streib"] .ex-card-btn:hover      { color: #8b0000 !important; border-color: #8b0000 !important; }

/* Modals — red background, white headings, white cards */
[data-theme="streib"] #examples-modal,
[data-theme="streib"] #snippets-modal,
[data-theme="streib"] #mydocs-modal,
[data-theme="streib"] #modal                  { background: #c41e1e !important; border-color: #8b0000 !important; }
[data-theme="streib"] #examples-modal h2,
[data-theme="streib"] #snippets-modal h2,
[data-theme="streib"] #mydocs-modal h2,
[data-theme="streib"] #modal h2               { color: #ffffff !important; }
[data-theme="streib"] .ex-category-heading    { color: rgba(255,255,255,.75) !important; }
[data-theme="streib"] .snippets-hint          { color: rgba(255,255,255,.7) !important; }
[data-theme="streib"] #modal h2 span          { color: rgba(255,255,255,.7) !important; }

/* Modal scrollbar — white thumb */
[data-theme="streib"] #examples-modal::-webkit-scrollbar-thumb,
[data-theme="streib"] #snippets-modal::-webkit-scrollbar-thumb,
[data-theme="streib"] #mydocs-modal::-webkit-scrollbar-thumb,
[data-theme="streib"] #modal::-webkit-scrollbar-thumb          { background: rgba(255,255,255,.4) !important; }
[data-theme="streib"] #examples-modal::-webkit-scrollbar-thumb:hover,
[data-theme="streib"] #snippets-modal::-webkit-scrollbar-thumb:hover,
[data-theme="streib"] #mydocs-modal::-webkit-scrollbar-thumb:hover,
[data-theme="streib"] #modal::-webkit-scrollbar-thumb:hover    { background: rgba(255,255,255,.7) !important; }

/* Print overrides */
@media print {
  [data-theme="streib"] #results-wrap { background: #ffffff !important; }
  [data-theme="streib"] #input-wrap   { background: #ffffff !important; }
  [data-theme="streib"] #editor       { background: #ffffff !important; }
  [data-theme="streib"] #gutter       { background: #ffffff !important; }
}

/* ── WINDOWS 3.1 CLASSIC (iconic silver gray) ── */
[data-theme="win31"] {
  --bg:       #c0c0c0;
  --surface:  #d4d0c8;
  --panel:    #b8b8b8;
  --border:   #808080;
  --divider:  #808080;
  --accent:   #000080;
  --accent2:  #008080;
  --accent3:  #800000;
  --muted:    #909090;
  --text:     #000000;
  --text-dim: #505050;
  --error:    #cc0000;
  --font-ui:  'Arial', sans-serif;
}
[data-theme="win31"] #editor::selection       { background: rgba(0,0,128,.2); }
[data-theme="win31"] .result-row.highlight    { background: rgba(0,0,0,.05); }
[data-theme="win31"] .tb-dropdown-menu        { box-shadow: 2px 2px 0 #808080 !important; border-radius: 0 !important; }
[data-theme="win31"] #export-overlay          { background: rgba(0,0,0,.35); }

/* ── WIN 3.1/95 CHROME ── */

/* Kill all transitions — no animation in 1995 */
[data-theme="win31"] * { transition: none !important; }

/* Toolbar buttons — raised bevel */
[data-theme="win31"] .tb-btn {
  border-radius: 0 !important;
  border: 1px solid #808080 !important;
  background: #c0c0c0 !important;
  color: #000000 !important;
  box-shadow: inset -1px -1px #404040, inset 1px 1px #ffffff,
              inset -2px -2px #808080, inset 2px 2px #dfdfdf;
}
[data-theme="win31"] .tb-btn:hover {
  background: #c0c0c0 !important;
  border-color: #808080 !important;
  color: #000000 !important;
  box-shadow: inset -1px -1px #404040, inset 1px 1px #ffffff,
              inset -2px -2px #808080, inset 2px 2px #dfdfdf;
}
[data-theme="win31"] .tb-btn:active {
  box-shadow: inset 1px 1px #404040, inset -1px -1px #ffffff,
              inset 2px 2px #808080, inset -2px -2px #dfdfdf !important;
  transform: translate(1px, 1px);
}
/* My Docs accent = Win95 "default" button — thick black outer border */
[data-theme="win31"] .tb-btn.accent {
  border: 2px solid #000000 !important;
  color: #000000 !important;
}
[data-theme="win31"] .tb-btn.accent:hover { color: #000000 !important; background: #c0c0c0 !important; }
[data-theme="win31"] #btn-quicksave.dirty  { color: #cc0000 !important; border-color: #808080 !important; }

/* Toolbar separator — classic Win95 double groove */
[data-theme="win31"] .tb-sep {
  background: none !important;
  border-left: 1px solid #808080;
  border-right: 1px solid #dfdfdf;
  width: 4px !important;
}

/* Toolbar bottom edge */
[data-theme="win31"] #toolbar { border-bottom: 2px solid #808080 !important; }

/* Modal dialogs — Win95 raised dialog border */
[data-theme="win31"] #modal,
[data-theme="win31"] #examples-modal,
[data-theme="win31"] #mydocs-modal,
[data-theme="win31"] #snippets-modal,
[data-theme="win31"] #export-modal {
  border-radius: 0 !important;
  border: 2px solid !important;
  border-color: #dfdfdf #404040 #404040 #dfdfdf !important;
  box-shadow: 2px 2px 0 #808080 !important;
}

/* Modal title bars — navy Win95 title bar */
[data-theme="win31"] #modal h2,
[data-theme="win31"] #examples-modal h2,
[data-theme="win31"] #mydocs-modal h2,
[data-theme="win31"] #snippets-modal h2,
[data-theme="win31"] #export-modal h2 {
  background: #000080 !important;
  color: #ffffff !important;
  margin: -24px -28px 20px !important;
  padding: 3px 8px !important;
  font-size: 12px !important;
  font-family: 'Arial', sans-serif !important;
  font-weight: bold !important;
  letter-spacing: 0 !important;
  text-transform: none !important;
  border-radius: 0 !important;
}

/* Cards — slight inset border, selection highlight on hover */
[data-theme="win31"] .mydocs-card,
[data-theme="win31"] .snippet-card,
[data-theme="win31"] .ex-card {
  border-radius: 0 !important;
  border: 1px solid !important;
  border-color: #808080 #dfdfdf #dfdfdf #808080 !important;
  box-shadow: none !important;
}
[data-theme="win31"] .mydocs-card:hover,
[data-theme="win31"] .snippet-card:hover {
  background: #000080 !important;
  color: #ffffff !important;
  border-color: #000080 !important;
}
[data-theme="win31"] .mydocs-card:hover .mydocs-card-title,
[data-theme="win31"] .mydocs-card:hover .mydocs-card-meta,
[data-theme="win31"] .snippet-card:hover .snippet-card-name,
[data-theme="win31"] .snippet-card:hover .snippet-card-desc { color: #ffffff !important; }

/* Editor area — sunken text field inset */
[data-theme="win31"] #editor-wrap {
  box-shadow: inset 1px 1px #808080, inset -1px -1px #dfdfdf,
              inset 2px 2px #404040, inset -2px -2px #c0c0c0 !important;
}

/* Results panel — sunken inset */
[data-theme="win31"] #results-wrap {
  box-shadow: inset 1px 1px #808080, inset -1px -1px #dfdfdf,
              inset 2px 2px #404040 !important;
}

/* Divider between panes */
[data-theme="win31"] #divider { background: #808080 !important; }

/* Status bar — classic Win95 panel look */
[data-theme="win31"] #statusbar {
  border-top: 1px solid #808080 !important;
  box-shadow: none !important;
}
[data-theme="win31"] #st-lines,
[data-theme="win31"] #st-results,
[data-theme="win31"] #st-sum,
[data-theme="win31"] #st-saved {
  box-shadow: inset 1px 1px #808080, inset -1px -1px #dfdfdf;
  padding: 0 6px;
}

/* Results pane — canary to white gradient */
[data-theme="easter"] #results-wrap { background: linear-gradient(to bottom, #ffffe8, #ffffff) !important; }

/* ── EASTER PRINT OVERRIDES ── */
@media print {
  [data-theme="easter"] #results-wrap  { background: #ffffff !important; }
  [data-theme="easter"] #input-wrap    { background: #ffffff !important; }
  [data-theme="easter"] #editor        { background: #ffffff !important; }
  [data-theme="easter"] #gutter        { background: #ffffff !important; }
}

/* ── WIN31 PRINT OVERRIDES ── */
@media print {
  /* Strip the sunken inset borders — they look broken on paper */
  [data-theme="win31"] #editor-wrap,
  [data-theme="win31"] #results-wrap {
    box-shadow: none !important;
  }

  /* Win95 window title bar — navy fill, raised chrome frame */
  [data-theme="win31"] #doc-titlebar {
    background: #000080 !important;
    color: #ffffff !important;
    border-bottom: none !important;
    margin: 0 0 12px 0 !important;
    padding: 6px 16px !important;
    /* Raised Win95 frame — bumped up from screen sizes for print DPI */
    box-shadow:
      inset 2px 2px #ffffff,
      inset -2px -2px #808080,
      inset 4px 4px #dfdfdf,
      inset -4px -4px #404040 !important;
  }

  [data-theme="win31"] #doc-title-input,
  [data-theme="win31"] #doc-subtitle-input,
  [data-theme="win31"] #doc-timestamp-wrap {
    font-family: 'Tahoma', 'MS Sans Serif', Arial, sans-serif !important;
  }
  [data-theme="win31"] #doc-title-input    { color: #ffffff !important; font-weight: bold !important; }
  [data-theme="win31"] #doc-subtitle-input { color: #ccccff !important; }
  [data-theme="win31"] #doc-timestamp-wrap { color: #ccccff !important; }
}

/* ── SYNTH (80s neon / synthwave) ── */
[data-theme="synth"] {
  --bg:       #2d2d2d;
  --surface:  #252525;
  --panel:    #343434;
  --border:   #4a4a4a;
  --divider:  #3d3d3d;
  --accent:   #cc44ff;
  --accent2:  #00ffcc;
  --accent3:  #f99157;
  --muted:    #5a5a5a;
  --text:     #e0dcd4;
  --text-dim: #8a8a8a;
  --error:    #f2777a;
}
[data-theme="synth"] #editor::selection    { background: rgba(204,68,255,.2); }
[data-theme="synth"] .result-row.highlight { background: rgba(0,255,204,.05); }

/* Glowing neon divider between editor and results pane */
[data-theme="synth"] #divider {
  background: #cc44ff;
  box-shadow: 0 0 6px rgba(204,68,255,.9), 0 0 14px rgba(204,68,255,.5);
}

/* Neon glow — subtle, just on interactive moments */
[data-theme="synth"] .tb-btn:hover {
  border-color: #cc44ff;
  box-shadow: 0 0 6px rgba(204,68,255,.5);
}
[data-theme="synth"] .tb-btn.accent {
  box-shadow: 0 0 8px rgba(204,68,255,.45);
}
[data-theme="synth"] .mydocs-card:hover,
[data-theme="synth"] .snippet-card:hover,
[data-theme="synth"] .ex-card:hover {
  border-color: #00ffcc;
  box-shadow: 0 0 8px rgba(0,255,204,.3);
}
[data-theme="synth"] #modal,
[data-theme="synth"] #examples-modal,
[data-theme="synth"] #mydocs-modal,
[data-theme="synth"] #snippets-modal,
[data-theme="synth"] #export-modal {
  border-color: #cc44ff;
  box-shadow: 0 0 24px rgba(204,68,255,.25);
}