/*
 * Design tokens for native HTML5/CSS3 migration.
 * Pattern inspired by sashimi-ui (token file separate from component CSS).
 */
:root {
  --color-surface: #fefd86;
  --color-highlight: #ffe4e1;
  --color-on-surface: #333;
  --color-on-surface-strong: #000000;
  --color-accent: #ff0099;
  --color-button-surface: #ffffff;
  --color-button-border: #ddd;
  --color-shadow: gray;

  --font-family-base: "M PLUS Rounded 1c", sans-serif;
  --font-size-body: medium;
  --font-size-table: large;

  --roundness-nav: 10px;
  --roundness-button: 4px;

  --shadow-nav: 0px 2px 4px var(--color-shadow);

  --nav-height-offset: 70px;
  --nav-breakpoint: 1200px;
  --logo-compact-breakpoint: 375px;
  --content-narrow-breakpoint: 768px;

  --anchor-offset: 100px;
  --spacing-footer-top: 40px;
  --nav-margin: 10px;
  --nav-logo-height: 40px;
  --nav-action-height: 40px;

  /* Layout (Bootstrap 3 .container 互換) */
  --content-padding-x: 15px;
  --content-max-width-sm: 750px;
  --content-max-width-md: 970px;
  --content-max-width-lg: 1170px;

  /* Announcement table (Bootstrap 3 .table 互換) */
  --color-table-border: var(--color-button-border);
  --table-cell-padding: 8px;
  --table-margin-bottom: 20px;
  --table-line-height: 1.42857143;
  --table-head-border-width: 2px;
  --color-on-surface-muted: #777;

  /* Carousel (Bootstrap 3 .carousel 互換) */
  --carousel-fade-duration: 600ms;
}

/* Baseline — replaces critical Bootstrap 3 defaults */
*,
*::before,
*::after {
  box-sizing: border-box;
}

html {
  -webkit-text-size-adjust: 100%;
}

body {
  margin: 0;
}

img {
  vertical-align: middle;
}

figure {
  margin: 0;
}