/* Composants de Diane (Components/Ui, Layout). Les couleurs viennent de css/diane-tokens.css ; aucune valeur de couleur en dur ici,
   (le thème de l'organisation les remplace : voir le commentaire de diane-tokens.css). */

/* ---------- teintes sémantiques : fixent --tone et --tone-bg ---------- */

.dn-tone-neutral { --tone: var(--dn-text-2); --tone-bg: var(--dn-surface-3); }
.dn-tone-accent  { --tone: var(--dn-accent-text); --tone-bg: var(--dn-accent-soft); }
.dn-tone-info    { --tone: var(--mud-palette-info, #0369a1);    --tone-bg: color-mix(in srgb, var(--mud-palette-info, #0369a1) 13%, transparent); }
.dn-tone-success { --tone: var(--mud-palette-success, #15803d); --tone-bg: color-mix(in srgb, var(--mud-palette-success, #15803d) 13%, transparent); }
.dn-tone-warning { --tone: var(--mud-palette-warning, #b45309); --tone-bg: color-mix(in srgb, var(--mud-palette-warning, #b45309) 14%, transparent); }
.dn-tone-danger  { --tone: var(--mud-palette-error, #b91c1c);   --tone-bg: color-mix(in srgb, var(--mud-palette-error, #b91c1c) 12%, transparent); }

/* ---------- coque : rail, barre du haut, contenu ---------- */

.dn-shell { display: flex; min-height: 100dvh; }
.dn-main { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; }

.dn-rail {
    position: sticky; top: 0; align-self: flex-start;
    height: 100dvh; width: var(--dn-rail-w); flex: 0 0 var(--dn-rail-w);
    display: flex; flex-direction: column; align-items: center; gap: 4px;
    padding: 14px 8px; background: linear-gradient(180deg, var(--dn-rail-from), var(--dn-rail-to)); color: var(--dn-rail-text-strong); z-index: 20;
}
.dn-rail__brand { display: block; margin-bottom: 14px; border-radius: 12px; line-height: 0; }
.dn-rail__spacer { flex: 1 1 auto; }
.dn-rail__link {
    width: 100%; display: flex; flex-direction: column; align-items: center; gap: 3px;
    padding: 10px 4px; border-radius: 12px; text-decoration: none;
    color: var(--dn-rail-text); font-size: .7rem; font-weight: 600; letter-spacing: .01em; transition: background .12s, color .12s;
}
.dn-rail__link:hover { background: var(--dn-rail-hover-bg); color: var(--dn-rail-text-strong); }
.dn-rail__link[aria-current="page"] { background: var(--dn-rail-active-bg); color: var(--dn-rail-active-text); box-shadow: inset 3px 0 0 var(--dn-accent); }
.dn-rail__link--secondary { color: var(--dn-rail-text-2); }
.dn-rail :focus-visible { outline-color: var(--dn-rail-active-text); }

.dn-topbar {
    position: sticky; top: 0; z-index: 15; height: var(--dn-topbar-h);
    display: flex; align-items: center; gap: 10px; padding: 0 20px;
    background: linear-gradient(90deg, color-mix(in srgb, var(--dn-topbar-from) 90%, transparent), color-mix(in srgb, var(--dn-topbar-to) 90%, transparent)); backdrop-filter: blur(10px);
    color: var(--dn-topbar-text); border-bottom: 1px solid var(--dn-border);
}
.dn-topbar__spacer { flex: 1 1 auto; }
.dn-topbar__brand { display: inline-flex; align-items: center; gap: 10px; min-width: 0; flex: 0 1 auto; color: var(--dn-topbar-text); }
.dn-topbar__home { flex: 0 0 auto; display: inline-flex; line-height: 0; border-radius: 10px; text-decoration: none; }
.dn-topbar__mark { display: none; }   /* le rail porte la marque sur ordinateur */
.dn-topbar__titles { display: flex; align-items: center; gap: 14px; min-width: 0; }
.dn-topbar__titles .dn-wordmark { flex: 0 1 auto; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* « pour <logo> Organisation » : un filet sépare le nom de l'outil de celui du client */
.dn-topbar__for { display: inline-flex; align-items: center; gap: 8px; min-width: 0; padding-left: 14px; border-left: 1px solid color-mix(in srgb, var(--dn-topbar-text) 28%, transparent); align-self: center; color: var(--dn-topbar-text-2); }
.dn-topbar__pour { font-size: .84rem; font-style: italic; font-weight: 500; flex: 0 0 auto; }
.dn-topbar__client, .dn-topbar__name { min-width: 0; font-size: 1rem; font-weight: 800; letter-spacing: -.01em; line-height: 1.15; color: var(--dn-topbar-text); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dn-wordmark { font-weight: 800; letter-spacing: -.01em; font-size: 1.05rem; line-height: 1.15; color: var(--dn-topbar-text); }
.dn-wordmark--lg { font-size: 1.6rem; color: var(--dn-text); }

.dn-usermenu {
    display: inline-flex; align-items: center; gap: 8px; padding: 3px 8px 3px 3px; cursor: pointer;
    border-radius: var(--dn-radius-pill); border: 1px solid var(--dn-border); background: var(--dn-surface); color: var(--dn-text); font: inherit; font-weight: 600; font-size: .88rem;
}
.dn-usermenu:hover { background: var(--dn-surface-3); }
.dn-usermenu__name { overflow-wrap: anywhere; line-height: 1.15; text-align: left; }
.dn-usermenu__head { display: flex; flex-direction: column; gap: 4px; align-items: flex-start; padding: 12px 16px; min-width: 220px; }
.dn-usermenu__head span:not(.dn-badge) { color: var(--dn-text-2); font-size: .82rem; overflow-wrap: anywhere; }

.dn-content { flex: 1 1 auto; width: 100%; max-width: var(--dn-content-max); margin: 0 auto; padding: 24px 24px 48px; outline: none; }
.dn-content:has(.dn-workspace) { max-width: none; padding: 14px 20px 16px; }

.dn-icon-btn {
    display: inline-grid; place-items: center; width: 40px; height: 40px; border-radius: var(--dn-radius-pill); cursor: pointer;
    border: 1px solid transparent; background: transparent; color: var(--dn-text-2); transition: background .12s, color .12s;
}
.dn-icon-btn:hover { background: var(--dn-surface-3); color: var(--dn-text); }

@media (max-width: 899px) {
    .dn-rail {
        position: fixed; inset: auto 0 0 0; height: auto; width: 100%; flex: none; flex-direction: row; justify-content: space-around; gap: 2px;
        padding: 6px 8px calc(6px + env(safe-area-inset-bottom)); box-shadow: 0 -4px 18px rgba(0, 0, 0, .25);
    }
    .dn-rail__brand, .dn-rail__spacer { display: none; }
    .dn-rail__link { flex: 1 1 0; padding: 7px 2px; min-height: 52px; justify-content: center; }
    .dn-rail__link[aria-current="page"] { box-shadow: inset 0 3px 0 var(--dn-accent); }
    .dn-rail { background: linear-gradient(90deg, var(--dn-rail-from), var(--dn-rail-to)); }   /* en bas de l'écran, le menu est horizontal : le dégradé aussi */
    .dn-topbar { padding: 0 12px; }
    .dn-topbar__mark { display: inline-flex; }
    .dn-usermenu__name { display: none; }
    /* sur téléphone : le nom de l'outil au-dessus, « pour <organisation> » dessous */
    .dn-topbar__titles { flex-direction: column; align-items: flex-start; gap: 1px; }
    .dn-topbar__titles .dn-wordmark { font-size: clamp(.68rem, 3.5vw, .95rem); }
    .dn-topbar__for { padding-left: 0; border-left: 0; gap: 5px; max-width: 100%; align-self: flex-start; }
    .dn-topbar__pour { font-size: .72rem; }
    .dn-topbar__client { font-size: clamp(.7rem, 3.4vw, .85rem); }
    .dn-content { padding: 16px 16px calc(var(--dn-tabbar-h) + 28px); }
    .dn-content:has(.dn-workspace) { padding: 10px 12px calc(var(--dn-tabbar-h) + 20px); }
}

/* ---------- en-tête de page ---------- */

.dn-page-header { display: flex; align-items: flex-start; gap: 14px; margin-bottom: 20px; flex-wrap: wrap; }
.dn-page-header__back {
    flex: 0 0 auto; display: inline-grid; place-items: center; width: 40px; height: 40px; border-radius: var(--dn-radius);
    border: 1px solid var(--dn-border); background: var(--dn-surface); color: var(--dn-text); text-decoration: none;
}
.dn-page-header__back:hover { background: var(--dn-surface-3); }
.dn-page-header__text { flex: 1 1 280px; min-width: 0; align-self: center;}
.dn-page-header__line { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.dn-page-title { margin: 0; font-size: 1.75rem; line-height: 1.2; font-weight: 750; letter-spacing: -.02em; overflow-wrap: anywhere; }
.dn-page-subtitle { margin: 4px 0 0; color: var(--dn-text-2); max-width: 70ch; }
.dn-page-header__actions { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.dn-page-header--compact { margin-bottom: 0; }
.dn-page-header--compact .dn-page-title { font-size: 1.35rem; }

/* ---------- panneau ---------- */

.dn-panel { background: var(--dn-surface); border: 1px solid var(--dn-border); border-radius: var(--dn-radius-lg); box-shadow: var(--dn-shadow-1); }
.dn-panel--toned { border-color: color-mix(in srgb, var(--tone) 45%, var(--dn-border)); }
.dn-panel__head { display: flex; align-items: center; gap: 12px; padding: 18px 20px 0; }
.dn-panel__icon { flex: 0 0 auto; display: grid; place-items: center; width: 36px; height: 36px; border-radius: 10px; background: var(--tone-bg, var(--dn-surface-3)); color: var(--tone, var(--dn-text-2)); }
.dn-panel__titles { flex: 1 1 auto; min-width: 0; }
.dn-panel__title { margin: 0; font-size: 1.05rem; font-weight: 700; line-height: 1.3; }
.dn-panel__subtitle { margin: 2px 0 0; color: var(--dn-text-2); font-size: .875rem; }
.dn-panel__actions { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.dn-panel__body { padding: 16px 20px 20px; }
.dn-panel__head + .dn-panel__body { padding-top: 14px; }
.dn-panel--flush > .dn-panel__body { padding: 0; }
.dn-panel--flush > .dn-panel__head { padding-bottom: 14px; }

/* ---------- pastille ---------- */

.dn-badge {
    display: inline-flex; align-items: center; gap: 6px; padding: 3px 10px; border-radius: var(--dn-radius-pill);
    background: var(--tone-bg); color: var(--tone); border: 1px solid color-mix(in srgb, var(--tone) 28%, transparent);
    font-size: .78rem; font-weight: 700; line-height: 1.4; white-space: nowrap;
}
.dn-badge--lg { font-size: .88rem; padding: 5px 12px; }
.dn-badge__icon.mud-icon-root { font-size: 1rem; width: 1rem; height: 1rem; }

.dn-pulse { display: inline-block; flex: 0 0 auto; width: 8px; height: 8px; border-radius: 50%; background: currentColor; animation: dn-pulse 1.4s ease-in-out infinite; }
@keyframes dn-pulse { 0% { box-shadow: 0 0 0 0 color-mix(in srgb, currentColor 55%, transparent); } 70%, 100% { box-shadow: 0 0 0 7px transparent; } }

/* ---------- encadré ---------- */

.dn-callout {
    display: flex; gap: 10px; align-items: flex-start; padding: 11px 14px; border-radius: var(--dn-radius);
    background: var(--tone-bg); border: 1px solid color-mix(in srgb, var(--tone) 25%, transparent); border-left: 4px solid var(--tone);
    color: var(--dn-text); font-size: .9rem; line-height: 1.45;
}
.dn-callout--compact { padding: 8px 12px; font-size: .85rem; }
.dn-callout__icon { flex: 0 0 auto; color: var(--tone); display: inline-flex; margin-top: 1px; }
.dn-callout__body { flex: 1 1 auto; min-width: 0; overflow-wrap: anywhere; }
.dn-callout__title { display: block; margin-bottom: 2px; }
.dn-callout__body small { color: var(--dn-text-2); }
.dn-callout__close { flex: 0 0 auto; border: 0; background: transparent; color: var(--dn-text-2); cursor: pointer; padding: 2px; border-radius: 6px; display: inline-flex; }
.dn-callout__close:hover { background: var(--tone-bg); color: var(--dn-text); }

/* ---------- état vide ---------- */

.dn-empty { text-align: center; padding: 40px 24px; border: 1.5px dashed var(--dn-border-strong); border-radius: var(--dn-radius-lg); background: var(--dn-surface); }
.dn-empty__icon { display: inline-grid; place-items: center; width: 64px; height: 64px; border-radius: 20px; background: var(--dn-accent-soft); color: var(--dn-accent-text); margin-bottom: 12px; }
.dn-empty__title { margin: 0 0 6px; font-size: 1.2rem; font-weight: 700; }
.dn-empty__text { margin: 0 auto; max-width: 52ch; color: var(--dn-text-2); }
.dn-empty__actions { margin-top: 18px; display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; }

/* ---------- chiffre clé ---------- */

.dn-stat { display: flex; flex-direction: column; gap: 2px; padding: 10px 14px; border-radius: var(--dn-radius); background: var(--tone-bg); border: 1px solid color-mix(in srgb, var(--tone) 22%, transparent); min-width: 0; }
.dn-stat__value { font-size: 1.9rem; line-height: 1.1; font-weight: 800; color: var(--tone); }
.dn-stat__label { font-size: .78rem; font-weight: 600; color: var(--dn-text-2); }

/* ---------- avatar ---------- */

.dn-avatar { display: inline-grid; place-items: center; flex: 0 0 auto; border-radius: 50%; background: var(--dn-avatar-bg); color: var(--dn-avatar-text); font-weight: 800; letter-spacing: .02em; }
.dn-avatar--sm { width: 30px; height: 30px; font-size: .72rem; }
.dn-avatar--md { width: 38px; height: 38px; font-size: .85rem; }
.dn-avatar--lg { width: 60px; height: 60px; font-size: 1.3rem; }

/* ---------- barre d'étapes ---------- */

.dn-steps { list-style: none; margin: 0; padding: 0; display: flex; gap: 8px; }
.dn-steps__item { flex: 1 1 0; min-width: 0; }
.dn-step {
    width: 100%; min-height: 54px; display: flex; align-items: center; gap: 10px; padding: 8px 14px; text-align: left; cursor: pointer;
    border-radius: var(--dn-radius); border: 1px solid var(--dn-border); background: var(--dn-surface); color: var(--dn-text); font: inherit;
    transition: border-color .12s, background .12s, box-shadow .12s;
}
.dn-step:hover:not(:disabled) { border-color: var(--dn-border-strong); background: var(--dn-surface-2); }
.dn-step:disabled { opacity: .55; cursor: not-allowed; }
.dn-step.is-current { border-color: var(--dn-accent); box-shadow: 0 0 0 1px var(--dn-accent); background: var(--dn-accent-soft); }
.dn-step__num {
    flex: 0 0 auto; display: inline-grid; place-items: center; width: 28px; height: 28px; border-radius: 50%;
    background: var(--dn-surface-3); color: var(--dn-text-2); font-weight: 800; font-size: .85rem;
}
.dn-step.is-current .dn-step__num { background: var(--dn-accent); color: var(--dn-on-accent); }
.dn-step.is-done .dn-step__num { background: var(--dn-state-inplace); color: var(--dn-on-ok); }
.dn-step.is-live .dn-step__num { background: var(--dn-state-waiting); color: var(--dn-on-bad); }
.dn-step__num .mud-icon-root { font-size: 1.1rem; }
.dn-step__text { display: flex; flex-direction: column; min-width: 0; line-height: 1.25; }
.dn-step__label { font-weight: 700; font-size: .92rem; overflow-wrap: anywhere; }
.dn-step__hint { font-size: .78rem; color: var(--dn-text-2); overflow-wrap: anywhere; }

@media (max-width: 599px) {
    .dn-steps { gap: 6px; }
    .dn-step { padding: 8px 8px; gap: 6px; flex-direction: column; justify-content: center; text-align: center; min-height: 62px; }
    .dn-step__hint { display: none; }
    .dn-step__label { font-size: .78rem; }
}

/* ---------- listes de points / de postes ---------- */

.dn-list { list-style: none; margin: 0; padding: 0; }
.dn-listitem + .dn-listitem { border-top: 1px solid var(--dn-border); }
.dn-point {
    width: 100%; display: flex; align-items: center; gap: 12px; min-height: 50px; padding: 8px 16px; text-align: left; cursor: pointer;
    background: transparent; border: 0; color: inherit; font: inherit; transition: background .1s;
}
.dn-point:hover { background: var(--dn-surface-2); }
.dn-point.is-active { background: var(--dn-select-soft); box-shadow: inset 3px 0 0 var(--dn-select); }
.dn-point__text { flex: 1 1 auto; min-width: 0; display: flex; flex-direction: column; line-height: 1.3; }
.dn-point__name { display: flex; align-items: center; flex-wrap: wrap; gap: 0 4px; font-weight: 600; font-size: .92rem; overflow-wrap: anywhere; }
.dn-point__sub { color: var(--dn-text-2); font-size: .78rem; overflow-wrap: anywhere; }
.dn-point__review.mud-icon-root { color: var(--mud-palette-warning); flex: 0 0 auto; }

.dn-glyph { flex: 0 0 auto; display: inline-grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; color: #fff; font-size: 13px; font-weight: 800; line-height: 1; }
.dn-glyph--dot { box-shadow: 0 0 0 2px var(--dn-surface), 0 0 0 3px var(--dn-border); }
.dn-glyph--square { border-radius: 9px; }
.dn-glyph--man { background: #fff; border: 2px solid var(--dn-kind-signaler); }
.dn-glyph--bar { background: #fff; border: 2px solid var(--dn-kind-barrier); }
.dn-glyph--cone { background: #fff; border: 2px solid var(--dn-kind-cone); }
.dn-glyph__bar { width: 15px; height: 5px; background: #00d8ff; border-radius: 1px; }

.dn-post__dot { flex: 0 0 auto; width: 16px; height: 16px; border-radius: 50%; background: var(--dn-state-waiting); box-shadow: 0 0 0 3px var(--dn-state-waiting-bg); }
.dn-post--inplace .dn-post__dot { background: var(--dn-state-inplace); box-shadow: 0 0 0 3px var(--dn-state-inplace-bg); }
.dn-post--problem { background: var(--dn-state-problem-bg); }
.dn-post--problem .dn-post__dot { background: var(--dn-state-problem); box-shadow: 0 0 0 3px var(--dn-state-problem-bg); animation: dn-blink 1s ease-in-out infinite; }
.dn-post--problem .dn-post__state { color: var(--dn-text); font-weight: 600; }
@keyframes dn-blink { 0%, 100% { opacity: 1; } 50% { opacity: .35; } }

.dn-code {
    flex: 0 0 auto; font-family: var(--dn-mono); font-weight: 800; letter-spacing: .1em; font-size: .9rem;
    padding: 3px 10px; border-radius: 8px; background: var(--dn-surface-3); border: 1px solid var(--dn-border); color: var(--dn-text);
}

/* ---------- champ à recopier ---------- */

.dn-copyfield__label { display: block; font-size: .82rem; font-weight: 700; color: var(--dn-text-2); margin-bottom: 4px; }
.dn-copyfield__row { display: flex; gap: 8px; align-items: stretch; }
.dn-copyfield__input {
    flex: 1 1 auto; min-width: 0; padding: 10px 12px; border-radius: var(--dn-radius-sm); border: 1px solid var(--dn-border-strong);
    background: var(--dn-surface-2); color: var(--dn-text); font-size: .9rem;
}

/* ---------- zone de dépôt de fichier ---------- */

.dn-drop {
    position: relative; display: flex; align-items: center; gap: 14px; padding: 18px; border-radius: var(--dn-radius);
    border: 2px dashed var(--dn-border-strong); background: var(--dn-surface-2); color: var(--dn-text); transition: border-color .12s, background .12s;
}
.dn-drop:hover, .dn-drop:focus-within { border-color: var(--dn-accent); background: var(--dn-accent-soft); }
.dn-drop.is-ready { border-style: solid; border-color: var(--dn-state-inplace); background: var(--dn-state-inplace-bg); }
.dn-drop__icon { flex: 0 0 auto; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 12px; background: var(--dn-surface); border: 1px solid var(--dn-border); color: var(--dn-accent-text); }
.dn-drop__text { display: flex; flex-direction: column; min-width: 0; line-height: 1.35; }
.dn-drop__text strong { overflow-wrap: anywhere; }
.dn-drop__text span { color: var(--dn-text-2); font-size: .84rem; }
.dn-drop input[type="file"] { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; }

/* ---------- attente ---------- */

.busy-overlay { position: fixed; inset: 0; z-index: 9999; background: var(--mud-palette-overlay-dark, rgba(7, 13, 26, .6)); display: flex; align-items: center; justify-content: center; }
.busy-content { text-align: center; color: #fff; }
.busy-message { margin-top: 1rem; font-size: 1.1rem; }

.dn-skeleton { border-radius: var(--dn-radius-lg); }

/* ---------- ajustements MudBlazor (cohérence du dessin) ---------- */

.mud-button-root { border-radius: var(--dn-radius-sm); }
.mud-button-root.mud-button-size-medium { min-height: 40px; }
.mud-button-root.mud-button-size-large { min-height: 50px; font-size: 1rem; }
.mud-button-filled.mud-button-filled-primary:not(.mud-disabled) { box-shadow: 0 1px 2px rgba(0, 0, 0, .25); }
.mud-input-outlined .mud-input-outlined-border { border-radius: var(--dn-radius-sm); }
.mud-dialog { border-radius: var(--dn-radius-lg); }
.mud-dialog .mud-dialog-title { font-weight: 700; }
.mud-snackbar { border-radius: var(--dn-radius); }
.mud-popover.mud-menu-popover, .mud-popover-open.mud-popover { border-radius: var(--dn-radius); }
.mud-table-root .mud-table-head .mud-table-cell { font-weight: 700; color: var(--dn-text-2); font-size: .8rem; letter-spacing: .03em; text-transform: uppercase; }
.mud-table { border-radius: var(--dn-radius-lg); border: 1px solid var(--dn-border); box-shadow: var(--dn-shadow-1); }
.mud-progress-linear { border-radius: 999px; }

/* ---------- icônes personnalisées ---------- */

.dn-glyph--img { background: transparent; box-shadow: none; }
.dn-glyph--img img { width: 30px; height: 30px; object-fit: contain; display: block; }
.dn-chip__img { width: 16px; height: 16px; object-fit: contain; }
.dn-glyph--withbar { width: 44px; border-radius: 15px; }
.dn-glyph--withbar svg { display: block; }

/* Une fenêtre qui s'ouvre verrouille le défilement de la page ; MudBlazor compense alors la disparition de l'ascenseur par un retrait de 8 px, ce qui décale tout.
   Comme la place de l'ascenseur est toujours réservée (scrollbar-gutter: stable, diane-tokens.css), il n'y a rien à compenser. */
.scroll-locked { padding-right: 0 !important; }
.scroll-locked .mud-layout .mud-appbar, .scroll-locked .mud-layout .mud-main-content .mud-scroll-to-top { padding-right: 0 !important; }

/* Un bouton discret au milieu d'une phrase (« ou actualisez maintenant »). */
.dn-inlinebtn {
    display: inline; padding: 0; border: 0; background: none; font: inherit; font-weight: 700; color: var(--dn-accent-text); cursor: pointer;
    text-decoration: underline; text-underline-offset: 3px;
}
.dn-inlinebtn:hover { color: var(--dn-text); }
.dn-inlinebtn:focus-visible { outline: 3px solid var(--dn-focus); outline-offset: 2px; border-radius: 4px; }

/* ---------- Signature de l'outil (pages sans session) : conception et partenaire ---------- */
.dn-partner { display: flex; align-items: center; gap: 18px; margin: 0; color: var(--dn-text-soft); }
.dn-partner__logo { flex: 0 0 auto; display: block; border-radius: 50%; line-height: 0; transition: transform .2s ease, box-shadow .2s ease; }
.dn-partner__logo img { display: block; width: 100%; height: auto; border-radius: 50%; }
.dn-partner__logo:hover { transform: scale(1.04); }
.dn-partner__logo:focus-visible, .dn-partner__text a:focus-visible { outline: 3px solid var(--dn-focus); outline-offset: 3px; border-radius: 6px; }
.dn-partner__text { margin: 0; display: flex; flex-direction: column; gap: 2px; line-height: 1.35; }
.dn-partner__line { display: block; }
.dn-partner__text a { white-space: nowrap; color: var(--dn-text); font-weight: 800; text-decoration: underline; text-decoration-color: color-mix(in srgb, var(--dn-accent-text) 60%, transparent); text-underline-offset: 4px; text-decoration-thickness: 2px; }
.dn-partner__text a:hover { text-decoration-color: var(--dn-accent-text); }

/* Version mise en avant, sous la présentation : une carte avec le logo en grand. */
.dn-partner--feature {
    margin-top: 34px; padding: 18px 22px; gap: 22px; border: 1px solid color-mix(in srgb, var(--dn-text) 14%, transparent); border-radius: var(--dn-radius-lg);
    background: linear-gradient(135deg, color-mix(in srgb, var(--dn-text) 7%, transparent), color-mix(in srgb, var(--dn-text) 2%, transparent)); box-shadow: 0 10px 30px rgba(0, 0, 0, .25);
}
.dn-partner--feature .dn-partner__logo { width: clamp(84px, 6.5vw, 112px); box-shadow: 0 0 0 3px color-mix(in srgb, var(--dn-text) 12%, transparent), 0 6px 18px rgba(0, 0, 0, .35); }
.dn-partner--feature .dn-partner__text { font-size: clamp(.95rem, 1.05vw, 1.15rem); }

/* Version compacte, sous le formulaire quand la présentation est masquée (téléphone, tablette). */
.dn-partner--compact { display: none; margin-top: 22px; justify-content: center; gap: 12px; font-size: .9rem; }
.dn-partner--compact .dn-partner__logo { width: 52px; box-shadow: 0 0 0 2px color-mix(in srgb, var(--dn-text) 12%, transparent); }
@media (max-width: 959px) {
    .dn-public__main { flex-direction: column; }
    .dn-partner--compact { display: flex; }
}

/* ---------- Numéro de version, discret ---------- */
.dn-buildtag { font-size: .72rem; letter-spacing: .04em; color: var(--dn-text-3, #7f8da6); font-variant-numeric: tabular-nums; user-select: all; cursor: default; }
.dn-usermenu__version { padding: 6px 16px 8px; text-align: right; }
/* Le numéro de version se pose dans le coin sans occuper de ligne : il ne doit jamais rallonger la page. */
.dn-public { position: relative; }
.dn-public__foot { position: absolute; right: 20px; bottom: 8px; line-height: 1; pointer-events: none; }
.dn-public__foot .dn-buildtag { pointer-events: auto; }
@media (max-width: 959px) { .dn-public__foot { right: 0; left: 0; text-align: center; bottom: 10px; } }