/*! Democratic choice — styles. Tout est préfixé .dc pour ne pas interférer avec le thème. */

.dchoice-app {
	--dchoice-accent: #2563eb;
	--dchoice-on-accent: #ffffff;
	--dchoice-ink: #0f172a;
	--dchoice-ink-2: #475569;
	--dchoice-muted: #64748b;
	--dchoice-line: #e5e7eb;
	--dchoice-line-2: #d1d5db;
	--dchoice-surface: #ffffff;
	--dchoice-bg: #f1f5f9;
	--dchoice-soft: color-mix(in srgb, var(--dchoice-accent) 8%, var(--dchoice-surface));
	--dchoice-soft-2: color-mix(in srgb, var(--dchoice-accent) 15%, var(--dchoice-surface));
	--dchoice-accent-ink: color-mix(in srgb, var(--dchoice-accent) 82%, #000000);
	--dchoice-warn: #a85d06;
	--dchoice-warn-soft: #fff5e6;
	--dchoice-ok: #1c7a4c;
	--dchoice-radius: 12px;
	--dchoice-radius-sm: 8px;
	--dchoice-shadow: 0 1px 2px rgba(15, 23, 42, .05);
	--dchoice-shadow-hover: 0 4px 14px rgba(15, 23, 42, .08);
	--dchoice-fs: 16px;
	--dchoice-ease: cubic-bezier(.2, .7, .2, 1);

	position: relative;
	max-width: none;
	margin: 1.5em 0;
	color: var(--dchoice-ink);
	font-family: inherit;
	font-size: var(--dchoice-fs, 16px);
	container: dchoice / inline-size;
	line-height: 1.55;
	text-align: left;
	-webkit-font-smoothing: antialiased;
}

.dchoice-app *,
.dchoice-app *::before,
.dchoice-app *::after { box-sizing: border-box; }

/* Réinitialisations à spécificité réelle (0,1,1) : elles battent les styles d'éléments du thème,
   et les classes des composants (0,2,0) passent ensuite par-dessus. */
.dchoice-app h2, .dchoice-app h3, .dchoice-app p, .dchoice-app ul, .dchoice-app li, .dchoice-app details, .dchoice-app summary, .dchoice-app figure, .dchoice-app figcaption {
	margin: 0; padding: 0; border: 0; background: none;
	font-family: inherit; color: inherit; text-decoration: none; text-transform: none; letter-spacing: normal;
}
.dchoice-app h2, .dchoice-app h3 { color: var(--dchoice-ink); line-height: 1.2; }
.dchoice-app ul, .dchoice-app li { list-style: none; }
.dchoice-app li::marker { content: none; }
.dchoice-app a, .dchoice-app a:hover, .dchoice-app a:focus { text-decoration: none; box-shadow: none; }
.dchoice-app button {
	font: inherit; letter-spacing: normal; text-transform: none; text-shadow: none; box-shadow: none;
	margin: 0; padding: 0; border-radius: 0; background: none; border: 0; color: inherit; cursor: pointer; line-height: 1.3;
	-webkit-appearance: none; appearance: none; width: auto; min-height: 0;
}
.dchoice-app .dchoice-ico { width: 1.25em; height: 1.25em; flex: none; display: inline-block; vertical-align: middle; }
.dchoice-app .dchoice-sr { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.dchoice-app :focus-visible { outline: 3px solid color-mix(in srgb, var(--dchoice-accent) 45%, transparent); outline-offset: 2px; }
.dchoice-app [tabindex="-1"]:focus { outline: none; }

/* ------------------------------------------------------------------ */
/* Cartes, titres                                                      */
/* ------------------------------------------------------------------ */
.dchoice-app .dchoice-card {
	background: var(--dchoice-surface);
	border: var(--dchoice-bw, 1px) solid var(--dchoice-line);
	border-radius: var(--dchoice-radius);
	box-shadow: var(--dchoice-shadow);
	padding: clamp(22px, 4.5vw, 44px);
}
.dchoice-app .dchoice-card + .dchoice-card,
.dchoice-app .dchoice-pair,
.dchoice-app .dchoice-others,
.dchoice-app .dchoice-foot { margin-top: 16px; }

.dchoice-app .dchoice-eyebrow {
	display: inline-flex; align-items: center; gap: 8px;
	font-size: calc(var(--dchoice-fs, 16px) * 0.8125); font-weight: 600; letter-spacing: .04em; text-transform: uppercase;
	color: var(--dchoice-accent-ink);
}
.dchoice-app .dchoice-eyebrow .dchoice-ico { width: 18px; height: 18px; }
.dchoice-app .dchoice-eyebrow--warn { color: var(--dchoice-warn); }

.dchoice-app .dchoice-title {
	margin-top: 14px;
	font-size: clamp(28px, 4.6vw, 40px); line-height: 1.12; font-weight: 700; letter-spacing: -.02em;
	color: var(--dchoice-ink);
}
.dchoice-app .dchoice-lead { margin-top: 14px; font-size: clamp(16px, 2.2vw, 18px); color: var(--dchoice-ink-2); max-width: 36em; }
.dchoice-app .dchoice-h3 { font-size: calc(var(--dchoice-fs, 16px) * 0.9375); font-weight: 700; color: var(--dchoice-ink); margin-bottom: 12px; }
.dchoice-app .dchoice-muted { color: var(--dchoice-muted); font-size: calc(var(--dchoice-fs, 16px) * 0.875); }

/* ------------------------------------------------------------------ */
/* Intro                                                               */
/* ------------------------------------------------------------------ */
.dchoice-app .dchoice-intro { position: relative; overflow: hidden; }
.dchoice-app .dchoice-intro::before {
	content: ""; position: absolute; inset: 0 0 auto auto; width: 340px; height: 340px; pointer-events: none;
	background: radial-gradient(circle at 70% 30%, var(--dchoice-soft-2), transparent 65%);
	transform: translate(30%, -35%);
}
.dchoice-app .dchoice-intro > * { position: relative; }
.dchoice-app .dchoice-meta { display: flex; flex-wrap: wrap; gap: 8px 22px; margin-top: 22px; color: var(--dchoice-ink-2); font-size: calc(var(--dchoice-fs, 16px) * 0.9375); }
.dchoice-app .dchoice-meta li { display: inline-flex; align-items: center; gap: 8px; }
.dchoice-app .dchoice-meta .dchoice-ico { color: var(--dchoice-accent); width: 18px; height: 18px; }
.dchoice-app .dchoice-strip { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 28px; }
.dchoice-app .dchoice-strip li { position: relative; }
.dchoice-app .dchoice-strip-item {
	width: 48px; height: 48px; border-radius: 14px; display: grid; place-items: center;
	background: var(--dchoice-soft); color: var(--dchoice-accent-ink);
	transition: transform .25s var(--dchoice-ease), background .25s, color .25s, box-shadow .25s;
}
.dchoice-app .dchoice-strip-item:hover, .dchoice-app .dchoice-strip-item:focus-visible {
	transform: translateY(-3px); background: var(--dchoice-accent); color: var(--dchoice-on-accent);
	box-shadow: 0 8px 18px -10px color-mix(in srgb, var(--dchoice-accent) 80%, transparent);
}
.dchoice-app .dchoice-strip-item .dchoice-ico { width: 22px; height: 22px; }
.dchoice-app .dchoice-strip-name {
	position: absolute; left: 50%; bottom: calc(100% + 8px); transform: translate(-50%, 4px);
	padding: 5px 9px; border-radius: 8px; background: var(--dchoice-ink); color: #fff;
	font-size: calc(var(--dchoice-fs, 16px) * 0.75); font-weight: 600; line-height: 1.3; white-space: nowrap; pointer-events: none;
	opacity: 0; transition: opacity .18s, transform .18s var(--dchoice-ease); z-index: 2;
}
.dchoice-app .dchoice-strip-item:hover .dchoice-strip-name, .dchoice-app .dchoice-strip-item:focus-visible .dchoice-strip-name { opacity: 1; transform: translate(-50%, 0); }
.dchoice-app .dchoice-strip-hint { margin-top: 12px; font-size: calc(var(--dchoice-fs, 16px) * 0.8125); color: var(--dchoice-muted); }

/* ------------------------------------------------------------------ */
/* Boutons                                                             */
/* ------------------------------------------------------------------ */
.dchoice-app .dchoice-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 30px; }
.dchoice-app .dchoice-vote-note { display: flex; align-items: flex-start; gap: 8px; margin: 12px 0 0; color: var(--dchoice-ink-2, #475569); font-size: calc(var(--dchoice-fs, 16px) * 0.875); }
.dchoice-app .dchoice-vote-note .dchoice-ico { flex: none; width: 16px; height: 16px; margin-top: 2px; color: var(--dchoice-accent); }
.dchoice-app .dchoice-btn {
	display: inline-flex; align-items: center; justify-content: center; gap: 10px;
	padding: 13px 22px; border-radius: var(--dchoice-radius-btn, 8px); font-size: calc(var(--dchoice-fs, 16px) * 1); font-weight: 600; line-height: 1.2;
	transition: background .2s, color .2s, transform .2s var(--dchoice-ease), box-shadow .2s, opacity .2s;
	text-decoration: none;
}
.dchoice-app .dchoice-btn .dchoice-ico { width: 18px; height: 18px; }
.dchoice-app .dchoice-btn-primary { background: var(--dchoice-accent); color: var(--dchoice-on-accent); box-shadow: 0 6px 18px -8px color-mix(in srgb, var(--dchoice-accent) 70%, transparent); }
.dchoice-app .dchoice-btn-primary:hover { background: color-mix(in srgb, var(--dchoice-accent) 86%, #000); color: var(--dchoice-on-accent); transform: translateY(-1px); }
.dchoice-app .dchoice-btn-primary:hover .dchoice-ico:last-child { transform: translateX(2px); }
.dchoice-app .dchoice-btn-primary .dchoice-ico { transition: transform .2s var(--dchoice-ease); }
.dchoice-app .dchoice-btn-primary[disabled] { opacity: .35; cursor: not-allowed; transform: none; box-shadow: none; }
.dchoice-app .dchoice-btn-soft { background: var(--dchoice-soft); color: var(--dchoice-accent-ink); }
.dchoice-app .dchoice-btn-soft:hover { background: var(--dchoice-soft-2); }
.dchoice-app .dchoice-btn-ghost { color: var(--dchoice-muted); padding-left: 10px; padding-right: 14px; }
.dchoice-app .dchoice-btn-ghost:hover { color: var(--dchoice-ink); background: var(--dchoice-bg); }
.dchoice-app .dchoice-link {
	display: inline-flex; align-items: center; gap: 7px; margin-top: 12px;
	font-size: calc(var(--dchoice-fs, 16px) * 0.9375); font-weight: 600; color: var(--dchoice-accent-ink);
	border-bottom: 1.5px solid transparent; transition: border-color .2s;
}
.dchoice-app .dchoice-link:hover { border-bottom-color: currentColor; color: var(--dchoice-accent-ink); }
.dchoice-app .dchoice-link .dchoice-ico { width: 17px; height: 17px; }
.dchoice-app .dchoice-ico.dchoice-ico-ext { width: 13px; height: 13px; opacity: .7; margin-left: -2px; }

/* ------------------------------------------------------------------ */
/* Questions                                                           */
/* ------------------------------------------------------------------ */
.dchoice-app .dchoice-progress { display: flex; align-items: center; gap: 16px; margin-bottom: 26px; }
.dchoice-app .dchoice-progress-label { font-size: calc(var(--dchoice-fs, 16px) * 0.8125); font-weight: 600; color: var(--dchoice-muted); white-space: nowrap; font-variant-numeric: tabular-nums; }
.dchoice-app .dchoice-progress-bar { display: flex; gap: 6px; flex: 1; }
.dchoice-app .dchoice-seg { flex: 1; height: 5px; border-radius: 9px; background: var(--dchoice-line); transition: background .35s var(--dchoice-ease); }
.dchoice-app .dchoice-seg.is-done { background: var(--dchoice-accent); }
.dchoice-app .dchoice-seg.is-current { background: color-mix(in srgb, var(--dchoice-accent) 45%, var(--dchoice-line)); }

.dchoice-app .dchoice-q-title { font-size: clamp(22px, 3.4vw, 28px); line-height: 1.2; font-weight: 700; letter-spacing: -.015em; }
.dchoice-app .dchoice-q-help { margin-top: 8px; color: var(--dchoice-muted); }

.dchoice-app .dchoice-grid { display: grid; gap: 12px; margin-top: 24px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.dchoice-app .dchoice-grid--options { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.dchoice-app .dchoice-grid--taille { grid-template-columns: repeat(3, minmax(0, 1fr)); margin-top: 10px; }
.dchoice-app .dchoice-grid--numerique { grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 10px; }
.dchoice-app .dchoice-grid--objectifs > :last-child:nth-child(odd),
.dchoice-app .dchoice-grid--risque > :last-child:nth-child(odd) { grid-column: 1 / -1; }

.dchoice-app .dchoice-opt {
	position: relative; display: flex; align-items: flex-start; gap: 14px; width: 100%;
	padding: 16px 44px 16px 16px; text-align: left;
	background: var(--dchoice-surface); border: 1.5px solid var(--dchoice-line); border-radius: var(--dchoice-radius-sm);
	color: var(--dchoice-ink);
	transition: border-color .2s, background .2s, transform .2s var(--dchoice-ease), box-shadow .2s;
}
.dchoice-app .dchoice-opt:hover { border-color: var(--dchoice-hover-line, color-mix(in srgb, var(--dchoice-accent) 45%, var(--dchoice-line))); transform: translateY(var(--dchoice-hover-y, -1px)); box-shadow: var(--dchoice-hover-glow, 0 0 #0000), var(--dchoice-shadow-hover, 0 6px 16px -10px rgba(20, 28, 50, .25)); }
.dchoice-app .dchoice-opt.is-selected { border-color: var(--dchoice-accent); background: var(--dchoice-soft); }
.dchoice-app .dchoice-opt-ico {
	width: 42px; height: 42px; border-radius: 12px; flex: none; display: grid; place-items: center;
	background: var(--dchoice-soft); color: var(--dchoice-accent-ink); transition: background .2s, color .2s;
}
.dchoice-app .dchoice-opt-ico .dchoice-ico { width: 22px; height: 22px; }
.dchoice-app .dchoice-opt.is-selected .dchoice-opt-ico { background: var(--dchoice-accent); color: var(--dchoice-on-accent); }
.dchoice-app .dchoice-opt-text { display: flex; flex-direction: column; gap: 3px; padding-top: 1px; min-width: 0; }
.dchoice-app .dchoice-opt-label { font-weight: 650; font-size: calc(var(--dchoice-fs, 16px) * 1); }
.dchoice-app .dchoice-opt-hint { font-size: calc(var(--dchoice-fs, 16px) * 0.875); color: var(--dchoice-muted); line-height: 1.4; }
.dchoice-app .dchoice-opt-tick {
	position: absolute; top: 14px; right: 14px; width: 22px; height: 22px; border-radius: 50%;
	display: grid; place-items: center; border: 1.5px solid var(--dchoice-line-2); color: transparent;
	transition: background .2s, border-color .2s, color .2s, transform .25s var(--dchoice-ease);
}
.dchoice-app .dchoice-opt-tick .dchoice-ico { width: 13px; height: 13px; stroke-width: 3; }
.dchoice-app .dchoice-opt.is-selected .dchoice-opt-tick { background: var(--dchoice-accent); border-color: var(--dchoice-accent); color: var(--dchoice-on-accent); transform: scale(1.05); }

.dchoice-app .dchoice-opt--num { flex-direction: column; gap: 6px; padding: 20px 18px; }
.dchoice-app .dchoice-opt-num { font-size: calc(var(--dchoice-fs, 16px) * 1.875); font-weight: 750; letter-spacing: -.02em; color: var(--dchoice-accent-ink); line-height: 1; }
.dchoice-app .dchoice-opt--compact { align-items: center; padding: 12px 40px 12px 12px; }
.dchoice-app .dchoice-opt--compact .dchoice-opt-ico { width: 36px; height: 36px; border-radius: 10px; }
.dchoice-app .dchoice-opt--compact .dchoice-opt-tick { top: 50%; margin-top: -11px; }

.dchoice-app .dchoice-sub { margin-top: 26px; }
.dchoice-app .dchoice-sub-label { font-size: calc(var(--dchoice-fs, 16px) * 0.875); font-weight: 650; color: var(--dchoice-ink-2); }
.dchoice-app .dchoice-counter { margin-top: 12px; font-size: calc(var(--dchoice-fs, 16px) * 0.8125); color: var(--dchoice-muted); font-variant-numeric: tabular-nums; }

.dchoice-app .dchoice-nav { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-top: 30px; flex-wrap: wrap; }

/* ------------------------------------------------------------------ */
/* Résultat                                                            */
/* ------------------------------------------------------------------ */
.dchoice-app .dchoice-recap { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 16px; }
.dchoice-app .dchoice-chip {
	display: inline-flex; align-items: baseline; gap: 7px; padding: 7px 12px; border-radius: 999px;
	background: var(--dchoice-surface); border: 1px solid var(--dchoice-line); font-size: calc(var(--dchoice-fs, 16px) * 0.875); color: var(--dchoice-ink);
	transition: border-color .2s, background .2s;
}
.dchoice-app .dchoice-chip:hover:not([disabled]) { border-color: var(--dchoice-accent); background: var(--dchoice-soft); }
.dchoice-app .dchoice-chip.is-empty { background: transparent; border-style: dashed; border-color: var(--dchoice-line-2); color: var(--dchoice-muted); }
.dchoice-app .dchoice-chip[disabled] { cursor: default; opacity: .7; }
.dchoice-app .dchoice-chip.is-current { border: 1.5px solid var(--dchoice-accent); background: var(--dchoice-surface); box-shadow: 0 0 0 3px color-mix(in srgb, var(--dchoice-accent) 14%, transparent); }
.dchoice-app .dchoice-chip.is-current .dchoice-chip-k { color: var(--dchoice-accent-ink); }
.dchoice-app .dchoice-in .dchoice-recap .dchoice-chip { animation: none; }
.dchoice-app .dchoice-chip-k { font-size: calc(var(--dchoice-fs, 16px) * 0.6875); font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--dchoice-muted); }
.dchoice-app .dchoice-chip-edit { width: 13px; height: 13px; color: var(--dchoice-muted); align-self: center; opacity: 0; transition: opacity .2s; }
.dchoice-app .dchoice-chip:hover .dchoice-chip-edit,
.dchoice-app .dchoice-chip:focus-visible .dchoice-chip-edit { opacity: 1; }

.dchoice-app .dchoice-hero { position: relative; overflow: visible; border-color: color-mix(in srgb, var(--dchoice-accent) 30%, var(--dchoice-line)); }
.dchoice-app .dchoice-hero::before {
	content: ""; position: absolute; left: 0; right: 0; top: 0; height: 5px; background: var(--dchoice-accent);
	border-radius: max(0px, calc(var(--dchoice-radius) - var(--dchoice-bw, 1px))) max(0px, calc(var(--dchoice-radius) - var(--dchoice-bw, 1px))) 0 0;
}
.dchoice-app .dchoice-hero-head { display: grid; grid-template-columns: auto 1fr auto; gap: 20px; align-items: start; }
.dchoice-app .dchoice-hero-ico {
	width: 68px; height: 68px; border-radius: 20px; flex: none; display: grid; place-items: center;
	background: var(--dchoice-accent); color: var(--dchoice-on-accent);
	box-shadow: 0 10px 24px -12px color-mix(in srgb, var(--dchoice-accent) 80%, transparent);
}
.dchoice-app .dchoice-hero-ico .dchoice-ico { width: 34px; height: 34px; }
.dchoice-app .dchoice-hero-name { margin-top: 6px; font-size: clamp(25px, 4vw, 34px); line-height: 1.15; font-weight: 750; letter-spacing: -.02em; }
.dchoice-app .dchoice-hero-sum { margin-top: 8px; color: var(--dchoice-ink-2); font-size: calc(var(--dchoice-fs, 16px) * 1.0625); }
.dchoice-app .dchoice-hero-body { display: grid; grid-template-columns: minmax(240px, 300px) 1fr; gap: 28px; align-items: center; margin-top: 26px; padding-top: 22px; border-top: 1px solid var(--dchoice-line); }
.dchoice-app .dchoice-mt { margin-top: 22px; }

.dchoice-app .dchoice-reasons { display: flex; flex-direction: column; gap: 12px; }
.dchoice-app .dchoice-reasons li { display: flex; gap: 11px; font-size: calc(var(--dchoice-fs, 16px) * 0.9375); color: var(--dchoice-ink-2); line-height: 1.5; }
.dchoice-app .dchoice-reasons strong { color: var(--dchoice-ink); font-weight: 650; }
.dchoice-app .dchoice-reasons .dchoice-ico { width: 20px; height: 20px; padding: 3px; border-radius: 50%; margin-top: 1px; stroke-width: 2.6; }
.dchoice-app .dchoice-reasons--pro .dchoice-ico { background: color-mix(in srgb, var(--dchoice-ok) 14%, #fff); color: var(--dchoice-ok); }
.dchoice-app .dchoice-reasons--con .dchoice-ico { background: var(--dchoice-warn-soft); color: var(--dchoice-warn); stroke-width: 2.2; }
.dchoice-app .dchoice-row-body .dchoice-reasons + .dchoice-reasons { margin-top: 10px; }

.dchoice-app .dchoice-tips { margin-top: 26px; padding: 18px 20px; border-radius: var(--dchoice-radius-sm); background: var(--dchoice-bg); }
.dchoice-app .dchoice-tips-title { display: flex; align-items: center; gap: 8px; font-weight: 650; font-size: calc(var(--dchoice-fs, 16px) * 0.9375); }
.dchoice-app .dchoice-tips-title .dchoice-ico { color: var(--dchoice-accent-ink); width: 19px; height: 19px; }
.dchoice-app .dchoice-tips ul { margin-top: 8px; display: flex; flex-direction: column; gap: 5px; }
.dchoice-app .dchoice-tips li { position: relative; padding-left: 18px; font-size: calc(var(--dchoice-fs, 16px) * 0.9375); color: var(--dchoice-ink-2); }
.dchoice-app .dchoice-tips li::before { content: ""; position: absolute; left: 4px; top: .68em; width: 5px; height: 5px; border-radius: 50%; background: var(--dchoice-accent); }

.dchoice-app .dchoice-pair { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 16px; }
.dchoice-app .dchoice-pair .dchoice-card { margin-top: 0; }
.dchoice-app .dchoice-alt, .dchoice-app .dchoice-further { display: flex; gap: 16px; padding: 24px; }
.dchoice-app .dchoice-alt-ico {
	width: 46px; height: 46px; border-radius: 14px; flex: none; display: grid; place-items: center;
	background: var(--dchoice-soft); color: var(--dchoice-accent-ink);
}
.dchoice-app .dchoice-alt-ico .dchoice-ico { width: 23px; height: 23px; }
.dchoice-app button.dchoice-alt-ico { transition: transform .2s var(--dchoice-ease), background .2s, color .2s; }
.dchoice-app button.dchoice-alt-ico:hover { transform: translateY(-2px); background: var(--dchoice-accent); color: var(--dchoice-on-accent); }
.dchoice-app button.dchoice-alt-ico--muted:hover { background: var(--dchoice-warn); color: #fff; }
.dchoice-app .dchoice-alt-body { min-width: 0; flex: 1; }
.dchoice-app .dchoice-alt-top { display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.dchoice-app .dchoice-alt-links { display: flex; flex-wrap: wrap; gap: 4px 18px; }
.dchoice-app button.dchoice-link { padding: 0; }
.dchoice-app .dchoice-alt-ico--muted { background: var(--dchoice-warn-soft); color: var(--dchoice-warn); }
.dchoice-app .dchoice-alt-name { margin-top: 4px; font-size: calc(var(--dchoice-fs, 16px) * 1.1875); font-weight: 700; letter-spacing: -.01em; }
.dchoice-app .dchoice-alt-sum { margin-top: 6px; font-size: calc(var(--dchoice-fs, 16px) * 0.9375); color: var(--dchoice-ink-2); }

.dchoice-app .dchoice-others .dchoice-muted { margin-top: -6px; }
.dchoice-app .dchoice-rows { margin-top: 18px; border-top: 1px solid var(--dchoice-line); }
.dchoice-app .dchoice-row { border-bottom: 1px solid var(--dchoice-line); }
.dchoice-app .dchoice-row summary {
	display: flex; align-items: center; gap: 14px; padding: 13px 4px; cursor: pointer; list-style: none;
	border-radius: 10px; transition: background .2s;
}
.dchoice-app .dchoice-row summary::-webkit-details-marker { display: none; }
.dchoice-app .dchoice-row summary:hover { background: var(--dchoice-bg); }
.dchoice-app .dchoice-row-ico { width: 34px; height: 34px; border-radius: 10px; flex: none; display: grid; place-items: center; background: var(--dchoice-soft); color: var(--dchoice-accent-ink); }
.dchoice-app .dchoice-row-ico .dchoice-ico { width: 18px; height: 18px; }
.dchoice-app .dchoice-row-name { flex: 1; font-weight: 600; font-size: calc(var(--dchoice-fs, 16px) * 0.9375); min-width: 0; }
.dchoice-app .dchoice-row-bar { width: 110px; height: 6px; border-radius: 9px; background: var(--dchoice-line); overflow: hidden; flex: none; }
.dchoice-app .dchoice-row-pct { width: 3.4em; text-align: right; font-size: calc(var(--dchoice-fs, 16px) * 0.875); font-weight: 650; color: var(--dchoice-ink-2); font-variant-numeric: tabular-nums; flex: none; }
.dchoice-app .dchoice-row-bar span { display: block; height: 100%; border-radius: 9px; background: color-mix(in srgb, var(--dchoice-accent) 70%, #fff); }
.dchoice-app .dchoice-row-chev { width: 18px; height: 18px; color: var(--dchoice-muted); transition: transform .25s var(--dchoice-ease); }
.dchoice-app .dchoice-row[open] .dchoice-row-chev { transform: rotate(180deg); }
.dchoice-app .dchoice-row-body { padding: 4px 4px 20px 52px; display: grid; grid-template-columns: 200px 1fr; gap: 22px; align-items: start; }
.dchoice-app .dchoice-row-body--plain { grid-template-columns: 1fr; }
.dchoice-app .dchoice-row-sum { font-size: calc(var(--dchoice-fs, 16px) * 0.9375); color: var(--dchoice-ink-2); margin-bottom: 12px; }
.dchoice-app .dchoice-row-body > .dchoice-row-sum:last-child { margin-bottom: 0; }
.dchoice-app .dchoice-row--out .dchoice-row-ico { background: var(--dchoice-bg); color: var(--dchoice-muted); }
.dchoice-app .dchoice-row--out .dchoice-row-name { color: var(--dchoice-muted); font-weight: 500; }
.dchoice-app .dchoice-row-tag { display: inline-flex; align-items: center; gap: 5px; font-size: calc(var(--dchoice-fs, 16px) * 0.8125); color: var(--dchoice-muted); white-space: nowrap; }
.dchoice-app .dchoice-row-tag .dchoice-ico { width: 13px; height: 13px; }

.dchoice-app .dchoice-foot { padding: 4px 6px; }
.dchoice-app .dchoice-secret {
	display: flex; gap: 12px; align-items: flex-start; padding: 16px 18px; border-radius: var(--dchoice-radius-sm);
	background: var(--dchoice-soft); color: var(--dchoice-ink-2); font-size: calc(var(--dchoice-fs, 16px) * 0.9375);
}
.dchoice-app .dchoice-secret .dchoice-ico { color: var(--dchoice-accent-ink); width: 20px; height: 20px; margin-top: 1px; }
.dchoice-app .dchoice-secret strong { color: var(--dchoice-ink); }
.dchoice-app .dchoice-foot .dchoice-nav { margin-top: 14px; justify-content: flex-start; }
.dchoice-app .dchoice-legal { margin-top: 12px; font-size: calc(var(--dchoice-fs, 16px) * 0.8125); color: var(--dchoice-muted); }

/* ------------------------------------------------------------------ */
/* Adéquation                                                          */
/* ------------------------------------------------------------------ */
.dchoice-app .dchoice-ring { display: flex; flex-direction: column; align-items: center; gap: 4px; flex: none; }
.dchoice-app .dchoice-ring-c { position: relative; width: 76px; height: 76px; display: grid; place-items: center; }
.dchoice-app .dchoice-ring-c svg { position: absolute; inset: 0; width: 100%; height: 100%; transform: rotate(-90deg); }
.dchoice-app .dchoice-ring-t { fill: none; stroke: var(--dchoice-line); stroke-width: 5; }
.dchoice-app .dchoice-ring-v { fill: none; stroke: var(--dchoice-accent); stroke-width: 5; stroke-linecap: round; }
.dchoice-app .dchoice-ring-n { position: relative; font-size: calc(var(--dchoice-fs, 16px) * 1.375); font-weight: 750; letter-spacing: -.02em; color: var(--dchoice-ink); line-height: 1; font-variant-numeric: tabular-nums; }
.dchoice-app .dchoice-ring-n small { font-size: calc(var(--dchoice-fs, 16px) * 0.75); font-weight: 650; margin-left: 1px; color: var(--dchoice-ink-2); }
.dchoice-app .dchoice-ring-l { font-size: calc(var(--dchoice-fs, 16px) * 0.625); font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--dchoice-muted); }
.dchoice-app .dchoice-pct {
	flex: none; padding: 3px 9px; border-radius: 99px; background: var(--dchoice-soft); color: var(--dchoice-accent-ink);
	font-size: calc(var(--dchoice-fs, 16px) * 0.8125); font-weight: 700; font-variant-numeric: tabular-nums;
}
.dchoice-app .dchoice-further .dchoice-pct { background: var(--dchoice-warn-soft); color: var(--dchoice-warn); }

/* ------------------------------------------------------------------ */
/* Diagramme en araignée                                               */
/* ------------------------------------------------------------------ */
.dchoice-app .dchoice-radar-fig { margin: 0; }
.dchoice-app .dchoice-radar { display: block; width: 100%; max-width: none; height: auto; overflow: visible; }
.dchoice-app .dchoice-radar text { font-family: inherit; }
.dchoice-app .dchoice-radar-fig--lg .dchoice-radar { max-width: 340px; margin: 0 auto; }
.dchoice-app .dchoice-radar-fig--sm .dchoice-radar { max-width: 220px; }
.dchoice-app .dchoice-rp { fill: color-mix(in srgb, var(--dchoice-accent) 16%, transparent); stroke: var(--dchoice-accent); stroke-width: 2; stroke-linejoin: round; }
.dchoice-app .dchoice-rd { fill: var(--dchoice-surface); stroke: var(--dchoice-accent); stroke-width: 2; }
.dchoice-app .dchoice-rd.is-on { fill: var(--dchoice-accent); }
.dchoice-app .dchoice-rh { fill: transparent; cursor: help; }
.dchoice-app .dchoice-rl { font-size: calc(var(--dchoice-fs, 16px) * 0.75); fill: var(--dchoice-ink-2); font-family: inherit; }
.dchoice-app .dchoice-radar--sm .dchoice-rl { font-size: calc(var(--dchoice-fs, 16px) * 0.8125); }
.dchoice-app .dchoice-rl.is-on { font-weight: 700; fill: var(--dchoice-ink); }
.dchoice-app .dchoice-rl-h { cursor: help; text-decoration: underline dotted; text-decoration-color: var(--dchoice-line-2); text-underline-offset: 3px; outline: none; transition: fill .15s; }
.dchoice-app .dchoice-rl-h:hover, .dchoice-app .dchoice-rl-h:focus-visible { fill: var(--dchoice-accent-ink); text-decoration-color: currentColor; }
.dchoice-app .dchoice-tip { max-width: 280px; }
.dchoice-app .dchoice-rl-dot { fill: var(--dchoice-accent); color: var(--dchoice-accent); font-size: .8em; }
.dchoice-app .dchoice-radar-cap { display: flex; flex-wrap: wrap; justify-content: center; gap: 4px 14px; margin-top: 6px; font-size: calc(var(--dchoice-fs, 16px) * 0.75); color: var(--dchoice-muted); text-align: center; }

.dchoice-app .dchoice-tip {
	position: absolute; z-index: 30; max-width: 260px; padding: 9px 11px; border-radius: 10px;
	background: var(--dchoice-ink); color: #fff; font-size: calc(var(--dchoice-fs, 16px) * 0.8125); line-height: 1.4; pointer-events: none;
	opacity: 0; transform: translateY(4px); transition: opacity .15s, transform .15s var(--dchoice-ease);
	box-shadow: 0 10px 24px -12px rgba(0, 0, 0, .5);
}
.dchoice-app .dchoice-tip.is-on { opacity: 1; transform: none; }
.dchoice-app .dchoice-tip strong { display: block; font-weight: 700; }
.dchoice-app .dchoice-tip span { display: block; margin-top: 3px; color: rgba(255, 255, 255, .82); }

/* ------------------------------------------------------------------ */
/* Fenêtre « fiche »                                                   */
/* ------------------------------------------------------------------ */
.dchoice-app .dchoice-modal {
	width: min(760px, calc(100vw - 24px)); max-width: none; max-height: calc(100vh - 32px); max-height: calc(100dvh - 32px);
	margin: auto; padding: 0; border: 0; border-radius: var(--dchoice-radius); background: var(--dchoice-surface); color: var(--dchoice-ink);
	box-shadow: 0 30px 80px -20px rgba(15, 20, 40, .45); overflow: auto; position: fixed;
}
.dchoice-app .dchoice-modal::backdrop { background: rgba(20, 26, 45, .45); backdrop-filter: blur(3px); }
.dchoice-app .dchoice-modal[open] { animation: dchoice-pop .28s var(--dchoice-ease) both; }
@keyframes dchoice-pop { from { opacity: 0; transform: translateY(14px) scale(.98); } to { opacity: 1; transform: none; } }
.dchoice-app .dchoice-modal-box { position: relative; padding: clamp(22px, 4vw, 38px); }
.dchoice-app .dchoice-modal-x {
	position: absolute; top: 14px; right: 14px; width: 38px; height: 38px; border-radius: 50%;
	display: grid; place-items: center; color: var(--dchoice-muted); transition: background .2s, color .2s;
}
.dchoice-app .dchoice-modal-x:hover { background: var(--dchoice-bg); color: var(--dchoice-ink); }
.dchoice-app .dchoice-modal-head { display: flex; gap: 18px; align-items: flex-start; padding-right: 36px; }
.dchoice-app .dchoice-hero-ico--sm { width: 56px; height: 56px; border-radius: 16px; }
.dchoice-app .dchoice-hero-ico--sm .dchoice-ico { width: 28px; height: 28px; }
.dchoice-app .dchoice-modal-title { margin-top: 4px; font-size: clamp(22px, 3.4vw, 28px); font-weight: 750; letter-spacing: -.02em; }
.dchoice-app .dchoice-modal-sum { margin-top: 6px; color: var(--dchoice-ink-2); }
.dchoice-app .dchoice-modal-grid { display: grid; grid-template-columns: minmax(220px, 300px) 1fr; gap: 26px; align-items: center; margin-top: 22px; padding-top: 20px; border-top: 1px solid var(--dchoice-line); }
.dchoice-app .dchoice-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 20px; }
.dchoice-app .dchoice-tags li { padding: 4px 10px; border-radius: 99px; background: var(--dchoice-soft); color: var(--dchoice-accent-ink); font-size: calc(var(--dchoice-fs, 16px) * 0.8125); font-weight: 600; }
.dchoice-app .dchoice-warnbox { display: flex; gap: 10px; margin-top: 18px; padding: 12px 14px; border-radius: 12px; background: var(--dchoice-warn-soft); color: var(--dchoice-warn); font-size: calc(var(--dchoice-fs, 16px) * 0.875); }
.dchoice-app .dchoice-warnbox .dchoice-ico { margin-top: 1px; }

/* ------------------------------------------------------------------ */
/* Animations                                                          */
/* ------------------------------------------------------------------ */
@keyframes dchoice-in { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
@keyframes dchoice-in-back { from { opacity: 0; transform: translateY(-10px); } to { opacity: 1; transform: none; } }
.dchoice-app .dchoice-in { animation: dchoice-in .42s var(--dchoice-ease) both; }
.dchoice-app .dchoice-in-back { animation: dchoice-in-back .35s var(--dchoice-ease) both; }
.dchoice-app .dchoice-in .dchoice-opt { animation: dchoice-in .45s var(--dchoice-ease) both; }
.dchoice-app .dchoice-in .dchoice-opt:nth-child(2) { animation-delay: .04s; }
.dchoice-app .dchoice-in .dchoice-opt:nth-child(3) { animation-delay: .08s; }
.dchoice-app .dchoice-in .dchoice-opt:nth-child(4) { animation-delay: .12s; }
.dchoice-app .dchoice-in .dchoice-opt:nth-child(5) { animation-delay: .16s; }
.dchoice-app .dchoice-in .dchoice-hero, .dchoice-app .dchoice-in .dchoice-pair, .dchoice-app .dchoice-in .dchoice-others { animation: dchoice-in .5s var(--dchoice-ease) both; }
.dchoice-app .dchoice-in .dchoice-pair { animation-delay: .08s; }
.dchoice-app .dchoice-in .dchoice-others { animation-delay: .14s; }

@media (prefers-reduced-motion: reduce) {
	.dchoice-app .dchoice-opt:hover { transform: none; }
	.dchoice-app *, .dchoice-app *::before, .dchoice-app *::after { animation: none !important; transition: none !important; }
}

/* ------------------------------------------------------------------ */
/* Mobile                                                              */
/* ------------------------------------------------------------------ */
@container dchoice (max-width: 600px) {
	.dchoice-app .dchoice-grid { grid-template-columns: 1fr; }
	.dchoice-app .dchoice-grid--options { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
	.dchoice-app .dchoice-grid--options .dchoice-opt-text { display: none; }
	.dchoice-app .dchoice-opt--num { align-items: center; justify-content: center; text-align: center; padding: 20px 6px; min-height: 84px; }
	.dchoice-app .dchoice-opt-num { font-size: calc(var(--dchoice-fs, 16px) * 1.375); }
	.dchoice-app .dchoice-recap { flex-wrap: nowrap; overflow-x: auto; margin-left: -16px; margin-right: -16px; padding: 2px 16px 6px; scrollbar-width: none; }
	.dchoice-app .dchoice-recap::-webkit-scrollbar { display: none; }
	.dchoice-app .dchoice-chip { white-space: nowrap; }
	.dchoice-app .dchoice-opt--num .dchoice-opt-tick { display: none; }
	.dchoice-app .dchoice-grid--taille { grid-template-columns: 1fr; }
	.dchoice-app .dchoice-grid--numerique { grid-template-columns: 1fr 1fr; gap: 8px; }
	.dchoice-app .dchoice-grid--numerique .dchoice-opt { flex-direction: column; align-items: flex-start; padding-right: 12px; }
	.dchoice-app .dchoice-grid--numerique .dchoice-opt-tick { top: 12px; margin-top: 0; }
	.dchoice-app .dchoice-hero-head { grid-template-columns: auto 1fr; gap: 14px; }
	.dchoice-app .dchoice-hero-txt { grid-column: 1 / -1; grid-row: 2; }
	.dchoice-app .dchoice-ring { justify-self: end; grid-row: 1; grid-column: 2; }
	.dchoice-app .dchoice-ring-c { width: 64px; height: 64px; }
	.dchoice-app .dchoice-ring-n { font-size: calc(var(--dchoice-fs, 16px) * 1.1875); }
	.dchoice-app .dchoice-hero-body, .dchoice-app .dchoice-modal-grid { grid-template-columns: 1fr; gap: 18px; }
	.dchoice-app .dchoice-row-body { grid-template-columns: 1fr; padding-left: 4px; }
	.dchoice-app .dchoice-row-body .dchoice-radar-fig--sm .dchoice-radar { margin: 0 auto; }
	.dchoice-app .dchoice-row-pct { width: 2.8em; font-size: calc(var(--dchoice-fs, 16px) * 0.8125); }
	.dchoice-app .dchoice-strip { gap: 8px; }
	.dchoice-app .dchoice-strip-name { display: none; }
	.dchoice-app .dchoice-modal-head { flex-direction: column; gap: 12px; }
	.dchoice-app .dchoice-hero-ico { width: 56px; height: 56px; border-radius: 16px; }
	.dchoice-app .dchoice-hero-ico .dchoice-ico { width: 28px; height: 28px; }
	.dchoice-app .dchoice-row-bar { width: 44px; }
	.dchoice-app .dchoice-nav .dchoice-btn-primary { flex: 1; }
	.dchoice-app .dchoice-actions .dchoice-btn { flex: 1 1 auto; }
}

/* Diagramme : zones points forts / points faibles, ligne neutre, repères (couleurs réglables : Apparence). */
.dchoice-app .dchoice-rb { stroke: none; }
.dchoice-app .dchoice-rb-p2 { fill: var(--dchoice-plus-2, #c0d9ea); }
.dchoice-app .dchoice-rb-p1 { fill: var(--dchoice-plus-1, #e0ecf5); }
.dchoice-app .dchoice-rb-m1 { fill: var(--dchoice-moins-1, #fbede0); }
.dchoice-app .dchoice-rb-m2 { fill: var(--dchoice-moins-2, #f6dac2); }
.dchoice-app .dchoice-rg { fill: none; stroke: rgba(27, 34, 51, .09); stroke-width: 1; }
.dchoice-app .dchoice-rs { stroke: rgba(27, 34, 51, .09); stroke-width: 1; }
.dchoice-app .dchoice-rg-0 { fill: none; stroke: #5b6478; stroke-width: 1.4; stroke-dasharray: 4 3; }
.dchoice-app .dchoice-radar--xs .dchoice-rg-0 { stroke-width: 1; stroke-dasharray: 2.5 2; }
.dchoice-app .dchoice-rt { font-size: calc(var(--dchoice-fs, 16px) * 0.5938); font-weight: 700; fill: #687186; paint-order: stroke; stroke: rgba(255, 255, 255, .9); stroke-width: 3px; stroke-linejoin: round; }
.dchoice-app .dchoice-rt-0 { fill: #3c4558; }
.dchoice-app .dchoice-rp { fill: color-mix(in srgb, var(--dchoice-accent) 7%, transparent); }
.dchoice-app .dchoice-rleg { display: inline-flex; flex-wrap: wrap; justify-content: center; gap: 4px 14px; font-size: calc(var(--dchoice-fs, 16px) * 0.75); color: #3c4558; }
.dchoice-app .dchoice-rleg-i { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
.dchoice-app .dchoice-rleg-i small { color: #687186; font-size: calc(var(--dchoice-fs, 16px) * 0.6875); }
.dchoice-app .dchoice-rleg-sw { display: inline-block; width: 18px; height: 11px; border-radius: 3px; }
.dchoice-app .dchoice-rleg-p { background: linear-gradient(90deg, var(--dchoice-plus-1, #e0ecf5), var(--dchoice-plus-2, #c0d9ea)); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--dchoice-plus, #1f78b4) 45%, transparent); }
.dchoice-app .dchoice-rleg-m { background: linear-gradient(90deg, var(--dchoice-moins-2, #f6dac2), var(--dchoice-moins-1, #fbede0)); box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--dchoice-moins, #e07b24) 45%, transparent); }
.dchoice-app .dchoice-rleg-0 { height: 0; border-radius: 0; border-top: 2px dashed #5b6478; }

.dchoice-app .dchoice-share-slot { display: contents; }

/* Contexte : désignation préparée depuis un mandat (Democratic Collective). */
.dchoice-app .dchoice-ctx { display: flex; align-items: flex-start; gap: 12px; margin: 0 0 16px; padding: 12px 16px; border-radius: 14px; background: var(--dchoice-soft); border: 1px solid color-mix(in srgb, var(--dchoice-accent) 28%, transparent); font-size: calc(var(--dchoice-fs, 16px) * 0.9375); }
.dchoice-app .dchoice-ctx p { margin: 0; line-height: 1.45; }
.dchoice-app .dchoice-ctx .dchoice-ico { flex: none; width: 22px; height: 22px; margin-top: 1px; color: var(--dchoice-accent); }
.dchoice-app .dchoice-ctx-k { font-weight: 600; color: var(--dchoice-ink-2, #475569); }
.dchoice-app .dchoice-ctx-g { color: var(--dchoice-ink-2, #475569); font-size: .92em; }