/* Superhero Slate — generated from tokens.json */
:root, [data-theme="light"] {
  --purple: #6e57b1;
  --purple-hover: #5b4a93;
  --purple-deep: #2d224e;
  --purple-light: #9676ff;
  --hero-ground: var(--purple);
  --hero-ray: var(--purple-light);
  --gold: #fecc30;
  --amber: #fdbb2c;
  --charcoal: #2e2e2e;
  --surface-page: #f6f6f6;
  --surface-card: #ffffff;
  --ink: #2e2e2e;
  --ink-soft: #3d3d3d;
  --ink-quote: #7e7e7e;
  --link: var(--purple);
  --on-purple: #ffffff;
  --on-gold: #2e2e2e;
  --on-dark: #ffffff;
  --border: #dedede;
  --hairline: #e7e7e7;
  --chip-line: var(--purple-deep);
  --tag: #cccccc;
  --focus: #6e57b1;
  --shadow-card: 0 0 10px rgba(0,0,0,0.1);
  --shadow-header: 0 0 10px rgba(0,0,0,0.5);
  --shadow-dialog: 0 0 10px rgba(0,0,0,0.7);
}
[data-theme="dark"] {
  --chip-line: var(--border);
  --hero-ground: var(--purple-deep);
  --hero-ray: var(--purple);
  --surface-page: #1d1633;
  --surface-card: #2d224e;
  --ink: #ece9f5;
  --ink-soft: #b5aecb;
  --ink-quote: #b5aecb;
  --link: #b8a6ff;
  --border: #463a6e;
  --hairline: #3a2f5f;
  --tag: #463a6e;
  --focus: #fecc30;
}
:root {
  --space-5: 5px;
  --space-10: 10px;
  --space-15: 15px;
  --space-20: 20px;
  --space-30: 30px;
  --space-40: 40px;
  --space-80: 80px;
  --radius-sm: 3px;
  --radius-md: 8px;
  --radius-lg: 16px;
  --radius-pill: 999px;
  --content-max: 900px;
  --card-max: 640px;
  --wide-max: 1200px;
  --header-h: 100px;
  --font-sans: "Lato", "Helvetica Neue", Arial, sans-serif;
}
.hero { font-family: var(--font-sans); font-size: 56px; line-height: 1.02; font-weight: 900; }
.title-single { font-family: var(--font-sans); font-size: 32px; line-height: 1.3; font-weight: 900; }
.title-card { font-family: var(--font-sans); font-size: 24px; line-height: 1.3; font-weight: 900; }
.nav { font-family: var(--font-sans); font-size: 18px; line-height: 1.2; font-weight: 900; }
.label { font-family: var(--font-sans); font-size: 14px; line-height: 1.3; font-weight: 900; letter-spacing: 0.06em; }
.meta { font-family: var(--font-sans); font-size: 14px; line-height: 1.4; font-weight: 400; }
.body { font-family: var(--font-sans); font-size: 17px; line-height: 1.7; font-weight: 400; }
.body-light { font-family: var(--font-sans); font-size: 17px; line-height: 1.7; font-weight: 300; }
.quote { font-family: var(--font-sans); font-size: 13px; line-height: 1.5; font-weight: 300; font-style: italic; }
.tag { font-family: var(--font-sans); font-size: 12px; line-height: 1.6; font-weight: 400; }

@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --chip-line: var(--border);
  --hero-ground: var(--purple-deep);
  --hero-ray: var(--purple);
  --surface-page: #1d1633;
  --surface-card: #2d224e;
  --ink: #ece9f5;
  --ink-soft: #b5aecb;
  --ink-quote: #b5aecb;
  --link: #b8a6ff;
  --border: #463a6e;
  --hairline: #3a2f5f;
  --tag: #463a6e;
  --focus: #fecc30;
color-scheme:dark}}
[data-theme="dark"]{color-scheme:dark}