/* Isolated design study: shared interface theme. Functional markup stays intact. */
:root {
  --navy: #1f2323;
  --ink: #303536;
  --muted: #697071;
  --blue: #d90046;
  --blue-dark: #be003d;
  --blue-pale: #fff0f4;
  --paper: #f5f6f8;
  --line: #e2e5e6;
  --teal: #126855;
  --teal-pale: #eaf6f0;
  --amber: #8a4c0f;
  --amber-pale: #fff4e4;
  --red: #b1293d;
  --radius: 20px;
  --shadow: none;
  --font: 'Poppins', Manrope, ui-sans-serif, sans-serif;
  --wf-pink: #ff0051;
}
html { scroll-padding-top: 110px; }
body { color: var(--ink); background: var(--paper); font-weight: 400; }
button, input, select, textarea { font-family: var(--font); }
h1, h2, h3, h4 { color: var(--navy); font-weight: 600; letter-spacing: -.035em; }
h1 { font-size: clamp(32px, 4vw, 48px); line-height: 1.22; }
h2 { font-weight: 600; }
h3, h4 { font-weight: 600; }
a { color: var(--blue); }
a:hover { color: var(--blue-dark); }
::selection { background: #ffd4e1; color: #1f2323; }
:focus-visible { outline: 3px solid #a32c82; outline-offset: 4px; }
.container { width: min(1200px, calc(100% - 80px)); }
.narrow { max-width: 840px; }
main#main-content { padding-bottom: 16px; }
.site-header { background: #fff; border-bottom-color: var(--line); backdrop-filter: none; }
.header-inner { min-height: 92px; gap: 28px; }
.site-header .brand, .site-footer .brand { color: #1f2323; font-size: 19px; font-weight: 600; letter-spacing: -.055em; }
.site-header .brand-mark, .site-footer .brand-mark { background: var(--wf-pink); border-radius: 50%; width: 39px; height: 39px; }
.site-header .brand small, .site-footer .brand small { color: #737879; font-weight: 400; letter-spacing: .015em; }
.desktop-nav { gap: 25px; }
.desktop-nav a { color: #3e4344; font-size: 12px; font-weight: 500; }
.desktop-nav a.active, .desktop-nav a:hover { color: var(--blue); }
.desktop-nav a.active:after { bottom: -24px; height: 2px; background: var(--wf-pink); }
.account-header-link { min-height: 44px; border-color: #cbd0d1; border-radius: 999px; color: #1f2323; font-weight: 500; padding: 10px 15px; }
.account-header-link:hover { border-color: #1f2323; color: #1f2323; background: #f5f6f8; }
.mobile-menu-button { border-color: var(--line); border-radius: 50%; color: #1f2323; }
.mobile-menu { border-color: var(--line); }
.mobile-menu a { font-weight: 500; border-radius: 8px; }
.mobile-menu a.active, .mobile-menu a:hover { background: #fff0f4; color: var(--blue); }
.demo-strip { background: #f3f4f5; border-color: #e6e7e8; color: #686f70; }
.demo-strip strong, .demo-strip>.container>span:first-child { color: #404748; }
.btn, .btn.small { border-radius: 999px; font-weight: 500; min-height: 48px; padding: 12px 23px; }
.btn.primary { background: #e60049; border-color: #e60049; color: white; box-shadow: none; }
.btn.primary:hover { background: #cf0045; border-color: #cf0045; box-shadow: none; }
.btn.secondary { color: #1f2323; background: #fff; border-color: #aeb6b7; }
.btn.secondary:hover { background: #f0f2f3; border-color: #1f2323; }
.btn.ghost { color: #60696a; }
.btn.ghost:hover { color: #1f2323; background: #eceff0; }
.btn.danger { color: #a02437; background: #fff1f2; border-color: #e5b6be; }
.btn.small { font-size: 12px; padding: 10px 18px; min-height: 44px; }
.text-link, .section-link { font-weight: 500; }
.eyebrow, .question-number { color: var(--blue); font-weight: 600; letter-spacing: .09em; }
.page-heading { padding-block: 58px 34px; }
.page-heading h1 { font-size: clamp(32px, 3.7vw, 44px); font-weight: 600; margin-bottom: 16px; }
.page-heading p { color: var(--muted); font-size: 14px; line-height: 1.9; }
.back-link, .breadcrumbs, .breadcrumbs a { color: #697071; }
.section-title { font-weight: 600; }
.panel { padding: 32px; border-color: var(--line); box-shadow: none; }
.panel-heading h2 { font-size: 25px; font-weight: 600; }
.panel-heading p, .section-description { color: var(--muted); line-height: 1.9; }
.guide-grid { gap: 22px; }
.guide-card { border-radius: 18px; padding: 29px; gap: 16px; border-color: var(--line); }
.guide-card:hover { border-color: #ec9bb5; }
.guide-card h3 { font-size: 18px; font-weight: 600; line-height: 1.5; }
.guide-card p { font-size: 13px; color: var(--muted); line-height: 1.9; }
.tag, .badge { background: #f1f2f3; color: #636b6c; font-weight: 500; border-radius: 6px; }
.tag { padding: 5px 10px; }
.chip { border-color: #dadddf; border-radius: 999px; color: #586263; background: white; }
.chip:hover { border-color: #b35e7e; color: var(--blue); }
.chip.active { background: #1f2323; border-color: #1f2323; color: #fff; }
.article-layout { gap: 32px; }
.article { padding: 42px; border-color: var(--line); border-radius: 20px; }
.article h1 { font-size: clamp(30px, 3vw, 42px); font-weight: 600; line-height: 1.3; }
.article p, .article li { color: #596263; font-size: 14px; line-height: 1.95; }
.article .article-lead { color: #5e6869 !important; font-size: 16px !important; font-weight: 400; }
.article-section { margin-top: 36px; }
.article-section h2 { font-size: 25px; font-weight: 600; }
.article-source { font-size: 11px; color: #737b7c; border-color: var(--line); }
.article-source a { color: #666d6e; }
.article-callout { background: #fff1f5; border-left-color: #e6487b; }
.article-callout strong { color: #8c244a; }
.article-aside { top: 118px; }
.article-aside .panel { padding: 25px; }
.article-aside nav a, .related-links a { color: #626c6d; font-size: 12px; }
.article-aside nav a:hover, .related-links a:hover { color: var(--blue); }
.faq-item { border-color: var(--line); border-radius: 14px; }
.faq-item summary { font-size: 13px; font-weight: 500; }
.faq-item summary:after { color: var(--blue); }
.data-table th { background: #f0f1f3; }
.steps-bar { margin-bottom: 29px; }
.step-item { color: #858d8e; font-weight: 500; }
.step-item.active { color: var(--blue); }
.step-item.active>span:first-child, .step-item.active>i:first-child { background: var(--wf-pink); border-color: var(--wf-pink); }
.progress-track { background: #eceff0; height: 5px; }
.progress-fill { background: var(--wf-pink); }
.type-card { border-color: #dce0e1; border-radius: 14px; color: #545f60; font-weight: 500; }
.type-card svg { color: #757f80; }
.type-card:hover { border-color: #e7a1b7; background: #fffafb; }
.type-card.selected { color: #b9003b; border-color: #db0046; background: #fff0f4; box-shadow: 0 0 0 1px #db0046; }
.type-card.selected svg { color: #d90046; }
.type-card:has(input:focus-visible), .answer-option:has(input:focus-visible) { outline-color: #a32c82; }
.type-selection-note, .vehicle-summary { background: #f6f7f8; border-color: #e3e6e7; }
.type-selection-note p, .other-types>summary span { color: #687172; }
.other-types { border-color: var(--line); }
.other-types>summary { color: #1f2323; }
.field-label, .account-field>span { font-weight: 500; color: #343d3e; }
.field-hint { color: #758081; }
.input, .select, .search-input, .report-code-input { border-color: #ccd2d3; border-radius: 10px; background-color: #fff; color: #1f2323; }
.input::placeholder, .search-input::placeholder { color: #859091; }
.input:focus, .select:focus, .search-input:focus { border-color: #a32c82; box-shadow: 0 0 0 3px #a32c8214; outline: none; }
.input[aria-invalid=true], .select[aria-invalid=true] { border-color: #c42a45; }
.field-error { color: #b1293d; }
.radio-row, .check-row { color: #5f6a6b; }
input[type=radio], input[type=checkbox], .radio-row input, .check-row input, .checklist-item input[type=checkbox] { accent-color: #d90046; }
.radio-row:has(input:checked) { background: #fff0f4; border-color: #d90046; color: #9c0032; }
.question-title { font-size: 27px; font-weight: 600; line-height: 1.45; }
.answer-option { font-weight: 500; color: #505b5c; border-color: #d9dedf; border-radius: 12px; }
.answer-option:before { border-color: #abb5b6; }
.answer-option:hover { border-color: #d982a1; background: #fff9fb; }
.answer-option.selected { background: #fff0f4; border-color: #d90046; color: #a90036; box-shadow: 0 0 0 1px #d90046; }
.answer-option.selected:before { border-color: #d90046; }
.quick-fuel-option { border-color: #d9dedf; color: #1f2323; border-radius: 12px; }
.quick-fuel-option strong { font-weight: 500; }
.quick-fuel-option span { color: #697475; }
.quick-fuel-option .icon { color: #858f90; }
.quick-fuel-option:hover, .quick-fuel-option.selected { background: #fff0f4; border-color: #d90046; }
.quick-fuel-option.selected strong, .quick-fuel-option.selected .choice-indicator { color: #aa0037; }
.quick-fuel-option:focus-visible { outline-color: #a32c82; }
.quick-fuel-panel .quick-fuel-title { font-weight: 600; }
.help-box { background: #f7f8f9; border-color: #e3e6e7; color: #687273; }
.help-box strong, .help-box>summary, .help-box svg { color: #495b5d; }
.notice.info { background: #f2effa; border-color: #ddd4ef; color: #594779; }
.notice.warning { background: #fff4e4; border-color: #e8cda6; color: #805019; }
.notice.success { background: #eaf6f0; border-color: #b8dcca; color: #126855; }
.list-return { background: #fff0f4; border-color: #f1c3d2; }
.list-return strong { color: #62253d; }
.list-return small { color: #775663; }
.list-return-icon { color: var(--blue); }
.stat-check, .result-group-check { --group-ink: #8a4c0f; --group-bg: #fff4e4; --group-line: #e8cda6; }
.stat-missing, .result-group-missing { --group-ink: #126855; --group-bg: #eaf6f0; --group-line: #b8dcca; }
.stat-unknown, .result-group-unknown { --group-ink: #6146a1; --group-bg: #f2edfc; --group-line: #d2c5ed; }
.result-group { box-shadow: none; border-radius: 18px; }
.result-group-header h2 { font-weight: 600; }
.result-group-header p { color: #596263; }
.result-group .result-copy h3 { color: #303637; font-weight: 600; }
.result-group .result-copy p { color: #5e6869; }
.result-stat-row .stat strong { font-weight: 600; }
.result-stat-row .stat span { font-weight: 500; }
.item-toggle { color: #515e5f; border-color: #cdd4d5; border-radius: 999px; font-weight: 500; }
.item-toggle[aria-pressed=true] { background: #eaf6f0; border-color: #91bea7; color: #126855; }
.result-group-empty { color: #697475; }
.preparation-context { background: #f1eff7; color: #66567f; font-weight: 500; }
.preparation-context-appointment { background: #fff2d8; color: #805d20; }
.preparation-context-equipment, .preparation-context-roadUse { background: #eaf4ef; color: #426b61; }
.preparation-note { background: #f1eff7; border-left-color: #9480b6; }
.preparation-sources, .preparation-sources small { color: #697475; }
.preparation-sources a { color: #8c244a; }
/* Context colour is independent of checklist status: inspection stays cool; road use amber. */
.traffic-context { color: #303637; }
.traffic-general { border-left-color: #687a82; background: #eef2f4; }
.traffic-topic { border-color: #dce2e4; }
.traffic-inspection { background: #eef2f4; border-left-color: #687a82; }
.traffic-road { background: #fff4d9; border-left-color: #a16b12; }
.traffic-comparison h3, .traffic-comparison h4 { color: #303637; font-weight: 600; }
.traffic-comparison p, .article .traffic-comparison p { color: #566365; }
.traffic-sources summary, .traffic-sources li span { color: #5e6e74; }
.traffic-sources a { color: #645580; }
.tabs { border-color: var(--line); }
.tab { font-weight: 500; }
.tab.active { color: var(--blue); }
.tab.active:after { background: var(--wf-pink); }
.empty-state { border-color: #ccd3d4; background: #fff; }
.empty-state>.icon, .empty-icon { color: #a32c65; }
.vehicle-card, .firm-card { border-color: var(--line); border-radius: 18px; }
.vehicle-card-header h3 { font-weight: 600; }
.vehicle-card-header button:hover { background: #fff0f4; }
.vehicle-meta, .date-copy, .date-copy small { color: #748081; }
.date-icon { background: #f2f3f4; color: #7c898a; }
.vehicle-badge { border-color: #d8dfe0; background: #f8f9fa; color: #303637; }
.upload-zone { border-color: #cfd6d7; background: #fff; }
.upload-zone:hover { background: #fff9fb; border-color: #db8ca5; }
.icon-button { color: #626e6f; border-color: #d8dfe0; border-radius: 50%; }
.icon-button:hover { background: #fff0f4; border-color: #e8adc0; color: var(--blue); }
.account-card, .account-overview, .account-management-card { border-color: var(--line); box-shadow: none; border-radius: 20px; }
.account-layout { gap: 64px; }
.account-card { padding: 36px; }
.account-card h1, .account-page-heading h1, .account-benefits>h2 { font-weight: 600; letter-spacing: -.035em; }
.account-intro, .account-benefit p, .account-email, .account-field small, .account-management-card p, .account-guest-prompt p { color: #697475; }
.account-back, .account-guest { color: #5f6e70; }
.account-icon { background: #fff0f4; color: #d90046; border-radius: 50%; }
.account-eyebrow { color: #d90046; font-weight: 500; }
.account-benefit>svg { color: #ba5b7c; }
.account-benefit h3 { font-weight: 600; }
.account-switch { color: #697475; }
.account-switch a, .account-recovery-link a, .account-legal a { color: #bb003c; }
.account-save-status { background: #f2f0f8; border-color: #e0d9ee; }
.account-save-status>svg { color: #7b6b9a; }
.account-save-status p, .account-count span { color: #697475; }
.account-count>svg { color: #7c6b96; }
.account-count { border-color: var(--line); }
.account-count strong { font-weight: 600; }
.account-import, .account-guest-prompt { background: #fff1f5; border-color: #f0c9d5; }
.account-guest-prompt>.account-icon { background: #ffe0e9; }
.account-session { background: #fff; }
.account-error { background: #fff0f2; border-color: #e7bac4; color: #9f263c; }
.account-container button:focus-visible, .account-container a:focus-visible, .account-guest-prompt a:focus-visible, .account-file-label:focus-within { outline-color: #a32c82; }
.account-status-banner { border-color: #dddfe2; border-radius: 16px; color: #303637; box-shadow: 0 8px 30px #1f232318; }
.modal-backdrop { background: #1f23236b; }
.modal { border-color: #dce0e1; border-radius: 22px; box-shadow: 0 24px 90px #1f232326; }
.modal-header, .modal-actions { border-color: var(--line); }
.modal-header button { background: #f3f4f5; border-radius: 50%; }
.toast { background: #1f2323; border-color: #1f2323; border-radius: 16px; }
#question-search-root { color: #1f2323; font-family: var(--font); }
.question-search-backdrop { background: #1f232378; }
.question-search-dialog { border-color: #e1e4e5; box-shadow: 0 30px 100px #1f23232e; }
.question-search-header { background: linear-gradient(125deg, #fff1f5, #fff 90%); }
.question-search-header h2 { font-weight: 600; }
.question-search-eyebrow { color: #c60040; font-weight: 500; }
.question-search-header p, .question-search-empty, .question-search-guide small { color: #697475; }
.question-search-close { color: #566163; border-color: #d4dbdc; }
.question-search-input-wrap { border-color: #cbd3d4; box-shadow: none; border-radius: 12px; }
.question-search-input-wrap:focus-within { border-color: #a32c82; box-shadow: 0 0 0 3px #a32c8214; }
.question-search-input-wrap input { color: #303637; font-family: var(--font); }
.question-search-input-wrap>svg { color: #ae4c6d; }
.question-search-submit { background: var(--wf-pink); border-radius: 999px; font-family: var(--font); font-weight: 500; }
.question-search-submit:hover { background: #d90046; }
.question-search-guide { border-color: #e0e4e5; background: #fafafa; color: #303637; border-radius: 12px; }
.question-search-guide:hover { background: #fff4f7; border-color: #eab3c5; }
.question-search-guide strong { font-weight: 500; }
.question-search-guide-icon { background: #ffeaf1; color: #ce0042; }
.question-search-chevron { color: #a95674; }
.question-search-section-heading h3 { font-weight: 600; }
.question-search-section-heading>span { background: #f1f2f3; color: #6e7778; }
.question-search-recent button { font-family: var(--font); font-weight: 400; border-color: #d8dfe0; color: #5d6a6c; border-radius: 999px; }
.question-search-recent button span { color: #9b6a7c; }
.question-search-footer { background: #f8f9fa; color: #748081; border-color: var(--line); }
.question-search-dialog button:focus-visible { outline-color: #a32c82; }
.commercial-card { color: #303637; border-color: var(--line); border-radius: 18px; }
.commercial-card-copy p { color: #697475; }
.commercial-button { font-family: var(--font); font-weight: 500; color: #1f2323; border-color: #aeb9ba; background: #fff; border-radius: 999px; }
.commercial-button:hover { color: #1f2323; background: #f0f2f3; }
.commercial-button:focus-visible { outline-color: #a32c82; }
.site-footer { background: #fff; border-color: var(--line); margin-top: 80px; }
.footer-inner { padding-block: 48px 34px; gap: 38px; }
.footer-inner p, .footer-inner>p:last-child { color: #748081; font-size: 11px; }
.footer-links { gap: 12px 24px; }
.footer-links a, .footer-inner nav a { color: #5d6769; font-size: 12px; font-weight: 400; }
.footer-links a:hover, .footer-inner nav a:hover { color: var(--blue); }
.footer-bottom { color: #7c8586; border-color: var(--line); padding-block: 22px; }
@media (max-width: 1200px) {
  .container { width: calc(100% - 64px); }
  .header-inner { gap: 18px; }
  .desktop-nav { gap: 20px; }
  .site-header .brand { font-size: 17px; }
  .header-action .btn { padding-inline: 18px; }
}
@media (max-width: 1000px) {
  .header-inner { min-height: 82px; gap: 14px; }
  .desktop-nav { gap: 13px; }
  .desktop-nav a { font-size: 11px; }
  .desktop-nav a.active:after { bottom: -19px; }
  .account-header-link { padding-inline: 11px; font-size: 11px; }
  .site-header .brand { font-size: 15px; }
  .site-header .brand-mark { width: 34px; height: 34px; }
  .article-layout { grid-template-columns: minmax(0, 1fr) 240px; gap: 24px; }
  .article { padding: 30px; }
  .guide-card { padding: 24px; }
  .account-layout { gap: 35px; }
}
@media (max-width: 760px) {
  html { scroll-padding-top: 84px; }
  .container { width: calc(100% - 40px); }
  .header-inner { min-height: 76px; gap: 9px; }
  .site-header .brand { font-size: 16px; gap: 8px; }
  .site-header .brand-mark { width: 34px; height: 34px; }
  .site-header .brand small { font-size: 8px; }
  .account-header-entry { margin-left: auto; }
  .account-header-link { font-size: 11px; padding: 9px 11px; gap: 5px; }
  .mobile-menu-button { margin-left: 0; min-width: 44px; }
  .desktop-nav, .header-action { display: none; }
  .mobile-bottom-nav { background: #fff; border-color: var(--line); box-shadow: none; backdrop-filter: none; }
  .mobile-bottom-nav a { color: #747e7f; font-weight: 500; }
  .mobile-bottom-nav a.active { background: #fff0f4; color: #c60040; }
  .page-heading { padding-block: 34px 24px; }
  .page-heading h1 { font-size: 31px; line-height: 1.35; }
  .page-heading p { font-size: 13px; }
  .panel { padding: 25px 22px; border-radius: 18px; }
  .panel-heading h2 { font-size: 23px; }
  .guide-grid { gap: 15px; }
  .guide-card { padding: 26px; }
  .guide-card h3 { font-size: 19px; }
  .article-layout { grid-template-columns: 1fr; gap: 22px; }
  .article { padding: 28px 24px; }
  .article h1 { font-size: 30px; }
  .article .article-lead { font-size: 15px !important; }
  .article-section h2 { font-size: 24px; }
  .article p, .article li { font-size: 14px; }
  .article-aside { position: static; }
  .article-aside nav { grid-template-columns: 1fr; }
  .question-title { font-size: 24px; }
  .btn, .btn.small { min-height: 46px; padding-inline: 20px; }
  .wizard-actions .btn { padding-inline: 16px; }
  .field-label { font-size: 13px; }
  .input, .select { font-size: 16px; }
  .type-card { font-size: 12px; }
  .account-layout { grid-template-columns: 1fr; gap: 26px; }
  .account-card { padding: 27px 24px; }
  .account-card h1 { font-size: 29px; }
  .account-benefits { padding-inline: 4px; }
  .account-benefits>h2 { font-size: 27px; }
  .account-save-status>div { min-width: 0; }
  .footer-inner { padding-block: 34px 26px; gap: 27px; }
  .site-footer { margin-top: 50px; }
  .footer-links { gap: 6px 21px; }
  .footer-links a { min-height: 40px; }
  .footer-bottom { font-size: 10px; }
}
@media (max-width: 480px) {
  .container { width: calc(100% - 32px); }
  .site-header .brand { font-size: 14px; gap: 7px; }
  .site-header .brand-mark { width: 30px; height: 30px; }
  .site-header .brand-mark svg { width: 21px; height: 21px; }
  .account-header-link { padding-inline: 9px; font-size: 10px; }
  .account-header-link .icon { width: 15px; height: 15px; }
  .account-header-link span { max-width: 63px; }
  .page-heading h1 { font-size: 29px; }
  .panel { padding: 22px 19px; }
  .article { padding: 25px 21px; }
  .article h1 { font-size: 28px; }
  .article-section h2 { font-size: 23px; }
  .guide-card { padding: 24px; }
  .answer-option { min-height: 54px; }
  .wizard-actions { gap: 8px; flex-wrap: wrap; }
  .wizard-actions .btn { font-size: 11px; padding-inline: 14px; }
  .result-stat-row { gap: 7px; }
  .result-stat-row .stat { padding: 14px 9px; }
  .result-stat-row .stat span { font-size: 10px; }
  .result-stat-row .stat strong { font-size: 27px; }
  .result-group-header h2 { font-size: 21px; }
  .result-group .result-copy h3 { font-size: 16px; }
  .result-group .result-copy p { font-size: 13px; }
  .account-card { padding: 24px 20px; }
  .account-card h1 { font-size: 27px; }
  .account-benefits>h2 { font-size: 25px; }
  .question-search-header h2 { font-size: 24px; }
  .question-search-input-wrap input { font-size: 16px; }
}
@media (max-width: 350px) {
  .site-header .container { width: calc(100% - 24px); }
  .header-inner { gap: 7px; }
  .site-header .brand { font-size: 12px; gap: 6px; }
  .site-header .brand-mark { width: 27px; height: 27px; }
  .site-header .brand small { font-size: 7px; }
  .account-header-link { padding-inline: 8px; font-size: 10px; gap: 4px; }
  .account-header-link span { max-width: 56px; }
  .account-header-link .icon { width: 14px; height: 14px; }
  .mobile-menu-button { min-width: 40px; width: 40px; }
  .type-card { font-size: 11px; }
  .step-item { font-size: 9px; gap: 4px; }
  .wizard-actions .btn { padding-inline: 12px; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  .btn, .type-card, .answer-option, .quick-fuel-option, .progress-fill { transition: none; }
}
@media print {
  body { color: #1f2323; background: #fff; }
  .container { width: 100%; }
  .page-heading { padding-block: 0 20px; }
  .page-heading h1 { font-size: 25px; }
  .article { padding: 20px; }
  .article h1 { font-size: 25px; }
  .article p, .article li { font-size: 11px; }
  .article-layout { display: block; }
  .result-group .result-copy p { font-size: 11px; }
}

/* Keep preparation questions close to the navigation and reduce repeated scrolling. */
.preparation-flow > .page-heading { padding-block: 12px 10px; }
.preparation-flow .steps-bar { margin-bottom: 10px; }
.preparation-flow .preparation-vehicle-summary { padding: 8px 12px; }

/* Keep the question controls accessible without covering the global bottom menu. */
@media (max-width: 760px) {
  body:has(.preparation-flow .question-navigation) {
    padding-bottom: calc(var(--wf-mobile-nav-height, 71px) + 96px);
  }
  .preparation-flow .question-navigation {
    position: fixed;
    inset: auto 0 var(--wf-mobile-nav-height, 71px);
    z-index: 45;
    display: grid;
    grid-template-columns: minmax(0, .8fr) minmax(0, 1.6fr);
    align-items: stretch;
    gap: 12px;
    margin: 0;
    padding: 12px max(16px, env(safe-area-inset-right, 0px)) 12px max(16px, env(safe-area-inset-left, 0px));
    border-top: 1px solid #e2e5e6;
    background: #fff;
    box-shadow: 0 -5px 20px #24262e08;
  }
  .preparation-flow .question-navigation > .btn {
    width: 100%;
    min-width: 0;
    min-height: 48px;
    margin: 0;
    padding: 11px 12px;
    font-size: 12px;
    line-height: 1.45;
  }
  .preparation-flow .question-navigation > .btn.ghost {
    border-color: #d9dedf;
    background: #fff;
  }
  .preparation-flow .question-support { margin-top: 16px; }
}

/* Consent choices follow the same visual system on every public page. */
.am-cookie-panel { color: #272c2e; border-color: #e1e5e6; box-shadow: 0 12px 50px #22262c20; }
.am-cookie-panel a { color: #b7003c; }
.am-cookie-actions button { border-color: #e60049; border-radius: 999px; color: #b7003c; background: #fff5f8; font-weight: 500; }
.am-cookie-actions button:hover { background: #ffe6ee; }
.am-cookie-status { color: #596567; }