/**
 * Theme C — ストライプ背景＋アクセント。色トークンは A と同構成。
 */
body {
  --front-accent: #6bb8d4;

  --front-text: #111827;
  --front-text-secondary: #0e131c;
  --front-text-muted: #6b7280;
  --front-text-tertiary: #333333;
  --front-text-heading: #374151;
  --front-underline-muted: rgba(17, 24, 39, 0.28);

  --front-bg: #ffffff;
  --front-bg-muted: #f9fafb;
  --front-bg-subtle: #f3f4f6;
  --front-bg-pill: #f3f4f6;
  --front-bg-search-nav: #fafafa;
  --front-bg-sort-hover: #f3f4f6;
  --front-bg-chip-hover: #eff6ff;

  --front-border: #e5e7eb;
  --front-border-light: #f3f4f6;
  --front-border-input: #d1d5db;

  --front-overlay-tap: rgba(17, 24, 39, 0.05);
  --front-backdrop: rgba(17, 24, 39, 0.45);
  --front-shadow-drawer: rgba(17, 24, 39, 0.12);
  --front-shadow-lightbox: rgba(0, 0, 0, 0.45);

  --front-accent: #1a2028;
  --front-accent-bg-soft: #dbeafe;
  --front-accent-border-soft: #93c5fd;
  --front-accent-text-strong: #1e40af;

  --front-nav-close-bg: #f3f4f6;
  --front-nav-close-fg: #374151;
  --front-nav-close-hover-bg: #e5e7eb;

  --front-lightbox-backdrop: rgba(17, 24, 39, 0.88);
  --front-lightbox-ui-bg: rgba(255, 255, 255, 0.15);
  --front-lightbox-ui-bg-hover: rgba(255, 255, 255, 0.25);
  --front-lightbox-ui-fg: #ffffff;
  --front-lightbox-counter: rgba(255, 255, 255, 0.9);

  --front-flash-ok-bg: #ecfdf5;
  --front-flash-ok-border: #a7f3d0;
  --front-flash-ok-text: #065f46;
  --front-flash-err-bg: #fef2f2;
  --front-flash-err-border: #fecaca;
  --front-flash-err-text: #991b1b;

  --front-purchase-btn-bg: #111827;
  --front-purchase-btn-fg: #ffffff;

  margin: 0;
  font-family: "Meiryo", "メイリオ", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: var(--front-text);
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  min-height: 100dvh;
  --front-gutter-x: 24px;
  --front-content-max: 960px;

  background-color: #6bb8d4;
  background-image: repeating-linear-gradient(
    -45deg,
    transparent,
    transparent 4px,
    rgba(255, 255, 255, 0.15) 4px,
    rgba(255, 255, 255, 0.15) 5px
  );
}

select {
  background-color: var(--front-bg);
}
