/* Skin: Vercel — shadcn neutral scale, 1px hairlines, small radii, shadow-sm.
   Mirrors the wpmd-theme token layer: white surfaces, near-black as the only
   accent, colour reserved for meaning (charts keep their data-viz hues). */

.skin-vercel {
	--bg: #ffffff;
	--bg-card: #ffffff;
	--bg-soft: #f5f5f5;
	--text: #0a0a0a;
	--text-soft: #737373;
	--border: #e5e5e5;
	--accent: #0a0a0a;
	--accent-soft: #f5f5f5;
	--link: #0a0a0a;
	--radius: 10px;
	--sans: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Helvetica, Arial, sans-serif;
	font-family: var(--sans);
	font-feature-settings: 'lnum' 1;
}

.skin-vercel h1,
.skin-vercel h2,
.skin-vercel h3 { letter-spacing: -0.02em; }

/* shadcn outline button: white, hairline, shadow-sm; hover fills muted. */
.skin-vercel .btn {
	border-radius: 6px;
	border-color: var(--border);
	background: #ffffff;
	font-weight: 500;
	box-shadow: 0 1px 2px rgba(0, 0, 0, .05);
}
.skin-vercel .btn:hover { background: #f5f5f5; border-color: #d4d4d4; color: var(--text); }
.skin-vercel .btn--accent,
.skin-vercel #country-game .cg-giveup,
.skin-vercel #country-game .cg-submit-form .btn { background: #0a0a0a; border-color: #0a0a0a; color: #fafafa; }
.skin-vercel .btn--accent:hover,
.skin-vercel #country-game .cg-giveup:hover,
.skin-vercel #country-game .cg-submit-form .btn:hover { background: #262626; border-color: #262626; color: #fafafa; opacity: 1; }

/* Cards: quiet frames — hairline plus shadow-sm, nothing louder. */
.skin-vercel .project-card,
.skin-vercel .revenue-card,
.skin-vercel .gh-card,
.skin-vercel .channel-card,
.skin-vercel .gh-org,
.skin-vercel .tweet-card,
.skin-vercel .follow-card,
.skin-vercel .cg-end { box-shadow: 0 1px 2px rgba(0, 0, 0, .05); }
.skin-vercel .project-card:hover { border-color: #d4d4d4; box-shadow: 0 12px 32px rgba(0, 0, 0, .10), 0 2px 6px rgba(0, 0, 0, .04); }

.skin-vercel .badge { background: #f5f5f5; color: #262626; }
.skin-vercel .share-fill { background: #0a0a0a; }
.skin-vercel ::selection { background: #0a0a0a; color: #fafafa; }
.skin-vercel a:hover { color: #0a0a0a; text-decoration-color: #0a0a0a; }
.skin-vercel :focus-visible { outline: 2px solid #0a0a0a; outline-offset: 2px; }
.skin-vercel .pagination .page-numbers.current { background: #0a0a0a; border-color: #0a0a0a; color: #fafafa; }
.skin-vercel .comment-form .submit,
.skin-vercel .search-submit { background: #0a0a0a; color: #fafafa; }
.skin-vercel .cg-input,
.skin-vercel .cg-name { border-radius: 6px; box-shadow: 0 1px 2px rgba(0, 0, 0, .05); }
.skin-vercel .cg-input:focus { outline: 2px solid rgba(10, 10, 10, .14); outline-offset: 0; border-color: #0a0a0a; }