/* ==========================================================================
   LMDS · Design system partagé (DA de l'accueil appliquée aux pages internes)
   Source : /index.html (24/10/2026). Généré/injecté par unify_da.py le 27/10/2026.
   Chargé APRÈS le <style> inline de chaque page : il complète, il ne remplace pas le contenu.
   ========================================================================== */
:root{--v:#b44dff;--v2:#9a2fe6;--bk:#000;--wh:#fff;--g1:#111;--g2:#1c1c1c;--g3:#8a8a8a;--line:#2a2a2a;
 --acc:#b44dff;--sp:cubic-bezier(.34,1.56,.64,1);--ease:cubic-bezier(.16,1,.3,1);--vd:#0b0712;--vd2:#1a0b2e;--vl:#3a2a4f}
html{scroll-behavior:smooth}
::selection{background:var(--v);color:#fff}

/* ---------- keyframes (mêmes noms que l'accueil + quelques ajouts da-) ---------- */
@keyframes t{to{transform:translateX(-50%)}}
@keyframes fi{from{opacity:0;transform:translateY(8px)}}
@keyframes blink{50%{opacity:0}}
@keyframes ring{0%{opacity:.9;transform:scale(.2)}100%{opacity:0;transform:scale(1.6)}}
@keyframes wpan{to{transform:translateX(-50%)}}
@keyframes daUp{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}
@keyframes daBar{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes daGlow{0%,100%{transform:translate3d(0,0,0) scale(1);opacity:.9}50%{transform:translate3d(-4%,3%,0) scale(1.08);opacity:1}}
@keyframes daShine{from{background-position:200% 0}to{background-position:-200% 0}}
@keyframes daPulse{0%,100%{box-shadow:0 0 0 0 rgba(180,77,255,.45)}50%{box-shadow:0 0 0 8px rgba(180,77,255,0)}}

/* ---------- barre de progression de lecture ---------- */
.da-prog{position:fixed;left:0;top:0;height:3px;width:100%;z-index:70;transform-origin:0 50%;transform:scaleX(0);
 background:linear-gradient(90deg,var(--v2),var(--v),#e0218a);box-shadow:0 0 12px rgba(180,77,255,.7);pointer-events:none}

/* ---------- boutons (copie accueil) ---------- */
.btn{transition:transform .2s,box-shadow .2s,background .2s,color .2s,border-color .2s}
.btn:hover{transform:translateY(-2px);box-shadow:0 10px 28px rgba(180,77,255,.45)}
.btn.v{background:var(--v);border-color:var(--v);color:#fff;box-shadow:0 8px 24px rgba(180,77,255,.35)}.btn.v:hover{background:var(--v2);border-color:var(--v2);color:#fff}
.btn.o{border-color:rgba(255,255,255,.85);color:#fff;background:rgba(0,0,0,.25);backdrop-filter:blur(2px)}.btn.o:hover{background:#fff;color:#000}
.btn .ar{margin-left:10px;transition:.15s;display:inline-block}.btn:hover .ar{transform:translateX(4px)}

/* ---------- tag / kick (accueil) ---------- */
.tag,.art .tag{border-color:var(--v);color:#fff;background:rgba(255,255,255,.14)}
.kick b{color:var(--v)}

/* ---------- séparateurs .sep (accueil) ---------- */
.sep{display:block;border:0;height:0;margin:8px auto;max-width:1136px;width:calc(100% - 48px);border-top:1px solid var(--vl);position:relative;overflow:visible}
.sep:before{content:"";position:absolute;left:50%;top:-3px;width:84px;margin-left:-42px;border-top:5px solid var(--v);
 transition:width .9s cubic-bezier(.2,.8,.2,1),margin .9s cubic-bezier(.2,.8,.2,1)}
.js .sep:not(.in):before{width:0;margin-left:0}
.prose hr.sep,.art hr.sep{width:100%;max-width:none;margin:54px auto;border-top:1px solid var(--vl)}

/* ---------- cartes (accueil) ---------- */
.card{position:relative;transition:transform .25s,box-shadow .25s,background .2s,color .2s}
.card:hover{transform:translateY(-6px);box-shadow:0 14px 40px rgba(180,77,255,.45);z-index:2}

/* ---------- reveal au scroll + titres mot par mot (accueil) ---------- */
.js .rv{opacity:0;transform:translateY(28px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.8,.2,1)}
.js .rv.in{opacity:1;transform:none}
.anim-t .w{display:inline-block;opacity:0;transform:translateY(.5em);transition:opacity .6s,transform .6s cubic-bezier(.2,.8,.2,1)}
.anim-t.in .w{opacity:1;transform:none}

/* ---------- en-tête des pages internes : halo violet animé ---------- */
main.art,main.da-g{position:relative;isolation:isolate;overflow-x:clip}
main.art:before,main.da-g:before{content:"";position:absolute;z-index:-1;pointer-events:none;top:-140px;right:-12%;width:min(900px,95vw);height:620px;
 background:radial-gradient(closest-side,rgba(180,77,255,.30),rgba(154,47,230,.12) 55%,transparent 75%);filter:blur(10px);animation:daGlow 14s ease-in-out infinite}
main.art:after,main.da-g:after{content:"";position:absolute;z-index:-1;pointer-events:none;left:0;right:0;top:0;height:1px;
 background:linear-gradient(90deg,transparent,var(--v) 30%,#e0218a 50%,var(--v) 70%,transparent);background-size:200% 100%;animation:daShine 6s linear infinite;opacity:.8}

/* entrée en cascade du haut de page (pur CSS : pas de flash) */
.art .crumb{animation:daUp .7s var(--ease) both}
.art .tag{animation:daUp .7s .08s var(--ease) both}
.art h1{animation:daUp .8s .14s var(--ease) both}
.art h1:after{content:"";display:block;width:84px;height:5px;background:var(--v);margin-top:20px;transform-origin:0 50%;animation:daBar .9s .45s var(--ease) both;box-shadow:0 0 18px rgba(180,77,255,.55)}
.art .by{animation:daUp .7s .26s var(--ease) both}
.art .aff{animation:daUp .7s .34s var(--ease) both}
.art .ph.hero{animation:daUp .9s .4s var(--ease) both}
.art .crumb a{transition:color .2s}.art .crumb a:hover{color:var(--v)}
.art .crumb span{color:#fff}

/* ---------- prose ---------- */
.art .aff{border:1px solid var(--line);border-left:4px solid var(--v);background:#0d0716}
.prose a{text-decoration-color:var(--v);text-decoration-thickness:2px;transition:color .2s,text-decoration-color .2s}
.prose a:hover{color:var(--v)}
.prose h2{position:relative}
.prose h3{position:relative;padding-left:16px}
.prose h3:before{content:"";position:absolute;left:0;top:.12em;bottom:.12em;width:4px;background:var(--v)}
.prose li::marker{color:var(--v);font-weight:700}
.prose blockquote{border-left:4px solid var(--v);background:linear-gradient(90deg,var(--vd2),transparent 80%);padding:14px 18px}
.prose strong{color:#fff}
.tw{border:1px solid var(--line);transition:border-color .3s,box-shadow .3s}
.tw:hover{border-color:var(--vl);box-shadow:0 20px 60px -30px var(--v)}
.tw table{margin:0}
.prose tbody tr{transition:background .2s}
.prose tbody tr:hover td{background:#120a1d}
.ph img{transition:transform .8s var(--ease),border-color .3s,filter .4s}
.ph{overflow:hidden}
.ph:hover img{transform:scale(1.03);border-color:var(--v)}
.ph figcaption{position:relative}
.author{border-top:1px solid var(--vl)}
.author .k{color:var(--v)}

/* ---------- listes d'articles = cartes ---------- */
.cat{color:var(--v);display:flex;gap:12px;align-items:center}
.cat:after{content:"";flex:1;height:1px;background:linear-gradient(90deg,var(--vl),transparent)}
.alist li{position:relative;transition:background .25s}
.alist a{position:relative;padding:18px 44px 18px 16px;transition:transform .35s var(--sp),background .25s,box-shadow .25s}
.alist a:before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--v);transform:scaleY(0);transform-origin:50% 100%;transition:transform .3s var(--ease)}
.alist a:after{content:"→";position:absolute;right:16px;top:50%;transform:translate(-6px,-50%);opacity:0;font:700 22px "Oswald",sans-serif;color:var(--v);transition:transform .3s var(--ease),opacity .3s}
.alist a:hover{background:linear-gradient(120deg,var(--vd),var(--vd2));box-shadow:0 14px 40px -18px rgba(180,77,255,.55);transform:translateX(4px)}
.alist a:hover:before{transform:scaleY(1)}
.alist a:hover:after{opacity:1;transform:translate(0,-50%)}
.alist a:hover h3{text-decoration:none;color:#fff}
.alist h3{transition:color .2s}

/* ---------- blocs WOD : niveaux + encart ---------- */
.lv>div{position:relative;transition:transform .35s var(--sp),box-shadow .3s,background .3s;border-top:4px solid #d9a8ff}
.lv>div:nth-child(2){border-top-color:#b44dff}
.lv>div.x,.lv>div:nth-child(3){border-top-color:#e0218a}
.lv>div:hover{transform:translateY(-6px);box-shadow:0 14px 40px rgba(180,77,255,.45);z-index:2;background:linear-gradient(150deg,#1a0b2e,#0b0712)}
.lv>div.x:hover{background:#fff;box-shadow:0 14px 40px rgba(224,33,138,.45)}
.lv .sub{color:var(--v)}.lv>div.x .sub{color:#9a2fe6}
.box{position:relative;border-color:color-mix(in srgb,var(--v) 55%,#2a2a2a);box-shadow:0 20px 60px -30px var(--v);overflow:hidden}
.box:before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(120% 80% at 50% 0,var(--v),transparent 60%);opacity:.14}
.box>*{position:relative}
.soon{background:var(--v);color:#fff;animation:daPulse 2.4s ease-in-out infinite}
.inv .soon,.inv-box .soon{background:#000;color:#fff}

/* ---------- blocs « accueil » réutilisés dans les pages fixes ---------- */
.inv-box{position:relative;box-shadow:10px 10px 0 var(--v)}
.list li{transition:background .25s,padding .25s}
.list li:hover{background:linear-gradient(90deg,var(--vd2),transparent);padding-left:12px;padding-right:12px}
.inv-box .list li:hover,.inv .list li:hover{background:linear-gradient(90deg,#f1e6ff,transparent)}
.ev{transition:background .25s}
.inv-box .ev:hover{background:linear-gradient(90deg,#f4ecff,transparent)}
.ev .go{border-color:var(--v);transition:background .2s,color .2s,transform .2s}
.ev .go:hover{background:var(--v);color:#fff;border-color:var(--v);transform:translateY(-2px)}
.cal-h{border-bottom-color:var(--v)}
.cover{box-shadow:16px 16px 0 var(--v);transition:transform .4s var(--sp)}
.cover:hover{transform:translate(-4px,-4px) rotate(-1deg)}
.chips span{border-color:var(--vl);transition:border-color .2s,background .2s}
.chips span:hover{border-color:var(--v);background:var(--vd2)}
.more{justify-content:center}

/* ---------- 404 (ancien footer) ---------- */
footer:not(.xf) a{transition:color .2s}footer:not(.xf) a:hover{color:var(--v)}

/* ---------- impression : on coupe tout ---------- */
@media print{
 .da-prog,main.art:before,main.art:after,main.da-g:before,main.da-g:after{display:none!important}
 .js .rv,.anim-t .w,.art *{opacity:1!important;transform:none!important;animation:none!important;transition:none!important}
}
@media(max-width:720px){main.art:before,main.da-g:before{height:420px;top:-100px}.prose hr.sep,.art hr.sep{margin:40px auto}}
