/* Contextual help shares the questionnaire's typography and violet palette. */
#questions legend{align-items:baseline}
#questions .question-label{flex:1;min-width:0;padding-top:0}
#questions .question-number{padding-top:0}
#questions .question-ending{white-space:nowrap}
.question-help{display:inline-flex;align-items:center;justify-content:center;flex:none;gap:6px;min-height:32px;padding:4px 9px;margin-left:8px;vertical-align:middle;border:1px solid #dacde866;border-radius:20px;background:#ffffff66;color:#8a6aa2;font-size:10px;font-weight:550;line-height:1.4;transition:background .15s,color .15s,border-color .15s}
.question-help:hover,.question-help[aria-expanded=true]{color:#654287;background:#f1e7fb;border-color:#c4acd8}
.question-help svg{width:15px;height:15px}
.question-help:focus-visible{outline:2px solid #9370bd;outline-offset:3px}
body.help-open{overflow:hidden}
#question-help{width:760px;max-width:calc(100vw - 40px);max-height:calc(100dvh - 48px);padding:0;border:1px solid #e0d2ed;border-radius:18px;overflow:hidden;background:#fdfbff;color:#59436e;box-shadow:0 30px 110px #21103245,0 2px 12px #21103214}
#question-help::backdrop{background:#271a404a;backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px)}
#question-help[open]{animation:help-appear .16s ease-out}
.help-panel{display:flex;flex-direction:column;max-height:calc(100dvh - 50px)}
.help-header{position:relative;flex:none;padding:27px 66px 22px 30px;border-bottom:1px solid #e8def0;background:radial-gradient(ellipse at 3% 0,#eee1fc 0,transparent 70%),linear-gradient(120deg,#f8f3fd,#fff)}
.help-topline{display:flex;align-items:center;gap:10px;margin-bottom:14px}
.help-symbol{display:grid;place-items:center;flex:none;width:30px;height:30px;border:1px solid #dbc8ed;border-radius:10px;background:linear-gradient(135deg,#fff,#e9daf9);color:#9368b5;box-shadow:inset 0 1px #fff}
.help-eyebrow{font-size:9px;font-weight:650;letter-spacing:.12em;text-transform:uppercase;color:#977aa9}
#help-section{display:block;font-size:10px;color:#a18caf;margin-top:3px;letter-spacing:0;text-transform:none;font-weight:400}
#help-title{font-size:23px;line-height:1.5;font-weight:550;letter-spacing:-.55px;color:#513466;margin:0;overflow-wrap:break-word}
.help-close{position:absolute;top:22px;right:21px;width:34px;height:34px;display:grid;place-items:center;border:1px solid #e1d5eb;border-radius:50%;background:#ffffffa6;color:#957ba8;font-size:22px;font-weight:300;line-height:1}
.help-close:hover{color:#5c337d;border-color:#b99acd;background:#fff}
.help-scroll{min-height:0;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#cebddf transparent;padding:24px 30px 15px}
#help-purpose{font-size:13px;line-height:1.9;color:#745d86;margin:0 0 24px;max-width:none}
.help-block{margin:0 0 23px}
.help-block h3{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:650;letter-spacing:0;margin:0 0 9px;color:#69447f}
.help-block h3 svg{width:16px;height:16px;color:#a386b9}
.help-block p{font-size:12px;line-height:1.9;margin:0;color:#877393}
.help-example{padding:18px 20px;border-left:2px solid #b697d0;border-radius:0 10px 10px 0;background:linear-gradient(100deg,#f0e7fa,#f8f3fd66)}
.help-example p{color:#7c638e}
.help-note{padding-top:2px}
.help-note p{font-size:11px;color:#95819f}
.help-comment-note{font-size:10px;line-height:1.8;color:#a38aaf;margin:6px 0 12px;padding-top:15px;border-top:1px solid #ede5f3}
.help-footer{flex:none;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:17px 30px;border-top:1px solid #e8def0;background:#fcf9ff}
.help-footer>span{font-size:10px;color:#a28aaf}
#help-done{min-height:40px;padding:10px 18px;font-size:11px;gap:10px}
.help-catalogue{margin:0 0 25px;border-top:1px solid #e3d6ee;border-bottom:1px solid #e3d6ee}
.help-catalogue>summary{display:flex;align-items:center;justify-content:space-between;gap:16px;cursor:pointer;min-height:49px;padding:10px 0;font-size:12px;font-weight:600;color:#805299;list-style:none}
.help-catalogue>summary:after,.help-family>summary:after{content:'+';font-size:19px;font-weight:400;color:#b092c2;flex:none}
.help-catalogue[open]>summary:after,.help-family[open]>summary:after{content:'−'}
.help-catalogue summary::-webkit-details-marker{display:none}
.help-catalogue-intro{font-size:11px!important;line-height:1.8;color:#a08aaa;margin:0 0 10px!important}
.help-family{border-top:1px solid #eee5f5}
.help-family>summary{display:flex;align-items:center;justify-content:space-between;gap:10px;cursor:pointer;list-style:none;padding:12px 0;font-size:11px;line-height:1.7;color:#8d729f}
.help-family>summary>span{flex:1}
.help-code{display:inline-block;min-width:34px;font-weight:650;color:#9d78b8;font-size:10px}
.help-motifs{margin:0;padding:0 0 14px 18px;color:#9d8aa8;font-size:11px;line-height:1.9}
.help-motifs li{padding:3px 0 3px 3px}
.help-quantity{display:inline-block;margin-left:7px;padding:0 5px;border-radius:3px;background:#eee3f8;font-size:9px;color:#9777ac}
.help-functions{margin:0;padding:0 0 10px}
.help-functions>div{padding:12px 0;border-top:1px solid #eee5f5}
.help-functions dt{font-size:11px;font-weight:600;color:#866698;margin:0 0 4px}
.help-functions dd{font-size:11px;color:#a08aaa;line-height:1.8;margin:0}
@keyframes help-appear{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:720px){#questions .question-label{padding-top:0}.question-help{min-height:36px;gap:4px;padding:5px 8px;margin-left:7px;font-size:9px}.question-help svg{width:14px;height:14px}#question-help{max-width:calc(100vw - 24px);max-height:calc(100dvh - 28px);border-radius:14px}.help-panel{max-height:calc(100dvh - 30px)}.help-header{padding:20px 52px 17px 20px}.help-topline{gap:8px;margin-bottom:10px}.help-close{top:14px;right:12px;width:32px;height:32px}.help-eyebrow{font-size:8px}#help-title{font-size:18px;line-height:1.55;letter-spacing:-.4px}.help-scroll{padding:19px 20px 12px}#help-purpose{font-size:12px;line-height:1.9;margin-bottom:21px}.help-block h3{font-size:11px}.help-block p{font-size:11px}.help-example{padding:15px 15px}.help-note p{font-size:10px}.help-footer{padding:13px 18px;gap:12px}.help-footer>span{display:none}#help-done{width:100%;font-size:11px}.help-catalogue>summary{font-size:11px}}
@media(pointer:coarse){.question-help{min-height:44px;min-width:44px}.help-close{width:44px;height:44px;top:12px;right:12px}.help-header{padding-right:68px}.help-family>summary{min-height:44px}}
@media(prefers-reduced-motion:reduce){#question-help[open]{animation:none}.question-help{transition:none}}

/* Sur petits écrans, les fenêtres restent lisibles et entièrement accessibles. */
#question-help{box-sizing:border-box;max-width:calc(100vw - 24px);max-height:calc(100dvh - 24px)}
#question-help .help-panel{min-width:0;min-height:0;max-height:calc(100dvh - 26px)}
#question-help .help-scroll{flex:1 1 auto;min-width:0;min-height:0;overflow-wrap:anywhere}
#question-help .help-header,#question-help .help-footer{min-width:0}
#question-help .help-footer .button{max-width:100%;white-space:normal}
#confirm{box-sizing:border-box;max-width:calc(100vw - 24px);max-height:calc(100dvh - 24px);overflow:auto;overscroll-behavior:contain;scroll-padding-block:20px}
#confirm :is(h2,p,.dialog-actions){min-width:0;overflow-wrap:anywhere}
#confirm .dialog-actions{flex-wrap:wrap}
@media screen and (max-width:600px){
  #question-help{width:calc(100vw - 24px);border-radius:16px}
  #question-help .help-header{padding:22px 62px 18px 20px}
  #help-title{font-size:20px;line-height:1.4;letter-spacing:-.3px}
  #question-help .help-close{top:12px;right:10px;width:44px;height:44px}
  #question-help .help-scroll{padding:20px}
  #question-help :is(#help-purpose,.help-block p,.help-example p,.help-note p,.help-motifs,.help-functions dd,.help-catalogue-intro){font-size:14px!important;line-height:1.75}
  #question-help :is(.help-block h3,.help-family>summary,.help-functions dt,.help-catalogue>summary){font-size:14px;line-height:1.6}
  #question-help .help-family>summary,#question-help .help-catalogue>summary{min-height:44px}
  #question-help .help-footer{padding:14px 20px}
  #question-help #help-done{min-height:48px;font-size:14px;line-height:1.5}
  #confirm{width:calc(100vw - 24px);padding:24px 20px;border-radius:16px}
  #confirm h2{font-size:24px;line-height:1.3;padding-right:30px}
  #confirm p{font-size:14px;line-height:1.7}
  #confirm .dialog-x{width:44px;height:44px;right:10px;top:10px}
  #confirm .dialog-actions{display:grid;grid-template-columns:minmax(0,1fr);gap:10px}
  #confirm .dialog-actions .button{min-height:48px;width:100%;font-size:14px;white-space:normal}
}
@media screen and (max-height:560px){
  #question-help{overflow:auto;max-height:calc(100dvh - 16px);margin:8px auto}
  #question-help .help-panel{display:block;max-height:none}
  #question-help .help-scroll{overflow:visible;max-height:none}
  #question-help .help-header{padding-top:18px;padding-bottom:16px}
  #question-help .help-footer{position:static}
}

/* Keep the confirmation heading balanced on narrow screens. */
#confirm-title{text-wrap:balance}

/* Les six options se découvrent dans une seule aide défilante. */
.help-option-list{display:grid;gap:14px;margin:0 0 22px}
.help-option{min-width:0;padding:20px;border:1px solid #e4d8ef;border-radius:16px;background:linear-gradient(135deg,#fff,#f6effb);box-shadow:inset 0 1px #fff}
.help-option-heading{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.help-option-heading>span{flex:none;display:grid;place-items:center;width:28px;height:28px;border-radius:9px;background:#e9def4;color:#9672b3;font-size:11px;font-weight:650}
.help-option h3{font-size:15px;line-height:1.5;margin:0;color:#65427d;font-weight:650}
.help-option p{font-size:13px;line-height:1.8;margin:0;color:#80658f;max-width:none}
.help-option .help-option-example{margin-top:12px;padding-top:11px;border-top:1px solid #e9dff1;color:#947ba3;font-size:12px}
.help-option-example strong{font-weight:600;color:#87629e}
.help-short-note{font-size:12px;line-height:1.8;color:#947ca4;margin:12px 0 18px}
@media(max-width:600px){
 .help-option{padding:16px;border-radius:14px}
 .help-option h3{font-size:15px}
 .help-option p,.help-option .help-option-example,.help-short-note{font-size:14px;line-height:1.75}
}