/* 主题：星空动漫（默认）
   深色星空背景 + 紫蓝渐变，安静、有氛围感。 */

:root {
  --bg-app: #0a0c16;
  --bg-panel: #131627;
  --bg-elevated: #191d33;
  --bg-input: #10131f;
  --bg-hover: rgba(255, 255, 255, .06);

  --border: rgba(255, 255, 255, .08);
  --border-strong: rgba(124, 108, 240, .45);

  --text: #e9ebf6;
  --text-muted: #a7aec9;
  --text-dim: #6d7594;

  --accent: #7c6cf0;
  --accent-2: #5b8def;
  --accent-soft: rgba(124, 108, 240, .15);

  --tag-color: #7c6cf0;

  --inline-code: #4cc3f5;
  --link: #4cc3f5;
  --md-h3-bar: #2dd4bf;
  --nav-hover: #a89dff;

  --tabbar-bg: rgba(11, 13, 23, .92);
  --code-bg: #0c0f19;
  --code-fg: #f4f6f9;
  --code-head: rgba(255, 255, 255, .045);
  --scrollbar: rgba(124, 108, 240, .25);
  --scrollbar-hover: rgba(124, 108, 240, .45);
  --shadow: 0 18px 40px -24px rgba(0, 0, 0, .9);
  --hero-fallback: #101328;
  --footer-bg: rgba(10, 12, 22, .6);
}

body {
  background:
    radial-gradient(1100px 620px at 78% -10%, rgba(124, 108, 240, .18), transparent 60%),
    radial-gradient(900px 520px at 12% 4%, rgba(91, 141, 239, .14), transparent 62%),
    var(--bg-app);
  background-attachment: fixed;
}

/* 星空点缀层 */
.site__bg {
  background-image:
    radial-gradient(1.4px 1.4px at 12% 18%, rgba(255,255,255,.85), transparent),
    radial-gradient(1.2px 1.2px at 27% 42%, rgba(255,255,255,.6), transparent),
    radial-gradient(1.6px 1.6px at 46% 12%, rgba(255,255,255,.7), transparent),
    radial-gradient(1.2px 1.2px at 63% 33%, rgba(255,255,255,.55), transparent),
    radial-gradient(1.5px 1.5px at 81% 22%, rgba(255,255,255,.75), transparent),
    radial-gradient(1.2px 1.2px at 91% 58%, rgba(255,255,255,.5), transparent),
    radial-gradient(1.4px 1.4px at 8% 68%, rgba(255,255,255,.55), transparent),
    radial-gradient(1.3px 1.3px at 34% 82%, rgba(255,255,255,.5), transparent),
    radial-gradient(1.5px 1.5px at 55% 72%, rgba(255,255,255,.6), transparent),
    radial-gradient(1.2px 1.2px at 73% 88%, rgba(255,255,255,.45), transparent),
    radial-gradient(1.6px 1.6px at 96% 80%, rgba(255,255,255,.55), transparent);
}

.hero__banner { box-shadow: 0 30px 80px -50px rgba(124, 108, 240, .8); }

.tab.is-active { box-shadow: inset 0 -2px 0 0 var(--accent); }