/* ═══════════════════════════════════════════════════════════════════════
   Sandbox Group — brand tokens
   Shared across Fractal, Cockpit, Prism, Nexus, Iris, Herald, Mosaic.
   ═══════════════════════════════════════════════════════════════════════ */
:root {
	/* ── Primary ── */
	--fun-purple: #a400bc;
	--experiences-yellow: #ffc101;
	--digital-green: #00d17f;
	--learning-blue: #4664e1;

	/* ── Secondary · text & ground ── */
	--dark-purple: #60156b;
	--dark-blue: #224089;
	--grey: #2a2f35;
	--white: #ffffff;

	/* ── Extended · support & overlay ── */
	--dark-green: #089b58;
	--dark-yellow: #ef9900;
	--light-purple: #d54de8;
	--light-yellow: #fcea6b;
	--light-green: #23f791;
	--light-blue: #73a6ff;

	/* ── Per-component accent (canonical from each icon) ── */
	--app-fractal: #a400bc;
	--app-cockpit: #2a2f35; /* charcoal control-plane, gold instruments */
	--app-cockpit-spark: #ffc101;
	--app-prism: #00d17f;
	--app-nexus: #ef9900; /* gold hub */
	--app-iris: #4664e1;
	--app-herald: #60156b;
	--app-mosaic: #a400bc; /* multi-tile; spectrum gradient used decoratively */
	--app-data: #ef9900;

	/* ── Neutrals for product surfaces ── */
	--ink: #221726;
	--ink-2: #4f4a52;
	--ink-muted: #8a8479;
	--ink-faint: #b6b0a4;
	--paper: #f6f4ee;
	--paper-2: #fbfaf6;
	--line: #e7e3d9;
	--line-soft: #efebe2;

	/* ── Type ── */
	--font-display: 'Quicksand', system-ui, sans-serif;
	--font-body: 'Work Sans', system-ui, sans-serif;
}

/* Spectrum gradient (Mosaic / Fractal accents) */
.sbx-spectrum {
	background: linear-gradient(90deg, #a400bc, #d54de8, #ffc101, #00d17f, #4664e1);
}