/* Global reset, theme variables, typography, and body defaults. */

:root {
  --bg: #ffffff;
  --text: #3a3a35;
  --muted: #a89f8c;
  --accent: #c9922a;
  --primary: #1a4a2e;
  --card: #f9f9f7;
  --border: #d0ccc4;
  --tag-bg: #f8f6f0;
  --tag-text: #1a4a2e;
  --danger: #8f4545;
}

[data-theme="dark"] {
  --bg: #18211b;
  --text: #f1eee6;
  --muted: #c5bca8;
  --accent: #d8a94f;
  --primary: #d6e8d9;
  --card: #202820;
  --border: #39453d;
  --tag-bg: #28352d;
  --tag-text: #f1eee6;
  --danger: #efb0b0;
}

* {
  box-sizing: border-box;
}

html,
body {
  margin: 0;
  padding: 0;
  min-height: 100%;
  /* Safety net: nothing on this page should ever force sideways scroll */
  width: 100%;
  overflow-x: hidden;
}

body {
  font-family: "DM Sans", sans-serif;
  color: var(--text);
  background: var(--bg);
  position: relative;
  transition:
    background-color 0.2s ease,
    color 0.2s ease;
}

/* Any media embed (chart canvas included) should never exceed its container */
img,
svg,
canvas,
video {
  max-width: 100%;
  height: auto;
}