.r2r-quiz { width:100%; min-width:0; position:relative; }
.r2r-quiz *, .r2r-quiz *::before, .r2r-quiz *::after { box-sizing:border-box; }
.r2r-quiz [hidden] { display:none !important; }
.r2r-screen { display:flex; flex-direction:column; min-height:100vh; min-height:100dvh; }
.r2r-screen--custom > * { flex:1 0 auto; }
/* The toolbar and navigation overlay the screen; padding keeps content clear of their measured heights. */
.r2r-screen--default, .r2r-screen--intro, .r2r-screen--result { background:linear-gradient(180deg,#4d78ae,#162d58); }
.r2r-screen--default { color:#fff; padding:45px 24px calc(var(--r2r-navigation-height,76px) + 45px); font-family:"Open Sans",Arial,sans-serif; }
.r2r-quiz-dialog .r2r-screen--default { padding-top:calc(var(--r2r-toolbar-height,88px) + 28px); }
/* Rows follow the Figma slides: the step header sits at the top and the remaining rows are centred below it. */
.r2r-default-content { display:grid; grid-template-columns:minmax(0,1fr); grid-template-rows:auto minmax(44px,1fr) repeat(6,auto) 1fr; justify-items:center; flex:1 0 auto; width:100%; max-width:56.25rem; min-width:0; margin:0 auto; text-align:center; overflow-wrap:anywhere; }
.r2r-screen--default h2 { grid-row:4; width:100%; color:inherit; font-size:clamp(1.75rem,4vw,2.8125rem); font-weight:700; line-height:1.2222; margin:18px 0 36px; text-shadow:0 4px 4px rgba(0,0,0,.25); scroll-margin-top:80px; }
.r2r-step { grid-row:1; width:397px; max-width:100%; color:inherit; font-size:1.25rem; font-weight:700; line-height:25px; margin:0; padding:13px 0 14px; border-top:1px solid #fff; border-bottom:1px solid #fff; }
.r2r-screen--default .r2r-image { grid-row:3; }
.r2r-image { display:block; width:auto; max-width:100%; height:240px; object-fit:contain; margin:0 auto; }
.r2r-screen--intro .r2r-image { width:100%; height:260px; object-fit:cover; border-radius:8px; }
.r2r-description { grid-row:5; width:100%; max-width:45rem; margin:0 auto 36px; font-size:1.125rem; line-height:1.3889; }
.r2r-description:empty { display:none; }
.r2r-description p { margin:12px 0; }
.r2r-description > :first-child { margin-top:0; }
.r2r-description > :last-child { margin-bottom:0; }
.r2r-description a { color:inherit; text-decoration:underline; }
.r2r-description img { max-width:100%; height:auto; }
/* The slides show no instructions line; it stays available to screen readers through the answers' aria-describedby. */
.r2r-instructions { grid-row:6; position:absolute; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
.r2r-answers { grid-row:7; display:flex; flex-wrap:wrap; justify-content:center; gap:25px; width:100%; min-width:0; }
.r2r-result-link { grid-row:8; }
.r2r-answers button, .r2r-result-link { background:#fff; color:#162d58; border:0; border-radius:300px; padding:20px 85px; cursor:pointer; font:800 1.1875rem/26px Arial,sans-serif; text-decoration:none; text-align:center; display:inline-flex; min-height:44px; min-width:44px; max-width:100%; white-space:normal; overflow-wrap:anywhere; align-items:center; justify-content:center; box-shadow:none; }
/* Result slides place the icon beside left-aligned text. */
.r2r-screen--result .r2r-default-content:has(.r2r-image) { grid-template-columns:225px minmax(0,640px); column-gap:31px; justify-content:center; justify-items:start; text-align:left; }
.r2r-screen--result .r2r-step { grid-column:1 / -1; justify-self:center; text-align:center; }
.r2r-screen--result .r2r-image { grid-column:1; grid-row:4 / span 5; width:225px; height:221px; margin:3px 0 0; }
.r2r-screen--result :is(h2, .r2r-description, .r2r-answers, .r2r-result-link) { grid-column:-2; }
.r2r-screen--result h2 { margin:0 0 23px; }
.r2r-screen--result .r2r-description { max-width:602px; margin:0 0 36px; }
.r2r-screen--result .r2r-default-content:has(.r2r-image) .r2r-answers { justify-content:flex-start; }
.r2r-screen--intro .r2r-answers button { background:#f4a31c; }
.r2r-answers button:hover, .r2r-result-link:hover { background:#eaf1f9; color:#162d58; }
.r2r-navigation { position:absolute; left:0; right:0; bottom:0; z-index:2; display:flex; flex-wrap:wrap; justify-content:space-between; padding:16px 24px; background:var(--r2r-navigation-background,#162d58); gap:16px; }
.r2r-navigation button { background:transparent; border:2px solid #b6c5dc; border-radius:6px; color:#fff; cursor:pointer; font:600 .875rem/1.5 Arial,sans-serif; padding:10px 18px; min-height:44px; min-width:44px; max-width:100%; white-space:normal; overflow-wrap:anywhere; }
.r2r-navigation button:disabled { opacity:.4; cursor:default; }
.r2r-quiz button:focus, .r2r-quiz a:focus { outline:3px solid #fff; outline-offset:3px; box-shadow:0 0 0 6px #162d58; }
/* The heading only receives programmatic focus to announce a new screen; it is not a control, so it shows no ring. */
.r2r-screen--default [data-r2r-heading]:focus, .r2r-screen--default [data-r2r-heading]:focus-visible { outline:none; box-shadow:none; }
.r2r-visually-hidden { position:absolute !important; width:1px !important; height:1px !important; padding:0 !important; margin:-1px !important; overflow:hidden !important; clip:rect(0,0,0,0) !important; clip-path:inset(50%) !important; white-space:nowrap !important; border:0 !important; }
.r2r-dialog-open { overflow:hidden; }
.r2r-quiz-dialog[data-r2r-dialog] { box-sizing:border-box; padding:0; border:0; border-radius:var(--r2r-modal-radius,12px); width:var(--r2r-modal-width,960px); max-width:calc(100vw - 32px); max-height:calc(100vh - 32px); max-height:calc(100dvh - 32px); margin:auto; color:#fff; background:#162d58; overflow:auto; overscroll-behavior:contain; }
.r2r-quiz-dialog:not([open]) { display:none !important; }
.r2r-quiz-dialog::backdrop { background:var(--r2r-backdrop,rgba(10,20,40,.75)); }
.r2r-quiz-dialog .r2r-screen { min-height:calc(100vh - 32px); min-height:calc(100dvh - 32px); }
.r2r-quiz-dialog[data-r2r-presentation="fullscreen"] .r2r-screen { min-height:100vh; min-height:100dvh; }
.r2r-quiz-dialog[data-r2r-presentation="fullscreen"] { width:100vw; max-width:100vw; height:100vh; height:100dvh; max-height:100vh; max-height:100dvh; border-radius:0; }
.r2r-dialog-toolbar { display:flex; justify-content:flex-end; padding:12px 20px; color:var(--r2r-toolbar-text,#fff); background:var(--r2r-toolbar-background,#162d58); position:absolute; top:0; left:0; right:0; z-index:3; }
.r2r-dialog-toolbar button { box-sizing:border-box; font:600 1rem/1.5 Arial,sans-serif; padding:10px 16px; min-width:44px; min-height:44px; max-width:100%; white-space:normal; overflow-wrap:anywhere; border:2px solid currentColor; border-radius:6px; color:inherit; background:transparent; cursor:pointer; }
.r2r-dialog-toolbar button:focus { outline:3px solid #fff; outline-offset:3px; box-shadow:0 0 0 6px #162d58; }
.r2r-quiz-dialog [data-r2r-screen] :is([data-r2r-heading], h1, h2, h3) { scroll-margin-top:var(--r2r-toolbar-height,100px); }
.r2r-standalone { margin:0; background:var(--r2r-page-background,#162d58); }
@media(max-width:600px) { .r2r-screen--default { padding:28px 20px calc(var(--r2r-navigation-height,76px) + 28px); } .r2r-quiz-dialog .r2r-screen--default { padding-top:calc(var(--r2r-toolbar-height,88px) + 8px); } .r2r-image { height:180px; } .r2r-answers { flex-direction:column; } .r2r-description { font-size:1rem; } .r2r-answers button, .r2r-result-link { padding:20px 32px; }
  .r2r-screen--result .r2r-default-content:has(.r2r-image) { grid-template-columns:minmax(0,1fr); justify-items:center; text-align:center; } .r2r-screen--result .r2r-image { grid-row:3; width:auto; height:180px; margin:0 auto 18px; } }
@media(prefers-reduced-motion:reduce) { .r2r-quiz *, .r2r-quiz *::before, .r2r-quiz *::after { animation:none !important; transition:none !important; scroll-behavior:auto !important; } }
@media(forced-colors:active) {
  .r2r-quiz-dialog[data-r2r-dialog], .r2r-dialog-toolbar { background:Canvas; color:CanvasText; }
  .r2r-quiz-dialog[data-r2r-dialog] { border:2px solid CanvasText; }
  .r2r-dialog-toolbar button { background:ButtonFace; color:ButtonText; border-color:ButtonText; }
  .r2r-dialog-toolbar button:focus { outline-color:Highlight; box-shadow:none; }
  .r2r-screen--default, .r2r-screen--intro, .r2r-screen--result, .r2r-navigation { background:Canvas; color:CanvasText; }
  .r2r-answers button, .r2r-navigation button, .r2r-screen--intro .r2r-answers button { background:ButtonFace; color:ButtonText; border:2px solid ButtonText; }
  .r2r-result-link { background:Canvas; color:LinkText; border:2px solid LinkText; }
  .r2r-description a { color:LinkText; }
  .r2r-navigation button:disabled { color:GrayText; border-color:GrayText; opacity:1; }
  .r2r-quiz button:focus, .r2r-quiz a:focus { outline:3px solid Highlight; box-shadow:none; }
}