/* =========================
   MIDNIGHT CHARCOAL
========================= */

body.palette-midnight {

  --bg: #050505;

  --panel: rgba(18,18,18,0.96);

  --panel-soft: rgba(255,255,255,0.04);

  --border: rgba(255,255,255,0.08);

  --border-strong: rgba(255,255,255,0.18);

  --text: #f2f2f2;

  --muted: #8d8d8d;

  --ghost: rgba(255,255,255,0.24);

  --shadow: rgba(0,0,0,0.55);

}

/* =========================
   SOFT GRAPHITE
========================= */

body.palette-graphite {

  --bg: #111214;

  --panel: rgba(28,29,32,0.96);

  --panel-soft: rgba(255,255,255,0.035);

  --border: rgba(255,255,255,0.07);

  --border-strong: rgba(255,255,255,0.14);

  --text: #e4e4e4;

  --muted: #979797;

  --ghost: rgba(255,255,255,0.20);

  --shadow: rgba(0,0,0,0.48);

}

/* =========================
   SOFT SEPIA
========================= */

body.palette-sepia {

  --bg: #211b17;

  --panel: rgba(44,36,30,0.95);

  --panel-soft: rgba(255,240,220,0.03);

  --border: rgba(255,220,180,0.08);

  --border-strong: rgba(255,220,180,0.16);

  --text: #ead8c4;

  --muted: #b39d88;

  --ghost: rgba(255,240,220,0.22);

  --shadow: rgba(0,0,0,0.52);

}

/* =========================
   WARM PAPER
========================= */

body.palette-paper {

  --bg: #ece7dc;

  --panel: rgba(255,252,246,0.96);

  --panel-soft: rgba(0,0,0,0.025);

  --border: rgba(0,0,0,0.08);

  --border-strong: rgba(0,0,0,0.14);

  --text: #252525;

  --muted: #666057;

  --ghost: rgba(0,0,0,0.28);

  --shadow: rgba(0,0,0,0.12);

}

/* =========================
   MUTED GREEN
========================= */

body.palette-green {

  --bg: #101611;

  --panel: rgba(24,34,27,0.96);

  --panel-soft: rgba(210,255,220,0.025);

  --border: rgba(170,220,180,0.08);

  --border-strong: rgba(170,220,180,0.16);

  --text: #d8e4d8;

  --muted: #91a292;

  --ghost: rgba(210,255,220,0.18);

  --shadow: rgba(0,0,0,0.50);

}

/* =========================
   LOW BLUE
========================= */

body.palette-blue {

  --bg: #10141a;

  --panel: rgba(24,30,40,0.96);

  --panel-soft: rgba(200,220,255,0.03);

  --border: rgba(180,200,240,0.08);

  --border-strong: rgba(180,200,240,0.16);

  --text: #dde6f2;

  --muted: #95a2b4;

  --ghost: rgba(200,220,255,0.20);

  --shadow: rgba(0,0,0,0.52);

}

/* =========================
   AMBER DUSK
========================= */

body.palette-amber {

  --bg: #18120c;

  --panel: rgba(38,28,18,0.96);

  --panel-soft: rgba(255,210,140,0.03);

  --border: rgba(255,210,140,0.08);

  --border-strong: rgba(255,210,140,0.18);

  --text: #f0d2a6;

  --muted: #b49267;

  --ghost: rgba(255,210,140,0.22);

  --shadow: rgba(0,0,0,0.56);

}

/* =========================
   PLAIN GREY
========================= */

body.palette-plain {

  --bg: #161616;

  --panel: rgba(28,28,28,0.96);

  --panel-soft: rgba(255,255,255,0.025);

  --border: rgba(255,255,255,0.06);

  --border-strong: rgba(255,255,255,0.12);

  --text: #ededed;

  --muted: #9b9b9b;

  --ghost: rgba(255,255,255,0.18);

  --shadow: rgba(0,0,0,0.52);

}

/* =========================
   PAPER BACKGROUND OVERRIDE
========================= */

body.palette-paper {

  background:
    radial-gradient(
      circle at top left,
      rgba(0,0,0,0.03),
      transparent 28%
    ),

    radial-gradient(
      circle at bottom right,
      rgba(0,0,0,0.025),
      transparent 34%
    ),

    linear-gradient(
      135deg,
      rgba(0,0,0,0.02),
      transparent 60%
    ),

    var(--bg);

}

/* =========================
   DARK PALETTES BACKGROUND
========================= */

body.palette-midnight,
body.palette-graphite,
body.palette-sepia,
body.palette-green,
body.palette-blue,
body.palette-amber,
body.palette-plain {

  background:
    radial-gradient(
      circle at top left,
      rgba(255,255,255,0.03),
      transparent 28%
    ),

    radial-gradient(
      circle at bottom right,
      rgba(255,255,255,0.025),
      transparent 34%
    ),

    linear-gradient(
      135deg,
      rgba(255,255,255,0.015),
      transparent 60%
    ),

    var(--bg);

}