/* K-168 — kept checks: the opt-in box (/check, the landing page and the task page), the result page's "Your data"
   block, the privacy note and the "deleted" page. Linked only by those partials and pages, so a page without them is
   unchanged. Morpheus tokens (morpheus.css, visual.css).
   UI UX Pro Max rules applied: a native checkbox with a visible label (`label for`) and its hint tied by
   aria-describedby; the whole row is at least 44 px high and 8 px from its neighbours (the site's phone rule for
   .form-check); off by default; the site's 2 px focus ring; 16 px text with line height 1.5, hints 16 px on a phone
   and 14 px from 576 px; text 4.5:1 or more on its surface. The delete action is separated from the page's other
   actions, red with an icon and words (never the colour alone), and asks once more before it deletes (a <details>
   disclosure: works with the keyboard and without a script). Reading width at most 42em (about 75 characters).
   No motion. */

.sc-consent { margin: 0 0 0.75rem; max-width: 42em; flex: 0 0 100%; }
.sc-consent .form-check-label { color: var(--m-text); font-size: 1rem; line-height: 1.5; cursor: pointer; }
.sc-consent .form-check-input { cursor: pointer; }
.sc-hint { display: block; margin-top: 0.125rem; font-size: 1rem; line-height: 1.5; color: var(--m-text-2); }
@media (min-width: 576px) { .sc-hint { font-size: 0.875rem; } }
.sc-hint a { color: var(--v-you, #7cc4ff); text-decoration: underline; text-underline-offset: 2px; }

/* the result page's block */
.sc-data { margin-top: 2rem; padding: 1rem 1.25rem; max-width: 46em; border: 1px solid var(--v-line, #2a2a4a);
  border-radius: var(--v-radius, 14px); background: var(--v-surface, #111128); color: var(--m-text); }
.sc-data-title { display: flex; align-items: center; gap: 0.5rem; margin: 0 0 0.5rem; font-size: 1rem;
  font-weight: 700; line-height: 1.4; }
.sc-data-title .m-icon { width: 1.25rem; height: 1.25rem; color: var(--v-ok-text, #66ffbb); }
.sc-data p { margin: 0 0 0.75rem; line-height: 1.5; overflow-wrap: anywhere; }
.sc-data a { color: var(--v-you, #7cc4ff); text-decoration: underline; text-underline-offset: 2px; }
.sc-delete { margin: 0; }
.sc-delete > summary { list-style: none; display: inline-flex; align-items: center; gap: 0.5rem; min-height: 44px; }
.sc-delete > summary::-webkit-details-marker { display: none; }
.sc-delete .m-icon { width: 1.125rem; height: 1.125rem; }
.sc-delete-body { margin-top: 0.75rem; padding: 0.75rem 1rem; border-left: 3px solid var(--v-bad, #e5534b);
  background: rgba(229, 83, 75, 0.08); border-radius: 0 8px 8px 0; }
.sc-delete-body p { display: flex; gap: 0.5rem; align-items: flex-start; }
.sc-delete-body p .m-icon { flex: 0 0 auto; margin-top: 0.15rem; color: var(--v-bad-text, #ff8888); }
.sc-delete-body .btn { display: inline-flex; align-items: center; gap: 0.5rem; min-height: 44px; }

/* the privacy note and the "deleted" page */
.sc-page { max-width: 42em; margin: 0 auto 3rem; line-height: 1.6; font-size: 1rem; color: var(--m-text); }
.sc-page h1 { display: flex; align-items: center; gap: 0.6rem; font-size: 1.75rem; font-weight: 700; margin-bottom: 1rem; }
.sc-page h1 .m-icon { width: 1.75rem; height: 1.75rem; color: var(--v-ok-text, #66ffbb); }
.sc-page h2 { font-size: 1.125rem; font-weight: 700; margin: 1.75rem 0 0.5rem; }
.sc-page ul { padding-left: 1.25rem; margin: 0; }
.sc-page li { margin-bottom: 0.5rem; }
.sc-page .sc-lead { color: var(--m-text-2); }
.sc-page .sc-version { margin-top: 2rem; color: var(--m-text-3); font-size: 0.875rem; }
.sc-page a { color: var(--v-you, #7cc4ff); }
.sc-page .sc-back { display: inline-block; min-height: 44px; padding-top: 0.625rem; }

/* the admin numbers */
.sc-metrics { max-width: 56em; }
.sc-metrics td.num, .sc-metrics th.num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
