/**
 * Numérique Doux — Accessibilité (extension Chrome, v1.2)
 */

/* ===== Polices libres ===== */
@font-face { font-family:"ND OpenDyslexic"; src:url("../fonts/OpenDyslexic-Regular.woff2") format("woff2"); font-weight:400; font-style:normal; font-display:swap; }
@font-face { font-family:"ND OpenDyslexic"; src:url("../fonts/OpenDyslexic-Bold.woff2") format("woff2"); font-weight:700; font-style:normal; font-display:swap; }
@font-face { font-family:"ND Lexend"; src:url("../fonts/Lexend-Regular.woff2") format("woff2"); font-weight:400; font-style:normal; font-display:swap; }
@font-face { font-family:"ND Lexend"; src:url("../fonts/Lexend-Bold.woff2") format("woff2"); font-weight:700; font-style:normal; font-display:swap; }
@font-face { font-family:"ND Atkinson"; src:url("../fonts/Atkinson-Regular.woff2") format("woff2"); font-weight:400; font-style:normal; font-display:swap; }
@font-face { font-family:"ND Atkinson"; src:url("../fonts/Atkinson-Bold.woff2") format("woff2"); font-weight:700; font-style:normal; font-display:swap; }
@font-face { font-family:"ND Andika"; src:url("../fonts/Andika-Regular.woff2") format("woff2"); font-weight:400; font-style:normal; font-display:swap; }
@font-face { font-family:"ND Andika"; src:url("../fonts/Andika-Bold.woff2") format("woff2"); font-weight:700; font-style:normal; font-display:swap; }

/* ===== Variables ===== */
#nda-root {
	--nda-accent: #2C7BB6; --nda-accent-2: #2E8B6F; --nda-on: #ffffff; --nda-bg: #ffffff; --nda-panel: #ffffff;
	--nda-text: #1f2733; --nda-muted: #f4f6f9; --nda-muted-2: #e9eef4; --nda-border: #dce3ec;
	--nda-radius: 16px; --nda-radius-sm: 10px; --nda-shadow: 0 12px 40px rgba(20,40,70,.20);
	--nda-size: 60px; --nda-icon: 30px; --nda-focus: #ffb000;
}
#nda-root.nda-size-small { --nda-size: 50px; --nda-icon: 25px; }
#nda-root.nda-size-large { --nda-size: 72px; --nda-icon: 38px; }

/* ===== Conteneur — réinitialisation pour ne PAS hériter du CSS du site ===== */
#nda-root, #nda-root * { box-sizing: border-box; }
#nda-root {
	position: fixed; z-index: 2147483600;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	font-size: 16px; line-height: 1.4; color: var(--nda-text);
	letter-spacing: normal; word-spacing: normal; text-transform: none; font-style: normal; font-weight: 400;
	text-indent: 0; white-space: normal; text-align: left; font-variant: normal; text-shadow: none;
}
#nda-root * { letter-spacing: normal; word-spacing: normal; text-transform: none; text-indent: 0; max-width: none; min-width: 0; float: none; }
#nda-root.nda-pos-bottom-right { right: 22px; bottom: 22px; }
#nda-root.nda-pos-bottom-left  { left: 22px;  bottom: 22px; }
#nda-root.nda-pos-top-right    { right: 22px; top: 22px; }
#nda-root.nda-pos-top-left     { left: 22px;  top: 22px; }

/* ===== Lanceur ===== */
.nda-launcher { width: var(--nda-size); height: var(--nda-size); border-radius: 50%; border: 3px solid var(--nda-on); background: var(--nda-accent); color: var(--nda-on); cursor: pointer; display: flex; align-items: center; justify-content: center; box-shadow: var(--nda-shadow); padding: 0; margin: 0; transition: transform .18s ease, box-shadow .18s ease; }
.nda-launcher:hover { transform: scale(1.07); }
.nda-launcher:focus-visible { outline: 3px solid var(--nda-focus); outline-offset: 3px; }
.nda-launcher svg { width: var(--nda-icon); height: var(--nda-icon); fill: currentColor; }

/* ===== Panneau (taille figée) ===== */
.nda-panel { position: absolute; width: 360px; max-width: calc(100vw - 32px); background: var(--nda-panel); border: 1px solid var(--nda-border); border-radius: var(--nda-radius); box-shadow: var(--nda-shadow); display: flex; flex-direction: column; max-height: min(82vh, 680px); overflow: hidden; opacity: 0; transform: translateY(12px) scale(.98); pointer-events: none; transition: opacity .2s ease, transform .2s ease; }
.nda-panel.nda-open { opacity: 1; transform: translateY(0) scale(1); pointer-events: auto; }
#nda-root.nda-pos-bottom-right .nda-panel, #nda-root.nda-pos-top-right .nda-panel { right: 0; }
#nda-root.nda-pos-bottom-left  .nda-panel, #nda-root.nda-pos-top-left  .nda-panel { left: 0; }
#nda-root.nda-pos-bottom-right .nda-panel, #nda-root.nda-pos-bottom-left .nda-panel { bottom: calc(var(--nda-size) + 16px); }
#nda-root.nda-pos-top-right .nda-panel, #nda-root.nda-pos-top-left .nda-panel { top: calc(var(--nda-size) + 16px); }

/* Header */
.nda-header { flex: none; display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 15px 16px; background: linear-gradient(135deg, var(--nda-accent), color-mix(in srgb, var(--nda-accent) 78%, #11405e)); color: var(--nda-on); }
.nda-header h2 { margin: 0; font-size: 18px; font-weight: 800; color: inherit; display: flex; align-items: center; gap: 8px; }
.nda-header h2 svg { width: 22px; height: 22px; fill: currentColor; }
.nda-close { background: rgba(255,255,255,.14); border: 2px solid transparent; color: inherit; font-size: 20px; line-height: 1; cursor: pointer; border-radius: 8px; width: 36px; height: 36px; display: flex; align-items: center; justify-content: center; flex: none; }
.nda-close:hover { background: rgba(255,255,255,.28); }
.nda-close:focus-visible { outline: 3px solid var(--nda-focus); outline-offset: 2px; }

/* Tabs — tiennent sans scroll horizontal */
.nda-tabs { flex: none; display: flex; gap: 2px; padding: 6px 6px 0; background: var(--nda-muted); border-bottom: 1px solid var(--nda-border); overflow: hidden; }
.nda-tab { flex: 1 1 0; min-width: 0; background: transparent; border: none; cursor: pointer; padding: 8px 2px 9px; font-size: 10px; font-weight: 700; color: #5b6675; border-bottom: 3px solid transparent; border-radius: 8px 8px 0 0; display: flex; flex-direction: column; align-items: center; gap: 4px; }
.nda-tab svg { width: 22px; height: 22px; fill: currentColor; flex: none; }
.nda-tab span { flex: none; max-width: 100%; overflow: hidden; white-space: normal; line-height: 1.05; }
.nda-tab:hover { color: var(--nda-accent); background: var(--nda-muted-2); }
.nda-tab[aria-selected="true"] { color: var(--nda-accent); border-bottom-color: var(--nda-accent); }
.nda-tab:focus-visible { outline: 3px solid var(--nda-focus); outline-offset: -2px; }

/* Body */
.nda-body { flex: 1 1 auto; min-height: 0; padding: 14px 16px; overflow-y: auto; overflow-x: hidden; scrollbar-gutter: stable; }
.nda-tabpanel { display: none; }
.nda-tabpanel.nda-active { display: block; animation: nda-fade .22s ease; }
@keyframes nda-fade { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }

.nda-hint { margin: 0 0 12px; font-size: 12.5px; color: #5b6675; line-height: 1.45; }
.nda-section-title { margin: 16px 0 8px; font-size: 12px; font-weight: 800; text-transform: uppercase; letter-spacing: .04em; color: #6a7686; }
.nda-section-title:first-child { margin-top: 2px; }

/* Grids — minmax(0,1fr) anti-débordement */
.nda-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }

/* Cards */
.nda-card { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 7px; text-align: center; min-height: 80px; min-width: 0; padding: 11px 8px; background: var(--nda-muted); border: 2px solid transparent; border-radius: var(--nda-radius-sm); color: var(--nda-text); font-size: 12.5px; font-weight: 600; cursor: pointer; transition: border-color .15s ease, background .15s ease, transform .1s ease; overflow-wrap: anywhere; }
.nda-card span { min-width: 0; max-width: 100%; }
.nda-card svg { width: 30px; height: 30px; fill: var(--nda-accent); flex: none; }
.nda-card:hover { background: var(--nda-muted-2); transform: translateY(-1px); }
.nda-card:focus-visible { outline: 3px solid var(--nda-focus); outline-offset: 2px; }
.nda-card[aria-pressed="true"] { background: var(--nda-accent); color: var(--nda-on); border-color: var(--nda-accent); box-shadow: 0 4px 14px color-mix(in srgb, var(--nda-accent) 40%, transparent); }
.nda-card[aria-pressed="true"] svg { fill: var(--nda-on); }
.nda-profile[aria-pressed="true"] { background: var(--nda-accent); border-color: var(--nda-accent); box-shadow: 0 4px 14px color-mix(in srgb, var(--nda-accent) 40%, transparent); }
.nda-profile[aria-pressed="true"] svg { fill: var(--nda-on); }

/* Sélecteur de polices */
.nda-fontlist { display: flex; flex-direction: column; gap: 7px; margin-bottom: 9px; }
.nda-fontopt { text-align: left; background: var(--nda-muted); border: 2px solid transparent; border-radius: 10px; padding: 9px 12px; cursor: pointer; color: var(--nda-text); display: flex; flex-direction: column; gap: 1px; }
.nda-fontopt:hover { background: var(--nda-muted-2); }
.nda-fontopt:focus-visible { outline: 3px solid var(--nda-focus); outline-offset: 2px; }
.nda-fontopt[aria-pressed="true"] { border-color: var(--nda-accent); background: #fff; box-shadow: 0 2px 10px color-mix(in srgb, var(--nda-accent) 25%, transparent); }
.nda-fontopt-name { font-size: 15px; font-weight: 700; line-height: 1.2; }
.nda-fontopt-desc { font-size: 11.5px; color: #5b6675; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; }

/* Stepper */
.nda-stepper { display: flex; align-items: center; justify-content: space-between; gap: 8px; background: var(--nda-muted); border-radius: var(--nda-radius-sm); padding: 8px 10px; margin-bottom: 9px; }
.nda-stepper .nda-lbl { font-size: 13px; font-weight: 700; flex: 1; min-width: 0; }
.nda-step-btn { width: 40px; height: 40px; flex: none; border-radius: 9px; border: 2px solid var(--nda-accent); background: var(--nda-bg); color: var(--nda-accent); font-size: 20px; font-weight: 700; cursor: pointer; line-height: 1; }
.nda-step-btn:hover { background: var(--nda-accent); color: var(--nda-on); }
.nda-step-btn:focus-visible { outline: 3px solid var(--nda-focus); outline-offset: 2px; }
.nda-step-val { min-width: 46px; text-align: center; font-weight: 800; font-variant-numeric: tabular-nums; }

/* Sliders */
.nda-slider { background: var(--nda-muted); border-radius: var(--nda-radius-sm); padding: 9px 12px; margin-bottom: 9px; }
.nda-slider .nda-srow { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: 4px; }
.nda-slider .nda-lbl { font-size: 13px; font-weight: 700; }
.nda-slider .nda-sval { font-size: 12px; font-weight: 800; color: var(--nda-accent); font-variant-numeric: tabular-nums; }
.nda-slider input[type="range"] { width: 100%; accent-color: var(--nda-accent); height: 22px; cursor: pointer; }
.nda-slider input[type="range"]:focus-visible { outline: 3px solid var(--nda-focus); outline-offset: 2px; }

/* Segmented */
.nda-seg { display: flex; gap: 6px; background: var(--nda-muted); border-radius: var(--nda-radius-sm); padding: 6px; margin-bottom: 9px; }
.nda-seg-btn { flex: 1; min-width: 0; border: 2px solid transparent; background: transparent; border-radius: 8px; padding: 8px 6px; font-size: 12.5px; font-weight: 700; color: var(--nda-text); cursor: pointer; }
.nda-seg-btn:hover { background: var(--nda-muted-2); }
.nda-seg-btn:focus-visible { outline: 3px solid var(--nda-focus); outline-offset: 1px; }
.nda-seg-btn[aria-pressed="true"] { background: var(--nda-accent); color: var(--nda-on); border-color: var(--nda-accent); }

/* Footer */
.nda-footer { flex: none; border-top: 1px solid var(--nda-border); padding: 12px 16px; background: var(--nda-bg); }
.nda-footer-row { display: flex; gap: 8px; }
.nda-btn { flex: 1; min-width: 0; display: inline-flex; align-items: center; justify-content: center; gap: 6px; padding: 11px; border-radius: 10px; font-size: 13px; font-weight: 800; cursor: pointer; border: 2px solid var(--nda-accent); background: var(--nda-bg); color: var(--nda-accent); }
.nda-btn svg { width: 17px; height: 17px; fill: currentColor; flex: none; }
.nda-btn:hover { background: var(--nda-accent); color: var(--nda-on); }
.nda-btn:focus-visible { outline: 3px solid var(--nda-focus); outline-offset: 2px; }
.nda-btn-ghost { border-color: var(--nda-border); color: #5b6675; }
.nda-btn-ghost:hover { background: var(--nda-muted-2); color: var(--nda-text); }
.nda-note { margin: 9px 0 0; font-size: 11px; color: #8a93a0; text-align: center; }

/* Report */
.nda-report { display: none; padding: 14px 16px; }
.nda-report.nda-active { display: block; }
.nda-report label { display: block; font-size: 13px; font-weight: 700; margin-bottom: 6px; }
.nda-report textarea { width: 100%; min-height: 120px; resize: vertical; padding: 10px; font-size: 14px; border: 2px solid var(--nda-border); border-radius: 10px; font-family: inherit; color: var(--nda-text); background: var(--nda-bg, #fff); }
.nda-report textarea:focus-visible { outline: 3px solid var(--nda-focus); outline-offset: 1px; border-color: var(--nda-accent); }

/* Skip link */
.nda-skip-link { position: fixed; top: -120px; left: 8px; z-index: 2147483601; padding: 12px 18px; background: var(--nda-accent, #2C7BB6); color: #fff; font-weight: 700; border-radius: 0 0 8px 8px; text-decoration: none; transition: top .15s ease; }
.nda-skip-link:focus { top: 0; outline: 3px solid var(--nda-focus); }

/* Guide & masque */
.nda-rg { position: fixed; left: 0; width: 25vw; height: 14px; background: rgba(20,40,70,.20); border-top: 4px solid #2C7BB6; border-bottom: 1px solid rgba(0,0,0,.35); border-radius: 3px; pointer-events: none; z-index: 2147483550; display: none; }
html.nda-guide .nda-rg { display: block; }
.nda-rm-top, .nda-rm-bottom { position: fixed; left: 0; width: 100%; background: rgba(0,0,0,.55); pointer-events: none; z-index: 2147483550; display: none; }
html.nda-mask .nda-rm-top, html.nda-mask .nda-rm-bottom { display: block; }

/* Lumière bleue */
.nda-bluelight-overlay { position: fixed; inset: 0; background: #ff9b2e; opacity: .18; mix-blend-mode: multiply; pointer-events: none; z-index: 2147483400; display: none; }
html.nda-bluelight .nda-bluelight-overlay { display: block; }

/* Clavier virtuel */
.nda-vk { position: fixed; left: 50%; bottom: 20px; transform: translateX(-50%); width: min(720px, calc(100vw - 24px)); background: var(--vk-bg, #1f2733); color: #fff; border: var(--vk-border, none); z-index: 2147483560; padding: 8px; border-radius: 14px; box-shadow: 0 14px 44px rgba(0,0,0,.45); display: none; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; }
.nda-vk.nda-open { display: block; }
.nda-vk-bar { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 2px 22px 8px; cursor: move; user-select: none; touch-action: none; }
.nda-vk-title { font-size: 13px; font-weight: 700; color: var(--vk-title-color, #fff); opacity: var(--vk-title-op, .85); }
.nda-vk-close { background: var(--vk-chrome-bg, rgba(255,255,255,.16)); border: none; color: var(--vk-chrome-color, #fff); width: 30px; height: 30px; border-radius: 7px; font-size: 18px; line-height: 1; cursor: pointer; }
.nda-vk-close:hover { background: var(--vk-chrome-bg-hover, rgba(255,255,255,.32)); }
.nda-vk-close:focus-visible { outline: 3px solid var(--nda-focus); outline-offset: 1px; }
.nda-vk-row { display: flex; gap: 5px; justify-content: center; margin-bottom: 5px; }
.nda-vk-key { flex: 1 1 0; min-width: 0; min-height: calc(58px * var(--nda-vk-scale, 1)); border: var(--vk-key-border, none); border-radius: 7px; background: var(--vk-key-bg, #38424f); color: var(--vk-key-color, #fff); font-family: Arial, "Helvetica Neue", Helvetica, sans-serif; font-size: calc(32px * var(--nda-vk-scale, 1)); font-weight: 600; cursor: pointer; }
.nda-vk-key:hover { background: var(--vk-key-hover-bg, #4a5563); color: var(--vk-key-hover-color, var(--vk-key-color, #fff)); }
.nda-vk-key:focus-visible { outline: 3px solid var(--nda-focus); outline-offset: 1px; }
.nda-vk-key.nda-vk-wide { flex: 1.6 1 0; font-size: calc(20px * var(--nda-vk-scale, 1)); }
.nda-vk-key.nda-vk-space { flex: 6 1 0; }
.nda-vk-key.nda-vk-action { background: var(--vk-action-bg, var(--nda-accent)); color: var(--vk-action-color, var(--vk-key-color, #fff)); }
.nda-vk-key[aria-pressed="true"] { background: var(--nda-accent); box-shadow: inset 0 0 0 2px #fff; }

/* Lecture vocale */
html .nda-tts-el { background-color: rgba(255, 214, 0, .30) !important; outline: 3px solid #ffb000 !important; outline-offset: 2px !important; border-radius: 4px !important; box-shadow: 0 0 0 3px rgba(255, 176, 0, .35) !important; }
html .nda-tts-w-on { background-color: #ffd21a !important; color: #000 !important; font-weight: 700 !important; border-radius: 3px; box-shadow: 0 0 0 3px #ffd21a, 0 0 0 5px #b8860b !important; text-decoration: underline !important; text-decoration-thickness: 2px !important; }

/* Division syllabique */
.nda-syl { position: relative; display: inline-block; padding: 0 0 .24em; }
.nda-syl::after { content: ""; position: absolute; left: .5px; right: .5px; bottom: .02em; height: .2em; border: 1.4px solid var(--nda-arc, #d62b1e); border-top: 0; border-radius: 0 0 50% 50% / 0 0 100% 100%; pointer-events: none; }
html.nda-dark, html.nda-contrast, html.nda-yellowblack { --nda-arc: #ff6a5a; }

/* Coloration une ligne sur deux */
html.nda-linecolor body :where(p,li,blockquote,dd,dt,td,figcaption):not(#nda-root *):not([class^="nda-"]):not(:has(p,li,blockquote,dd,dt,td,figcaption)) {
	line-height: 2em !important;
	background-image: repeating-linear-gradient(to bottom, var(--nda-line1, rgba(44,123,182,.3)) 0, var(--nda-line1, rgba(44,123,182,.3)) 2em, var(--nda-line2, rgba(255,210,0,.3)) 2em, var(--nda-line2, rgba(255,210,0,.3)) 4em) !important;
	background-origin: content-box !important;
	background-clip: content-box !important;
	background-attachment: local !important;
	background-color: transparent !important;
}

/* ===================== MODES (sur <html>) ===================== */
html.nda-font-opendyslexic body :where(p,li,a,span,h1,h2,h3,h4,h5,h6,td,th,label,button,input,textarea,blockquote,figcaption,dd,dt):not(#nda-root *):not([class^="nda-"]) { font-family: "ND OpenDyslexic", "Comic Sans MS", Verdana, sans-serif !important; letter-spacing: .02em !important; }
html.nda-font-lexend body :where(p,li,a,span,h1,h2,h3,h4,h5,h6,td,th,label,button,input,textarea,blockquote,figcaption,dd,dt):not(#nda-root *):not([class^="nda-"]) { font-family: "ND Lexend", system-ui, sans-serif !important; }
html.nda-font-atkinson body :where(p,li,a,span,h1,h2,h3,h4,h5,h6,td,th,label,button,input,textarea,blockquote,figcaption,dd,dt):not(#nda-root *):not([class^="nda-"]) { font-family: "ND Atkinson", Verdana, sans-serif !important; }
html.nda-font-andika body :where(p,li,a,span,h1,h2,h3,h4,h5,h6,td,th,label,button,input,textarea,blockquote,figcaption,dd,dt):not(#nda-root *):not([class^="nda-"]) { font-family: "ND Andika", Verdana, sans-serif !important; }
html.nda-font-comic body :where(p,li,a,span,h1,h2,h3,h4,h5,h6,td,th,label,button,input,textarea,blockquote,figcaption,dd,dt):not(#nda-root *):not([class^="nda-"]) { font-family: "Comic Sans MS", "Trebuchet MS", Verdana, sans-serif !important; letter-spacing: .03em !important; }

html.nda-fine body :where(p,li,a,span,h1,h2,h3,h4,h5,h6,td,th,blockquote,dd,dt):not(#nda-root *):not([class^="nda-"]) { line-height: var(--nda-lh, inherit) !important; letter-spacing: var(--nda-ls, normal) !important; word-spacing: var(--nda-ws, normal) !important; }
html.nda-align body :where(p,li,td,blockquote,h1,h2,h3,h4,h5,h6):not(#nda-root *):not([class^="nda-"]) { text-align: left !important; }

html.nda-contrast body, html.nda-contrast body :where(div,section,article,main,header,footer,aside,nav,p,li,ul,ol,table,td,th,span,h1,h2,h3,h4,h5,h6,blockquote,figure):not(#nda-root *):not([class^="nda-"]) { background-color: #000 !important; color: #fff !important; border-color: #fff !important; }
html.nda-contrast body :where(a,a *):not(#nda-root *) { color: #ff0 !important; text-decoration: underline !important; }
html.nda-contrast body :where(button,input,select,textarea):not(#nda-root *):not([class^="nda-"]) { background-color: #000 !important; color: #fff !important; border: 2px solid #fff !important; }

html.nda-yellowblack body, html.nda-yellowblack body :where(div,section,article,main,header,footer,aside,nav,p,li,ul,ol,table,td,th,span,h1,h2,h3,h4,h5,h6,blockquote,figure):not(#nda-root *):not([class^="nda-"]) { background-color: #000 !important; color: #ffff00 !important; border-color: #ffff00 !important; }
html.nda-yellowblack body :where(a,a *):not(#nda-root *) { color: #ffe680 !important; text-decoration: underline !important; }
html.nda-yellowblack body :where(button,input,select,textarea):not(#nda-root *):not([class^="nda-"]) { background-color: #000 !important; color: #ffff00 !important; border: 2px solid #ffff00 !important; }

html.nda-dark body, html.nda-dark body :where(div,section,article,main,header,footer,aside,nav,p,li,ul,ol,table,td,th,blockquote,figure):not(#nda-root *):not([class^="nda-"]) { background-color: #14181d !important; color: #e6e6e6 !important; border-color: #39414a !important; }
html.nda-dark body :where(a,a *):not(#nda-root *) { color: #79b8ff !important; }
html.nda-dark body :where(button,input,select,textarea):not(#nda-root *):not([class^="nda-"]) { background-color: #20262d !important; color: #e6e6e6 !important; border-color: #39414a !important; }

html.nda-light body, html.nda-light body :where(div,section,article,main,header,footer,aside,nav,p,li,ul,ol,table,td,th,blockquote,figure):not(#nda-root *):not([class^="nda-"]) { background-color: #fff !important; color: #111 !important; }
html.nda-light body :where(a,a *):not(#nda-root *) { color: #0b4a82 !important; text-decoration: underline !important; }

html.nda-filtered body > *:not(#nda-root):not(.nda-skip-link):not(.nda-rg):not(.nda-rm-top):not(.nda-rm-bottom):not(.nda-vk):not(.nda-bluelight-overlay):not(.nda-ps):not(.nda-tip):not(script):not(style):not(link) { filter: var(--nda-filter, none); }
html.nda-invert body :where(img,video,picture,iframe,canvas) { filter: invert(1) hue-rotate(180deg); }

html.nda-links body a:not(.nda-skip-link):not(#nda-root *) { outline: 5px dotted var(--nda-links-outline, #b8860b) !important; outline-offset: 3px; background-color: var(--nda-links-bg, #fff3cd) !important; color: var(--nda-links-fg, #5b2c00) !important; text-decoration: underline !important; font-weight: 700 !important; }
html.nda-titles body :where(h1,h2,h3,h4,h5,h6):not(#nda-root *):not([class^="nda-"]) { background: var(--nda-titles-bg, #d6e6fb) !important; color: var(--nda-titles-fg, #0f2a43) !important; outline: 5px dashed var(--nda-titles-outline, #1f6fb2) !important; outline-offset: 3px; }

html.nda-focus body :where(a,button,input,select,textarea,[tabindex]):not(#nda-root *):focus,
html.nda-focus body :where(a,button,input,select,textarea,[tabindex]):not(#nda-root *):focus-visible { outline: 4px solid #d35400 !important; outline-offset: 2px !important; box-shadow: 0 0 0 2px #fff !important; }

html.nda-noanim *, html.nda-noanim *::before, html.nda-noanim *::after { animation-duration: .001s !important; animation-iteration-count: 1 !important; transition-duration: .001s !important; scroll-behavior: auto !important; }

html.nda-hideimg body :where(img,picture,svg,video):not(#nda-root *):not(.nda-rg):not(.nda-rm-top):not(.nda-rm-bottom):not(.nda-ps *) { visibility: hidden !important; }

html.nda-readmode body :where(aside,nav,.sidebar,[role="complementary"],.widget-area,.ads,.advertisement) { display: none !important; }
html.nda-readmode body :where(main,article,.entry-content,.post,.content,#content) { max-width: 760px !important; margin-left: auto !important; margin-right: auto !important; background: #fffef8 !important; color: #1a1a1a !important; line-height: 1.85 !important; font-size: 1.05em !important; }
html.nda-readmode body :where(p,li) { background: transparent !important; }

/* Grandes zones cliquables — nettement plus grandes */
html.nda-bigtargets body :where(a,button,[role="button"],input[type="submit"],input[type="button"],.btn):not(#nda-root *):not([class^="nda-"]) {
	min-height: 56px !important; padding: .75em 1.2em !important; line-height: 1.7 !important; font-size: 1.12em !important;
	letter-spacing: .01em !important; border-radius: 8px !important;
}

/* Grand curseur adaptatif */
html.nda-cursor, html.nda-cursor body, html.nda-cursor body * { cursor: var(--nda-cursor), auto !important; }
html.nda-cursor body :where(p,li,span,h1,h2,h3,h4,h5,h6,td,th,blockquote,article,section,dd,dt,figcaption,input[type="text"],input[type="search"],input[type="email"],input[type="password"],input[type="url"],input[type="tel"],input[type="number"],textarea):not(#nda-root *) { cursor: var(--nda-cursor-text), text !important; }
html.nda-cursor body :where(a,a *,button,button *,[role="button"],[role="button"] *,input[type="submit"],input[type="button"],input[type="checkbox"],input[type="radio"],select,summary,label[for]):not(#nda-root *) { cursor: var(--nda-cursor-link), pointer !important; }

.nda-cb-svg { position: absolute; width: 0; height: 0; overflow: hidden; }

@media (prefers-reduced-motion: reduce) { .nda-launcher, .nda-panel, .nda-tabpanel { transition: none !important; animation: none !important; } }
@media (max-width: 480px) { .nda-panel { width: calc(100vw - 24px); max-height: 78vh; } }

/* ===== Améliorations v1.4 ===== */
.nda-header-right { display: flex; align-items: center; gap: 8px; flex: none; }
.nda-lang { background: var(--lang-bg, rgba(255,255,255,.16)); color: var(--lang-color, #fff); border: 1px solid var(--lang-border, rgba(255,255,255,.4)); border-radius: 8px; font-size: 12px; font-weight: 700; padding: 6px 4px; cursor: pointer; max-width: 96px; }
.nda-lang option { background: var(--lang-opt-bg, #fff); color: var(--lang-opt-color, #1f2733); }
.nda-lang:focus-visible { outline: 3px solid var(--nda-focus); outline-offset: 2px; }

/* Défilement par pointage */
.nda-ps { position: fixed; top: 0; bottom: 0; width: 0; pointer-events: none; z-index: 2147483540; display: none; }
html.nda-pscroll .nda-ps { display: block; }
.nda-ps-btn { position: fixed; width: 56px; height: 56px; border-radius: 50%; border: 2px solid #fff; background: var(--nda-accent, #2C7BB6); color: #fff; cursor: pointer; pointer-events: auto; display: flex; align-items: center; justify-content: center; box-shadow: 0 6px 22px rgba(0,0,0,.32); padding: 0; font-size: 26px; line-height: 1; transition: transform .12s ease, background .12s ease; }
.nda-ps-btn:hover { background: #1f5e8f; transform: scale(1.07); }
html.nda-pscroll-left .nda-ps-btn { left: 18px; }
html.nda-pscroll-right .nda-ps-btn { right: 18px; }
.nda-ps-up { bottom: calc(50% + 5px); }
.nda-ps-down { top: calc(50% + 5px); }

/* Infobulle */
.nda-tip { position: fixed; z-index: 2147483560; max-width: 320px; background: #1f2733; color: #fff; font-size: 16px; line-height: 1.4; font-weight: 600; padding: 8px 12px; border-radius: 8px; box-shadow: 0 8px 26px rgba(0,0,0,.35); pointer-events: none; display: none; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif; }

.nda-step-input { width: 60px; font-size: 14px; font-weight: 800; text-align: center; border: 2px solid var(--nda-accent); border-radius: 6px; padding: 3px 2px; color: var(--nda-text); background: var(--nda-bg, #fff); }
.nda-step-input::-webkit-outer-spin-button, .nda-step-input::-webkit-inner-spin-button { -webkit-appearance: none; margin: 0; }

/* Clavier : redimensionnement + micro */
/* Barre d'outils du clavier (reduire / taille d'origine / fermer) */
.nda-vk-tools { display: flex; align-items: center; gap: 6px; flex: none; }
.nda-vk-tool { background: var(--vk-chrome-bg, rgba(255,255,255,.16)); border: var(--vk-chrome-border, none); color: var(--vk-chrome-color, #fff); width: 30px; height: 30px; border-radius: 7px; font-size: 18px; line-height: 1; cursor: pointer; display: flex; align-items: center; justify-content: center; padding: 0; }
.nda-vk-tool:hover { background: var(--vk-chrome-bg-hover, rgba(255,255,255,.32)); }
.nda-vk-tool:focus-visible { outline: 3px solid var(--nda-focus); outline-offset: 1px; }
.nda-vk-tool svg { width: 17px; height: 17px; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }

/* Poignees de redimensionnement aux 4 coins + equerres */
.nda-vk-grip { position: absolute; width: 20px; height: 20px; z-index: 4; touch-action: none; }
.nda-vk-grip::before { content: ""; position: absolute; width: 11px; height: 11px; border: 0 solid var(--vk-grip, rgba(255,255,255,.8)); }
.nda-vk-grip-tl { top: 1px; left: 1px; cursor: nwse-resize; }
.nda-vk-grip-tl::before { top: 4px; left: 4px; border-top-width: 3px; border-left-width: 3px; border-radius: 4px 0 0 0; }
.nda-vk-grip-tr { top: 1px; right: 1px; cursor: nesw-resize; }
.nda-vk-grip-tr::before { top: 4px; right: 4px; border-top-width: 3px; border-right-width: 3px; border-radius: 0 4px 0 0; }
.nda-vk-grip-bl { bottom: 1px; left: 1px; cursor: nesw-resize; }
.nda-vk-grip-bl::before { bottom: 4px; left: 4px; border-bottom-width: 3px; border-left-width: 3px; border-radius: 0 0 0 4px; }
.nda-vk-grip-br { bottom: 1px; right: 1px; cursor: nwse-resize; }
.nda-vk-grip-br::before { bottom: 4px; right: 4px; border-bottom-width: 3px; border-right-width: 3px; border-radius: 0 0 4px 0; }

/* Mode reduit : ne garder que le micro (+ poignee + rouvrir) */
.nda-vk-mini { display: none; align-items: center; gap: 8px; padding: 2px; cursor: move; }
.nda-vk-mini-grip { color: var(--vk-minigrip, rgba(255,255,255,.55)); font-size: 16px; line-height: 1; padding: 0 2px; cursor: move; user-select: none; letter-spacing: -2px; }
.nda-vk-mini-restore { background: var(--vk-chrome-bg, rgba(255,255,255,.16)); border: var(--vk-chrome-border, none); color: var(--vk-chrome-color, #fff); width: 38px; height: 46px; border-radius: 10px; cursor: pointer; display: flex; align-items: center; justify-content: center; padding: 0; }
.nda-vk-mini-restore:hover { background: var(--vk-chrome-bg-hover, rgba(255,255,255,.32)); }
.nda-vk-mini-restore:focus-visible { outline: 3px solid var(--nda-focus); outline-offset: 1px; }
.nda-vk-mini-restore svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 2.4; stroke-linecap: round; stroke-linejoin: round; }
.nda-vk-mini .nda-vk-mini-mic { flex: 0 0 auto; width: 60px; height: 46px; min-height: 0; border-radius: 10px; }
.nda-vk-mini .nda-vk-mini-mic svg { width: 26px; height: 26px; }
.nda-vk.nda-vk-mini-on { width: auto !important; min-width: 0 !important; padding: 6px; }
.nda-vk.nda-vk-mini-on .nda-vk-bar,
.nda-vk.nda-vk-mini-on .nda-vk-row,
.nda-vk.nda-vk-mini-on .nda-vk-grip { display: none !important; }
.nda-vk.nda-vk-mini-on .nda-vk-mini { display: flex; }
.nda-vk-mic svg { width: calc(20px * var(--nda-vk-scale, 1)); height: calc(20px * var(--nda-vk-scale, 1)); vertical-align: middle; }
.nda-vk-key.nda-vk-mic-on { background: #c0392b !important; box-shadow: 0 0 0 3px rgba(192,57,43,.45) !important; }



/* =================== v1.9.2 : clavier (police de lecture, contraste), grand curseur, panneau =================== */

/* --- Clavier : police identique a la police de lecture (sinon Arial par defaut ci-dessus) --- */
html.nda-font-opendyslexic .nda-vk-key { font-family: "ND OpenDyslexic", "Comic Sans MS", Verdana, sans-serif !important; }
html.nda-font-lexend .nda-vk-key { font-family: "ND Lexend", system-ui, sans-serif !important; }
html.nda-font-atkinson .nda-vk-key { font-family: "ND Atkinson", Verdana, sans-serif !important; }
html.nda-font-andika .nda-vk-key { font-family: "ND Andika", Verdana, sans-serif !important; }
html.nda-font-comic .nda-vk-key { font-family: "Comic Sans MS", "Trebuchet MS", Verdana, sans-serif !important; }

/* --- Themes (contraste) pilotes par variables : clavier + selecteur de langue --- */
html { --vk-bg:#1f2733; --vk-border:none; --vk-title-color:#fff; --vk-title-op:.85; --vk-key-bg:#38424f; --vk-key-color:#fff; --vk-key-border:none; --vk-key-hover-bg:#4a5563; --vk-key-hover-color:var(--vk-key-color); --vk-action-bg:var(--nda-accent); --vk-action-color:var(--vk-key-color); --vk-chrome-bg:rgba(255,255,255,.16); --vk-chrome-bg-hover:rgba(255,255,255,.32); --vk-chrome-color:#fff; --vk-chrome-border:none; --vk-grip:rgba(255,255,255,.8); --vk-minigrip:rgba(255,255,255,.55); --lang-bg:rgba(255,255,255,.16); --lang-color:#fff; --lang-border:rgba(255,255,255,.4); --lang-opt-bg:#fff; --lang-opt-color:#1f2733; }
html.nda-contrast { --vk-bg:#000; --vk-border:2px solid #fff; --vk-title-color:#fff; --vk-title-op:1; --vk-key-bg:#000; --vk-key-color:#fff; --vk-key-border:2px solid #fff; --vk-key-hover-bg:#fff; --vk-key-hover-color:#000; --vk-action-bg:#fff; --vk-action-color:#000; --vk-chrome-bg:#000; --vk-chrome-color:#fff; --vk-chrome-border:2px solid #fff; --vk-grip:#fff; --vk-minigrip:#fff; --lang-bg:#000; --lang-color:#fff; --lang-border:#fff; --lang-opt-bg:#000; --lang-opt-color:#fff; }
html.nda-yellowblack { --vk-bg:#000; --vk-border:2px solid #ff0; --vk-title-color:#ff0; --vk-title-op:1; --vk-key-bg:#000; --vk-key-color:#ff0; --vk-key-border:2px solid #ff0; --vk-key-hover-bg:#ff0; --vk-key-hover-color:#000; --vk-action-bg:#332b00; --vk-action-color:#ff0; --vk-chrome-bg:#000; --vk-chrome-color:#ff0; --vk-chrome-border:2px solid #ff0; --vk-grip:#ff0; --vk-minigrip:#ff0; --lang-bg:#000; --lang-color:#ff0; --lang-border:#ff0; --lang-opt-bg:#000; --lang-opt-color:#ff0; }
html.nda-dark { --vk-bg:#14181d; --vk-border:1px solid #39414a; --vk-key-bg:#20262d; --vk-key-color:#e6e6e6; --vk-key-hover-bg:#2b333c; --lang-bg:#20262d; --lang-color:#e6e6e6; --lang-border:#39414a; --lang-opt-bg:#20262d; --lang-opt-color:#e6e6e6; }
html.nda-light { --vk-bg:#eef1f5; --vk-border:1px solid #c9d2dc; --vk-title-color:#1f2733; --vk-key-bg:#fff; --vk-key-color:#1f2733; --vk-key-border:1px solid #c9d2dc; --vk-key-hover-bg:#e3e9f0; --vk-action-bg:var(--nda-accent); --vk-action-color:#fff; --vk-chrome-bg:#dde4ec; --vk-chrome-color:#1f2733; --vk-grip:#5b6675; --vk-minigrip:#8a93a0; --lang-bg:#fff; --lang-color:#1f2733; --lang-border:#c9d2dc; --lang-opt-bg:#fff; --lang-opt-color:#1f2733; }
/* cas particuliers non reductibles a une variable */
html.nda-contrast .nda-vk-key.nda-vk-mic-on { background: #fff !important; color: #000 !important; box-shadow: 0 0 0 3px #fff !important; }
html.nda-light .nda-vk-key.nda-vk-action { border-color: var(--nda-accent) !important; }


/* --- Grand curseur : double-fleche sur les poignees d'angle, croix de deplacement sur la barre --- */
html.nda-cursor .nda-vk-grip-tl, html.nda-cursor .nda-vk-grip-br { cursor: var(--nda-cursor-rz1), nwse-resize !important; }
html.nda-cursor .nda-vk-grip-tr, html.nda-cursor .nda-vk-grip-bl { cursor: var(--nda-cursor-rz2), nesw-resize !important; }
html.nda-cursor .nda-vk-bar, html.nda-cursor .nda-vk-mini, html.nda-cursor .nda-vk-mini-grip { cursor: var(--nda-cursor-move), move !important; }

/* --- Panneau de reglage : police identique a la police de lecture --- */
html.nda-font-opendyslexic #nda-root, html.nda-font-opendyslexic #nda-root button, html.nda-font-opendyslexic #nda-root input, html.nda-font-opendyslexic #nda-root select, html.nda-font-opendyslexic #nda-root textarea { font-family: "ND OpenDyslexic", "Comic Sans MS", Verdana, sans-serif; }
html.nda-font-lexend #nda-root, html.nda-font-lexend #nda-root button, html.nda-font-lexend #nda-root input, html.nda-font-lexend #nda-root select, html.nda-font-lexend #nda-root textarea { font-family: "ND Lexend", system-ui, sans-serif; }
html.nda-font-atkinson #nda-root, html.nda-font-atkinson #nda-root button, html.nda-font-atkinson #nda-root input, html.nda-font-atkinson #nda-root select, html.nda-font-atkinson #nda-root textarea { font-family: "ND Atkinson", Verdana, sans-serif; }
html.nda-font-andika #nda-root, html.nda-font-andika #nda-root button, html.nda-font-andika #nda-root input, html.nda-font-andika #nda-root select, html.nda-font-andika #nda-root textarea { font-family: "ND Andika", Verdana, sans-serif; }
html.nda-font-comic #nda-root, html.nda-font-comic #nda-root button, html.nda-font-comic #nda-root input, html.nda-font-comic #nda-root select, html.nda-font-comic #nda-root textarea { font-family: "Comic Sans MS", "Trebuchet MS", Verdana, sans-serif; }

/* --- Panneau de reglage : adaptation aux modes de contraste (override des variables) --- */
html.nda-contrast #nda-root { --nda-bg:#000 !important; --nda-panel:#000 !important; --nda-text:#fff !important; --nda-on:#000 !important; --nda-muted:#1c1c1c !important; --nda-muted-2:#2c2c2c !important; --nda-border:#fff !important; --nda-accent:#ffffff !important; --nda-accent-2:#ffffff !important; --nda-focus:#ff0 !important; }
html.nda-yellowblack #nda-root { --nda-bg:#000 !important; --nda-panel:#000 !important; --nda-text:#ff0 !important; --nda-on:#000 !important; --nda-muted:#1a1500 !important; --nda-muted-2:#2a2200 !important; --nda-border:#ff0 !important; --nda-accent:#ffff00 !important; --nda-accent-2:#ffff00 !important; --nda-focus:#ffff00 !important; }
html.nda-dark #nda-root { --nda-bg:#14181d !important; --nda-panel:#14181d !important; --nda-text:#e6e6e6 !important; --nda-on:#ffffff !important; --nda-muted:#20262d !important; --nda-muted-2:#2b333c !important; --nda-border:#39414a !important; --nda-accent:#4aa3df !important; --nda-accent-2:#3fae8f !important; }
html.nda-light #nda-root { --nda-bg:#ffffff; --nda-panel:#ffffff; --nda-text:#111111; }
/* corrections des couleurs de texte codees en dur pour ces modes */
html.nda-contrast #nda-root .nda-hint, html.nda-yellowblack #nda-root .nda-hint, html.nda-dark #nda-root .nda-hint,
html.nda-contrast #nda-root .nda-section-title, html.nda-yellowblack #nda-root .nda-section-title, html.nda-dark #nda-root .nda-section-title,
html.nda-contrast #nda-root .nda-tab, html.nda-yellowblack #nda-root .nda-tab, html.nda-dark #nda-root .nda-tab,
html.nda-contrast #nda-root .nda-fontopt-desc, html.nda-yellowblack #nda-root .nda-fontopt-desc, html.nda-dark #nda-root .nda-fontopt-desc,
html.nda-contrast #nda-root .nda-note, html.nda-yellowblack #nda-root .nda-note, html.nda-dark #nda-root .nda-note,
html.nda-contrast #nda-root .nda-btn-ghost, html.nda-yellowblack #nda-root .nda-btn-ghost, html.nda-dark #nda-root .nda-btn-ghost { color: var(--nda-text) !important; }
/* option de police selectionnee : fond clair code en dur -> adapte */
html.nda-contrast #nda-root .nda-fontopt[aria-pressed="true"], html.nda-yellowblack #nda-root .nda-fontopt[aria-pressed="true"], html.nda-dark #nda-root .nda-fontopt[aria-pressed="true"] { background: var(--nda-muted-2) !important; color: var(--nda-text) !important; border-color: var(--nda-accent) !important; }
html.nda-contrast #nda-root .nda-step-btn, html.nda-yellowblack #nda-root .nda-step-btn, html.nda-dark #nda-root .nda-step-btn { background: var(--nda-bg) !important; }


/* =================== v1.9.3 : point d'etat sur le lanceur (option B) =================== */
.nda-launcher { position: relative; }
.nda-launcher-dot { position: absolute; top: 3px; right: 3px; width: 15px; height: 15px; border-radius: 50%; background: #2E8B6F; border: 2.5px solid #fff; display: none; pointer-events: none; box-shadow: 0 1px 4px rgba(0,0,0,.35); }
.nda-launcher.nda-has-active .nda-launcher-dot { display: block; }
html.nda-contrast #nda-root .nda-launcher-dot, html.nda-yellowblack #nda-root .nda-launcher-dot { background: #2E8B6F; border-color: #000; }


/* (selecteur de langue : desormais pilote par les variables --lang-* ci-dessus) */


/* =================== v2.0.0 : profils personnalisés, jaune/noir strict, encadrement au survol, plan des titres, grandes zones au survol, bouton ajustable/réduit =================== */

/* --- Bouton flottant : décalage X/Y réglable --- */
#nda-root { --nda-off-x: 0px; --nda-off-y: 0px; }
#nda-root.nda-pos-bottom-right { right: calc(22px + var(--nda-off-x)); bottom: calc(22px + var(--nda-off-y)); }
#nda-root.nda-pos-bottom-left  { left: calc(22px + var(--nda-off-x));  bottom: calc(22px + var(--nda-off-y)); }
#nda-root.nda-pos-top-right    { right: calc(22px + var(--nda-off-x)); top: calc(22px + var(--nda-off-y)); }
#nda-root.nda-pos-top-left     { left: calc(22px + var(--nda-off-x));  top: calc(22px + var(--nda-off-y)); }

/* --- Bouton flottant réduit : reprend sa taille au survol ou au focus --- */
#nda-root.nda-mini .nda-launcher { transition: transform .18s ease, box-shadow .18s ease, width .18s ease, height .18s ease; }
#nda-root.nda-mini .nda-launcher svg { transition: width .18s ease, height .18s ease; }
#nda-root.nda-mini .nda-launcher:not(:hover):not(:focus-visible) { width: calc(var(--nda-size) * .58); height: calc(var(--nda-size) * .58); border-width: 2px; }
#nda-root.nda-mini .nda-launcher:not(:hover):not(:focus-visible) svg { width: calc(var(--nda-icon) * .58); height: calc(var(--nda-icon) * .58); }
#nda-root.nda-mini .nda-launcher:not(:hover):not(:focus-visible) .nda-launcher-dot { width: 11px; height: 11px; top: 0; right: 0; }

/* --- Encadrement du bloc survolé --- */
html { --nda-frame: #2C7BB6; }
html.nda-dark { --nda-frame: #79b8ff; }
html.nda-contrast { --nda-frame: #ffffff; }
html.nda-yellowblack { --nda-frame: #ffff00; }
.nda-hoverframe-on { outline: 3px solid var(--nda-frame, #2C7BB6) !important; outline-offset: 2px !important; border-radius: 2px; }

/* --- Grandes zones : contour uniquement au survol / focus --- */
html.nda-bigtargets body :where(a,button,[role="button"],input[type="submit"],input[type="button"],.btn):not(#nda-root *):not([class^="nda-"]):hover,
html.nda-bigtargets body :where(a,button,[role="button"],input[type="submit"],input[type="button"],.btn):not(#nda-root *):not([class^="nda-"]):focus-visible {
	outline: 3px solid var(--nda-frame, #2C7BB6) !important; outline-offset: 2px !important;
}

/* --- Bouton pleine largeur dans le panneau --- */
.nda-btn-block { display: flex; width: 100%; margin-top: 10px; }

/* --- Plan de la page (arborescence des titres) --- */
.nda-toc { display: none; padding: 14px 16px; min-height: 0; }
.nda-toc.nda-active { display: block; flex: 1 1 auto; overflow-y: auto; }
.nda-toc-list { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 4px; }
.nda-toc-item { margin: 0; }
.nda-toc-btn { display: block; width: 100%; text-align: left; background: var(--nda-muted); border: 2px solid transparent; border-radius: 8px; padding: 8px 10px; font-size: 13px; font-weight: 600; color: var(--nda-text); cursor: pointer; overflow-wrap: anywhere; }
.nda-toc-btn:hover { background: var(--nda-muted-2); border-color: var(--nda-accent); }
.nda-toc-btn:focus-visible { outline: 3px solid var(--nda-focus); outline-offset: 2px; }
.nda-toc-lvl { display: inline-block; min-width: 24px; font-size: 10.5px; font-weight: 800; color: var(--nda-accent); margin-right: 6px; }
.nda-toc-empty { font-size: 13px; color: #5b6675; }
html.nda-contrast #nda-root .nda-toc-empty, html.nda-yellowblack #nda-root .nda-toc-empty, html.nda-dark #nda-root .nda-toc-empty { color: var(--nda-text); }
.nda-toc-target { outline: 4px solid var(--nda-frame, #2C7BB6) !important; outline-offset: 3px !important; }

/* --- Profils personnalisés --- */
.nda-cp-wrap { margin-top: 4px; }
.nda-cp-item { position: relative; min-width: 0; display: flex; }
.nda-cp-item .nda-card { width: 100%; }
.nda-cp-emoji { font-size: 26px; line-height: 1; }
.nda-cp-del { position: absolute; top: 4px; right: 4px; width: 22px; height: 22px; border-radius: 50%; border: none; background: rgba(31,39,51,.14); color: inherit; font-size: 14px; line-height: 1; cursor: pointer; display: flex; align-items: center; justify-content: center; padding: 0; }
.nda-cp-del:hover { background: #c0392b; color: #fff; }
.nda-cp-del:focus-visible { outline: 3px solid var(--nda-focus); outline-offset: 1px; }
.nda-cp-form { background: var(--nda-muted); border-radius: var(--nda-radius-sm); padding: 12px; margin-top: 10px; display: none; }
.nda-cp-form.nda-active { display: block; }
.nda-cp-form label { display: block; font-size: 12px; font-weight: 700; margin: 10px 0 5px; }
.nda-cp-form label:first-child { margin-top: 0; }
.nda-cp-name { width: 100%; padding: 9px 10px; font-size: 14px; border: 2px solid var(--nda-border); border-radius: 8px; background: var(--nda-bg); color: var(--nda-text); font-family: inherit; }
.nda-cp-name:focus-visible { outline: 3px solid var(--nda-focus); outline-offset: 1px; border-color: var(--nda-accent); }
.nda-cp-icons { display: grid; grid-template-columns: repeat(6, 1fr); gap: 6px; }
.nda-cp-icon { font-size: 22px; padding: 6px 0; background: var(--nda-bg); border: 2px solid var(--nda-border); border-radius: 8px; cursor: pointer; line-height: 1.2; }
.nda-cp-icon:hover { border-color: var(--nda-accent); }
.nda-cp-icon[aria-pressed="true"] { border-color: var(--nda-accent); box-shadow: 0 0 0 2px color-mix(in srgb, var(--nda-accent) 45%, transparent); }
.nda-cp-icon:focus-visible { outline: 3px solid var(--nda-focus); outline-offset: 1px; }
.nda-cp-actions { display: flex; gap: 8px; margin-top: 12px; }
.nda-cp-err { display: none; margin: 8px 0 0; font-size: 12px; font-weight: 700; color: #c0392b; }
.nda-cp-err.nda-active { display: block; }

/* --- Jaune sur noir : interface strictement jaune et noir (suppression du bleu) --- */
html.nda-yellowblack #nda-root { --nda-focus: #ffff00; }
html.nda-yellowblack #nda-root .nda-header { background: #000; color: #ff0; border-bottom: 2px solid #ff0; }
html.nda-contrast #nda-root .nda-header { background: #000; color: #fff; border-bottom: 2px solid #fff; }
html.nda-yellowblack #nda-root .nda-close, html.nda-contrast #nda-root .nda-close { background: transparent !important; border: 2px solid currentColor !important; }
html.nda-yellowblack #nda-root .nda-launcher-dot { background: #000; border-color: #ff0; }
html.nda-yellowblack #nda-root .nda-card[aria-pressed="true"], html.nda-yellowblack #nda-root .nda-profile[aria-pressed="true"] { box-shadow: none !important; }
html.nda-yellowblack #nda-root .nda-cp-emoji, html.nda-yellowblack #nda-root .nda-cp-icon, html.nda-contrast #nda-root .nda-cp-emoji, html.nda-contrast #nda-root .nda-cp-icon { filter: grayscale(1) contrast(1.1); }
html.nda-yellowblack #nda-root .nda-cp-del { background: #000 !important; border: 2px solid #ff0 !important; color: #ff0 !important; }
html.nda-yellowblack #nda-root .nda-cp-del:hover { background: #ff0 !important; color: #000 !important; }
html.nda-yellowblack .nda-rg { border-top-color: #ff0; background: rgba(255,255,0,.25); }
html.nda-yellowblack body .nda-ps-btn { background: #000 !important; color: #ff0 !important; border-color: #ff0 !important; }
html.nda-yellowblack body .nda-ps-btn:hover { background: #ff0 !important; color: #000 !important; }
html.nda-yellowblack .nda-skip-link { background: #000; color: #ff0; outline: 2px solid #ff0; }
html.nda-yellowblack .nda-tip, html.nda-yellowblack .nda-mag { background: #000 !important; color: #ff0 !important; box-shadow: 0 0 0 2px #ff0, 0 8px 26px rgba(0,0,0,.6) !important; }
html.nda-yellowblack.nda-linecolor body :where(p,li,blockquote,dd,dt,td,figcaption):not(#nda-root *):not([class^="nda-"]):not(:has(p,li,blockquote,dd,dt,td,figcaption)) { background-image: repeating-linear-gradient(to bottom, rgba(255,255,0,0) 0, rgba(255,255,0,0) 2em, rgba(255,255,0,.18) 2em, rgba(255,255,0,.18) 4em) !important; }
html.nda-yellowblack.nda-links body a:not(.nda-skip-link):not(#nda-root *) { outline-color: #ff0 !important; background-color: #ff0 !important; color: #000 !important; }
html.nda-yellowblack.nda-titles body :where(h1,h2,h3,h4,h5,h6):not(#nda-root *):not([class^="nda-"]) { background: #ff0 !important; color: #000 !important; outline: 5px dashed #ff0 !important; }
html.nda-yellowblack.nda-focus body :where(a,button,input,select,textarea,[tabindex]):not(#nda-root *):focus,
html.nda-yellowblack.nda-focus body :where(a,button,input,select,textarea,[tabindex]):not(#nda-root *):focus-visible { outline-color: #ff0 !important; box-shadow: 0 0 0 2px #000 !important; }
html.nda-yellowblack .nda-syl::after { border-color: #ff0; }

/* --- v2.0.1 : la taille du texte s'applique aussi à l'interface du panneau --- */
.nda-panel { zoom: var(--nda-ui-scale, 1); max-width: calc((100vw - 32px) / var(--nda-ui-scale, 1)); }
@media (max-width: 480px) { .nda-panel { width: calc((100vw - 24px) / var(--nda-ui-scale, 1)); } }

/* --- v2.0.2/2.0.3 : panneau flottant (option) + barres de défilement selon le contraste --- */
#nda-root.nda-float .nda-header { cursor: move; user-select: none; touch-action: none; }
#nda-root.nda-float .nda-header .nda-close, #nda-root.nda-float .nda-header .nda-lang { cursor: pointer; }
html.nda-cursor #nda-root.nda-float .nda-header { cursor: var(--nda-cursor-move), move !important; }
html.nda-contrast, html.nda-contrast .nda-body, html.nda-contrast .nda-toc { scrollbar-color: #000 #fff; }
html.nda-yellowblack, html.nda-yellowblack .nda-body, html.nda-yellowblack .nda-toc { scrollbar-color: #000 #ff0; }

/* --- v2.0.4 : compensation d'échelle — le panneau ne déborde jamais de l'écran --- */
.nda-panel { max-height: calc(min(82vh, 680px) / var(--nda-ui-scale, 1)); }
#nda-root.nda-pos-bottom-right .nda-panel, #nda-root.nda-pos-bottom-left .nda-panel { bottom: calc((var(--nda-size) + 16px) / var(--nda-ui-scale, 1)); }
#nda-root.nda-pos-top-right .nda-panel, #nda-root.nda-pos-top-left .nda-panel { top: calc((var(--nda-size) + 16px) / var(--nda-ui-scale, 1)); }
@media (max-width: 480px) { .nda-panel { max-height: calc(78vh / var(--nda-ui-scale, 1)); } }

/* =================== v2.0.9 (WordPress) : blindage contre le CSS du thème =================== */
/* Chaque composant interactif est verrouillé (#nda-root + !important), piloté par les variables
   de l'extension : le thème du site ne peut plus modifier couleurs, fonds ni contours. */

#nda-root button, #nda-root input, #nda-root select, #nda-root textarea {
	font-family: inherit !important; text-transform: none !important; letter-spacing: normal !important;
	text-shadow: none !important; text-decoration: none !important; margin: 0 !important;
}
#nda-root a, #nda-root a:hover { text-decoration: none !important; }

/* Lanceur */
#nda-root .nda-launcher { background: var(--nda-accent) !important; color: var(--nda-on) !important; border: 3px solid var(--nda-on) !important; }
#nda-root .nda-launcher svg { fill: currentColor !important; }

/* Onglets */
#nda-root .nda-tab { background: transparent !important; color: #5b6675 !important; border: none !important; border-bottom: 3px solid transparent !important; box-shadow: none !important; border-radius: 8px 8px 0 0 !important; }
#nda-root .nda-tab:hover { color: var(--nda-accent) !important; background: var(--nda-muted-2) !important; }
#nda-root .nda-tab[aria-selected="true"] { color: var(--nda-accent) !important; border-bottom-color: var(--nda-accent) !important; background: transparent !important; }
#nda-root .nda-tab svg { fill: currentColor !important; }
html.nda-contrast #nda-root .nda-tab, html.nda-yellowblack #nda-root .nda-tab, html.nda-dark #nda-root .nda-tab { color: var(--nda-text) !important; }
html.nda-contrast #nda-root .nda-tab[aria-selected="true"], html.nda-yellowblack #nda-root .nda-tab[aria-selected="true"], html.nda-dark #nda-root .nda-tab[aria-selected="true"] { color: var(--nda-accent) !important; }

/* Cartes */
#nda-root .nda-card { background: var(--nda-muted) !important; color: var(--nda-text) !important; border: 2px solid transparent !important; border-radius: var(--nda-radius-sm) !important; box-shadow: none !important; }
#nda-root .nda-card:hover { background: var(--nda-muted-2) !important; color: var(--nda-text) !important; }
#nda-root .nda-card svg, #nda-root .nda-card:hover svg { fill: var(--nda-accent) !important; }
#nda-root .nda-card[aria-pressed="true"], #nda-root .nda-card[aria-pressed="true"]:hover { background: var(--nda-accent) !important; color: var(--nda-on) !important; border-color: var(--nda-accent) !important; box-shadow: 0 4px 14px color-mix(in srgb, var(--nda-accent) 40%, transparent) !important; }
#nda-root .nda-card[aria-pressed="true"] svg { fill: var(--nda-on) !important; }

/* Segments, sélecteur de police, stepper */
#nda-root .nda-seg-btn { background: transparent !important; color: var(--nda-text) !important; border: 2px solid transparent !important; box-shadow: none !important; }
#nda-root .nda-seg-btn:hover { background: var(--nda-muted-2) !important; color: var(--nda-text) !important; }
#nda-root .nda-seg-btn[aria-pressed="true"], #nda-root .nda-seg-btn[aria-pressed="true"]:hover { background: var(--nda-accent) !important; color: var(--nda-on) !important; border-color: var(--nda-accent) !important; }
#nda-root .nda-fontopt { background: var(--nda-muted) !important; color: var(--nda-text) !important; border: 2px solid transparent !important; box-shadow: none !important; }
#nda-root .nda-fontopt:hover { background: var(--nda-muted-2) !important; color: var(--nda-text) !important; }
#nda-root .nda-fontopt[aria-pressed="true"] { border-color: var(--nda-accent) !important; }
#nda-root .nda-step-btn { background: var(--nda-bg) !important; color: var(--nda-accent) !important; border: 2px solid var(--nda-accent) !important; }
#nda-root .nda-step-btn:hover { background: var(--nda-accent) !important; color: var(--nda-on) !important; }
#nda-root .nda-step-input, #nda-root .nda-cp-name, #nda-root .nda-report textarea { background: var(--nda-bg) !important; color: var(--nda-text) !important; }
#nda-root input[type="range"] { accent-color: var(--nda-accent) !important; background: transparent !important; border: none !important; box-shadow: none !important; }

/* Boutons du pied de panneau + plan + profils personnalisés */
#nda-root .nda-btn { background: var(--nda-bg) !important; color: var(--nda-accent) !important; border: 2px solid var(--nda-accent) !important; box-shadow: none !important; }
#nda-root .nda-btn:hover { background: var(--nda-accent) !important; color: var(--nda-on) !important; }
#nda-root .nda-btn svg { fill: currentColor !important; }
#nda-root .nda-btn-ghost { background: var(--nda-bg) !important; color: #5b6675 !important; border-color: var(--nda-border) !important; }
#nda-root .nda-btn-ghost:hover { background: var(--nda-muted-2) !important; color: var(--nda-text) !important; }
html.nda-contrast #nda-root .nda-btn-ghost, html.nda-yellowblack #nda-root .nda-btn-ghost, html.nda-dark #nda-root .nda-btn-ghost { color: var(--nda-text) !important; }
#nda-root .nda-toc-btn { background: var(--nda-muted) !important; color: var(--nda-text) !important; border: 2px solid transparent !important; }
#nda-root .nda-toc-btn:hover { background: var(--nda-muted-2) !important; color: var(--nda-text) !important; border-color: var(--nda-accent) !important; }
#nda-root .nda-cp-icon { background: var(--nda-bg) !important; border: 2px solid var(--nda-border) !important; box-shadow: none !important; }
#nda-root .nda-cp-icon:hover { border-color: var(--nda-accent) !important; }
#nda-root .nda-cp-icon[aria-pressed="true"] { border-color: var(--nda-accent) !important; }
#nda-root .nda-cp-del { background: rgba(31,39,51,.14) !important; color: inherit !important; border: none !important; }
#nda-root .nda-cp-del:hover { background: #c0392b !important; color: #fff !important; }
#nda-root .nda-close { background: rgba(255,255,255,.14) !important; color: inherit !important; border: 2px solid transparent !important; }
#nda-root .nda-close:hover { background: rgba(255,255,255,.28) !important; }
#nda-root .nda-lang { background: var(--lang-bg, rgba(255,255,255,.16)) !important; color: var(--lang-color, #fff) !important; border: 1px solid var(--lang-border, rgba(255,255,255,.4)) !important; }

/* Éléments hors panneau (clavier virtuel, défilement par pointage) */
.nda-vk-key { background: var(--vk-key-bg, #38424f) !important; color: var(--vk-key-color, #fff) !important; border: var(--vk-key-border, none) !important; text-transform: none !important; text-shadow: none !important; }
.nda-vk-key:hover { background: var(--vk-key-hover-bg, #4a5563) !important; color: var(--vk-key-hover-color, var(--vk-key-color, #fff)) !important; }
.nda-vk-key.nda-vk-action { background: var(--vk-action-bg, var(--nda-accent)) !important; color: var(--vk-action-color, var(--vk-key-color, #fff)) !important; }
.nda-ps-btn { background: var(--nda-accent, #2C7BB6) !important; color: #fff !important; border: 2px solid #fff !important; }

/* --- v2.0.10 (WordPress) : clavier virtuel — mise en page verrouillée, identique à l'extension Chrome --- */
.nda-vk, .nda-vk * { box-sizing: border-box !important; }
.nda-vk { position: fixed !important; padding: 8px !important; margin: 0 !important; border-radius: 14px !important; background: var(--vk-bg, #1f2733) !important; border: var(--vk-border, none) !important; box-shadow: 0 14px 44px rgba(0,0,0,.45) !important; z-index: 2147483560 !important; max-width: none !important; }
.nda-vk-bar { display: flex !important; align-items: center !important; justify-content: space-between !important; gap: 8px !important; padding: 2px 22px 8px !important; margin: 0 !important; background: transparent !important; border: none !important; }
.nda-vk-title { font-size: 13px !important; font-weight: 700 !important; color: var(--vk-title-color, #fff) !important; margin: 0 !important; padding: 0 !important; background: transparent !important; }
.nda-vk-tools { display: flex !important; align-items: center !important; gap: 6px !important; margin: 0 !important; padding: 0 !important; }
.nda-vk-tool, .nda-vk-close { width: 30px !important; height: 30px !important; min-height: 0 !important; padding: 0 !important; margin: 0 !important; border-radius: 7px !important; display: flex !important; align-items: center !important; justify-content: center !important; background: var(--vk-chrome-bg, rgba(255,255,255,.16)) !important; color: var(--vk-chrome-color, #fff) !important; border: var(--vk-chrome-border, none) !important; box-shadow: none !important; }
.nda-vk-tool:hover, .nda-vk-close:hover { background: var(--vk-chrome-bg-hover, rgba(255,255,255,.32)) !important; }
.nda-vk-row { display: flex !important; flex-wrap: nowrap !important; gap: 5px !important; justify-content: center !important; margin: 0 0 5px !important; padding: 0 !important; list-style: none !important; }
.nda-vk-key { flex: 1 1 0 !important; min-width: 0 !important; width: auto !important; height: auto !important; min-height: calc(58px * var(--nda-vk-scale, 1)) !important; padding: 0 !important; margin: 0 !important; border-radius: 7px !important; font-size: calc(32px * var(--nda-vk-scale, 1)) !important; font-weight: 600 !important; line-height: 1 !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; cursor: pointer !important; box-shadow: none !important; opacity: 1 !important; }
.nda-vk-key.nda-vk-wide { flex: 1.6 1 0 !important; font-size: calc(20px * var(--nda-vk-scale, 1)) !important; }
.nda-vk-key.nda-vk-space { flex: 6 1 0 !important; }
.nda-vk-key:focus-visible { outline: 3px solid var(--nda-focus, #ffb000) !important; outline-offset: 1px !important; }
.nda-vk-key[aria-pressed="true"] { box-shadow: inset 0 0 0 2px #fff !important; }
.nda-vk-mini { gap: 8px !important; padding: 2px !important; margin: 0 !important; }
.nda-vk-mini-restore, .nda-vk-mini .nda-vk-mini-mic { min-height: 0 !important; margin: 0 !important; }

/* --- v2.0.11 : message d'information du micro (dictée indisponible / micro refusé) --- */
.nda-vk-toast { position: absolute !important; left: 50% !important; bottom: calc(100% + 10px) !important; transform: translateX(-50%) !important; width: max-content !important; max-width: min(92vw, 480px) !important; background: #1f2733 !important; color: #fff !important; font-size: 15px !important; font-weight: 600 !important; line-height: 1.4 !important; padding: 10px 14px !important; border-radius: 10px !important; box-shadow: 0 8px 26px rgba(0,0,0,.4) !important; text-align: center !important; opacity: 0; pointer-events: none; transition: opacity .2s ease; z-index: 2147483561 !important; }
.nda-vk-toast.nda-on { opacity: 1; }
html.nda-yellowblack .nda-vk-toast { background: #000 !important; color: #ff0 !important; box-shadow: 0 0 0 2px #ff0 !important; }
html.nda-contrast .nda-vk-toast { background: #000 !important; color: #fff !important; box-shadow: 0 0 0 2px #fff !important; }