/* Cosmic Roadmaps Spark Check. Everything is scoped under .crsc.
   Colours inherit from the theme; change the accent below to taste. */
.crsc {
	--crsc-accent: #6b4fbb;
	--crsc-accent-text: #ffffff;
	--crsc-line: rgba(128, 128, 128, 0.35);
	--crsc-radius: 10px;
	max-width: 42rem;
	margin: 0 auto;
	box-sizing: border-box;
}
.crsc *, .crsc *::before, .crsc *::after { box-sizing: inherit; }

.crsc-grid { display: grid; gap: 1rem; grid-template-columns: 1fr; }
@media (min-width: 600px) { .crsc-grid { grid-template-columns: 1fr 1fr; } }

.crsc fieldset { border: 1px solid var(--crsc-line); border-radius: var(--crsc-radius); padding: 0.75rem 1rem 0.25rem; margin: 0 0 1rem; min-width: 0; }
.crsc legend { padding: 0 0.4rem; font-weight: 600; }
.crsc label { display: block; margin-bottom: 0.25rem; }
.crsc input[type="text"],
.crsc input[type="email"],
.crsc input[type="date"] { width: 100%; max-width: 100%; padding: 0.55rem 0.6rem; font: inherit; border: 1px solid var(--crsc-line); border-radius: 6px; }
.crsc input:focus-visible, .crsc button:focus-visible, .crsc a:focus-visible { outline: 2px solid var(--crsc-accent); outline-offset: 2px; }

.crsc fieldset.crsc-type { padding: 0.6rem 1rem; }
.crsc .crsc-type { display: flex; flex-wrap: wrap; gap: 0.25rem 1.25rem; }
.crsc .crsc-radio, .crsc .crsc-check label { display: inline-flex; align-items: center; gap: 0.4rem; margin: 0; }
.crsc .crsc-check { margin: 0.5rem 0; }
.crsc .crsc-check label { display: flex; align-items: flex-start; }
.crsc .crsc-check input { margin-top: 0.3rem; }

.crsc-button { display: inline-block; padding: 0.7rem 1.4rem; font: inherit; font-weight: 600; color: var(--crsc-accent-text); background: var(--crsc-accent); border: 0; border-radius: 999px; cursor: pointer; text-decoration: none; }
.crsc-button:hover { filter: brightness(1.1); }
.crsc-button-small { padding: 0.5rem 1rem; }
.crsc-button-ghost { background: transparent; color: inherit; border: 1px solid var(--crsc-line); }
.crsc-actions { display: flex; flex-wrap: wrap; gap: 0.6rem; margin: 0.75rem 0; }

.crsc-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.crsc-gate-main { border: 2px solid var(--crsc-accent); padding: 1.5rem; box-shadow: 0 4px 18px rgba(107, 79, 187, 0.18); }
.crsc-gate-main h4 { font-size: 1.4em; margin-bottom: 0.5rem; }
.crsc-emailrow { display: flex; flex-wrap: wrap; gap: 0.6rem; margin: 1rem 0 0.5rem; }
.crsc-emailrow input[type="email"] { flex: 1 1 15rem; width: auto; padding: 0.8rem 0.9rem; font-size: 1.05em; }
.crsc-button-big { padding: 0.8rem 1.6rem; font-size: 1.05em; flex: 0 0 auto; }
.crsc-login-link { margin: 0 0 1rem; font-size: 0.9em; opacity: 0.85; }
.crsc-linkbtn { background: none; border: 0; padding: 0; font: inherit; color: inherit; text-decoration: underline; cursor: pointer; }
.crsc-linkbtn:focus-visible { outline: 2px solid var(--crsc-accent); outline-offset: 2px; }
.crsc-quiet { border-style: dashed; padding: 0.75rem 1rem; font-size: 0.9em; }
.crsc-quiet h4 { font-size: 1em; margin-bottom: 0.25rem; }

.crsc-errors { border: 1px solid #b32d2e; border-radius: 6px; padding: 0.5rem 1rem; margin-bottom: 1rem; }
.crsc-errors ul { margin: 0; padding-left: 1.2rem; }
.crsc-notice { border: 1px solid var(--crsc-accent); border-radius: 6px; padding: 0.6rem 1rem; }
.crsc-fine { font-size: 0.875em; opacity: 0.8; }

.crsc-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

.crsc-result, .crsc-shared { text-align: center; }
.crsc-names { font-size: 1.1em; font-weight: 600; margin-bottom: 0; }
.crsc-score { margin: 0.25rem 0 0; line-height: 1; }
.crsc-score-num { font-size: 4.5rem; font-weight: 700; color: var(--crsc-accent); }
.crsc-score-of { font-size: 1.5rem; opacity: 0.7; margin-left: 0.15rem; }
.crsc-label { margin: 0.25rem 0 0; text-transform: uppercase; letter-spacing: 0.08em; font-size: 0.85em; font-weight: 600; }
.crsc-headline { margin: 0.5rem 0; }
.crsc-lasting { font-style: italic; }
.crsc-cta { margin-top: 1.5rem; }

.crsc-card, .crsc-gate { border: 1px solid var(--crsc-line); border-radius: var(--crsc-radius); padding: 1rem 1.25rem; margin: 1.25rem 0; text-align: left; }
.crsc-card h4, .crsc-gate h4 { margin-top: 0; }
.crsc-sub { font-weight: 600; margin-bottom: 0.25rem; }
.crsc-list { margin: 0 0 0.75rem; padding-left: 1.2rem; }
.crsc-list li { margin: 0.25rem 0; }
.crsc-tone { opacity: 0.7; font-size: 0.9em; }
.crsc-aspect { font-size: 1.15em; font-weight: 600; margin: 0; }

.crsc-sharerow { display: flex; flex-wrap: wrap; gap: 0.5rem; align-items: center; }
.crsc-sharerow input { flex: 1 1 14rem; }

.crsc-upsell { text-align: center; }
