:root {
    /* カラーパレット */
    --color-primary: #FF8C42;
    --color-secondary: #4ECDC4;
    --color-accent: #FFD93D;
    --color-text: #2C3E50;
    --color-bg: #F8F9FA;
    --color-white: #FFFFFF;
    --color-success: #28A745;
    --color-danger: #DC3545;
    --color-warning: #FFC107;

    /* ヒーロー・フッター用カラー */
    --color-hero-bg: #eceae5;
    --color-hero-text: #195c83;
    --color-hero-text-secondary: rgba(25, 92, 131, 0.9);

    /* プライマリーカラー（グラデーション用） */
    --color-gradient-start: #667eea;
    --color-gradient-end: #764ba2;
    --color-gradient: linear-gradient(135deg, var(--color-gradient-start) 0%, var(--color-gradient-end) 100%);

    /* テキストカラー */
    --color-text-primary: #333;
    --color-text-secondary: #666;
    --color-text-tertiary: #555;
    --color-text-light: #999;
    --color-text-muted: #6c757d;

    /* 背景カラー */
    --color-bg-white: #fff;
    --color-bg-light: #f8f9fa;
    --color-bg-gray: #f0f0f0;

    /* ボーダーカラー */
    --color-border: #e0e0e0;
    --color-border-focus: #667eea;

    /* リンクカラー */
    --color-link: #667eea;
    --color-link-hover: #5568d3;

    /* シャドウ */
    --shadow-xs: 0 2px 8px rgba(0,0,0,0.1);
    --shadow-sm: 0 1px 3px rgba(0,0,0,0.12);
    --shadow-md: 0 4px 6px rgba(0,0,0,0.1);
    --shadow-card: 0 4px 12px rgba(0,0,0,0.05);
    --shadow-button: 0 8px 20px rgba(102, 126, 234, 0.4);
    --shadow-heavy: 0 20px 60px rgba(0, 0, 0, 0.3);
    --shadow-hover: 0 10px 40px rgba(0,0,0,0.2);

    /* ステータスカラー */
    --color-error: #f44336;
    --color-error-bg: #fee;
    --color-error-text: #c33;
    --color-warning-bg: #fff3cd;
    --color-warning-border: #ffc107;
    --color-warning-text: #856404;
    --color-info: #2196F3;
    --color-info-bg: #E3F2FD;
    --color-female: #E91E63;
    --color-female-bg: #FCE4EC;

    /* 管理画面用：成功/エラー/警告の拡張カラー */
    --color-success-bg: #d4edda;
    --color-success-text: #155724;
    --color-success-border: #c3e6cb;
    --color-danger-bg: #f8d7da;
    --color-danger-text: #721c24;
    --color-danger-border: #f5c6cb;
    --color-info-text: #0c5460;
    --color-info-bg-light: #d1ecf1;
    --color-info-border: #bee5eb;

    /* チャット・通知用カラー */
    --color-chat-bg: #f5f5f5;
    --color-chat-bubble-sent: #e7f3ff;
    --color-chat-bubble-received: #ffffff;
    --color-chat-text: #0066cc;
    --color-notification-unread: #e3f2fd;
    --color-notification-badge-danger: #dc3545;
    --color-notification-badge-warning: #ffc107;
    --color-notification-badge-secondary: #6c757d;

    /* オーバーレイ拡張 */
    --color-overlay-dark: rgba(0, 0, 0, 0.5);
    --color-overlay-darker: rgba(0, 0, 0, 0.7);

    /* 追加シャドウ */
    --shadow-notification: 0 2px 4px rgba(0,0,0,0.05);

    /* オーバーレイカラー（透明度付き） */
    --color-overlay-light: rgba(255, 255, 255, 0.2);
    --color-overlay-medium: rgba(255, 255, 255, 0.3);

    /* グレースケール */
    --color-gray-100: #F8F9FA;
    --color-gray-300: #DEE2E6;
    --color-gray-500: #ADB5BD;
    --color-gray-700: #495057;
    --color-gray-900: #212529;

    /* タイポグラフィ */
    --font-family-base: 'Noto Sans JP', sans-serif;
    --font-size-base: 17px;
    --font-size-lg: 19px;
    --font-size-xl: 26px;

    /* スペーシング */
    --spacing-sm: 10px;
    --spacing-md: 20px;
    --spacing-lg: 30px;
    --spacing-xl: 40px;

    /* レイアウト */
    --header-height: 80px;
    --container-max-width: 1400px;

    /* ボーダー */
    --border-radius-md: 8px;
    --border-radius-lg: 12px;

    /* トランジション */
    --transition-base: 0.3s ease;
}