/**
 * Mon Darts — v0 дизайн систем (3 theme)
 * Зөвхөн :root / [data-theme] дээр hex. Бусад нь var().
 */
@import url("dartboard-theme.css");

:root {
	--bg: #dce7f1;
	--surface: #ffffff;
	--surface-alt: #f3f7fb;
	--chrome: #173a5e;
	--ink: #10243a;
	--ink-muted: #5b6b7d;
	--line: #d2dde8;
	--accent: #d93a2b;
	--highlight: #f5c518;
	--on-accent: #ffffff;
	--on-highlight: #10243a;

	--font-display: "Oswald", "Roboto Condensed", system-ui, sans-serif;
	--font-sans: "Inter", system-ui, -apple-system, sans-serif;
	--font-mono: "JetBrains Mono", ui-monospace, monospace;

	--step--1: 0.8125rem;
	--step-0: 0.9375rem;
	--step-1: 1.125rem;
	--step-2: 1.5rem;
	--step-3: 2.25rem;
	--step-4: 3.5rem;
	--step-5: 4.5rem;

	--radius: 6px;
	--radius-sm: 4px;
	--radius-pill: 999px;
	--shadow: 0 1px 2px rgb(0 0 0 / 0.04);
}

[data-theme="light"] {
	--bg: var(--db-cream);
	--surface: #ffffff;
	--surface-alt: var(--db-cream-bright);
	--chrome: var(--db-black);
	--ink: var(--db-ink);
	--ink-muted: var(--db-ink-muted);
	--line: color-mix(in srgb, var(--db-black) 12%, var(--db-cream));
	--accent: var(--db-red);
	--highlight: var(--db-green);
	--on-accent: #ffffff;
	--on-highlight: var(--db-ink);
}

[data-theme="dark"] {
	--bg: #101c2b;
	--surface: #18293d;
	--surface-alt: #1e3148;
	--chrome: #0a131e;
	--ink: #f2f4f6;
	--ink-muted: #93a3b5;
	--line: #274058;
	--accent: #e23e2e;
	--highlight: #ffc72c;
	--on-accent: #ffffff;
	--on-highlight: #101c2b;
	--shadow: none;
}

html.ds {
	background: var(--bg);
}

body.site-body.ds-body,
html.ds body.site-body {
	--ink-dim: var(--ink-muted);
	--panel: var(--surface);
	--brand: var(--chrome);
	--brand-deep: var(--chrome);
	--live: var(--accent);
	--blue: var(--chrome);
	--gold: var(--highlight);
	--green: var(--chrome);
	--red: var(--accent);
	--page-bg: var(--bg);
	--card: var(--surface);
	--text-dark: var(--ink);
	background: var(--bg);
	color: var(--ink);
	font-family: var(--font-sans);
	font-size: var(--step-0);
	line-height: 1.6;
}

html.ds body.site-body a {
	color: var(--chrome);
}

html.ds .site-header {
	border-bottom: 3px solid var(--db-red);
	box-shadow: none;
}

html.ds .site-header-in {
	max-width: 1200px;
	gap: 16px;
	padding: 12px 16px;
}

html.ds .site-nav {
	gap: 8px 16px;
}

html.ds .site-header .site-nav a,
html.ds .site-body .site-header .site-nav a,
html.ds .archive-body .site-header .site-nav a {
	color: var(--surface);
	font-family: var(--font-sans);
	font-size: 15px;
	font-weight: 500;
	letter-spacing: 0;
	text-transform: none;
}

html.ds .site-nav .nav-live {
	background: var(--highlight);
	color: var(--on-highlight) !important;
	border-radius: var(--radius-pill);
	padding: 6px 12px;
	font-size: 11px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	font-weight: 700;
}

html.ds .site-nav .nav-cta {
	background: var(--accent);
	border: none;
	border-radius: var(--radius);
	padding: 10px 18px;
	color: var(--on-accent) !important;
}

html.ds .site-nav .nav-cta-alt {
	display: none;
}

html.ds .site-nav a:focus-visible,
html.ds .btn-site:focus-visible,
html.ds .btn-hero:focus-visible {
	outline: 2px solid var(--highlight);
	outline-offset: 2px;
}

/* ----- Home hero (Theme A chrome) ----- */
html.ds .home-hero {
	background: var(--chrome);
	color: var(--surface);
	padding: 48px 16px 32px;
}

html.ds .home-hero::before {
	opacity: 0.12;
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 200' fill='none'><circle cx='100' cy='100' r='96' stroke='%23ffffff' stroke-width='1.25'/><circle cx='100' cy='100' r='72' stroke='%23ffffff' stroke-width='1'/><circle cx='100' cy='100' r='48' stroke='%23ffffff' stroke-width='1'/><circle cx='100' cy='100' r='24' stroke='%23ffffff' stroke-width='1'/><circle cx='100' cy='100' r='4' fill='%23d93a2b'/></svg>");
	background-repeat: no-repeat;
	background-position: right -8% center;
	background-size: min(420px, 70vw);
}

html.ds .hero-brand {
	color: var(--highlight);
	font-size: 11px;
	letter-spacing: 0.14em;
	font-weight: 600;
}

html.ds .hero-title {
	font-family: var(--font-display);
	font-size: var(--step-4);
	font-weight: 500;
	letter-spacing: -0.01em;
	line-height: 1.1;
	text-wrap: balance;
	color: var(--surface);
}

html.ds .hero-lead {
	color: var(--ink-muted);
	filter: brightness(1.8);
	font-size: var(--step-0);
	line-height: 1.6;
	text-wrap: pretty;
}

html.ds .hero-actions {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
}

html.ds .btn-hero-primary,
html.ds .btn-site {
	background: var(--accent);
	color: var(--on-accent) !important;
	border: none;
	border-radius: var(--radius);
	padding: 10px 18px;
	font-family: var(--font-sans);
	font-weight: 600;
	box-shadow: none;
}

html.ds .btn-hero-ghost {
	background: transparent;
	color: var(--surface) !important;
	border: 1px solid var(--surface);
	border-radius: var(--radius);
	padding: 10px 18px;
}

html.ds .home-band,
html.ds .home-band.band-light,
html.ds .home-band.band-dark {
	background: var(--bg) !important;
	color: var(--ink);
	--ink: var(--ink);
	--ink-dim: var(--ink-muted);
	--panel: var(--surface);
	--line: var(--line);
	--blue: var(--chrome);
	--gold: var(--chrome);
	padding: 32px 16px;
}

/* band-dark-ийн хуучин цайвар текст — цайвар фонд БҮҮ үлдээ */
html.ds .band-dark .home-row,
html.ds .band-dark .home-row:hover {
	background: transparent;
	border-color: transparent;
	color: var(--ink);
}

html.ds .band-dark .home-row-main strong,
html.ds .band-dark .home-row-side {
	color: var(--ink);
}

html.ds .band-dark .home-row-date,
html.ds .band-dark .home-row-main i,
html.ds .band-dark .home-row-side small {
	color: var(--ink-muted);
}

html.ds .home-row-main em {
	color: var(--accent);
	font-weight: 800;
}

html.ds .home-tier {
	background: var(--chrome);
	color: var(--surface);
}

html.ds .home-band + .home-band {
	padding-top: 32px;
}

html.ds .home-band-in {
	max-width: 1200px;
	display: flex;
	flex-direction: column;
	gap: 16px;
}

html.ds .home-band h2 {
	font-family: var(--font-display);
	font-size: var(--step-2);
	font-weight: 500;
	letter-spacing: -0.01em;
	text-transform: none;
	color: var(--ink);
	line-height: 1.1;
}

html.ds .home-band h2::after {
	display: none;
}

html.ds .home-band h2 a,
html.ds .arc-main h2 .h2-link {
	font-family: var(--font-sans);
	font-size: var(--step--1);
	color: var(--chrome) !important;
	background: var(--surface);
	border: 1px solid var(--line);
	border-radius: var(--radius-pill);
}

html.ds .home-sec-lead,
html.ds .muted {
	color: var(--ink-muted);
	font-size: var(--step--1);
}

html.ds .quick-grid,
html.ds .home-stats {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 16px;
}

@media (min-width: 768px) {
	html.ds .quick-grid,
	html.ds .home-stats {
		grid-template-columns: repeat(4, 1fr);
	}
}

html.ds .quick-link,
html.ds .home-stat {
	background: var(--surface);
	border: 1px solid var(--line);
	border-radius: var(--radius);
	box-shadow: var(--shadow);
	border-left: 3px solid var(--highlight);
	color: var(--ink) !important;
}

html.ds .quick-link:nth-child(2),
html.ds .home-stat:nth-child(2) {
	border-left-color: var(--accent);
}

html.ds .quick-link:nth-child(3),
html.ds .home-stat:nth-child(3) {
	border-left-color: var(--chrome);
}

html.ds .home-stat b {
	font-family: var(--font-mono);
	font-size: clamp(1.75rem, 4vw, var(--step-5));
	font-variant-numeric: tabular-nums;
	font-weight: 700;
	color: var(--ink);
	line-height: 1.1;
}

html.ds .home-stat i {
	font-style: normal;
	font-size: 11px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--ink-muted);
}

html.ds .home-list,
html.ds .home-series-list,
html.ds .zebra-list {
	border: 1px solid var(--line);
	border-radius: var(--radius);
	overflow: hidden;
	background: var(--surface);
	box-shadow: var(--shadow);
	gap: 0;
}

html.ds .home-list a,
html.ds .home-series-list a,
html.ds .zebra-list > *,
html.ds .home-feat a,
html.ds .home-clubs a {
	background: var(--surface);
	border: 0;
	border-bottom: 1px solid var(--line);
	border-radius: 0;
	box-shadow: none;
	color: var(--ink);
}

html.ds .home-list a:last-child,
html.ds .home-series-list a:last-child,
html.ds .zebra-list > *:last-child {
	border-bottom: 0;
}

html.ds .home-list a:nth-child(odd),
html.ds .home-series-list a:nth-child(odd),
html.ds .zebra-list > *:nth-child(odd),
html.ds .home-feat a:nth-child(odd) {
	background: var(--surface);
}

html.ds .home-list a:nth-child(even),
html.ds .home-series-list a:nth-child(even),
html.ds .zebra-list > *:nth-child(even),
html.ds .home-feat a:nth-child(even) {
	background: var(--surface-alt);
}

html.ds .home-list a:hover,
html.ds .home-series-list a:hover {
	background: #dce7f1;
}

html.ds table.zebra tbody tr:nth-child(odd),
html.ds .arc-main table tbody tr:nth-child(odd),
html.ds .entry-table tbody tr:nth-child(odd),
html.ds .sa-table tbody tr:nth-child(odd) {
	background: var(--surface);
}

html.ds table.zebra tbody tr:nth-child(even),
html.ds .arc-main table tbody tr:nth-child(even),
html.ds .entry-table tbody tr:nth-child(even),
html.ds .sa-table tbody tr:nth-child(even) {
	background: var(--surface-alt);
}

html.ds .site-footer {
	border-top: 3px solid var(--db-green);
	color: color-mix(in srgb, var(--db-cream) 78%, var(--db-wire));
}

html.ds .site-footer a,
html.ds .site-footer .copy {
	color: color-mix(in srgb, var(--db-cream) 85%, #fff);
	font-size: 13px;
}

html.ds .site-footer-in {
	max-width: 1200px;
}

/* ----- Archive Theme B ----- */
html.ds .archive-body .arc-hero {
	background: var(--bg);
	color: var(--ink);
	--ink: var(--ink);
	--ink-dim: var(--ink-muted);
	border-bottom: none;
	padding: 48px 16px 32px;
}

html.ds .archive-body .arc-hero::before {
	display: none;
}

html.ds .archive-body .arc-hero h1 {
	font-family: var(--font-display);
	font-size: var(--step-3);
	font-weight: 500;
	letter-spacing: -0.01em;
	line-height: 1.1;
	color: var(--ink);
}

html.ds .archive-body .arc-hero h1 em {
	color: var(--ink);
	font-style: normal;
	box-shadow: inset 0 -3px 0 var(--highlight);
}

html.ds .archive-body .search-box input {
	background: var(--surface);
	color: var(--ink);
	border: 1px solid var(--line);
	border-radius: var(--radius);
}

html.ds .archive-body .search-box input:focus {
	outline: 2px solid var(--highlight);
	border-color: var(--chrome);
	box-shadow: none;
}

html.ds .archive-body .counters {
	display: grid;
	grid-template-columns: repeat(5, minmax(0, 1fr));
	gap: 12px;
}

@media (max-width: 52rem) {
	html.ds .archive-body .counters {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

html.ds .archive-body .counters > * {
	background: var(--surface);
	border: 1px solid var(--line);
	border-radius: var(--radius);
	box-shadow: var(--shadow);
	border-left: none;
}

html.ds .archive-body .counter-val {
	font-family: var(--font-mono);
	font-variant-numeric: tabular-nums;
	color: var(--ink);
}

html.ds .archive-body .counter-label {
	color: var(--ink-muted);
}

html.ds .archive-body .counter-rule {
	background: var(--mark, var(--chrome));
}

html.ds .archive-body .feat-body .big,
html.ds .archive-body .feat-body .sub {
	font-family: var(--font-mono);
	font-variant-numeric: tabular-nums;
	color: var(--ink);
}

html.ds .archive-body .feat-body .big small,
html.ds .archive-body .feat-body .sub {
	font-family: var(--font-sans);
	color: var(--ink-muted);
}

html.ds .archive-body .tier-card b {
	font-family: var(--font-mono);
	font-variant-numeric: tabular-nums;
	color: var(--ink);
}

html.ds .archive-body .tier-card .tier-label,
html.ds .archive-body .tier-card .ex {
	color: var(--ink-muted);
}

html.ds .archive-body .club-card .cn {
	color: var(--ink);
}

html.ds .archive-body .club-meta,
html.ds .archive-body .club-rank {
	color: var(--ink-muted);
}

html.ds .archive-body .arc-main {
	max-width: 1200px;
}

html.ds .archive-body .arc-main section,
html.ds .archive-body .arc-main section:nth-of-type(odd),
html.ds .archive-body .arc-main section:nth-of-type(even) {
	background: var(--bg) !important;
	color: var(--ink);
	--ink: var(--ink);
	--ink-dim: var(--ink-muted);
	--panel: var(--surface);
	--line: var(--line);
	--blue: var(--chrome);
	--gold: var(--highlight);
	padding: 32px 16px;
}

html.ds .archive-body .arc-main section::before,
html.ds .archive-body .arc-main section::after {
	display: none !important;
}

html.ds .archive-body .arc-main h2 {
	font-family: var(--font-display);
	font-size: var(--step-2);
	text-transform: none;
	letter-spacing: -0.01em;
	font-weight: 500;
	color: var(--ink);
	opacity: 1;
}

html.ds .archive-body .feat-card,
html.ds .archive-body .tour-row,
html.ds .archive-body table {
	background: var(--surface);
	border: 1px solid var(--line);
	border-radius: var(--radius);
	box-shadow: var(--shadow);
}

html.ds .archive-body table thead th {
	background: var(--chrome);
	color: var(--surface);
	font-size: 11px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	font-weight: 600;
}

html.ds .archive-body tbody tr:nth-child(odd) {
	background: var(--surface);
}

html.ds .archive-body tbody tr:nth-child(even) {
	background: var(--surface-alt);
}

html.ds .archive-body tbody tr:hover {
	background: #dce7f1;
	cursor: pointer;
}

html.ds .archive-body .feat-photo.placeholder {
	background: var(--chrome);
	color: var(--surface);
	border-color: var(--chrome);
}

/* ----- LIVE match Theme C ----- */
html.ds[data-theme="dark"] body {
	background: var(--bg);
	color: var(--ink);
	font-family: var(--font-sans);
}

html.ds[data-theme="dark"] #app {
	background: var(--bg);
	max-width: 34rem;
}

html.ds[data-theme="dark"] #header {
	background: var(--chrome);
	border-bottom: 2px solid var(--accent);
}

html.ds[data-theme="dark"] #match-title {
	font-family: var(--font-display);
	font-weight: 500;
	letter-spacing: -0.01em;
}

html.ds[data-theme="dark"] #live-badge {
	background: var(--accent);
	color: var(--on-accent);
	font-size: 11px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	border-radius: var(--radius-sm);
	font-family: var(--font-sans);
}

html.ds[data-theme="dark"] .name-text {
	font-family: var(--font-display);
	font-weight: 500;
}

html.ds[data-theme="dark"] #legs {
	font-family: var(--font-mono);
	font-variant-numeric: tabular-nums;
	font-size: var(--step-3);
	color: var(--highlight);
}

html.ds[data-theme="dark"] #article {
	background: var(--bg);
}

html.ds[data-theme="dark"] .score-table th {
	background: var(--chrome);
	color: var(--surface);
	font-size: 11px;
	letter-spacing: 0.14em;
	text-transform: uppercase;
}

html.ds[data-theme="dark"] .score-table td {
	font-family: var(--font-mono);
	font-variant-numeric: tabular-nums;
	border-color: var(--line);
}

/* Идэвхтэй / bust нүдийг stripe-аар бүү дар */
html.ds[data-theme="dark"] .score-table tbody tr:nth-child(odd) td:not(.cell-active):not(.cell-bust) {
	background: var(--surface-alt);
}

html.ds[data-theme="dark"] .score-table td.cell-active {
	background: #ffd700;
	color: #111;
}

html.ds[data-theme="dark"] .score-table td.cell-active.rem-mode {
	background: #4a6d8c;
	color: #fff;
}

html.ds[data-theme="dark"] .big-box.focus .big-inner,
html.ds[data-theme="dark"] .big-box.finish .big-inner {
	background: #ffd700;
	color: #111;
}

html.ds[data-theme="dark"] .pad button,
html.ds[data-theme="dark"] #keypad button {
	background: var(--surface);
	color: var(--ink);
	border: 1px solid var(--line);
	border-radius: var(--radius);
	font-family: var(--font-mono);
}

@media (prefers-reduced-motion: reduce) {
	html.ds * {
		animation: none !important;
		transition: none !important;
	}
}