/* ============================================================
   DESIGN TOKENS — Древние: Падение мира
   Единый источник цветов, шрифтов, радиусов и теней.
   Используется во всех модулях и страницах через var(--ds-*).
   ============================================================ */

:root {
	/* --- Цвета: фон и текст --- */
	--ds-bg-page:        #e2e2e2;
	--ds-bg-card:        rgba(255, 255, 255, 0.92);
	--ds-bg-soft:        rgba(0, 0, 0, 0.04);
	--ds-bg-elevated:    #ffffff;
	--ds-text:           #222222;
	--ds-text-muted:     #888888;
	--ds-text-placeholder:#aaaaaa;
	--ds-border:         #d0d0d0;
	--ds-border-dark:    #929292;

	/* --- Цвета: акценты --- */
	--ds-accent:         #cccf68;
	--ds-accent-dark:    #a38412;
	--ds-gold:           #c4a317;
	--ds-gold-dark:      #6b4d00;
	--ds-orange:         #ff8d00;
	--ds-orange-dark:    #d67500;
	--ds-blue:           #0275d8;
	--ds-blue-dark:      #01549b;
	--ds-green:          #38a220;
	--ds-green-dark:     #266f16;
	--ds-red:            #e35353;
	--ds-red-dark:       #c94444;

	/* --- Цвета: редкость карт --- */
	--ds-rarity-rare:      #036ecb;
	--ds-rarity-epic:      #7e04cb;
	--ds-rarity-legendary: #bfa700;
	--ds-rarity-mythic:    #a90000;

	/* --- Цвета: элементы (эссенции) --- */
	--ds-el-fire:  #950906;
	--ds-el-water: #0079bf;
	--ds-el-earth: #00a300;
	--ds-el-air:   #98f3f5;
	--ds-el-dark:  #3d2e6e;
	--ds-el-light: #f8f77e;

	/* --- Шрифты --- */
	--ds-font-body:      Calibri, 'Segoe UI', Tahoma, sans-serif;
	--ds-font-title:     'Russo One', sans-serif;
	--ds-font-display:   'Boombox', sans-serif;
	--ds-font-game:      'Mastodon', sans-serif;
	--ds-font-stroke:    'Stroke', sans-serif;

	/* --- Типографика --- */
	--ds-fs-title:  28px;
	--ds-fs-sub:    18px;
	--ds-fs-body:   15px;
	--ds-fs-label:  12px;
	--ds-fs-small:  11px;

	/* --- Радиусы --- */
	--ds-radius-sm:  8px;
	--ds-radius-md:  14px;
	--ds-radius-lg:  24px;
	--ds-radius-pill: 100%;

	/* --- Тени --- */
	--ds-shadow-card: 0 20px 60px rgba(0,0,0,0.08), 0 4px 16px rgba(0,0,0,0.04), inset 0 1px 0 rgba(255,255,255,0.6);
	--ds-shadow-btn:  0 4px 14px rgba(204, 207, 104, 0.35);
	--ds-shadow-btn-hover: 0 6px 20px rgba(204, 207, 104, 0.4);

	/* --- Прочее --- */
	--ds-max-width:  600px;
	--ds-transition: 0.3s all;
}