/*
 * 9MinGames Cartoon Design Tokens.
 * This file is the single source of truth for the public visual system.
 */
:root {
	color-scheme: light;

	/* Brand palette */
	--nmg-color-ink: #18192b;
	--nmg-color-ink-soft: #304a5f;
	--nmg-color-muted: #526b7d;
	--nmg-color-white: #ffffff;
	--nmg-color-paper: #f8fbfd;
	--nmg-color-paper-soft: #e9f6fb;
	--nmg-color-paper-warm: #fff8df;
	--nmg-color-sky: #38add6;
	--nmg-color-sky-light: #8dd8ef;
	--nmg-color-sky-soft: #c8eef8;
	--nmg-color-sky-deep: #176f99;
	--nmg-color-navy: #222b4b;
	--nmg-color-navy-deep: #15182d;
	--nmg-color-mint: #55d69e;
	--nmg-color-mint-strong: #32bd82;
	--nmg-color-yellow: #ffd778;
	--nmg-color-yellow-strong: #ffca45;
	--nmg-color-coral: #ff8178;
	--nmg-color-coral-strong: #ef625b;
	--nmg-color-blue: #4b96b9;
	--nmg-color-blue-strong: #2e708c;
	--nmg-color-violet: #8b7cff;
	--nmg-color-pink: #f166bf;
	--nmg-color-lime: #a8d94e;
	--nmg-color-player: #050812;

	/* Controlled component palette */
	--nmg-palette-cyan: #35c7e8;
	--nmg-palette-amber: #ffb53d;
	--nmg-palette-red: #ff665e;
	--nmg-palette-blue: #4c8fff;
	--nmg-palette-green: #4ed59a;
	--nmg-palette-pink: #f166bf;
	--nmg-palette-violet: #a777ff;
	--nmg-palette-lime: #a8d94e;
	--nmg-palette-purple: #8b6cff;

	/* Semantic palette */
	--nmg-bg: var(--nmg-color-sky);
	--nmg-bg-soft: var(--nmg-color-sky-light);
	--nmg-surface: var(--nmg-color-paper);
	--nmg-surface-2: var(--nmg-color-paper-soft);
	--nmg-surface-3: var(--nmg-color-sky-soft);
	--nmg-text: var(--nmg-color-ink);
	--nmg-text-soft: var(--nmg-color-ink-soft);
	--nmg-muted: var(--nmg-color-muted);
	--nmg-border: color-mix(in srgb, var(--nmg-color-ink) 24%, transparent);
	--nmg-border-strong: var(--nmg-color-ink);
	--nmg-accent: var(--nmg-color-mint);
	--nmg-accent-hover: var(--nmg-color-mint-strong);
	--nmg-accent-soft: color-mix(in srgb, var(--nmg-color-mint) 28%, transparent);
	--nmg-warning: var(--nmg-color-yellow);
	--nmg-danger: var(--nmg-color-coral);
	--nmg-success: var(--nmg-color-mint);
	--nmg-info: var(--nmg-color-blue);
	--nmg-link: #164e73;
	--nmg-link-hover: #0b3451;

	/* Component roles */
	--nmg-button-primary: var(--nmg-color-mint);
	--nmg-button-secondary: var(--nmg-color-yellow);
	--nmg-button-tertiary: var(--nmg-color-sky-soft);
	--nmg-card-background: color-mix(in srgb, var(--nmg-color-paper) 96%, transparent);
	--nmg-section-background: color-mix(in srgb, var(--nmg-color-paper-soft) 82%, transparent);
	--nmg-header-background: linear-gradient(135deg, var(--nmg-color-navy), var(--nmg-color-navy-deep) 72%);
	--nmg-footer-background: linear-gradient(180deg, var(--nmg-color-navy), var(--nmg-color-navy-deep));
	--nmg-toolbar-surface: transparent;
	--nmg-toolbar-background: transparent;
	--nmg-toolbar-control-surface: var(--nmg-color-paper);
	--nmg-toolbar-control-hover: var(--nmg-color-yellow);
	--nmg-reaction-like-surface: var(--nmg-color-paper);
	--nmg-reaction-like-hover: color-mix(in srgb, var(--nmg-color-paper) 68%, var(--nmg-color-mint));
	--nmg-reaction-like-active: var(--nmg-color-mint);
	--nmg-reaction-dislike-surface: var(--nmg-color-paper);
	--nmg-reaction-dislike-hover: color-mix(in srgb, var(--nmg-color-paper) 68%, var(--nmg-color-coral));
	--nmg-reaction-dislike-active: var(--nmg-color-coral);
	--nmg-category-surface: var(--nmg-color-yellow);
	--nmg-category-text: var(--nmg-color-ink);
	--nmg-category-border: var(--nmg-color-ink);
	--nmg-rating-popover-surface: var(--nmg-color-paper);
	--nmg-rating-star: var(--nmg-color-yellow-strong);
	--nmg-rating-star-hover: var(--nmg-color-paper-warm);
	--nmg-rating-star-active: var(--nmg-color-yellow);
	--nmg-media-card-divider: var(--nmg-color-ink);
	--nmg-detail-delimiter: var(--nmg-color-ink-soft);
	--nmg-shell-glass: color-mix(in srgb, var(--nmg-color-sky-light) 74%, transparent);

	/* Shape and depth */
	--nmg-radius-xs: 9px;
	--nmg-radius-sm: 13px;
	--nmg-radius-md: 17px;
	--nmg-radius-lg: 22px;
	--nmg-radius-xl: 30px;
	--nmg-radius-pill: 999px;
	--nmg-line-thin: 2px;
	--nmg-line-strong: 3px;
	--nmg-shadow-xs: 0 2px 0 var(--nmg-color-ink);
	--nmg-shadow-sm: 0 3px 0 var(--nmg-color-ink);
	--nmg-shadow-md: 0 5px 0 var(--nmg-color-ink), 0 12px 20px color-mix(in srgb, var(--nmg-color-sky-deep) 13%, transparent);
	--nmg-shadow-lg: 0 8px 0 var(--nmg-color-ink), 0 18px 30px color-mix(in srgb, var(--nmg-color-sky-deep) 18%, transparent);
	--nmg-shadow-focus: 0 0 0 4px color-mix(in srgb, var(--nmg-color-yellow) 66%, transparent);

	/* Layout */
	--nmg-container: 1320px;
	--nmg-reading: 920px;
	--nmg-game-container: 1440px;
	--nmg-header-height: 58px;
	--nmg-header-logo-height: 40px;
	--nmg-header-logo-width: 190px;
	--nmg-header-control-height: 36px;
	--nmg-player-cta-mobile-size: 56px;
	--nmg-player-cta-mobile-size-compact: 52px;
	--nmg-player-cta-mobile-icon-size: 22px;
	--nmg-toolbar-control-size: 28px;
	--nmg-toolbar-icon-size: 14px;
	--nmg-toolbar-reaction-min-width: 50px;
	--nmg-toolbar-mobile-control-size: 36px;
	--nmg-toolbar-mobile-control-size-compact: 34px;
	--nmg-toolbar-mobile-icon-size: 16px;
	--nmg-toolbar-mobile-icon-size-compact: 15px;
	--nmg-toolbar-mobile-reaction-min-width: 58px;
	--nmg-toolbar-mobile-reaction-min-width-compact: 54px;
	--nmg-view-all-padding-block: 10px;
	--nmg-content-footer-gap: clamp(18px, 2vw, 28px);
	--nmg-footer-padding-top: clamp(22px, 2.5vw, 30px);
	--nmg-mobile-page-gutter: 6px;
	--nmg-mobile-page-gutter-compact: 4px;
	--nmg-space-1: 4px;
	--nmg-space-2: 8px;
	--nmg-space-3: 12px;
	--nmg-space-4: 16px;
	--nmg-space-5: 20px;
	--nmg-space-6: 24px;
	--nmg-space-7: 32px;
	--nmg-space-8: 40px;
	--nmg-gap: clamp(16px, 2vw, 28px);

	/* Typography and motion */
	--nmg-font-display: ui-rounded, "Arial Rounded MT Bold", "Trebuchet MS", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	--nmg-font-reading: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	--nmg-font: var(--nmg-font-display);
	--nmg-transition-fast: 120ms cubic-bezier(.2, .8, .2, 1);
	--nmg-transition: 180ms cubic-bezier(.2, .8, .2, 1);
	--nmg-transition-slow: 260ms cubic-bezier(.2, .8, .2, 1);

	/* Game component aliases retained as stable public contract */
	--nmg-game-ink: var(--nmg-color-ink);
	--nmg-game-paper: var(--nmg-color-paper);
	--nmg-game-paper-soft: var(--nmg-color-paper-soft);
	--nmg-game-sky: var(--nmg-color-sky);
	--nmg-game-sea: var(--nmg-color-sky-deep);
	--nmg-game-mint: var(--nmg-color-mint);
	--nmg-game-yellow: var(--nmg-color-yellow);
	--nmg-game-coral: var(--nmg-color-coral);
	--nmg-game-blue: var(--nmg-color-blue);
	--nmg-game-shadow: var(--nmg-shadow-lg);
	--nmg-game-shadow-soft: var(--nmg-shadow-md);
}
/* Fallback shell used only when the companion cartoon child theme is inactive. */
body.nmg-game-home,
body.nmg-game-view,
body.nmg-game-archive,
body.nmg-tester-profile-view {
	margin: 0;
	background: linear-gradient(180deg, var(--nmg-color-sky-light), var(--nmg-color-sky-deep));
	color: var(--nmg-text);
	font-family: var(--nmg-font-reading);
}