@charset "utf-8";

/* ============================================================
   DreamStar Official Site — Design Tokens

   新規のトップページ／プロモーションUIは原則この値を参照する。
   詳細ルール: ../DESIGN_SYSTEM.md
   変更禁止ページへは読み込ませないこと。
   ============================================================ */

:root {
	/* Color: base */
	--ds-color-page: #cdeafb;
	--ds-color-surface: #e9f5fd;
	--ds-color-surface-light: #f5fbff;
	--ds-color-white: #ffffff;

	/* Color: text */
	--ds-color-text-primary: #1b4a78;
	--ds-color-text-secondary: #3d6485;
	--ds-color-text-muted: #6687a2;

	/* Color: accent */
	--ds-color-pink: #ff78aa;
	--ds-color-orange: #ff9c52;
	--ds-color-mint: #31cda0;
	--ds-color-blue: #36a9e8;
	--ds-color-yellow: #f6bc22;

	/* Border */
	--ds-color-border: rgba(133, 199, 237, .30);
	--ds-color-border-strong: rgba(133, 199, 237, .42);

	/* Radius */
	--ds-radius-sm: 10px;
	--ds-radius-md: 16px;
	--ds-radius-lg: 22px;
	--ds-radius-pill: 999px;

	/* Space */
	--ds-space-xs: 6px;
	--ds-space-sm: 10px;
	--ds-space-md: 16px;
	--ds-space-lg: 24px;
	--ds-space-xl: 32px;
	--ds-space-2xl: 48px;
	--ds-space-3xl: 64px;

	/* Shadow */
	--ds-shadow-card: 0 8px 18px rgba(37, 113, 164, .12);
	--ds-shadow-soft: 0 6px 18px rgba(37, 113, 164, .07);

	/* Typography */
	--ds-font-body: "Noto Sans JP", sans-serif;
	--ds-font-display: "M PLUS Rounded 1c", "Noto Sans JP", sans-serif;

	/* Layout */
	--ds-content-max: 640px;

	/* Motion */
	--ds-motion-reveal: .7s;
	--ds-ease-out: cubic-bezier(.22, 1, .36, 1);
}