/* Certificate check, the safeguarding report, the 404 page and the two moved-page fallbacks. The shell's story.css supplies the hero and
   components.css the fields and buttons; this sheet sets the reading column and the result and alert cards. Tokens only.
   The certificate check and the safeguarding report (the heart's quiet pages) wear Temple Dark with the layer behind them (assets/css/ds/chakra.css, aspects
   `seal` and `shelter`): plain words and the form on the black, hairlines instead of cards (the .pf--verify and .pf--sg rules at the end); the 404 and the
   moved-page fallbacks keep the first rules. */
.pf { min-inline-size: 0; overflow-x: clip; }
.pf-doc { box-sizing: border-box; margin-inline: auto; max-inline-size: 44rem; padding: var(--ds-space-8) var(--ds-space-4) var(--ds-space-10); min-inline-size: 0; overflow-wrap: anywhere; }
.pf-doc p, .pf-doc li { line-height: var(--ds-leading-normal); }
.pf-doc a:not(.ds-button) { color: var(--ds-accent); text-underline-offset: .2em; }
.pf-form { display: grid; gap: var(--ds-space-4); margin-block-start: var(--ds-space-5); }
.pf-code { text-transform: uppercase; }
.pf-card { margin-block-start: var(--ds-space-5); padding: var(--ds-space-5); background: var(--ds-surface-raised); border: 1px solid var(--ds-border); border-radius: var(--ds-radius-lg); }
.pf-card h2 { margin: 0 0 var(--ds-space-3); font-family: var(--ds-font-display); font-size: var(--ds-text-2xl); line-height: var(--ds-leading-tight); }
.pf-card p:last-child { margin-block-end: 0; }
.pf-result { padding-block: var(--ds-space-4); }
.pf-result__topic { margin: 0; font-size: var(--ds-text-sm); font-weight: 600; color: var(--ds-success); }
.pf-result__topic--no { color: var(--ds-warning); }
.pf-result__text { margin: var(--ds-space-2) 0; font-family: var(--ds-font-display); font-size: var(--ds-text-xl); }
.pf-muted { margin: 0; color: var(--ds-text-muted); }
.pf-alert { margin: 0 0 var(--ds-space-5); padding: var(--ds-space-4); border: 1px solid var(--ds-danger); border-radius: var(--ds-radius-md); background: var(--ds-surface-sunken); }
.pf-err { margin-block-start: var(--ds-space-4); }
.pf-check { display: flex; align-items: center; gap: var(--ds-space-3); min-block-size: 44px; cursor: pointer; }
.pf-check input { flex: none; inline-size: 20px; block-size: 20px; accent-color: var(--ds-action); }
.pf-hp { position: absolute; inline-size: 1px; block-size: 1px; overflow: hidden; clip-path: inset(50%); }   /* the honeypot: out of sight, never in the tab order */
.pf--404 .pf-hero, .pf--moved .pf-hero { min-block-size: 50vh; }
@media (min-width: 48rem) { .pf-doc { padding-inline: var(--ds-space-8); } }

/* the heart's two forms: the certificate check and the safeguarding report */
.pf--verify, .pf--sg { --ck: var(--ck-heart); font-family: var(--ds-font-ui); color: var(--ds-text); clip-path: inset(0); }
:is(.pf--verify, .pf--sg) .ds-chakra-beat { box-sizing: border-box; padding-inline: var(--ds-gutter, 1rem); min-inline-size: 0; }
:is(.pf--verify, .pf--sg) .pf-open { padding-block: var(--ds-space-11) clamp(var(--ds-space-10), 14vh, var(--ds-space-12)); min-block-size: min(38rem, 80svh); }
:is(.pf--verify, .pf--sg) .ds-chakra-beat > .pf-read { margin-inline: 0; max-inline-size: 40rem; display: grid; gap: var(--ds-space-5); min-inline-size: 0; overflow-wrap: anywhere; }
.pf-title { margin: 0; font-family: var(--ds-font-display); font-weight: 500; font-size: var(--ds-text-4xl); line-height: 1; letter-spacing: -.01em; color: var(--ds-text); text-wrap: balance;
  text-shadow: 0 0 2.2rem color-mix(in srgb, var(--ck) 38%, transparent), 0 0 .6rem color-mix(in srgb, var(--ds-surface-sunken) 80%, transparent); }
.pf-kind { margin: calc(var(--ds-space-3) * -1) 0 0; font-size: var(--ds-text-lg); color: var(--ds-text-muted); }
:is(.pf--verify, .pf--sg) :is(p, label, .pf-result, .pf-done h2) { text-shadow: 0 0 .7rem color-mix(in srgb, var(--ds-surface-sunken) 90%, transparent), 0 0 .2rem color-mix(in srgb, var(--ds-surface-sunken) 80%, transparent); }
:is(.pf--verify, .pf--sg) .pf-read > p { margin: 0; font-size: var(--ds-text-md); line-height: 1.7; color: var(--ds-text); }
:is(.pf--verify, .pf--sg) a:not(.ds-button) { color: var(--ds-accent); text-underline-offset: .2em; }
:is(.pf--verify, .pf--sg) :focus-visible { outline: 2px solid var(--ds-focus); outline-offset: 3px; border-radius: var(--ds-radius-sm); }
:is(.pf--verify, .pf--sg) .pf-form { margin-block-start: var(--ds-space-2); }
:is(.pf--verify, .pf--sg) .pf-check { color: var(--ds-text); }
.pf-result { display: grid; gap: var(--ds-space-2); padding-block: var(--ds-space-5); border-block: 1px solid var(--ds-border); }
.pf-result p { margin: 0; }
.pf--verify .pf-result__text { font-size: var(--ds-text-2xl); line-height: var(--ds-leading-tight); }
.pf--verify .pf-code { max-inline-size: 36rem; }
.pf--sg .sg-urgent { padding: var(--ds-space-3) 0 var(--ds-space-3) var(--ds-space-4); border: 0; border-inline-start: 2px solid var(--ds-danger); border-radius: 0; background: none; font-size: var(--ds-text-lg); }
.pf-done { display: grid; gap: var(--ds-space-3); padding-block: var(--ds-space-5); border-block: 1px solid var(--ds-border); }
.pf-done h2 { margin: 0; font-family: var(--ds-font-display); font-weight: 500; font-size: var(--ds-text-3xl); line-height: var(--ds-leading-tight); color: var(--ds-text); }
.pf-done p { margin: 0; font-size: var(--ds-text-md); line-height: 1.7; }
:is(.pf--verify, .pf--sg) .ds-chakra-why { margin-block-start: var(--ds-space-6); }
@media (min-width: 48rem) { :is(.pf--verify, .pf--sg) .ds-chakra-beat { padding-inline: max(var(--ds-space-8), calc((100% - 52rem) / 2 + var(--ds-space-8))); } }
