/* Coin Price Guide components. Consumes theme tokens (--cpg-*) with safe fallbacks. */
.cpg {
	--_bg: var(--cpg-bg, #070B12); --_surface: var(--cpg-surface, #0D131D); --_surface2: var(--cpg-surface-2, #121A27);
	--_line: var(--cpg-line, #1E2A3B); --_line2: var(--cpg-line-strong, #2C3B52); --_text: var(--cpg-text, #E6EDF7);
	--_muted: var(--cpg-muted, #8A9BB5); --_dim: var(--cpg-dim, #5B6B84); --_accent: var(--cpg-accent, #37F2C8);
	--_accent2: var(--cpg-accent-2, #7C9BFF); --_warn: var(--cpg-warn, #FFB547); --_danger: var(--cpg-danger, #FF5C7A);
	--_ui: var(--cpg-font-ui, "Space Grotesk", system-ui, sans-serif); --_mono: var(--cpg-font-mono, "JetBrains Mono", ui-monospace, monospace);
	--_r: var(--cpg-radius, 6px);
	color: var(--_text); font-family: var(--_ui);
}
.cpg *, .cpg *::before, .cpg *::after { box-sizing: border-box; }
.cpg a { color: inherit; text-decoration: none; }
.cpg-mono { font-family: var(--_mono); font-variant-numeric: tabular-nums; }
.cpg-dim { color: var(--_dim); }
.cpg-eyebrow { display: block; font-family: var(--_mono); font-size: 11px; letter-spacing: .14em; text-transform: uppercase; color: var(--_muted); }
.cpg-note { font-size: 13px; margin: 14px 0 0; }
.cpg-empty { color: var(--_muted); font-size: 14px; margin: 0; }

/* Panel */
.cpg-panel { position: relative; background: var(--_surface); border: 1px solid var(--_line); border-radius: var(--_r); padding: 20px; box-shadow: inset 0 1px 0 rgba(255,255,255,.03); }
.cpg-panel::before, .cpg-panel::after { content: ""; position: absolute; width: 10px; height: 10px; border-color: var(--_line2); border-style: solid; pointer-events: none; }
.cpg-panel::before { top: -1px; left: -1px; border-width: 1px 0 0 1px; border-color: var(--_accent); opacity: .7; }
.cpg-panel::after { bottom: -1px; right: -1px; border-width: 0 1px 1px 0; border-color: var(--_accent); opacity: .7; }
.cpg-panel__head { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; margin-bottom: 16px; flex-wrap: wrap; }
.cpg-panel__title { margin: 0; font-size: 18px; font-weight: 600; line-height: 1.2; }
.cpg-panel__title .cpg-eyebrow { margin-bottom: 6px; }
.cpg-panel__text { margin: 0; font-size: 14px; line-height: 1.55; color: var(--_muted); }

/* Stats */
.cpg-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.cpg-stat { background: var(--_surface); border: 1px solid var(--_line); border-radius: var(--_r); padding: 16px 18px; display: flex; flex-direction: column; gap: 6px; position: relative; overflow: hidden; }
.cpg-stat::after { content: ""; position: absolute; inset: auto 0 0 0; height: 2px; background: linear-gradient(90deg, var(--_accent), transparent 70%); opacity: .8; }
.cpg-stat__value { font-family: var(--_mono); font-size: 30px; font-weight: 700; line-height: 1; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.cpg-stat__hint { font-size: 12px; color: var(--_dim); }

/* Search */
.cpg-search { position: relative; max-width: 720px; }
.cpg-search__label { display: block; margin-bottom: 8px; }
.cpg-search__field { display: flex; align-items: center; gap: 10px; background: var(--_surface2); border: 1px solid var(--_line2); border-radius: var(--_r); padding: 0 12px; transition: box-shadow .16s ease-out, border-color .16s ease-out; }
.cpg-search__field:focus-within { border-color: var(--_accent); box-shadow: 0 0 0 1px rgba(var(--cpg-accent-rgb, 90,180,255),.35), 0 0 24px rgba(var(--cpg-accent-rgb, 90,180,255),.12); }
.cpg-search__prompt { font-family: var(--_mono); color: var(--_accent); font-size: 14px; }
.cpg-search__input { flex: 1; background: transparent; border: 0; outline: 0; color: var(--_text); font: 500 16px/1 var(--_mono); padding: 14px 0; min-width: 0; }
.cpg-search__input::placeholder { color: var(--_dim); }
.cpg-search__kbd { font-family: var(--_mono); font-size: 11px; color: var(--_dim); border: 1px solid var(--_line2); border-radius: 4px; padding: 2px 6px; }
.cpg-search__results { position: absolute; z-index: 30; left: 0; right: 0; top: 100%; margin: 6px 0 0; padding: 6px; list-style: none; background: var(--_surface); border: 1px solid var(--_line2); border-radius: var(--_r); box-shadow: 0 16px 48px rgba(0,0,0,.5); max-height: 420px; overflow: auto; }
.cpg-search__results li a { display: grid; grid-template-columns: 1fr auto; gap: 2px 16px; padding: 10px 12px; border-radius: 4px; }
.cpg-search__results li a:hover, .cpg-search__results li.is-active a { background: var(--_surface2); }
.cpg-search__name { font-weight: 600; font-size: 15px; }
.cpg-search__meta { grid-column: 1; font-size: 12px; color: var(--_muted); }
.cpg-search__range { grid-column: 2; grid-row: 1 / span 2; align-self: center; font-size: 13px; color: var(--_accent); }
.cpg-search__empty { padding: 12px; color: var(--_muted); font-size: 14px; }

/* Cards */
.cpg-countries, .cpg-denoms { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.cpg-card { display: flex; flex-direction: column; gap: 10px; background: var(--_surface); border: 1px solid var(--_line); border-radius: var(--_r); padding: 20px; position: relative; overflow: hidden; transition: border-color .16s ease-out, transform .16s ease-out, box-shadow .16s ease-out; }
.cpg-card::before { content: ""; position: absolute; inset: 0; background: radial-gradient(420px 160px at 0% 0%, rgba(var(--cpg-accent-2-rgb, 199,210,227),.10), transparent 70%); opacity: 0; transition: opacity .16s ease-out; }
.cpg-card:hover { border-color: var(--_accent); transform: translateY(-2px); box-shadow: 0 0 0 1px rgba(var(--cpg-accent-rgb, 90,180,255),.25), 0 12px 32px rgba(0,0,0,.35); }
.cpg-card:hover::before { opacity: 1; }
.cpg-card__head { display: flex; justify-content: space-between; align-items: center; }
.cpg-card__arrow { font-family: var(--_mono); color: var(--_accent); transition: transform .16s ease-out; }
.cpg-card:hover .cpg-card__arrow { transform: translateX(4px); }
.cpg-card__title { margin: 0; font-size: 22px; font-weight: 600; letter-spacing: -.01em; }
.cpg-card__blurb { margin: 0; color: var(--_muted); font-size: 14px; line-height: 1.5; }
.cpg-card__meta { margin: auto 0 0; padding-top: 12px; border-top: 1px dashed var(--_line); display: grid; grid-template-columns: repeat(3, auto); gap: 12px; }
.cpg-card__meta div { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.cpg-card__meta dt { font-family: var(--_mono); font-size: 10px; letter-spacing: .12em; text-transform: uppercase; color: var(--_dim); }
.cpg-card__meta dd { margin: 0; font-family: var(--_mono); font-size: 13px; font-variant-numeric: tabular-nums; white-space: nowrap; }
.cpg-card--denom .cpg-card__meta { grid-template-columns: auto 1fr; }
.cpg-card__foot { font-size: 11px; }

/* Movers */
.cpg-movers__list { list-style: none; margin: 0; padding: 0; counter-reset: mv; }
.cpg-movers__item { display: grid; grid-template-columns: 1fr auto auto; gap: 4px 16px; align-items: center; padding: 10px 0; border-top: 1px solid var(--_line); }
.cpg-movers__item:first-child { border-top: 0; }
.cpg-movers__coin { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.cpg-movers__name { font-weight: 600; font-size: 14px; }
.cpg-movers__coin .cpg-mono { font-size: 12px; }
.cpg-movers__vals { font-size: 13px; }
.cpg-delta { display: inline-block; font-family: var(--_mono); font-size: 11px; padding: 2px 6px; border-radius: 4px; font-variant-numeric: tabular-nums; }
.cpg-delta--up { color: var(--_accent); background: rgba(var(--cpg-accent-rgb, 90,180,255),.10); }
.cpg-delta--down { color: var(--_danger); background: rgba(255,92,122,.10); }

/* Views */
.cpg-view { display: flex; flex-direction: column; gap: 28px; padding: 24px 0 48px; }
.cpg-crumbs { display: flex; flex-wrap: wrap; gap: 8px; font-family: var(--_mono); font-size: 12px; color: var(--_muted); }
.cpg-crumbs a:hover { color: var(--_accent); }
.cpg-crumbs__sep { color: var(--_dim); }
.cpg-view__head { display: flex; flex-direction: column; gap: 8px; }
.cpg-view__title { margin: 0; font-size: clamp(28px, 4vw, 44px); font-weight: 700; letter-spacing: -.02em; line-height: 1.05; }
.cpg-view__lede { margin: 0; color: var(--_muted); font-size: 16px; max-width: 70ch; display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.cpg-pill { display: inline-block; font-family: var(--_mono); font-size: 11px; letter-spacing: .06em; text-transform: uppercase; padding: 3px 8px; border-radius: 4px; border: 1px solid; white-space: nowrap; }
.cpg-pill--ok { color: var(--_accent); border-color: rgba(var(--cpg-accent-rgb, 90,180,255),.4); }
.cpg-pill--muted { color: var(--_muted); border-color: var(--_line2); }
.cpg-pill--warn { color: var(--_warn); border-color: rgba(255,181,71,.5); }
.cpg-notice { background: var(--_surface); border: 1px solid var(--_line2); border-left: 3px solid var(--_accent2); border-radius: var(--_r); padding: 14px 16px; font-size: 14px; color: var(--_muted); }
.cpg-notice--warn { border-left-color: var(--_warn); }
.cpg-notice strong { color: var(--_text); }

/* Tables */
.cpg-table-tools { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.cpg-filter { display: flex; align-items: center; gap: 8px; background: var(--_surface2); border: 1px solid var(--_line2); border-radius: 4px; padding: 0 12px; flex: 1 1 280px; max-width: 420px; }
.cpg-filter:focus-within { border-color: var(--_accent); }
.cpg-filter input { flex: 1; background: transparent; border: 0; outline: 0; color: var(--_text); font: 14px var(--_mono); padding: 10px 0; min-width: 0; }
.cpg-select { background: var(--_surface2); color: var(--_text); border: 1px solid var(--_line2); border-radius: 4px; padding: 9px 12px; font: 13px var(--_mono); }
.cpg-table-wrap { overflow-x: auto; border: 1px solid var(--_line); border-radius: var(--_r); background: var(--_surface); -webkit-overflow-scrolling: touch; }
.cpg-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.cpg-table th, .cpg-table td { padding: 10px 12px; text-align: left; border-bottom: 1px solid var(--_line); white-space: nowrap; vertical-align: middle; }
.cpg-table thead th { position: sticky; top: 0; z-index: 1; background: var(--_surface2); font-family: var(--_mono); font-size: 11px; letter-spacing: .1em; text-transform: uppercase; color: var(--_muted); font-weight: 500; }
.cpg-table th[data-sort] { cursor: pointer; user-select: none; }
.cpg-table th[data-sort]:hover { color: var(--_text); }
.cpg-table th[aria-sort=ascending]::after { content: " ↑"; color: var(--_accent); }
.cpg-table th[aria-sort=descending]::after { content: " ↓"; color: var(--_accent); }
.cpg-table tbody tr:hover { background: rgba(var(--cpg-accent-2-rgb, 199,210,227),.05); }
.cpg-table tbody tr:last-child td { border-bottom: 0; }
.cpg-num { text-align: right !important; }
.cpg-table__link { font-weight: 600; }
.cpg-table__link:hover { color: var(--_accent); }
.cpg-desigs { margin-left: 8px; font-size: 10px; color: var(--_dim); letter-spacing: .06em; }
.cpg-col-series { max-width: 220px; overflow: hidden; text-overflow: ellipsis; font-size: 12px; }
.cpg-col-status { text-align: right !important; }

/* Coin page */
.cpg-coin__head { flex-direction: row; justify-content: space-between; align-items: flex-end; gap: 24px; flex-wrap: wrap; }
.cpg-coin__mint { font-family: var(--_mono); font-size: .5em; color: var(--_accent); vertical-align: middle; border: 1px solid rgba(var(--cpg-accent-rgb, 90,180,255),.4); border-radius: 4px; padding: 2px 8px; margin-left: 8px; }
.cpg-coin__range { display: flex; flex-direction: column; gap: 6px; min-width: 260px; padding: 16px 20px; }
.cpg-coin__range-val { font-size: 26px; font-weight: 700; letter-spacing: -.02em; }
.cpg-grid-panel { padding: 0; overflow: hidden; }
.cpg-grid-panel__head { padding: 20px 20px 0; }
.cpg-grid-panel .cpg-note { padding: 0 20px 18px; }
.cpg-tabs { display: inline-flex; border: 1px solid var(--_line2); border-radius: 4px; padding: 3px; gap: 3px; background: var(--_bg); }
.cpg-tab { background: transparent; border: 0; color: var(--_muted); font: 500 12px var(--_mono); letter-spacing: .06em; text-transform: uppercase; padding: 7px 12px; border-radius: 3px; cursor: pointer; transition: background .16s ease-out, color .16s ease-out; }
.cpg-tab[aria-selected=true] { background: var(--_surface2); color: var(--_accent); box-shadow: inset 0 0 0 1px rgba(var(--cpg-accent-rgb, 90,180,255),.35); }
.cpg-tab:disabled { opacity: .35; cursor: not-allowed; }
.cpg-picker { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 16px; padding: 16px 20px; border-top: 1px solid var(--_line); border-bottom: 1px solid var(--_line); background: rgba(var(--cpg-accent-2-rgb, 199,210,227),.04); }
.cpg-picker__out { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.cpg-picker__out .cpg-eyebrow { display: inline; }
.cpg-picker__item strong { font-size: 18px; color: var(--_accent); }
.cpg-grid { border: 0; border-radius: 0; }
.cpg-table--grid th.cpg-grid__desig, .cpg-table--grid td.cpg-grid__desig { position: sticky; left: 0; background: var(--_surface); z-index: 2; }
.cpg-table--grid thead th.cpg-grid__desig { z-index: 3; background: var(--_surface2); }
.cpg-table--grid tbody th { font-weight: 500; }
.cpg-grid__desig-name { font-size: 12px; }
.cpg-desig { display: inline-block; font-family: var(--_mono); font-size: 11px; font-weight: 700; padding: 2px 7px; border-radius: 3px; letter-spacing: .06em; }
.cpg-desig--reg { color: var(--_accent2); background: rgba(var(--cpg-accent-2-rgb, 199,210,227),.14); }
.cpg-desig--bn { color: #C9A27E; background: rgba(201,162,126,.14); }
.cpg-desig--rb { color: #E8875C; background: rgba(232,135,92,.14); }
.cpg-desig--rd { color: #FF6B5C; background: rgba(255,107,92,.14); }
.cpg-table--grid td { transition: background .16s ease-out; }
.cpg-table--grid td.is-picked { background: rgba(var(--cpg-accent-rgb, 90,180,255),.12); box-shadow: inset 0 0 0 1px rgba(var(--cpg-accent-rgb, 90,180,255),.5); color: var(--_accent); }
.cpg-table--grid td .cpg-delta { margin-left: 6px; }
.cpg-coin__aside { display: grid; grid-template-columns: repeat(auto-fit, minmax(320px, 1fr)); gap: 14px; }
.cpg-spec { margin: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 12px 20px; }
.cpg-spec div { display: flex; flex-direction: column; gap: 3px; }
.cpg-spec dt { font-family: var(--_mono); font-size: 10px; letter-spacing: .12em; text-transform: uppercase; color: var(--_dim); }
.cpg-spec dd { margin: 0; font-size: 14px; }
.cpg-pager { display: flex; justify-content: space-between; gap: 14px; }
.cpg-pager__link { display: flex; flex-direction: column; gap: 4px; padding: 14px 16px; border: 1px solid var(--_line); border-radius: var(--_r); background: var(--_surface); font-weight: 600; font-size: 14px; max-width: 48%; transition: border-color .16s ease-out; }
.cpg-pager__link:hover { border-color: var(--_accent); }
.cpg-pager__link--next { text-align: right; margin-left: auto; }

/* Responsive */
@media (max-width: 900px) {
	.cpg-stats { grid-template-columns: repeat(2, 1fr); }
	.cpg-countries, .cpg-denoms { grid-template-columns: 1fr 1fr; }
	.cpg-coin__aside { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
	.cpg-countries, .cpg-denoms { grid-template-columns: 1fr; }
	.cpg-stat__value { font-size: 24px; }
	.cpg-col-series { display: none; }
	.cpg-movers__item { grid-template-columns: 1fr auto; }
	.cpg-movers__vals { grid-column: 1; }
	.cpg-coin__range { min-width: 0; width: 100%; }
	.cpg-spec { grid-template-columns: 1fr; }
	.cpg-search__results li a { grid-template-columns: 1fr; }
	.cpg-search__range { grid-column: 1; grid-row: auto; }
	.cpg-search__kbd { display: none; }
}
@media (prefers-reduced-motion: reduce) { .cpg *, .cpg *::before, .cpg *::after { transition: none !important; } }

/* Polish */
.cpg-panel > .cpg-panel__title { margin-bottom: 14px; }
.cpg-tab { white-space: nowrap; }
@media (max-width: 600px) {
	.cpg-tab { font-size: 11px; padding: 7px 9px; }
	.cpg-grid-panel__head { flex-direction: column; align-items: flex-start; }
}

/* Featured coin on country cards */
.cpg-featured { display: flex; align-items: center; gap: 16px; padding: 14px; margin: 4px 0 6px; border: 1px solid var(--_line); border-radius: var(--_r); background: linear-gradient(135deg, rgba(var(--cpg-accent-rgb, 90,180,255), .06), transparent 60%); }
.cpg-featured__text { display: flex; flex-direction: column; gap: 4px; min-width: 0; }
.cpg-featured__nick { font-weight: 600; font-size: 14px; line-height: 1.3; }
.cpg-featured__val { font-size: 12px; color: var(--_accent); }
.cpg-coin { --_m1: #d8dfe9; --_m2: #8a97ab; --_m3: #f2f5fa; --_m4: #5d6b80; --_ink: #2a3140;
	position: relative; flex: 0 0 auto; width: 72px; height: 72px; border-radius: 50%;
	background: radial-gradient(circle at 35% 30%, var(--_m3) 0%, var(--_m1) 30%, var(--_m2) 70%, var(--_m4) 100%);
	box-shadow: inset 0 0 0 2px rgba(255,255,255,.18), inset 0 -4px 10px rgba(0,0,0,.35), 0 8px 18px rgba(0,0,0,.45), 0 0 0 1px rgba(0,0,0,.4);
	transform-style: preserve-3d; animation: cpg-coin-turn 10s ease-in-out infinite; }
.cpg-coin::before { content: ""; position: absolute; inset: 6px; border-radius: 50%; border: 1px dashed rgba(0,0,0,.25); box-shadow: inset 0 0 0 1px rgba(255,255,255,.18); }
.cpg-coin::after { content: ""; position: absolute; inset: 0; border-radius: 50%; background: linear-gradient(120deg, transparent 35%, rgba(255,255,255,.45) 48%, transparent 60%); mix-blend-mode: screen; animation: cpg-coin-shine 10s ease-in-out infinite; }
.cpg-coin__face { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0; color: var(--_ink); font-family: var(--_mono); font-weight: 700; text-shadow: 0 1px 0 rgba(255,255,255,.35); }
.cpg-coin__date { font-size: 15px; letter-spacing: .02em; line-height: 1; }
.cpg-coin__denom { font-size: 9px; letter-spacing: .12em; opacity: .8; }
.cpg-coin--copper { --_m1: #c98a5b; --_m2: #8a5230; --_m3: #ecb98e; --_m4: #5a3119; --_ink: #3a1f10; }
.cpg-coin--gold { --_m1: #e8c665; --_m2: #b48a2a; --_m3: #fbe7a1; --_m4: #7a5a12; --_ink: #4a3608; }
.cpg-coin--silver { --_m1: #d8dfe9; --_m2: #8a97ab; --_m3: #f2f5fa; --_m4: #5d6b80; --_ink: #2a3140; }
.cpg-card:hover .cpg-coin { animation-duration: 3s; }
@keyframes cpg-coin-turn { 0%, 100% { transform: perspective(300px) rotateY(-28deg); } 50% { transform: perspective(300px) rotateY(28deg); } }
@keyframes cpg-coin-shine { 0%, 100% { transform: translateX(-30%); } 50% { transform: translateX(30%); } }
@media (prefers-reduced-motion: reduce) { .cpg-coin, .cpg-coin::after { animation: none !important; } }
@media (max-width: 600px) { .cpg-coin { width: 60px; height: 60px; } .cpg-coin__date { font-size: 13px; } }

/* Coin photos */
.cpg-photo { display: flex; gap: 16px; align-items: flex-start; }
.cpg-photo__side { margin: 0; display: flex; flex-direction: column; align-items: center; gap: 6px; }
.cpg-photo__img { display: block; width: 72px; height: 72px; object-fit: cover; border-radius: 50%; box-shadow: 0 8px 18px rgba(0,0,0,.45), 0 0 0 1px rgba(255,255,255,.12); background: var(--_surface2); }
.cpg-photo--lg .cpg-photo__img { width: 160px; height: 160px; }
.cpg-photo--sm .cpg-photo__img { width: 36px; height: 36px; }
.cpg-photo__note { display: block; font-size: 11px; margin-top: 8px; font-family: var(--_mono); }
.cpg-coin--lg { width: 160px; height: 160px; }
.cpg-coin--lg .cpg-coin__date { font-size: 30px; }
.cpg-coin--lg .cpg-coin__denom { font-size: 11px; }
.cpg-coin__visual { display: flex; flex-direction: column; align-items: flex-start; }
.cpg-coin__head { align-items: center; }
.cpg-coin__intro { flex: 1 1 320px; display: flex; flex-direction: column; gap: 8px; }
.cpg-thumb { width: 28px; height: 28px; object-fit: cover; border-radius: 50%; vertical-align: middle; margin-right: 10px; box-shadow: 0 0 0 1px rgba(255,255,255,.12); }
.cpg-table__namecell { white-space: nowrap; }
@media (max-width: 600px) { .cpg-photo--lg .cpg-photo__img, .cpg-coin--lg { width: 120px; height: 120px; } .cpg-coin--lg .cpg-coin__date { font-size: 22px; } }
.cpg-photo__credit { display: block; margin-top: 6px; font-family: var(--_mono); font-size: 10px; color: var(--_dim); max-width: 340px; line-height: 1.4; }
.cpg-photo__credit a { color: var(--_muted); text-decoration: underline; text-decoration-color: var(--_line2); }
