/*
  base.css
  トークンを使った要素レベルの基本スタイル（reset.cssの上に乗る意匠のベースライン）。
*/

html {
  scroll-behavior: smooth;
}

body {
  background-color: var(--color-bg);
}

a {
  transition: color 0.2s ease, opacity 0.2s ease;
}

a:hover {
  opacity: 0.8;
}

:focus-visible {
  outline: 2px solid var(--color-accent);
  outline-offset: 2px;
}

::selection {
  background-color: var(--color-accent);
  color: var(--color-text-inverse);
}

button {
  color: inherit;
}