/*
 * pp-vaccine-intake — patient-facing form
 *
 * Built for a parent on a phone, one-handed, on cell data, with a toddler on
 * their hip.
 *
 * Direction: editorial rather than SaaS. Questions are set in a serif, so they
 * read as something a person asked; interface text stays sans, so the two
 * voices never blur. Structure comes from hairlines and space rather than a
 * stack of bordered cards.
 *
 * Colour discipline:
 *   ink     #14232B  the primary action. If it is ink, it moves you forward.
 *   cyan    #00AEEF  selection and progress. Never an action.
 *   magenta #EC008C  clinical attention, and nothing else. A parent who learns
 *                    magenta means "someone will call you" must never see it
 *                    used decoratively.
 *
 * The serif is a system stack — Iowan Old Style on iOS, Charter on macOS,
 * Georgia elsewhere — so the typography costs nothing to download. A consent
 * form should not make anyone wait on a font before they can read a medical
 * question.
 */

html body .ppvi-app.ppvi-app {
	--ink: #14232B !important;
	--ink-2: #5A6B73 !important;
	--ink-3: #8B979D !important;
	--paper: #FBFAF9 !important;
	--surface: #FFFFFF !important;
	--rule: #E4E0DA !important;
	--rule-2: #C9C3BA !important;

	--cyan: #00AEEF !important;
	--cyan-ink: #05587A !important;
	--cyan-wash: #E6F7FE !important;

	--magenta: #EC008C !important;
	--magenta-ink: #8C0054 !important;
	--magenta-wash: #FDECF5 !important;

	--good: #0F7A5F !important;
	--good-wash: #E7F4EF !important;

	--rail: 560px !important;
	--gutter: 22px !important;
	--pad-x: 16px !important;

	--gap-sm: 10px !important;
	--gap: 18px !important;
	--gap-lg: 28px !important;

	--h: 58px !important;
	--h-row: 62px !important;

	--r-sm: 10px !important;
	--r: 12px !important;

	--serif: "Iowan Old Style", "Charter", "Palatino Linotype", "Palatino", "Book Antiqua", Georgia, serif !important;

	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
	font-size: 17px !important;
	line-height: 1.5 !important;
	color: var(--ink) !important;
	background: var(--paper) !important;
	-webkit-font-smoothing: antialiased !important;

	width: 100% !important;
	flex: 1 1 100% !important;
	align-self: stretch !important;
	justify-self: stretch !important;
	max-width: var(--rail) !important;
	margin: 0 auto !important;
	padding: 0 var(--gutter) calc(120px + env(safe-area-inset-bottom)) !important;
	min-height: 72dvh !important;
	box-sizing: border-box !important;
	scroll-padding-bottom: 140px !important;

	overscroll-behavior-y: contain !important;
	-webkit-tap-highlight-color: transparent !important;
}

html body .ppvi-app.ppvi-app * { box-sizing: border-box !important; }

/* Every element takes the form's typeface. Inheritance is not enough here:
 html body .ppvi-app.ppvi-app * the theme sets font-family directly on h4,
html body .ppvi-app.ppvi-app p,
html body .ppvi-app.ppvi-app label and span,
html body .ppvi-app.ppvi-app and a direct
 * rule always beats an inherited value. This catch-all is the floor; the
 * serif rules below are more specific and override it where intended. */
html body .ppvi-app.ppvi-app h1,
html body .ppvi-app.ppvi-app h2,
html body .ppvi-app.ppvi-app h3,
html body .ppvi-app.ppvi-app h4,
html body .ppvi-app.ppvi-app h5,
html body .ppvi-app.ppvi-app h6,
html body .ppvi-app.ppvi-app p,
html body .ppvi-app.ppvi-app span,
html body .ppvi-app.ppvi-app label,
html body .ppvi-app.ppvi-app div,
html body .ppvi-app.ppvi-app small,
html body .ppvi-app.ppvi-app strong,
html body .ppvi-app.ppvi-app em,
html body .ppvi-app.ppvi-app li,
html body .ppvi-app.ppvi-app a {
	font-weight: inherit !important;
	font-style: normal !important;
	font-variant: normal !important;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif !important;
	text-transform: none !important;
	letter-spacing: normal !important;
	text-shadow: none !important;
}

html body .ppvi-app.ppvi-app button,
html body .ppvi-app.ppvi-app .ppvi-label,
html body .ppvi-app.ppvi-app .ppvi-q,
html body .ppvi-app.ppvi-app .ppvi-h,
html body .ppvi-app.ppvi-app .ppvi-eyebrow,
html body .ppvi-app.ppvi-app .ppvi-count {
	-webkit-user-select: none !important;
	user-select: none !important;
	-webkit-touch-callout: none !important;
}

/* Motion ------------------------------------------------------------- */

@keyframes ppvi-in {
	from { opacity: 0; transform: translateY(8px); }
	to { opacity: 1; transform: none; }
}
html body .ppvi-app.ppvi-app > * { animation: ppvi-in 160ms ease-out both !important; }

/* Progress ----------------------------------------------------------- */

html body .ppvi-app.ppvi-app .ppvi-top { padding: 22px 0 30px !important; }
html body .ppvi-app.ppvi-app .ppvi-meta {
	display: flex !important;
	align-items: baseline !important;
	justify-content: space-between !important;
	margin-bottom: 7px !important;
}
html body .ppvi-app.ppvi-app .ppvi-eyebrow {
	font-size: 12px !important;
	font-weight: 600 !important;
	letter-spacing: 0.12em !important;
	text-transform: uppercase !important;
	color: var(--ink-3) !important;
}
html body .ppvi-app.ppvi-app .ppvi-count {
	font-size: 13px !important;
	color: var(--ink-3) !important;
	font-variant-numeric: tabular-nums !important;
}
html body .ppvi-app.ppvi-app .ppvi-track {
	height: 2px !important;
	background: var(--rule) !important;
	position: relative !important;
	overflow: hidden !important;
}
html body .ppvi-app.ppvi-app .ppvi-track i {
	position: absolute !important;
	inset: 0 auto 0 0 !important;
	background: var(--cyan) !important;
	transition: width 280ms ease !important;
}

/* Type --------------------------------------------------------------- */

/* The serif. One rule for the heading and the in-card question so the two
 * cannot drift,
html body .ppvi-app.ppvi-app prefixed html body so it outranks anything a theme option can
 * emit — Avada's heading typography can arrive as .fusion-body .post-content h2
 * with !important,
html body .ppvi-app.ppvi-app which beats a bare .ppvi-app .ppvi-h on specificity. Every
 * font property is set,
html body .ppvi-app.ppvi-app not just the family,
html body .ppvi-app.ppvi-app because the theme also sets
 * weight and variant on headings. */
html body .ppvi-app.ppvi-app .ppvi-h,
html body .ppvi-app.ppvi-app h2.ppvi-h,
html body .ppvi-app.ppvi-app h3.ppvi-h,
html body .ppvi-app.ppvi-app .ppvi-q,
html body .ppvi-app.ppvi-app p.ppvi-q {
	font-family: var(--serif) !important;
	font-weight: 400 !important;
	font-style: normal !important;
	font-stretch: normal !important;
	font-variant: normal !important;
	font-feature-settings: normal !important;
	font-synthesis: none !important;
	text-transform: none !important;
	text-shadow: none !important;
	color: var(--ink) !important;
}
html body .ppvi-app.ppvi-app .ppvi-h {
	font-size: 29px !important;
	letter-spacing: -0.015em !important;
	line-height: 1.18 !important;
	margin: 0 0 9px !important;
	outline: none !important;
}
html body .ppvi-app.ppvi-app .ppvi-h.lg { font-size: 34px !important; line-height: 1.12 !important; letter-spacing: -0.02em !important; }
html body .ppvi-app.ppvi-app .ppvi-h.sm { font-size: 23px !important; }
html body .ppvi-app.ppvi-app .ppvi-q {
	font-size: 23px !important;
	letter-spacing: -0.01em !important;
	line-height: 1.2 !important;
	margin: 0 0 var(--gap) !important;
}

/* Wordmark ----------------------------------------------------------- */

html body .ppvi-app.ppvi-app .ppvi-mark { display: flex !important; gap: 7px !important; padding: 26px 0 0 !important; }
html body .ppvi-app.ppvi-app .ppvi-mark span {
	font-size: 12px !important;
	font-weight: 600 !important;
	letter-spacing: 0.14em !important;
}
html body .ppvi-app.ppvi-app .ppvi-mark .a { color: var(--cyan) !important; }
html body .ppvi-app.ppvi-app .ppvi-mark .b { color: var(--magenta) !important; }

/* Name rail ---------------------------------------------------------- */

html body .ppvi-app.ppvi-app .ppvi-rail { display: flex !important; gap: 14px !important; flex-wrap: wrap !important; margin: 0 0 var(--gap) !important; }
html body .ppvi-app.ppvi-app .ppvi-rail span { font-size: 13px !important; color: var(--ink-3) !important; }

/* Fields ------------------------------------------------------------- */

html body .ppvi-app.ppvi-app .ppvi-field { margin-bottom: var(--gap) !important; }
html body .ppvi-app.ppvi-app .ppvi-label {
	display: block !important;
	font-size: 13px !important;
	font-weight: 600 !important;
	letter-spacing: 0.04em !important;
	text-transform: uppercase !important;
	color: var(--ink-3) !important;
	margin-bottom: 8px !important;
}
html body .ppvi-app.ppvi-app input[type="text"],
html body .ppvi-app.ppvi-app input[type="tel"],
html body .ppvi-app.ppvi-app input[type="email"],
html body .ppvi-app.ppvi-app select {
	width: 100% !important;
	min-height: var(--h) !important;
	font-size: 17px !important;
	font-family: inherit !important;
	font-weight: 500 !important;
	color: var(--ink) !important;
	background: var(--surface) !important;
	border: 1px solid var(--rule-2) !important;
	border-radius: var(--r) !important;
	padding: 12px var(--pad-x) !important;
	appearance: none !important;
}
html body .ppvi-app.ppvi-app input::placeholder { color: var(--ink-3) !important; font-weight: 400 !important; }
html body .ppvi-app.ppvi-app select {
	background-image: linear-gradient(45deg, transparent 50%, var(--ink-2) 50%), linear-gradient(135deg, var(--ink-2) 50%, transparent 50%) !important;
	background-position: calc(100% - 20px) 25px, calc(100% - 14px) 25px !important;
	background-size: 6px 6px, 6px 6px !important;
	background-repeat: no-repeat !important;
}
html body .ppvi-app.ppvi-app input:focus-visible,
html body .ppvi-app.ppvi-app select:focus-visible,
html body .ppvi-app.ppvi-app button:focus-visible {
	outline: none !important;
	border-color: var(--cyan) !important;
	box-shadow: 0 0 0 4px var(--cyan-wash) !important;
}
html body .ppvi-app.ppvi-app .ppvi-row { display: flex !important; flex-direction: column !important; gap: 0 !important; }
html body .ppvi-app.ppvi-app .ppvi-row > * { min-width: 0 !important; }

html body .ppvi-app.ppvi-app .ppvi-dob { display: flex !important; gap: 10px !important; }
html body .ppvi-app.ppvi-app .ppvi-dob select { min-width: 0 !important; padding-left: var(--pad-x) !important; padding-right: 34px !important; }
html body .ppvi-app.ppvi-app .ppvi-dob select:nth-child(1) { flex: 1.6 !important; }
html body .ppvi-app.ppvi-app .ppvi-dob select:nth-child(2) { flex: 0.9 !important; }
html body .ppvi-app.ppvi-app .ppvi-dob select:nth-child(3) { flex: 1.1 !important; }

html body .ppvi-app.ppvi-app span.ppvi-label { display: block !important; }

/* Buttons ------------------------------------------------------------ */

html body .ppvi-app.ppvi-app .ppvi-btn {
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	gap: 10px !important;
	width: 100% !important;
	min-height: var(--h) !important;
	font-size: 17px !important;
	font-weight: 600 !important;
	font-family: inherit !important;
	letter-spacing: -0.01em !important;
	color: var(--ink) !important;
	background: var(--surface) !important;
	border: 1px solid var(--rule-2) !important;
	border-radius: var(--r) !important;
	padding: 14px var(--pad-x) !important;
	cursor: pointer !important;
	transition: transform 90ms ease, background 120ms ease !important;
}
html body .ppvi-app.ppvi-app .ppvi-btn.primary {
	background: var(--ink) !important;
	border-color: var(--ink) !important;
	color: #fff !important;
}
html body .ppvi-app.ppvi-app .ppvi-btn.ghost {
	border-color: transparent !important;
	background: none !important;
	color: var(--ink-2) !important;
	font-weight: 500 !important;
	min-height: 48px !important;
}
html body .ppvi-app.ppvi-app .ppvi-btn:active { transform: scale(0.985) !important; }
html body .ppvi-app.ppvi-app .ppvi-btn[disabled] { opacity: 0.4 !important; }
html body .ppvi-app.ppvi-app .ppvi-btn .spin {
	width: 18px; height: 18px !important;
	border: 2px solid rgba(255,255,255,0.4) !important;
	border-top-color: #fff !important;
	border-radius: 50% !important;
	animation: ppvi-spin 700ms linear infinite !important;
}
@keyframes ppvi-spin { to { transform: rotate(360deg); } }

/* Two-option answers ------------------------------------------------- */

html body .ppvi-app.ppvi-app .ppvi-pair { display: flex !important; gap: var(--gap-sm) !important; margin-bottom: var(--gap) !important; }
html body .ppvi-app.ppvi-app .ppvi-opt {
	flex: 1 !important;
	min-width: 0 !important;
	min-height: var(--h-row) !important;
	font-family: inherit !important;
	font-size: 17px !important;
	font-weight: 600 !important;
	letter-spacing: -0.01em !important;
	color: var(--ink) !important;
	background: var(--surface) !important;
	border: 1px solid var(--rule-2) !important;
	border-radius: var(--r) !important;
	padding: 10px var(--pad-x) !important;
	cursor: pointer !important;
	transition: background 120ms ease, border-color 120ms ease !important;
}
html body .ppvi-app.ppvi-app .ppvi-opt.on {
	background: var(--cyan) !important;
	border-color: var(--cyan) !important;
	color: #fff !important;
}
html body .ppvi-app.ppvi-app .ppvi-opt:active { transform: scale(0.985) !important; }

/* Lists — people,
html body .ppvi-app.ppvi-app uploads,
html body .ppvi-app.ppvi-app anything chosen from a set ----------------- */

html body .ppvi-app.ppvi-app .ppvi-list-group { border-top: 1px solid var(--rule) !important; margin-bottom: var(--gap-lg) !important; }

html body .ppvi-app.ppvi-app .ppvi-chip {
	display: flex !important;
	align-items: center !important;
	gap: 14px !important;
	width: 100% !important;
	min-height: var(--h-row) !important;
	text-align: left !important;
	font-size: 18px !important;
	font-family: inherit !important;
	color: var(--ink) !important;
	background: none !important;
	border: none !important;
	border-bottom: 1px solid var(--rule) !important;
	border-radius: 0 !important;
	padding: 10px 0 !important;
	cursor: pointer !important;
}
html body .ppvi-app.ppvi-app .ppvi-chip .who { flex: 1 !important; }
html body .ppvi-app.ppvi-app .ppvi-chip .age { font-size: 14px !important; color: var(--ink-3) !important; }
html body .ppvi-app.ppvi-app .ppvi-chip .mark {
	width: 22px; height: 22px; flex: none !important;
	border: 1.5px solid var(--rule-2) !important;
	border-radius: 50% !important;
	display: flex; align-items: center; justify-content: center !important;
	font-size: 13px; line-height: 1 !important;
	color: transparent !important;
	order: 3 !important;
}
html body .ppvi-app.ppvi-app .ppvi-chip[aria-pressed="true"] .who { font-weight: 600 !important; }
html body .ppvi-app.ppvi-app .ppvi-chip[aria-pressed="true"] .mark {
	border-color: var(--cyan) !important;
	background: var(--cyan) !important;
	color: #fff !important;
}

html body .ppvi-app.ppvi-app .ppvi-done-row {
	display: flex !important;
	align-items: center !important;
	gap: 12px !important;
	min-height: var(--h-row) !important;
	border-bottom: 1px solid var(--rule) !important;
	padding: 10px 0 !important;
}
html body .ppvi-app.ppvi-app .ppvi-done-who { display: flex !important; flex-direction: column !important; min-width: 0 !important; flex: 1 !important; }
html body .ppvi-app.ppvi-app .ppvi-done-who .who { font-size: 18px !important; font-weight: 600 !important; letter-spacing: -0.01em !important; }
html body .ppvi-app.ppvi-app .ppvi-done-who .meta { font-size: 14px !important; color: var(--ink-2) !important; }
html body .ppvi-app.ppvi-app .ppvi-linkbtn {
	flex: none !important;
	min-height: 44px !important;
	font-family: inherit !important;
	font-size: 16px !important;
	font-weight: 600 !important;
	color: var(--cyan-ink) !important;
	background: none !important;
	border: none !important;
	padding: 8px 0 !important;
	cursor: pointer !important;
}

/* Incentive claim page: an employee row is a label wrapping a radio ------- */
html body .ppvi-app.ppvi-app label.ppvi-chip { display: flex !important; }
html body .ppvi-app.ppvi-app label.ppvi-chip:has(input:checked) .who { font-weight: 600 !important; }
html body .ppvi-app.ppvi-app a.ppvi-btn { text-decoration: none !important; }

/* Leaderboard: sized for a screen across a room ----------------------- */
html body .ppvi-app.ppvi-app.ppvi-board { max-width: 760px !important; }
html body .ppvi-app.ppvi-app .ppvi-board-row { min-height: 78px !important; gap: 18px !important; }
html body .ppvi-app.ppvi-app .ppvi-board-row .who { font-size: 24px !important; }
html body .ppvi-app.ppvi-app .ppvi-board-rank {
	width: 40px !important; flex: none !important;
	font-family: var(--serif) !important; font-size: 28px !important; color: var(--ink-3) !important;
	text-align: center !important;
}
html body .ppvi-app.ppvi-app .ppvi-board-row.lead .ppvi-board-rank { color: var(--cyan) !important; }
html body .ppvi-app.ppvi-app .ppvi-board-n {
	font-size: 34px !important; font-weight: 600 !important; letter-spacing: -0.02em !important;
	font-variant-numeric: tabular-nums !important; min-width: 64px !important; text-align: right !important;
}
html body .ppvi-app.ppvi-app .ppvi-board-bar {
	display: block !important; height: 4px !important; margin-top: 8px !important;
	background: var(--rule) !important; border-radius: 2px !important; overflow: hidden !important;
}
html body .ppvi-app.ppvi-app .ppvi-board-bar i { display: block !important; height: 100% !important; background: var(--cyan) !important; }

html body .ppvi-app.ppvi-app .ppvi-board-rank { font-size: 26px !important; }

/* Team goal ------------------------------------------------------------ */
html body .ppvi-app.ppvi-app .ppvi-goal { margin: 0 0 26px !important; }
html body .ppvi-app.ppvi-app .ppvi-goal-head { display: flex !important; justify-content: space-between !important; font-size: 16px !important; color: var(--ink-2) !important; margin-bottom: 10px !important; }
html body .ppvi-app.ppvi-app .ppvi-goal-track { position: relative !important; height: 14px !important; background: var(--rule) !important; border-radius: 7px !important; overflow: visible !important; }
html body .ppvi-app.ppvi-app .ppvi-goal-track i { display: block !important; height: 100% !important; background: linear-gradient(90deg, var(--cyan), var(--magenta)) !important; border-radius: 7px !important; transition: width 600ms ease !important; }
html body .ppvi-app.ppvi-app .ppvi-goal-rocket { position: absolute !important; top: -16px !important; margin-left: -14px !important; font-size: 28px !important; line-height: 1 !important; }

/* Rockets on the bars,
html body .ppvi-app.ppvi-app movement arrows,
html body .ppvi-app.ppvi-app today badges ------------------ */
html body .ppvi-app.ppvi-app .ppvi-board-bar { position: relative !important; overflow: visible !important; }
html body .ppvi-app.ppvi-app .ppvi-board-ship { position: absolute !important; top: -13px !important; margin-left: -10px !important; font-size: 20px !important; line-height: 1 !important; }
html body .ppvi-app.ppvi-app .ppvi-move { font-size: 13px !important; margin-left: 6px !important; }
html body .ppvi-app.ppvi-app .ppvi-move.up { color: var(--good) !important; }
html body .ppvi-app.ppvi-app .ppvi-move.down { color: var(--magenta) !important; }
html body .ppvi-app.ppvi-app .ppvi-today { display: inline-block !important; font-size: 13px !important; font-weight: 600 !important; color: var(--cyan-ink) !important; background: var(--cyan-wash) !important; border-radius: 999px !important; padding: 2px 9px !important; margin-left: 8px !important; vertical-align: middle !important; }

/* Shout-outs and confetti --------------------------------------------- */
html body .ppvi-app.ppvi-app .ppvi-shout { font-family: var(--serif) !important; font-size: 24px !important; color: var(--magenta-ink) !important; background: var(--magenta-wash) !important; border-radius: var(--r) !important; padding: 14px 18px !important; margin: 0 0 14px !important; animation: ppvi-pop 500ms cubic-bezier(.2,1.4,.4,1) both !important; }
@keyframes ppvi-pop { from { transform: scale(0.92); opacity: 0; } to { transform: none; opacity: 1; } }
html body .ppvi-app.ppvi-app.ppvi-celebrate { position: relative !important; overflow: hidden !important; }
html body .ppvi-app.ppvi-app .ppvi-confetti { position: absolute !important; inset: 0 !important; pointer-events: none !important; z-index: 2 !important; }
html body .ppvi-app.ppvi-app .ppvi-confetti i { position: absolute !important; top: -12px !important; width: 8px !important; height: 14px !important; border-radius: 2px !important; animation: ppvi-fall 3.2s linear infinite !important; }
@keyframes ppvi-fall { to { transform: translateY(110vh) rotate(540deg); opacity: 0.2; } }

/* About-you: one rhythm from the heading down. The signer row is a bounded
 * group with room after it; every field is a fixed distance from the next;
 * a select and the label after it never crowd. */
html body .ppvi-app.ppvi-app .ppvi-signer { margin-bottom: var(--gap-lg) !important; }
html body .ppvi-app.ppvi-app .ppvi-signer .ppvi-done-row { min-height: 72px !important; }
html body .ppvi-app.ppvi-app .ppvi-signer .meta { line-height: 1.45 !important; margin-top: 2px !important; }
html body .ppvi-app.ppvi-app .ppvi-field { margin-bottom: 24px !important; }
html body .ppvi-app.ppvi-app .ppvi-field:last-of-type { margin-bottom: var(--gap) !important; }
html body .ppvi-app.ppvi-app .ppvi-rail { margin: 0 0 22px !important; }

/* Outcome cards — the one place a box is still right ------------------ */

html body .ppvi-app.ppvi-app .ppvi-card {
	border-radius: var(--r) !important;
	padding: var(--pad-x) !important;
	margin-bottom: var(--gap-sm) !important;
	background: var(--surface) !important;
	border: 1px solid var(--rule) !important;
}
html body .ppvi-app.ppvi-app .ppvi-card h4 { margin: 0 0 4px !important; font-size: 18px !important; font-weight: 600 !important; line-height: 1.3 !important; letter-spacing: -0.01em !important; }
html body .ppvi-app.ppvi-app .ppvi-card p { margin: 0 !important; font-size: 15px !important; line-height: 1.5 !important; color: var(--ink-2) !important; }
html body .ppvi-app.ppvi-app .ppvi-card.good { border-color: #B6DECD !important; background: var(--good-wash) !important; }
html body .ppvi-app.ppvi-app .ppvi-card.good h4,
html body .ppvi-app.ppvi-app .ppvi-card.good p { color: var(--good) !important; }
html body .ppvi-app.ppvi-app .ppvi-card.attention { border-color: var(--magenta) !important; background: var(--magenta-wash) !important; }
html body .ppvi-app.ppvi-app .ppvi-card.attention h4,
html body .ppvi-app.ppvi-app .ppvi-card.attention p { color: var(--magenta-ink) !important; }

html body .ppvi-app.ppvi-app .ppvi-edit { padding: 0 !important; margin-bottom: var(--gap) !important; }
html body .ppvi-app.ppvi-app .ppvi-sep { height: 1px !important; background: var(--rule) !important; margin: var(--gap-lg) 0 !important; }

/* Consent + signature ------------------------------------------------ */

html body .ppvi-app.ppvi-app .ppvi-consent { border-top: 1px solid var(--rule) !important; padding: var(--gap) 0 4px !important; }
html body .ppvi-app.ppvi-app .ppvi-consent:first-of-type { border-top: none !important; }
html body .ppvi-app.ppvi-app .ppvi-consent h4 { margin: 0 0 8px !important; font-size: 17px !important; font-weight: 600 !important; line-height: 1.3 !important; }
html body .ppvi-app.ppvi-app .ppvi-consent p { margin: 0 0 14px !important; font-size: 15px !important; color: var(--ink-2) !important; line-height: 1.6 !important; }
html body .ppvi-app.ppvi-app .ppvi-agree {
	display: flex; align-items: center; gap: 12px !important;
	min-height: 48px; cursor: pointer !important;
	font-size: 16px; font-weight: 600 !important;
}
html body .ppvi-app.ppvi-app .ppvi-agree input { width: 24px !important; height: 24px !important; accent-color: var(--cyan) !important; flex: none !important; }

html body .ppvi-app.ppvi-app .ppvi-sigwrap {
	border: 1px dashed var(--rule-2) !important;
	border-radius: var(--r) !important;
	background: var(--surface) !important;
	margin-bottom: 10px !important;
	position: relative !important;
}
html body .ppvi-app.ppvi-app .ppvi-sigwrap::after {
	content: attr(data-hint) !important;
	position: absolute !important;
	left: 0; right: 0; bottom: 14px !important;
	text-align: center !important;
	font-size: 14px !important;
	color: var(--ink-3) !important;
	pointer-events: none !important;
}
html body .ppvi-app.ppvi-app .ppvi-sigwrap.signed::after { content: none !important; }
html body .ppvi-app.ppvi-app .ppvi-sig { display: block !important; width: 100% !important; height: 180px !important; touch-action: none !important; border-radius: var(--r) !important; }

/* Confirmation ------------------------------------------------------- */

html body .ppvi-app.ppvi-app .ppvi-tick {
	width: 34px; height: 34px !important;
	border-radius: 50% !important;
	background: var(--cyan) !important;
	color: #fff !important;
	display: flex; align-items: center; justify-content: center !important;
	font-size: 18px !important;
	margin: 30px 0 22px !important;
}

/* Action bar --------------------------------------------------------- */

html body .ppvi-app.ppvi-app .ppvi-bar {
	width: auto !important;
	position: sticky !important;
	bottom: 0 !important;
	background: linear-gradient(to top, var(--paper) 84%, transparent) !important;
	padding: 18px var(--gutter) calc(16px + env(safe-area-inset-bottom)) !important;
	margin: 0 calc(var(--gutter) * -1) !important;
	z-index: 5 !important;
	display: flex !important;
	flex-direction: column !important;
	gap: 8px !important;
}

/* Notices ------------------------------------------------------------ */

.ppvi-errorslot:empty { display: none !important; }
html body .ppvi-app.ppvi-app .ppvi-error {
	color: var(--magenta-ink) !important;
	background: var(--magenta-wash) !important;
	border-radius: var(--r-sm) !important;
	padding: 12px var(--pad-x) !important;
	font-size: 15px !important;
	font-weight: 500 !important;
	margin: 14px 0 0 !important;
}
html body .ppvi-app.ppvi-app .ppvi-error .ppvi-linkbtn {
	color: var(--magenta-ink) !important;
	text-decoration: underline !important;
	min-height: 0 !important;
	font-size: 15px !important;
}
html body .ppvi-app.ppvi-app .ppvi-note { color: var(--ink-3) !important; font-size: 14px !important; line-height: 1.55 !important; margin: 14px 0 0 !important; }
html body .ppvi-app.ppvi-app .ppvi-hidden { display: none !important; }
html body .ppvi-app.ppvi-app .ppvi-sr { position: absolute !important; width: 1px !important; height: 1px !important; overflow: hidden !important; clip: rect(0 0 0 0) !important; }

/* Skeleton ----------------------------------------------------------- */

html body .ppvi-app.ppvi-app .ppvi-skeleton { padding-top: 34px !important; }
html body .ppvi-app.ppvi-app .ppvi-skeleton span {
	display: block !important;
	height: 14px !important;
	margin-bottom: 14px !important;
	border-radius: 7px !important;
	background: var(--rule) !important;
	animation: ppvi-pulse 1.4s ease-in-out infinite !important;
}
html body .ppvi-app.ppvi-app .ppvi-skeleton span.block { height: 58px !important; border-radius: var(--r) !important; }
@keyframes ppvi-pulse { 0%,
100% { opacity: 1; } 50% { opacity: 0.55; } }

/* No prefers-color-scheme block,
html body .ppvi-app.ppvi-app deliberately.
 *
 html body .ppvi-app.ppvi-app * The form paints its own background,
html body .ppvi-app.ppvi-app so honouring the device's dark mode on a
 * light site produces a dark rectangle sitting on a white page rather than a
 html body .ppvi-app.ppvi-app * dark page. pediatricpeople.com has no dark mode,
html body .ppvi-app.ppvi-app so the form follows the
 html body .ppvi-app.ppvi-app * site. If the site ever gains one,
html body .ppvi-app.ppvi-app re-add the overrides here and key them to
 * the site's own theme class rather than the OS setting. */

@media (prefers-reduced-motion: reduce) {
	html body .ppvi-app.ppvi-app *,
html body .ppvi-app.ppvi-app *::before,
html body .ppvi-app.ppvi-app *::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
	}
	html body .ppvi-app.ppvi-app > * { animation: none !important; }
	html body .ppvi-app.ppvi-app .ppvi-confetti { display: none !important; }
	html body .ppvi-app.ppvi-app .ppvi-shout { animation: none !important; }
}

/* Wall-screen leaderboard v2 --------------------------------------------
 * Sizes use clamp() so a 1080p wall gets larger type without a setting. */
html body .ppvi-app.ppvi-app.ppvi-board { position: relative !important; overflow: hidden !important; max-width: 1100px !important; padding: 34px 40px 40px !important; border-radius: 16px !important; min-height: 60vh !important; }
html body .ppvi-app.ppvi-app.ppvi-board-dark { --ink: #EAF2F8 !important; --ink-2: #A9BACB !important; --ink-3: #7F93A6 !important; --paper: #0B1420 !important; --surface: #0F1E2F !important; --rule: #1E2F44 !important; --rule-2: #2A3D55 !important; background: #0B1420 !important; color: #EAF2F8 !important; }
html body .ppvi-app.ppvi-app.ppvi-board-light { background: var(--paper) !important; }
html body .ppvi-app.ppvi-app .ppvi-board-in { position: relative !important; z-index: 1 !important; }

html body .ppvi-app.ppvi-app .ppvi-stars { position: absolute !important; inset: 0 !important; pointer-events: none !important; z-index: 0 !important; }
html body .ppvi-app.ppvi-app.ppvi-board-light .ppvi-stars { display: none !important; }
html body .ppvi-app.ppvi-app .ppvi-stars i { position: absolute !important; border-radius: 50% !important; background: #fff !important; opacity: .55 !important; animation: ppvi-twinkle 3.6s ease-in-out infinite !important; }
@keyframes ppvi-twinkle { 0%, 100% { opacity: .25; } 50% { opacity: .8; } }

html body .ppvi-app.ppvi-app .ppvi-bhead { display: flex !important; justify-content: space-between !important; align-items: baseline !important; }
html body .ppvi-app.ppvi-app .ppvi-bhead .ppvi-mark { padding: 0 !important; }
html body .ppvi-app.ppvi-app .ppvi-bhead .upd { font-size: 13px !important; color: var(--ink-3) !important; }
html body .ppvi-app.ppvi-app .ppvi-btitle { font-size: clamp(30px, 3.2vw, 46px) !important; line-height: 1.05 !important; margin: 28px 0 8px !important; }
html body .ppvi-app.ppvi-app .ppvi-pace { font-size: clamp(15px, 1.3vw, 19px) !important; color: var(--ink-2) !important; margin: 0 0 22px !important; line-height: 1.5 !important; }
html body .ppvi-app.ppvi-app .ppvi-pace b { color: var(--ink) !important; }
html body .ppvi-app.ppvi-app .ppvi-pace .hot { color: #5ED3FF !important; }
html body .ppvi-app.ppvi-app .ppvi-pace .flame { color: #FFB020 !important; }
html body .ppvi-app.ppvi-app .ppvi-pace .behind { color: var(--magenta) !important; }

/* Mission track. Labels anchor to their own end at the edges so nothing clips. */
html body .ppvi-app.ppvi-app .ppvi-next { font-size: 14px !important; color: #5ED3FF !important; margin: 0 0 8px !important; }
html body .ppvi-app.ppvi-app .ppvi-track2 { position: relative !important; height: 64px !important; margin: 0 20px 26px !important; }
html body .ppvi-app.ppvi-app .ppvi-track2 .rail { position: absolute !important; left: 0 !important; right: 0 !important; top: 26px !important; height: 3px !important; background: var(--rule) !important; border-radius: 2px !important; }
html body .ppvi-app.ppvi-app .ppvi-track2 .fill { position: absolute !important; left: 0 !important; top: 26px !important; height: 3px !important; background: linear-gradient(90deg, var(--cyan), var(--magenta)) !important; border-radius: 2px !important; transition: width 900ms ease !important; }
html body .ppvi-app.ppvi-app .ppvi-track2 .ship { position: absolute !important; top: 4px !important; margin-left: -15px !important; font-size: 30px !important; line-height: 1 !important; transition: left 900ms ease !important; z-index: 2 !important; }
html body .ppvi-app.ppvi-app .ppvi-track2 .stop { position: absolute !important; top: 18px !important; margin-left: -9px !important; }
html body .ppvi-app.ppvi-app .ppvi-track2 .stop i { display: block !important; width: 18px !important; height: 18px !important; border-radius: 50% !important; opacity: .45 !important; box-shadow: 0 0 0 4px rgba(255,255,255,.06) !important; }
html body .ppvi-app.ppvi-app .ppvi-track2 .stop.reached i { opacity: 1 !important; }
html body .ppvi-app.ppvi-app .ppvi-track2 .stop.goal i { width: 24px !important; height: 24px !important; margin: -3px 0 0 -3px !important; }
html body .ppvi-app.ppvi-app .ppvi-track2 .stop em { position: absolute !important; top: 26px !important; left: 9px !important; transform: translateX(-50%) !important; font-style: normal !important; font-size: 12px !important; color: var(--ink-3) !important; white-space: nowrap !important; }
html body .ppvi-app.ppvi-app .ppvi-track2 .stop em.end { transform: translateX(-100%) !important; left: 12px !important; color: #FFB020 !important; }
html body .ppvi-app.ppvi-app .ppvi-track2 .stop.reached em { color: var(--ink-2) !important; }

/* Rows: name + count on line one, badges beneath, then the bar. */
html body .ppvi-app.ppvi-app .ppvi-bgrid { display: grid !important; grid-template-columns: 1fr 260px !important; gap: 26px !important; }
html body .ppvi-app.ppvi-app .ppvi-brows { border-top: 1px solid var(--rule) !important; }
html body .ppvi-app.ppvi-app .ppvi-brow { display: flex !important; align-items: center !important; gap: 16px !important; padding: 12px 0 !important; border-bottom: 1px solid var(--rule) !important; }
html body .ppvi-app.ppvi-app .ppvi-brow .rk { width: 40px !important; flex: none !important; text-align: center !important; font-size: clamp(22px, 2vw, 30px) !important; color: var(--ink-3) !important; }
html body .ppvi-app.ppvi-app .ppvi-brow .mid { flex: 1 !important; min-width: 0 !important; }
html body .ppvi-app.ppvi-app .ppvi-brow .line1 { display: flex !important; align-items: baseline !important; justify-content: space-between !important; gap: 12px !important; }
html body .ppvi-app.ppvi-app .ppvi-brow .nm { font-size: clamp(20px, 1.9vw, 28px) !important; font-weight: 600 !important; letter-spacing: -.01em !important; }
html body .ppvi-app.ppvi-app .ppvi-brow .n { font-size: clamp(30px, 2.8vw, 42px) !important; font-weight: 600 !important; letter-spacing: -.02em !important; font-variant-numeric: tabular-nums !important; }
html body .ppvi-app.ppvi-app .ppvi-brow .line2 { display: flex !important; flex-wrap: wrap !important; gap: 8px 14px !important; margin: 2px 0 4px !important; font-size: 13px !important; }
html body .ppvi-app.ppvi-app .ppvi-brow .b-today { color: #5ED3FF !important; background: rgba(0,174,239,.14) !important; border-radius: 999px !important; padding: 2px 9px !important; font-weight: 600 !important; }
html body .ppvi-app.ppvi-app .ppvi-brow .b-streak { color: #FFB020 !important; font-weight: 600 !important; }
html body .ppvi-app.ppvi-app .ppvi-brow .b-gap { color: var(--ink-3) !important; }
html body .ppvi-app.ppvi-app .ppvi-brow .b-move.up { color: #3ED598 !important; }
html body .ppvi-app.ppvi-app .ppvi-brow .b-move.down { color: var(--magenta) !important; }
html body .ppvi-app.ppvi-app .ppvi-brow .bar { position: relative !important; height: 3px !important; margin-top: 8px !important; background: var(--rule) !important; border-radius: 2px !important; }
html body .ppvi-app.ppvi-app .ppvi-brow .bar i { display: block !important; height: 100% !important; background: var(--cyan) !important; border-radius: 2px !important; transition: width 900ms ease !important; }
html body .ppvi-app.ppvi-app .ppvi-brow .bar .ship { position: absolute !important; top: -13px !important; margin-left: -10px !important; font-size: 20px !important; line-height: 1 !important; transition: left 900ms ease !important; }

html body .ppvi-app.ppvi-app .ppvi-bside { display: flex !important; flex-direction: column !important; gap: 14px !important; }
html body .ppvi-app.ppvi-app .ppvi-bside .panel { background: var(--surface) !important; border: 1px solid var(--rule) !important; border-radius: 12px !important; padding: 14px 16px !important; }
html body .ppvi-app.ppvi-app .ppvi-bside .eyebrow { font-size: 11px !important; font-weight: 700 !important; letter-spacing: .14em !important; text-transform: uppercase !important; color: var(--ink-3) !important; margin: 0 0 8px !important; }
html body .ppvi-app.ppvi-app .ppvi-bside .kv { display: flex !important; justify-content: space-between !important; font-size: 16px !important; padding: 4px 0 !important; }
html body .ppvi-app.ppvi-app .ppvi-bside .big { font-size: 17px !important; margin: 0 !important; line-height: 1.4 !important; }

html body .ppvi-app.ppvi-app .ppvi-shouts { margin: 0 0 16px !important; }
html body .ppvi-app.ppvi-app .ppvi-board .ppvi-shout { background: rgba(236,0,140,.14) !important; color: #FF7AC3 !important; }
html body .ppvi-app.ppvi-app .ppvi-confetti-live { position: absolute !important; inset: 0 !important; pointer-events: none !important; z-index: 3 !important; }
html body .ppvi-app.ppvi-app .ppvi-confetti-live i { position: absolute !important; top: -12px !important; width: 8px !important; height: 14px !important; border-radius: 2px !important; animation: ppvi-fall 3.2s linear 2 !important; }

@media (max-width: 760px) {
	html body .ppvi-app.ppvi-app .ppvi-bgrid { grid-template-columns: 1fr !important; }
	html body .ppvi-app.ppvi-app.ppvi-board { padding: 24px 20px 30px !important; }
}
@media (max-width: 600px) {
	html body .ppvi-app.ppvi-app .ppvi-track2 .stop em { display: none !important; }
}

/* Leaderboard motion. Everything here is tied to an event: a gain, an
 * overtake, a new leader. Idle motion is limited to the track rocket's bob
 * and the occasional shooting star. All of it is off under reduced motion. */
html body .ppvi-app.ppvi-app .ppvi-track2 .ship { animation: ppvi-bob 3.2s ease-in-out infinite !important; }
@keyframes ppvi-bob { 0%, 100% { transform: translateY(0) rotate(-6deg); } 50% { transform: translateY(-4px) rotate(-3deg); } }

html body .ppvi-app.ppvi-app .ppvi-brow { position: relative !important; will-change: transform !important; }
html body .ppvi-app.ppvi-app .ppvi-brow.gained { animation: ppvi-glow 2.4s ease-out !important; }
@keyframes ppvi-glow { 0% { background: rgba(0,174,239,.22); } 100% { background: transparent; } }
html body .ppvi-app.ppvi-app .ppvi-brow.gained .n { color: #5ED3FF !important; transition: color 1.2s ease 1.2s !important; }

/* The rocket kicks: a quick lean, a flame behind it, then settles. */
html body .ppvi-app.ppvi-app .ppvi-brow .bar .ship { display: inline-block !important; transform-origin: 60% 50% !important; }
html body .ppvi-app.ppvi-app .ppvi-brow.boost .bar .ship { animation: ppvi-kick 900ms cubic-bezier(.2,1.4,.4,1) !important; }
html body .ppvi-app.ppvi-app .ppvi-brow.boost-big .bar .ship { animation: ppvi-kick 900ms cubic-bezier(.2,1.4,.4,1) 2 !important; }
@keyframes ppvi-kick { 0% { transform: rotate(0) scale(1); } 30% { transform: rotate(-18deg) scale(1.35); } 100% { transform: rotate(0) scale(1); } }
html body .ppvi-app.ppvi-app .ppvi-brow.boost .bar .ship::after,
html body .ppvi-app.ppvi-app .ppvi-brow.boost-big .bar .ship::after {
	content: "" !important; position: absolute !important; left: -22px !important; top: 9px !important; width: 22px !important; height: 5px !important;
	border-radius: 3px !important; background: linear-gradient(90deg, transparent, #FFB020, #FF5A1F) !important;
	animation: ppvi-flame 900ms ease-out !important; opacity: 0 !important;
}
html body .ppvi-app.ppvi-app .ppvi-brow.boost-big .bar .ship::after { width: 34px !important; left: -34px !important; }
@keyframes ppvi-flame { 0% { opacity: 0; transform: scaleX(.2); } 25% { opacity: 1; transform: scaleX(1); } 100% { opacity: 0; transform: scaleX(1.4); } }

/* Overtakes: the row that moved up gets a green edge for a moment. */
html body .ppvi-app.ppvi-app .ppvi-brow.overtook { box-shadow: inset 4px 0 0 #3ED598 !important; transition: box-shadow 2s ease 1s !important; }
html body .ppvi-app.ppvi-app .ppvi-brow.overtaken { box-shadow: inset 4px 0 0 rgba(236,0,140,.55) !important; transition: box-shadow 2s ease 1s !important; }

/* New leader: the medal pulses and the row lifts. */
html body .ppvi-app.ppvi-app .ppvi-brow.new-leader .rk { animation: ppvi-crown 1.2s cubic-bezier(.2,1.4,.4,1) 3 !important; }
@keyframes ppvi-crown { 0%, 100% { transform: scale(1) rotate(0); } 40% { transform: scale(1.5) rotate(-12deg); } 70% { transform: scale(1.3) rotate(8deg); } }
html body .ppvi-app.ppvi-app .ppvi-brow.new-leader { animation: ppvi-lift 4s ease-out !important; }
@keyframes ppvi-lift { 0% { background: rgba(255,176,32,.25); } 100% { background: transparent; } }

html body .ppvi-app.ppvi-app .ppvi-shout.fade { opacity: 0 !important; transition: opacity 800ms ease !important; }

/* Shooting star: a short streak that crosses and fades. */
html body .ppvi-app.ppvi-app .ppvi-stars .shoot { position: absolute !important; width: 90px !important; height: 2px !important; border-radius: 2px !important;
	background: linear-gradient(90deg, transparent, #fff) !important; transform: rotate(-25deg) !important; animation: ppvi-shoot 1.4s ease-out forwards !important; }
@keyframes ppvi-shoot { 0% { opacity: 0; transform: translate(0,0) rotate(-25deg); } 15% { opacity: 1; } 100% { opacity: 0; transform: translate(220px, -100px) rotate(-25deg); } }

@media (prefers-reduced-motion: reduce) {
	html body .ppvi-app.ppvi-app .ppvi-track2 .ship,
	html body .ppvi-app.ppvi-app .ppvi-brow.boost .bar .ship,
	html body .ppvi-app.ppvi-app .ppvi-brow.boost-big .bar .ship,
	html body .ppvi-app.ppvi-app .ppvi-brow.new-leader .rk,
	html body .ppvi-app.ppvi-app .ppvi-brow.gained,
	html body .ppvi-app.ppvi-app .ppvi-brow.new-leader,
	html body .ppvi-app.ppvi-app .ppvi-stars i,
	html body .ppvi-app.ppvi-app .ppvi-stars .shoot { animation: none !important; }
}

/* Always-on motion for the wall screen. Thrusters flicker behind every
 * rocket, the next stop breathes, rows arrive in sequence on launch, and a
 * gain bursts. Still nothing under reduced motion. */
html body .ppvi-app.ppvi-app .ppvi-brow .bar .ship::before,
html body .ppvi-app.ppvi-app .ppvi-track2 .ship::before {
	content: "" !important; position: absolute !important; top: 55% !important; right: 88% !important; width: 16px !important; height: 4px !important;
	border-radius: 2px !important; background: linear-gradient(90deg, transparent, #FFB020 60%, #FF5A1F) !important;
	transform-origin: right center !important; animation: ppvi-thrust 240ms ease-in-out infinite alternate !important; opacity: .9 !important;
}
html body .ppvi-app.ppvi-app .ppvi-track2 .ship::before { width: 26px !important; height: 6px !important; top: 60% !important; }
@keyframes ppvi-thrust { from { transform: scaleX(.55); opacity: .6; } to { transform: scaleX(1.15); opacity: 1; } }

/* Launch: rows and panels arrive; bars and rockets travel out. */
html body .ppvi-app.ppvi-app .arrive { animation: ppvi-arrive 520ms cubic-bezier(.2,.9,.3,1) both !important; }
@keyframes ppvi-arrive { from { opacity: 0; transform: translateX(-24px); } to { opacity: 1; transform: none; } }
html body .ppvi-app.ppvi-app.launching .bar i,
html body .ppvi-app.ppvi-app.launching .ppvi-track2 .fill { transition: width 1500ms cubic-bezier(.2,.8,.2,1) !important; }
html body .ppvi-app.ppvi-app.launching .ship { transition: left 1500ms cubic-bezier(.2,.8,.2,1) !important; }
html body .ppvi-app.ppvi-app .ship.flying::before { width: 40px !important; animation: ppvi-thrust 120ms ease-in-out infinite alternate !important; }

/* The next stop pulses. */
html body .ppvi-app.ppvi-app .ppvi-track2 .stop.next i { animation: ppvi-breathe 2.2s ease-in-out infinite !important; opacity: .85 !important; }
@keyframes ppvi-breathe { 0%, 100% { transform: scale(1); box-shadow: 0 0 0 4px rgba(255,255,255,.06); } 50% { transform: scale(1.35); box-shadow: 0 0 0 10px rgba(0,174,239,.18); } }

/* A gain: a ring bursts out of the number and a "+N" floats up. */
html body .ppvi-app.ppvi-app .ppvi-brow .n { position: relative !important; }
html body .ppvi-app.ppvi-app .ppvi-brow .n .burst { position: absolute !important; left: 50% !important; top: 50% !important; width: 20px !important; height: 20px !important; margin: -10px 0 0 -10px !important;
	border: 3px solid #5ED3FF !important; border-radius: 50% !important; animation: ppvi-burst 900ms ease-out forwards !important; pointer-events: none !important; }
@keyframes ppvi-burst { from { transform: scale(.4); opacity: 1; } to { transform: scale(4.5); opacity: 0; } }
html body .ppvi-app.ppvi-app .ppvi-brow .n .plus { position: absolute !important; right: 0 !important; top: -14px !important; font-size: 18px !important; color: #3ED598 !important; font-weight: 700 !important;
	animation: ppvi-float 1.6s ease-out forwards !important; pointer-events: none !important; }
@keyframes ppvi-float { from { transform: translateY(0); opacity: 1; } to { transform: translateY(-34px); opacity: 0; } }

@media (prefers-reduced-motion: reduce) {
	html body .ppvi-app.ppvi-app .ppvi-brow .bar .ship::before,
	html body .ppvi-app.ppvi-app .ppvi-track2 .ship::before,
	html body .ppvi-app.ppvi-app .arrive,
	html body .ppvi-app.ppvi-app .ppvi-track2 .stop.next i,
	html body .ppvi-app.ppvi-app .ppvi-brow .n .burst,
	html body .ppvi-app.ppvi-app .ppvi-brow .n .plus { animation: none !important; }
}
