/* light scheme */
:root[color-mode="light"] {
  --bg-body: #FFFFFF;
  --bg-card: rgba(255, 251, 246, 0.84);
  --bg-card-strong: rgba(255, 247, 237, 0.96);
  --bg-hero: radial-gradient(circle at top left, rgba(243, 170, 87, 0.24), transparent 42%), linear-gradient(135deg, #fff8ef 0%, #ffffff 55%, #f6efe8 100%);
  --color-text-hero: #1f1b16;
  --color-accent: #c6652b;
  --color-accent-soft: rgba(198, 101, 43, 0.14);
  --color-border-soft: rgba(122, 87, 56, 0.12);
  --shadow-card: 0 24px 60px rgba(105, 72, 40, 0.12);
  --color-text-base: #666;
  --color-text-a: #666;
  --color-text-a-hover: #000000;
  --color-text-a-active: #000000;
  --color-text-sub: #8e8e8e;
  --color-text-md-title: #24292e;
  --color-text-md-content: #24292e;
  --color-text-md-code: #e96900;
  --bg-text-md-code: #f8f8f8;
  --bg-block-md-quote: #EEEEEE;
  --color-block-md-quote: #555555;
  --color-divider-md-border: #5858581a;
  --bg-content-search: rgb(255 255 255 / 60%);
  --bg-block-md-pre: #e6e6e6;
  --color-text-md-pre: #555555;
  --bg-block-md-table: #ffffff;
  --bg-block-md-table-2: #f6f8fa;
  --color-border-md-table: #dfe2e5;
}

/* dark scheme */
:root[color-mode="dark"] {
  --bg-body: #2E3440;
  --bg-card: rgba(48, 56, 69, 0.84);
  --bg-card-strong: rgba(56, 65, 79, 0.94);
  --bg-hero: radial-gradient(circle at top left, rgba(236, 152, 72, 0.18), transparent 38%), linear-gradient(135deg, #353e4e 0%, #2e3440 55%, #252b35 100%);
  --color-text-hero: #f3eee7;
  --color-accent: #ffb16f;
  --color-accent-soft: rgba(255, 177, 111, 0.14);
  --color-border-soft: rgba(255, 255, 255, 0.09);
  --shadow-card: 0 26px 70px rgba(0, 0, 0, 0.26);
  --color-text-base: #C1C2C5;
  --color-text-a: #C1C2C5;
  --color-text-a-hover: #FFFFFF;
  --color-text-a-active: #FFFFFF;
  --color-text-sub: #8e8e8e;
  --color-text-md-title: #eceff4;
  --color-text-md-content: #eceff4;
  --color-text-md-code: #e96900;
  --bg-text-md-code: #3b4252;
  --bg-block-md-quote: #3a4252;
  --color-block-md-quote: #abb9cf;
  --color-divider-md-border: #ffffff4f;
  --bg-content-search: rgb(59 66 82 / 60%);
  --bg-block-md-pre: #3a4252;
  --color-text-md-pre: #abb9cf;
  --bg-block-md-table: #2E3440;
  --bg-block-md-table-2: #313744;
  --color-border-md-table: #4c566a;
}