/* export du 10/10/2026 */
/* MARX · BLOG — pages publiques (directions A « Magazine » et B « Guide pratique ») + éditeur + carte console. Jetons --mx-* de la charte v2. */

/* ───── Public : base commune ───── */
.bl{min-height:100vh;display:flex;flex-direction:column;background:var(--mx-bg)}
.bl-hd{position:sticky;top:0;z-index:20;background:color-mix(in oklab,var(--mx-bg) 88%,transparent);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border-bottom:1px solid var(--mx-line)}
.bl-hd-in{max-width:76rem;margin:0 auto;padding:0 var(--mx-gutter);height:56px;display:flex;align-items:center;justify-content:space-between;gap:var(--mx-s-3);min-width:0}
.bl-logo{display:inline-flex;align-items:center;gap:10px;min-height:var(--mx-target);color:var(--mx-ink);text-decoration:none}
.bl-logo .mxl-word{font-size:24px}
.bl-logo-sub{font-size:var(--mx-fs-sm);font-weight:var(--mx-fw-semi);color:var(--mx-muted);padding-left:10px;border-left:1px solid var(--mx-line-2)}
.bl-hd-nav{display:flex;align-items:center;gap:var(--mx-s-1);min-width:0}
.bl-hd-nav>a:not(.mx-btn){display:inline-flex;align-items:center;min-height:var(--mx-target);padding:0 var(--mx-s-2);font-size:var(--mx-fs-sm);font-weight:var(--mx-fw-semi);color:var(--mx-ink);text-decoration:none}
.bl-hd-nav>a[aria-current]{box-shadow:inset 0 -2px 0 var(--mx-red)}
@media (max-width:359.98px){.bl-logo-sub{display:none}}
.bl-main{flex:1 1 auto;width:100%;max-width:76rem;margin:0 auto;padding:var(--mx-s-8) var(--mx-gutter) var(--mx-s-16);display:flex;flex-direction:column;gap:var(--mx-s-10);min-width:0}
.bl-h1{margin:0;font-family:var(--mx-font-display);font-weight:700;text-transform:uppercase;line-height:.92;letter-spacing:-.005em;text-wrap:balance;overflow-wrap:anywhere}
.bl-lead{margin:0;color:var(--mx-ink-2);text-wrap:pretty}
.bl-intro{display:flex;flex-direction:column;gap:var(--mx-s-4)}
.bl-kicker{margin:0;font-size:var(--mx-fs-xs);font-weight:var(--mx-fw-bold);color:var(--mx-red-text)}
.bl-meta{margin:0;display:flex;flex-wrap:wrap;gap:2px 8px;font-size:var(--mx-fs-xs);color:var(--mx-muted);font-variant-numeric:tabular-nums}
.bl-ph{position:relative;display:grid;place-items:center;width:100%;aspect-ratio:16/9;border-radius:var(--mx-r-md);border:1px solid var(--mx-line);background:repeating-linear-gradient(135deg,var(--mx-bg-2) 0 10px,var(--mx-surface-2) 10px 20px);color:var(--mx-muted);font-size:var(--mx-fs-xs);font-weight:var(--mx-fw-semi);overflow:hidden}
.bl-ph span{padding:4px 10px;border-radius:var(--mx-r-pill);background:var(--mx-surface)}
.bl-cats{display:flex;gap:var(--mx-s-2);overflow-x:auto;scrollbar-width:none;min-width:0}
.bl-cats::-webkit-scrollbar{display:none}
.bl-cat{flex:0 0 auto;display:inline-flex;align-items:center;min-height:var(--mx-target);padding:0 var(--mx-s-4);border:1.5px solid var(--mx-line-2);border-radius:var(--mx-r-pill);font-size:var(--mx-fs-sm);font-weight:var(--mx-fw-semi);color:var(--mx-ink);text-decoration:none;white-space:nowrap;transition:background var(--mx-d-fast) var(--mx-ease),border-color var(--mx-d-fast) var(--mx-ease)}
.bl-cat:hover{border-color:var(--mx-ink);color:var(--mx-ink)}
.bl-cat[aria-current]{background:var(--mx-ink);border-color:var(--mx-ink);color:var(--mx-on-ink)}
.bl-sec{margin:0 0 var(--mx-s-5);padding-bottom:var(--mx-s-2);border-bottom:2px solid var(--mx-line-strong);font-size:var(--mx-fs-sm);font-weight:var(--mx-fw-bold)}
.bl-feed{display:flex;flex-direction:column;gap:var(--mx-s-12);min-width:0}
.bl-list{display:grid;gap:var(--mx-s-8) var(--mx-s-6);min-width:0}
.bl-card{position:relative;display:flex;flex-direction:column;gap:var(--mx-s-3);min-width:0}
.bl-card-bd{display:flex;flex-direction:column;gap:var(--mx-s-2);min-width:0}
.bl-card-t{margin:0;font-weight:var(--mx-fw-bold);line-height:1.2;text-wrap:balance}
.bl-card-t a{color:var(--mx-ink);text-decoration:none;font-weight:inherit}
.bl-card-t a::after{content:"";position:absolute;inset:0;z-index:1}
.bl-card:hover .bl-card-t a{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:4px}
.bl-card-t a:focus-visible{outline:none}
.bl-card:has(a:focus-visible){outline:2px solid var(--mx-focus);outline-offset:4px;border-radius:var(--mx-r-sm)}
.bl-card-ch{margin:0;font-size:var(--mx-fs-sm);line-height:1.5;color:var(--mx-ink-2);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.bl-pager{display:flex;align-items:center;justify-content:space-between;gap:var(--mx-s-3);padding-top:var(--mx-s-4);border-top:1px solid var(--mx-line)}
.bl-pager [aria-disabled]{color:var(--mx-muted);cursor:default}
.bl-empty,.bl-gone{display:flex;flex-direction:column;align-items:center;text-align:center;gap:var(--mx-s-3);padding:var(--mx-s-12) var(--mx-s-4)}
.bl-empty{border:1.5px dashed var(--mx-line-2);border-radius:var(--mx-r-lg)}
.bl-gone{padding-block:var(--mx-s-16)}
.bl-gone .bl-h1{font-size:clamp(2.25rem,1.6rem+3vw,4rem)}
.bl-gone .bl-chapo{max-width:30rem}
/* Fil d'Ariane */
.bl-crumb ol{margin:0;padding:0;list-style:none;display:flex;flex-wrap:wrap;align-items:center;gap:2px 6px;font-size:var(--mx-fs-xs);color:var(--mx-muted)}
.bl-crumb li{display:inline-flex;align-items:center;gap:6px;min-width:0}
.bl-crumb li+li::before{content:"›";color:var(--mx-faint)}
.bl-crumb a{display:inline-flex;align-items:center;min-height:32px;color:var(--mx-ink-2);font-weight:var(--mx-fw-semi);text-decoration:none}
.bl-crumb a:hover{color:var(--mx-ink);text-decoration:underline}
.bl-crumb [aria-current]{max-width:22rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--mx-ink)}
@media (max-width:767.98px){.bl-crumb [aria-current]{display:none}.bl-crumb li:nth-last-child(2)::after{content:""}}
/* Article */
.bl-main--art{gap:var(--mx-s-8)}
.bl-art-hd{display:flex;flex-direction:column;gap:var(--mx-s-4);max-width:48rem;min-width:0}
.bl-chapo{margin:0;font-size:clamp(1.125rem,1.05rem + .4vw,1.375rem);line-height:1.5;color:var(--mx-ink);text-wrap:pretty}
.bl-cover{margin:0;display:flex;flex-direction:column;gap:var(--mx-s-2)}
.bl-cover figcaption,.bl-fig figcaption{font-size:var(--mx-fs-xs);color:var(--mx-muted);line-height:1.4}
.bl-art{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--mx-s-6);min-width:0}
.bl-toc{display:flex;flex-direction:column;gap:var(--mx-s-3);min-width:0}
.bl-toc details{border:1px solid var(--mx-line);border-radius:var(--mx-r-md);background:var(--mx-surface)}
.bl-toc summary{display:flex;align-items:center;justify-content:space-between;gap:var(--mx-s-2);min-height:var(--mx-target);padding:0 var(--mx-s-4);font-size:var(--mx-fs-sm);font-weight:var(--mx-fw-bold);cursor:pointer;list-style:none}
.bl-toc summary::-webkit-details-marker{display:none}
.bl-toc details[open] summary .mx-ico{transform:rotate(180deg)}
.bl-toc ol{margin:0;padding:0 var(--mx-s-4) var(--mx-s-3);list-style:none;display:flex;flex-direction:column}
.bl-toc a{display:block;padding:9px 0 9px 12px;border-left:2px solid var(--mx-line);font-size:var(--mx-fs-sm);font-weight:var(--mx-fw-medium);line-height:1.35;color:var(--mx-ink-2);text-decoration:none}
.bl-toc a:hover{color:var(--mx-ink);border-left-color:var(--mx-ink)}
.bl-toc>.mx-btn{align-self:flex-start}
@media (min-width:1024px){
.bl-toc{position:sticky;top:80px;align-self:start}
.bl-toc details{border:0;background:none}
.bl-toc summary{padding:0;pointer-events:none;min-height:32px;color:var(--mx-muted);font-size:var(--mx-fs-xs)}
.bl-toc summary .mx-ico{display:none}
.bl-toc ol{padding:0}
}
.bl-body{display:flex;flex-direction:column;gap:var(--mx-s-5);max-width:42rem;min-width:0;font-size:1.0625rem;line-height:1.7;color:var(--mx-ink)}
.bl-body p{margin:0;text-wrap:pretty}
.bl-body h2{margin:var(--mx-s-6) 0 0;font-size:clamp(1.375rem,1.2rem + .6vw,1.75rem);font-weight:var(--mx-fw-bold);line-height:1.2;scroll-margin-top:80px;text-wrap:balance}
.bl-body h3{margin:var(--mx-s-2) 0 0;font-size:1.1875rem;font-weight:var(--mx-fw-bold);line-height:1.3}
.bl-body ul,.bl-body ol{margin:0;padding-left:1.3em;display:flex;flex-direction:column;gap:6px}
.bl-body ul{list-style:disc}.bl-body ol{list-style:decimal}
.bl-body li::marker{color:var(--mx-red)}
.bl-body blockquote{margin:var(--mx-s-2) 0}
.bl-table,.bl-fig{margin:0;display:flex;flex-direction:column;gap:var(--mx-s-2);min-width:0}
.bl-scroll{overflow-x:auto;min-width:0}
.bl-table table{width:100%;border-collapse:collapse;font-size:var(--mx-fs-sm);line-height:1.45;font-variant-numeric:tabular-nums}
.bl-table caption{caption-side:bottom;text-align:left;padding-top:var(--mx-s-2);font-size:var(--mx-fs-xs);color:var(--mx-muted)}
.bl-table th,.bl-table td{padding:10px 12px;border-bottom:1px solid var(--mx-line);text-align:left;vertical-align:top}
.bl-table thead th{border-bottom:2px solid var(--mx-line-strong);font-weight:var(--mx-fw-bold);white-space:nowrap}
.bl-table tbody th{font-weight:var(--mx-fw-semi)}
.bl-box{display:flex;flex-direction:column;gap:6px;padding:var(--mx-s-4) var(--mx-s-5);border-radius:var(--mx-r-md);font-size:var(--mx-fs-body);line-height:1.55}
.bl-box-t{display:flex;align-items:center;gap:8px;font-size:var(--mx-fs-sm);font-weight:var(--mx-fw-bold)}
.bl-box--key{background:var(--mx-green-soft)}.bl-box--key .bl-box-t{color:var(--mx-green-text)}
.bl-box--warn{background:var(--mx-warn-soft);border:1px solid var(--mx-warn)}.bl-box--warn .bl-box-t{color:var(--mx-warn-text)}
.bl-mid{display:flex;align-items:flex-start;gap:10px;padding:var(--mx-s-3) 0;border-block:1px solid var(--mx-line);font-size:var(--mx-fs-sm);line-height:1.5;color:var(--mx-ink-2)}
.bl-mid .mx-ico{margin-top:3px;color:var(--mx-red-text)}
.bl-faq{display:flex;flex-direction:column}
.bl-faq h2{margin-bottom:var(--mx-s-3)}
.bl-faq details{border-bottom:1px solid var(--mx-line)}
.bl-faq details:first-of-type{border-top:1px solid var(--mx-line)}
.bl-faq summary{display:flex;align-items:center;justify-content:space-between;gap:var(--mx-s-3);min-height:56px;padding:var(--mx-s-2) 0;cursor:pointer;list-style:none}
.bl-faq summary::-webkit-details-marker{display:none}
.bl-faq summary h3{margin:0;font-size:1.0625rem}
.bl-faq summary .mx-ico{flex:0 0 auto;transition:transform var(--mx-d-fast) var(--mx-ease)}
.bl-faq details[open] summary .mx-ico{transform:rotate(180deg)}
.bl-faq details p{padding-bottom:var(--mx-s-4);color:var(--mx-ink-2)}
.bl-src ol{gap:var(--mx-s-2);font-size:var(--mx-fs-sm)}
.bl-src li::marker{color:var(--mx-muted)}
.bl-host{font-size:var(--mx-fs-xs);color:var(--mx-muted)}
.bl-cta{display:flex;flex-direction:column;align-items:flex-start;gap:var(--mx-s-3);margin-top:var(--mx-s-6);padding:var(--mx-s-6);border-radius:var(--mx-r-lg)}
.bl-cta-t{font-size:1.25rem;font-weight:var(--mx-fw-bold);line-height:1.25}
.bl-cta-x{font-size:var(--mx-fs-sm)}
.bl-rel{padding-top:var(--mx-s-4)}
.bl-list--3{grid-template-columns:repeat(auto-fill,minmax(min(100%,18rem),1fr))}
.bl-ft{margin-top:auto;border-top:1px solid var(--mx-line);background:var(--mx-bg-2)}
.bl-ft-in{max-width:76rem;margin:0 auto;padding:var(--mx-s-5) var(--mx-gutter);display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--mx-s-2) var(--mx-s-6)}
.bl-ft .mxl-word{font-size:20px;color:var(--mx-ink)}

/* ───── Direction A · Magazine ───── */
.bl--a .bl-intro{padding-bottom:var(--mx-s-6);border-bottom:2px solid var(--mx-line-strong)}
.bl--a .bl-intro .bl-h1{font-size:clamp(3.25rem,1.6rem + 7vw,8rem);line-height:.85}
.bl--a .bl-lead{font-size:clamp(1.0625rem,1rem + .45vw,1.375rem);max-width:38rem}
.bl--a .bl-home{display:flex;flex-direction:column;gap:var(--mx-s-8);min-width:0}
.bl--a .bl-list{grid-template-columns:repeat(auto-fill,minmax(min(100%,19rem),1fr))}
.bl--a .bl-card-t{font-size:1.25rem}
.bl--a .bl-card--noimg{justify-content:flex-end;padding:var(--mx-s-5);min-height:14rem;background:var(--mx-surface);border:1px solid var(--mx-line);border-radius:var(--mx-r-md)}
.bl--a .bl-card--noimg .bl-card-t{font-family:var(--mx-font-display);font-weight:700;text-transform:uppercase;font-size:1.75rem;line-height:.98}
.bl--a .bl-card--une{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--mx-s-5)}
.bl--a .bl-card--une .bl-ph{aspect-ratio:4/3}
.bl--a .bl-card--une .bl-card-t{font-family:var(--mx-font-display);font-weight:700;text-transform:uppercase;font-size:clamp(2.125rem,1.5rem + 2.6vw,3.75rem);line-height:.94}
.bl--a .bl-card--une .bl-card-ch{-webkit-line-clamp:3;font-size:var(--mx-fs-body)}
@media (min-width:1024px){.bl--a .bl-card--une{grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);align-items:end;gap:var(--mx-s-10)}.bl--a .bl-card--une .bl-card-bd{padding-bottom:var(--mx-s-4)}}
.bl--a .bl-art-hd{align-items:center;text-align:center;margin-inline:auto}
.bl--a .bl-art-hd .bl-meta{justify-content:center}
.bl--a .bl-art-hd .bl-h1{font-size:clamp(2.5rem,1.5rem + 4.4vw,5.25rem)}
.bl--a .bl-crumb ol{justify-content:center}
.bl--a .bl-cover .bl-ph{aspect-ratio:21/9}
@media (max-width:767.98px){.bl--a .bl-cover .bl-ph{aspect-ratio:4/3}}
@media (min-width:1024px){.bl--a .bl-art{grid-template-columns:minmax(0,42rem) 14rem;justify-content:center;gap:var(--mx-s-16)}.bl--a .bl-toc{order:2}}
.bl--a .bl-body h2{font-family:var(--mx-font-display);font-weight:700;text-transform:uppercase;font-size:clamp(1.75rem,1.4rem + 1.2vw,2.375rem);line-height:1}
.bl--a .bl-body>p:first-child::first-letter{float:left;margin:6px 10px 0 0;font-family:var(--mx-font-display);font-weight:700;font-size:4.4em;line-height:.8;color:var(--mx-red)}
.bl--a .bl-body blockquote p{font-family:var(--mx-font-display);font-weight:700;font-size:clamp(1.75rem,1.4rem + 1.4vw,2.5rem);line-height:1.05;text-wrap:balance}
.bl--a .bl-body blockquote{padding:var(--mx-s-4) 0;border-block:2px solid var(--mx-line-strong)}
.bl--a .bl-cta{background:var(--mx-ink);color:var(--mx-on-ink)}
.bl--a .bl-cta-x{color:color-mix(in oklab,var(--mx-on-ink) 82%,transparent)}

/* ───── Direction B · Guide pratique ───── */
.bl--b .bl-main{max-width:72rem;gap:var(--mx-s-8)}
.bl--b .bl-intro .bl-h1{font-size:clamp(2.25rem,1.7rem + 2.2vw,3.5rem)}
.bl--b .bl-lead{font-size:var(--mx-fs-body);max-width:36rem}
.bl--b .bl-home{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--mx-s-6);min-width:0}
@media (min-width:1024px){
.bl--b .bl-home{grid-template-columns:14rem minmax(0,1fr);gap:var(--mx-s-10)}
.bl--b .bl-cats{position:sticky;top:80px;align-self:start;flex-direction:column;gap:2px;overflow:visible}
.bl--b .bl-cat{border:0;border-radius:var(--mx-r-sm);padding:0 var(--mx-s-3);white-space:normal;line-height:1.3}
.bl--b .bl-cat:hover{background:var(--mx-bg-2)}
.bl--b .bl-cat[aria-current]{background:var(--mx-surface);color:var(--mx-ink);font-weight:var(--mx-fw-bold);box-shadow:var(--mx-e-1)}
}
.bl--b .bl-sec{border-bottom-width:1px;border-bottom-color:var(--mx-line-2)}
.bl--b .bl-feed{gap:var(--mx-s-8)}
.bl--b .bl-list{gap:0}
.bl--b .bl-list>.bl-card{display:grid;grid-template-columns:minmax(0,1fr) 7.5rem;align-items:start;gap:var(--mx-s-4);padding:var(--mx-s-5) 0;border-bottom:1px solid var(--mx-line)}
.bl--b .bl-list>.bl-card:first-child{padding-top:0}
.bl--b .bl-list>.bl-card .bl-card-img{order:2}
.bl--b .bl-list>.bl-card .bl-ph{aspect-ratio:4/3}
.bl--b .bl-list>.bl-card .bl-ph span{display:none}
.bl--b .bl-list>.bl-card--noimg{grid-template-columns:minmax(0,1fr)}
.bl--b .bl-card-t{font-size:1.125rem}
@media (max-width:479.98px){.bl--b .bl-list>.bl-card{grid-template-columns:minmax(0,1fr) 5.5rem}}
.bl--b .bl-list--3>.bl-card{display:flex;padding:var(--mx-s-4);border:1px solid var(--mx-line);border-radius:var(--mx-r-md);background:var(--mx-surface)}
.bl--b .bl-list--3>.bl-card .bl-card-img{order:0}
.bl--b .bl-list--3>.bl-card .bl-ph{aspect-ratio:16/9}
.bl--b .bl-list--3{gap:var(--mx-s-3)}
.bl--b .bl-card--une{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--mx-s-4);padding:var(--mx-s-4);border:1px solid var(--mx-line);border-radius:var(--mx-r-lg);background:var(--mx-surface)}
@media (min-width:768px){.bl--b .bl-card--une{grid-template-columns:minmax(0,.9fr) minmax(0,1fr);align-items:center;gap:var(--mx-s-6);padding:var(--mx-s-5)}}
.bl--b .bl-card--une .bl-card-t{font-size:1.5rem}
.bl--b .bl-art-hd .bl-h1{font-size:clamp(2rem,1.55rem + 1.9vw,3.25rem);line-height:.96}
.bl--b .bl-chapo{position:relative;padding:var(--mx-s-4) var(--mx-s-5);border:1px solid var(--mx-line);border-radius:var(--mx-r-md);background:var(--mx-surface);font-size:var(--mx-fs-body)}
.bl--b .bl-chapo::before{content:"En bref";display:block;margin-bottom:6px;font-size:var(--mx-fs-xs);font-weight:var(--mx-fw-bold);color:var(--mx-red-text)}
.bl--b .bl-gone .bl-chapo::before{content:none}
.bl--b .bl-cover{max-width:48rem}
@media (min-width:1024px){.bl--b .bl-art{grid-template-columns:14rem minmax(0,44rem);gap:var(--mx-s-10)}}
.bl--b .bl-body{font-size:1rem;line-height:1.65}
.bl--b .bl-body blockquote{padding:var(--mx-s-4) var(--mx-s-5);border:1px solid var(--mx-line);border-radius:var(--mx-r-md);background:var(--mx-surface-2)}
.bl--b .bl-body blockquote p{font-weight:var(--mx-fw-semi)}
.bl--b .bl-cta{border:1.5px solid var(--mx-line-strong);background:var(--mx-surface)}
.bl--b .bl-cta-x{color:var(--mx-ink-2)}

/* ───── Éditeur (dans l'app) ───── */
.be-page{max-width:var(--mx-page-max)}
.be-hd{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:var(--mx-s-3)}
.be-new{font-weight:var(--mx-fw-bold)}
.be-tools-row{display:flex;flex-wrap:wrap;align-items:center;gap:var(--mx-s-3)}
.be-tools-row .mx-tabs{flex:1 1 20rem}
.be-search{position:relative;flex:0 1 18rem;min-width:0}
.be-search .mx-ico{position:absolute;left:14px;top:50%;transform:translateY(-50%);color:var(--mx-muted);pointer-events:none}
.be-search .mx-input{padding-left:42px}
.be-rows .mx-item{grid-template-columns:minmax(0,1fr) auto}
.be-rows .mx-item-meta{white-space:normal;justify-content:flex-end;flex-wrap:wrap}
.be-who{font-size:var(--mx-fs-xs);color:var(--mx-muted)}
.be-bar{position:sticky;top:var(--mx-nav-h);z-index:15;background:color-mix(in oklab,var(--mx-bg) 94%,transparent);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom:1px solid var(--mx-line)}
.be-bar-in{max-width:var(--mx-page-max);margin:0 auto;padding:var(--mx-s-2) var(--mx-gutter);display:flex;align-items:center;justify-content:space-between;gap:var(--mx-s-3);min-height:60px;min-width:0}
.be-save{display:inline-flex;align-items:center;gap:6px;font-size:var(--mx-fs-xs);font-weight:var(--mx-fw-semi);color:var(--mx-muted);white-space:nowrap}
.be-save .mx-ico{color:var(--mx-green-text)}
.be-bar-l{display:flex;align-items:center;gap:var(--mx-s-3);min-width:0}
.be-bar-r{display:flex;align-items:center;gap:var(--mx-s-2)}
.be-mbar{display:none}
@media (max-width:767.98px){
.be-bar-r{display:none}
.be-mbar{position:fixed;left:0;right:0;bottom:0;z-index:30;display:grid;grid-template-columns:1fr 1fr;gap:var(--mx-s-2);padding:var(--mx-s-2) var(--mx-gutter) calc(var(--mx-s-2) + env(safe-area-inset-bottom));background:var(--mx-surface);border-top:1px solid var(--mx-line);box-shadow:0 -6px 20px rgba(0,0,0,.08)}
.be-editing .mx-page{padding-bottom:120px}
body.be-editing .pl-demo{bottom:84px}
}
.be-write{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--mx-s-6);align-items:start}
@media (min-width:1100px){.be-write{grid-template-columns:minmax(0,1fr) 22rem}.be-side{position:sticky;top:calc(var(--mx-nav-h) + 76px)}}
.be-canvas{display:flex;flex-direction:column;gap:var(--mx-s-5);min-width:0}
.be-title{min-height:56px;font-size:1.5rem;font-weight:var(--mx-fw-bold)}
.be-slug{display:flex;align-items:stretch;min-width:0;border:var(--mx-bw-ui) solid var(--mx-line-ui);border-radius:var(--mx-r-md);background:var(--mx-surface);overflow:hidden}
.be-slug span{display:flex;align-items:center;padding:0 var(--mx-s-3);background:var(--mx-bg-2);font-size:var(--mx-fs-sm);color:var(--mx-muted);white-space:nowrap}
.be-slug input{flex:1 1 auto;min-width:0;border:0;background:transparent;padding:0 var(--mx-s-3);min-height:var(--mx-h-md);font:inherit;font-size:var(--mx-fs-sm);color:var(--mx-ink)}
.be-slug:focus-within{border-color:var(--mx-ink);box-shadow:0 0 0 3px color-mix(in oklab,var(--mx-focus) 35%,transparent)}
.be-slug input:focus{outline:none}
@media (max-width:479.98px){.be-slug span{max-width:7.5rem;overflow:hidden;text-overflow:ellipsis}}
.be-grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,14rem),1fr));gap:var(--mx-s-4)}
.be-cover{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--mx-s-3)}
.be-cover .bl-ph{aspect-ratio:21/9}
.be-sec-t{display:flex;align-items:center;justify-content:space-between;gap:var(--mx-s-3);padding-top:var(--mx-s-4);border-top:1px solid var(--mx-line)}
.be-tb{position:sticky;top:calc(var(--mx-nav-h) + 61px);z-index:5;display:flex;align-items:center;gap:2px;padding:4px;border:1px solid var(--mx-line);border-radius:var(--mx-r-md);background:var(--mx-surface);box-shadow:var(--mx-e-1);align-self:flex-start}
.be-tb button{display:inline-grid;place-items:center;min-width:var(--mx-target);height:36px;border-radius:var(--mx-r-sm);font-size:var(--mx-fs-sm);color:var(--mx-ink)}
.be-tb button::after{content:"";position:absolute}
.be-tb button:hover{background:var(--mx-bg-2)}
.be-tb .b{font-weight:800}.be-tb .i{font-style:italic;font-weight:600}
.be-tb-sep{width:1px;height:20px;background:var(--mx-line);margin:0 4px}
.be-blocks{display:flex;flex-direction:column;gap:2px}
.be-blk{position:relative;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:start;gap:var(--mx-s-2);padding:var(--mx-s-2);border:1px solid transparent;border-radius:var(--mx-r-md);transition:border-color var(--mx-d-fast) var(--mx-ease),background var(--mx-d-fast) var(--mx-ease)}
.be-blk:hover,.be-blk:focus-within{border-color:var(--mx-line-2);background:var(--mx-surface)}
.be-blk-k{display:inline-flex;align-items:center;justify-content:center;min-width:3.25rem;height:24px;margin-top:6px;padding:0 6px;border-radius:var(--mx-r-xs);background:var(--mx-bg-2);font-size:11px;font-weight:var(--mx-fw-bold);color:var(--mx-ink-2);white-space:nowrap}
.be-blk-x{display:flex;gap:2px;opacity:0;transition:opacity var(--mx-d-fast) var(--mx-ease)}
.be-blk:hover .be-blk-x,.be-blk:focus-within .be-blk-x{opacity:1}
@media (hover:none),(max-width:767.98px){.be-blk-x{opacity:1}.be-blk-x .be-up,.be-blk-x .be-dn{display:none}}
.be-blk-x .mx-iconbtn{width:36px;height:36px;color:var(--mx-muted)}
.be-blk-x .mx-iconbtn::after{content:"";position:absolute;inset:-4px}
.be-blk-x .mx-iconbtn:hover{color:var(--mx-ink)}
.be-ce{min-height:36px;padding:5px 2px;border-radius:var(--mx-r-xs);font-size:1rem;line-height:1.6;color:var(--mx-ink);overflow-wrap:anywhere}
.be-ce:focus{outline:none}
.be-ce:empty::before{content:attr(data-ph);color:var(--mx-muted)}
.be-ce--h2{font-size:1.375rem;font-weight:var(--mx-fw-bold);line-height:1.3}
.be-ce--h3{font-size:1.125rem;font-weight:var(--mx-fw-bold)}
.be-ce--quote{font-weight:var(--mx-fw-semi);padding-left:12px;border-left:3px solid var(--mx-line-2)}
.be-ce ul{margin:0;padding-left:1.2em;list-style:disc}
.be-blk--key .be-ce{padding:8px 12px;border-radius:var(--mx-r-sm);background:var(--mx-green-soft)}
.be-blk--warn .be-ce{padding:8px 12px;border-radius:var(--mx-r-sm);background:var(--mx-warn-soft)}
.be-imgblk{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--mx-s-2)}
.be-imgblk .bl-ph{aspect-ratio:16/7}
.be-tbl{width:100%;border-collapse:collapse;font-size:var(--mx-fs-sm)}
.be-tbl th,.be-tbl td{padding:6px 8px;border:1px solid var(--mx-line);text-align:left;vertical-align:top}
.be-tbl th{background:var(--mx-bg-2);font-weight:var(--mx-fw-bold)}
.be-add{position:relative;display:flex;justify-content:center;margin:var(--mx-s-2) 0}
.be-add>.mx-btn{border-style:dashed}
.be-addmenu{position:absolute;z-index:20;top:calc(100% + 6px);left:50%;transform:translateX(-50%);width:min(22rem,calc(100vw - 2rem));padding:var(--mx-s-2);display:grid;grid-template-columns:1fr 1fr;gap:2px;background:var(--mx-surface);border:1px solid var(--mx-line);border-radius:var(--mx-r-lg);box-shadow:var(--mx-e-3);animation:mx-pop-in var(--mx-d-fast) var(--mx-ease-out) both}
.be-addmenu button{display:flex;align-items:center;gap:var(--mx-s-2);min-height:var(--mx-target);padding:0 var(--mx-s-3);border-radius:var(--mx-r-sm);font-size:var(--mx-fs-sm);font-weight:var(--mx-fw-semi);text-align:left;color:var(--mx-ink)}
.be-addmenu button:hover{background:var(--mx-bg-2)}
.be-addmenu .k{display:inline-grid;place-items:center;min-width:2.25rem;height:22px;border-radius:var(--mx-r-xs);background:var(--mx-bg-2);font-size:10.5px;font-weight:var(--mx-fw-bold);color:var(--mx-ink-2)}
.be-qa{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--mx-s-2);padding:var(--mx-s-3);border:1px solid var(--mx-line);border-radius:var(--mx-r-md);background:var(--mx-surface)}
.be-qa .mx-stack{min-width:0}
.be-side{display:flex;flex-direction:column;gap:var(--mx-s-4);min-width:0}
.be-side .mx-card{gap:var(--mx-s-4)}
.be-count{font-size:var(--mx-fs-xs);font-weight:var(--mx-fw-semi);color:var(--mx-muted);font-variant-numeric:tabular-nums}
.be-count.is-over{color:var(--mx-warn-text)}
.be-lblrow{display:flex;align-items:baseline;justify-content:space-between;gap:var(--mx-s-2)}
.be-serp{display:flex;flex-direction:column;gap:4px;padding:var(--mx-s-3) var(--mx-s-4);border:1px solid var(--mx-line);border-radius:var(--mx-r-md);background:var(--mx-surface-2);font-family:Arial,Helvetica,sans-serif;min-width:0}
.be-serp-u{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--mx-ink-2);overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.be-serp-fav{flex:0 0 auto;display:inline-grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--mx-bg-2);font-size:10px;font-weight:700;color:var(--mx-red-text)}
.be-serp-t{font-size:18px;line-height:1.3;color:var(--mx-info-text);overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.be-serp-d{font-size:13px;line-height:1.45;color:var(--mx-ink-2);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.be-share{display:grid;grid-template-columns:minmax(0,1fr);border:1px solid var(--mx-line);border-radius:var(--mx-r-md);overflow:hidden;background:var(--mx-surface-2)}
.be-share .bl-ph{border:0;border-radius:0;aspect-ratio:1.91/1}
.be-share-bd{display:flex;flex-direction:column;gap:2px;padding:var(--mx-s-2) var(--mx-s-3)}
.be-share-bd .u{font-size:11px;color:var(--mx-muted);text-transform:uppercase;letter-spacing:.04em}
.be-share-bd .t{font-size:var(--mx-fs-sm);font-weight:var(--mx-fw-bold);line-height:1.3;color:var(--mx-ink)}
.be-check{display:flex;flex-direction:column;gap:2px;margin:0;padding:0;list-style:none}
.be-check li{display:grid;grid-template-columns:22px minmax(0,1fr);gap:var(--mx-s-2);align-items:start;padding:7px 0;font-size:var(--mx-fs-sm);line-height:1.4;color:var(--mx-ink)}
.be-check li .mx-ico{margin-top:1px}
.be-check .ok .mx-ico{color:var(--mx-green-text)}
.be-check .warn .mx-ico{color:var(--mx-warn-text)}
.be-check .info .mx-ico{color:var(--mx-muted)}
.be-check .warn span{font-weight:var(--mx-fw-semi)}
.be-check small{display:block;font-size:var(--mx-fs-xs);color:var(--mx-muted);font-weight:400}
.be-prev{display:flex;flex-direction:column;gap:var(--mx-s-4);min-width:0}
.be-prev-frame{width:100%;margin:0 auto;border:1px solid var(--mx-line);border-radius:var(--mx-r-lg);overflow:hidden;background:var(--mx-bg);box-shadow:var(--mx-e-2)}
.be-prev-frame--mob{max-width:375px}
.be-prev-frame iframe{display:block;width:100%;height:calc(100vh - 220px);min-height:520px;border:0}
.be-live{display:flex;flex-wrap:wrap;align-items:center;gap:var(--mx-s-2);min-width:0}
.be-live a{overflow-wrap:anywhere}
.be-phase{display:flex;align-items:center;gap:var(--mx-s-2);font-size:var(--mx-fs-xs);font-weight:var(--mx-fw-semi);color:var(--mx-ink-2);white-space:nowrap}
.be-static .mx-modal-bg{position:fixed}

/* ───── Carte « Blog » de la console + panneau de notifications statique ───── */
.bk-grid{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--mx-s-6);align-items:start}
@media (min-width:1100px){.bk-grid{grid-template-columns:minmax(0,1.4fr) minmax(0,1fr)}}
.bk-card{gap:0;padding:0;overflow:hidden}
.bk-card-hd{display:flex;align-items:center;justify-content:space-between;gap:var(--mx-s-3);padding:var(--mx-s-4) var(--mx-s-5);border-bottom:1px solid var(--mx-line)}
.bk-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--mx-s-3);align-items:center;padding:var(--mx-s-3) var(--mx-s-5);border-bottom:1px solid var(--mx-line)}
.bk-row:last-child{border-bottom:0}
.bk-row .t{font-size:var(--mx-fs-sm);font-weight:var(--mx-fw-semi);line-height:1.35;color:var(--mx-ink);overflow-wrap:anywhere}
.bk-row .m{font-size:var(--mx-fs-xs);color:var(--mx-muted);font-variant-numeric:tabular-nums}
.bk-row-a{display:flex;align-items:center;gap:var(--mx-s-1)}
.bk-sub{padding:var(--mx-s-3) var(--mx-s-5) var(--mx-s-2);font-size:var(--mx-fs-xs);font-weight:var(--mx-fw-bold);color:var(--mx-muted);background:var(--mx-surface-2);border-bottom:1px solid var(--mx-line)}
.bk-give{display:flex;flex-wrap:wrap;gap:var(--mx-s-2);padding:var(--mx-s-4) var(--mx-s-5);border-top:1px solid var(--mx-line);background:var(--mx-surface-2)}
.bk-give .mx-input{flex:1 1 12rem;min-width:0}
.bk-pop .mx-popover{position:static;display:flex;width:100%;max-width:26rem;max-height:none;animation:none;box-shadow:var(--mx-e-2)}
.bk-badge{display:inline-flex;align-items:center;height:22px;padding:0 8px;border-radius:6px;background:var(--mx-bg-2);border:1px solid var(--mx-line-2);font-size:11px;font-weight:var(--mx-fw-bold);color:var(--mx-ink-2)}
.mx-stack--5{--mx-stack:var(--mx-s-5)}
.bl-meta>span{white-space:nowrap}
.be-bar-l{min-width:0;overflow:hidden}
.be-save{min-width:0;overflow:hidden;text-overflow:ellipsis}
@media (max-width:479.98px){.be-bar-l .mx-back span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}.be-save .w{display:none}.be-save .m{display:inline}}
.be-save .m{display:none}