:root {
  --bg: #e6f0ed;
  --surface: #f7fbfa;
  --card: #ffffff;
  --text: #10221e;
  --muted: #5b6b67;

  --primary: #5d6b6b;
  --accent: #9fcfbf;
  --danger: #e55d5d;
  --success: #2fbf71;

  --ring: rgba(93, 107, 107, 0.25);
  --shadow: 0 16px 40px rgba(16, 34, 30, 0.1);
  --shadow-soft: 0 10px 26px rgba(16, 34, 30, 0.1);

  --radius-xl: 28px;
  --radius-lg: 18px;
  --radius-md: 14px;

  --gap: 16px;
  --max: 1080px;

  --speed: 180ms;
  --ease: cubic-bezier(0.2, 0.8, 0.2, 1);
}

[data-theme='dark'] {
  --bg: #0d1412;
  --surface: #0f1a17;
  --card: #101f1b;
  --text: #eaf5f2;
  --muted: #9bb1aa;

  --primary: #b9d6cd;
  --accent: #3a8c78;
  --ring: rgba(185, 214, 205, 0.22);
  --shadow: 0 16px 44px rgba(0, 0, 0, 0.35);
  --shadow-soft: 0 10px 24px rgba(0, 0, 0, 0.35);
}

* {
  box-sizing: border-box;
}
html,
body {
  height: 100%;
}
body {
  margin: 0;
  font-family: Roboto, system-ui, -apple-system, Segoe UI, Arial, sans-serif;
  background: radial-gradient(
      1200px 600px at 20% 10%,
      rgba(159, 207, 191, 0.35),
      transparent 60%
    ),
    radial-gradient(
      1200px 600px at 80% 30%,
      rgba(247, 203, 202, 0.3),
      transparent 55%
    ),
    var(--bg);
  color: var(--text);
}

a {
  color: inherit;
  text-decoration: none;
}
button,
input,
select,
textarea {
  font: inherit;
}
img {
  max-width: 100%;
  display: block;
}

:focus-visible {
  outline: none;
  box-shadow: 0 0 0 4px var(--ring);
  border-color: transparent !important;
}

.hidden {
  display: none !important;
}

@media (prefers-reduced-motion: reduce) {
  * {
    transition: none !important;
    animation: none !important;
    scroll-behavior: auto !important;
  }
}