/* raid/siege.css — « Le Siège » : la page du raid en mode bras de fer.
 *
 * Portage de la maquette validée admin/_dev_raid_design/finale.html (15/10/2026).
 * Tout est scopé sous `html.siege` (classe posée par js/raid-siege.js quand le
 * boss actif est en mode 'brasdefer') : le raid classique n'est pas touché.
 *
 * ⚠️ Garde-fous thèmes : six thèmes de css/themes.css imposent
 * `body.theme-X * { color:#000 !important }`. Ici le fond est TOUJOURS sombre,
 * donc chaque couleur de texte est en !important et la règle générale
 * `html.siege body .sg *{color:inherit!important}` (spécificité 0,2,2) passe
 * devant la leur (0,2,1). Même chose pour .fv-header.
 * ⚠️ color-mix() (Safari ≥ 16.2) : chaque déclaration qui l'utilise est
 * précédée d'un repli simple, ignoré par les navigateurs qui le comprennent.
 * Fichier GÉNÉRÉ depuis un gabarit (préfixe html.siege .sg) : on peut le
 * retoucher directement.
 */

/* ── Polices hébergées (OFL, voir raid/fonts/OFL-*.txt) ───────────────── */
@font-face{font-family:"Cinzel";font-style:normal;font-weight:700;font-display:swap;
  src:url(/raid/fonts/cinzel-700-latin.woff2) format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Inter";font-style:normal;font-weight:400 800;font-display:swap;
  src:url(/raid/fonts/inter-var-latin.woff2) format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

/* ── Jetons ───────────────────────────────────────────────────────────── */
html.siege,html.siege-attente{
  --nuit:#10111F; --nuit-p:#0A0B15; --acier:#262B3C; --acier-c:#363D54;
  --or:#D9AD63; --or-c:#F3D79A; --or-f:#8A6424;
  --lum:#59BFFF; --lum-c:#A9DEFF; --lum-f:#1D5C93;
  --omb:#EA6659; --omb-c:#FFB0A6; --omb-f:#8E2C24;
  --ivoire:#F2E6C9; --doux:#BDB6CB; --pale:#9A94AB;
  --titre:"Cinzel",Georgia,"Times New Roman",serif;
  --texte:"Inter","Nunito Sans",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --moi:var(--lum); --moi-c:var(--lum-c); --moi-f:var(--lum-f); --moi-f2:#123a5e;
  --grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .05 0'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E");
}
html.siege[data-sg-camp="omb"]{--moi:var(--omb); --moi-c:var(--omb-c); --moi-f:var(--omb-f); --moi-f2:#521a15}

/* ── L'ancienne page s'efface (mode bras de fer seulement) ────────────── */
html.siege body,html.siege-attente body{background:var(--nuit-p)!important;overflow-x:hidden}
html.siege body::before,html.siege body::after,
html.siege-attente body::before,html.siege-attente body::after{display:none!important}
html.siege .raid-main,html.siege #raidJaugeSection,html.siege #raid-buffs-bar,html.siege #raidTutorial,
html.siege #fv-camp-fond,html.siege footer.seo-about,html.siege #raidPlayerInfo,
html.siege-attente .raid-main,html.siege-attente #raidJaugeSection,html.siege-attente #raid-buffs-bar,
html.siege-attente #raidTutorial,html.siege-attente footer.seo-about{display:none!important}
.sg[hidden],html.siege .sg [hidden]{display:none!important}

/* ── Garde-fous thèmes ────────────────────────────────────────────────── */
html.siege body .sg,html.siege body .sg-calques{color:var(--ivoire)!important;font-family:var(--texte);font-size:16px;line-height:1.35;-webkit-text-size-adjust:100%}
html.siege body .sg *{color:inherit!important;text-shadow:none}
html.siege body .sg *,html.siege body .sg *::before,html.siege body .sg *::after{box-sizing:border-box}
html.siege body[class*="theme-"] .fv-header,html.siege body[class*="theme-"] .fv-header *{color:var(--ivoire)!important;-webkit-text-fill-color:currentColor!important}

/* ── Bandeau du site, habillé « Siège » ───────────────────────────────── */
html.siege .fv-header{position:sticky;top:0;z-index:40;min-height:56px;height:auto;display:flex;align-items:center;gap:10px;padding:6px 16px;margin:0;
  background:#0B0C17!important;color:var(--ivoire)!important;border:0;border-bottom:1px solid rgba(217,173,99,.28);box-shadow:0 6px 20px rgba(0,0,0,.45);
  font-family:var(--texte);-webkit-backdrop-filter:none;backdrop-filter:none}
html.siege .fv-header .fv-header-left{gap:8px;flex:none}
html.siege .fv-header .fv-btn-home-glass{margin:0;text-decoration:none;font-weight:600;font-size:15px;line-height:1.2;padding:8px 12px;border-radius:10px;
  border:1px solid rgba(217,173,99,.35);background:rgba(255,255,255,.04);box-shadow:none;color:var(--ivoire)!important;transform:none}
html.siege .fv-header .fv-btn-home-glass:hover{background:rgba(217,173,99,.12);box-shadow:none}
html.siege .fv-header .fv-header-center{flex:1;min-width:0;justify-content:center}
html.siege .fv-header h1{margin:0;font-family:var(--titre);font-weight:700;font-size:19px;letter-spacing:.06em;color:var(--or-c)!important;-webkit-text-fill-color:var(--or-c)!important;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;background:none;text-shadow:none!important}
html.siege .fv-header .fv-header-right{flex:none}
html.siege .fv-header .player-points{margin:0;font-weight:800;font-size:15px;padding:7px 12px;border-radius:999px;border:1px solid rgba(217,173,99,.35);
  background:rgba(255,255,255,.04);white-space:nowrap;color:var(--ivoire)!important;font-variant-numeric:tabular-nums}
@media (max-width:600px){html.siege .fv-header .fv-btn-home-glass.deux{display:none}}

/* ── Conteneur ────────────────────────────────────────────────────────── */
html.siege .sg{position:relative}
html.siege .sg.wrap{background:var(--nuit-p)!important;max-width:1180px;margin:0 auto;padding:0}
html.siege .sg button{font:inherit}
html.siege .sg .num{font-variant-numeric:tabular-nums}
html.siege .sg a{text-decoration:none}

/* ======================= PREMIER ÉCRAN ======================= */
html.siege .sg .premier{position:relative;isolation:isolate;overflow:hidden;display:flex;flex-direction:column;
  background:
    radial-gradient(55% 45% at 50% 44%, rgba(217,173,99,.20), transparent 70%),
    radial-gradient(60% 55% at -8% 62%, rgba(234,102,89,.34), transparent 72%),
    radial-gradient(60% 55% at 108% 62%, rgba(89,191,255,.30), transparent 72%),
    linear-gradient(180deg,#0B0C18 0%,#151329 46%,#0C0D19 72%,var(--nuit-p) 100%)}

html.siege .sg .tete{position:relative;z-index:6;text-align:center;padding:14px 16px 4px}
html.siege .sg .tete .sur{font-size:13px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--or)!important}
html.siege .sg .tete h1{margin:2px 0 0;font-family:var(--titre);font-weight:700;font-size:clamp(28px,5.4vw,48px);line-height:1.08;letter-spacing:.02em;text-wrap:balance;
  color:var(--or-c)!important;
  background:linear-gradient(180deg,#FFF6DD 0%,#F3D79A 40%,#D9AD63 62%,#9A6E2A 100%);-webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent!important;filter:drop-shadow(0 2px 0 rgba(0,0,0,.7))}
html.siege .sg .etat{display:inline-flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:center;margin-top:8px;font-size:15px}
html.siege .sg .etat .mene{font-weight:800;color:var(--lum-c)!important}
html.siege .sg .etat .mene.omb{color:var(--omb-c)!important}
html.siege .sg .etat .chrono{display:inline-flex;align-items:center;gap:6px;padding:5px 12px;border-radius:999px;background:rgba(0,0,0,.42);border:1px solid rgba(217,173,99,.32);color:var(--doux)!important;font-size:14px}
html.siege .sg .etat .chrono b{color:var(--ivoire)!important;font-weight:800}
html.siege .sg .etat .sep{width:4px;height:4px;border-radius:50%;background:var(--or)}

/* ---- scène ---- */
html.siege .sg .scene{position:relative;z-index:3;height:clamp(240px,26svh,330px);margin-top:-4px}
html.siege .sg .brume{position:absolute;left:-25%;right:-25%;top:12%;height:70%;z-index:0;pointer-events:none;
  background:radial-gradient(34% 46% at 30% 55%,rgba(8,8,18,.75),transparent 70%),radial-gradient(34% 46% at 70% 50%,rgba(8,8,18,.7),transparent 70%),
             radial-gradient(40% 30% at 50% 78%,rgba(170,160,205,.10),transparent 70%);
  animation:sg-derive 26s ease-in-out infinite alternate}
@keyframes sg-derive{from{transform:translateX(-4%)}to{transform:translateX(4%)}}
html.siege .sg .faisceau{position:absolute;top:-30%;width:34%;height:150%;z-index:0;pointer-events:none;opacity:.8;animation:sg-souffle 7s ease-in-out infinite}
html.siege .sg .faisceau.g{left:-6%;transform:rotate(-24deg);transform-origin:top left;
  background:linear-gradient(90deg,transparent 0%,rgba(234,102,89,.20) 38%,rgba(255,140,110,.30) 50%,rgba(234,102,89,.16) 62%,transparent 100%)}
html.siege .sg .faisceau.d{right:-6%;transform:rotate(24deg);transform-origin:top right;animation-delay:-3.5s;
  background:linear-gradient(90deg,transparent 0%,rgba(89,191,255,.15) 38%,rgba(169,222,255,.28) 50%,rgba(89,191,255,.14) 62%,transparent 100%)}
@keyframes sg-souffle{0%,100%{opacity:.55}50%{opacity:.95}}

html.siege .sg .boss{position:absolute;left:50%;bottom:3%;z-index:2;width:min(56vw,29svh,390px);aspect-ratio:1;transform:translateX(-50%)}
html.siege .sg .boss .corps{position:absolute;inset:0;animation:sg-respire 5s ease-in-out infinite}
html.siege .sg .boss .corps img{width:100%;height:100%;display:block;object-fit:contain}
html.siege .sg .boss .halo{position:absolute;inset:-6%;border-radius:50%;z-index:-1;
  background:radial-gradient(circle at 50% 46%,rgba(255,226,160,.55),rgba(217,173,99,.18) 32%,transparent 62%);animation:sg-halo 5s ease-in-out infinite}
html.siege .sg .boss .coeur{position:absolute;left:50%;top:40%;width:34%;height:34%;margin:-17% 0 0 -17%;border-radius:50%;pointer-events:none;mix-blend-mode:screen;
  background:radial-gradient(circle,rgba(255,244,205,.95),rgba(255,206,120,.45) 30%,transparent 68%);animation:sg-coeur 2.6s ease-in-out infinite}
html.siege .sg .boss .rim{position:absolute;inset:0;pointer-events:none;
  -webkit-mask:var(--boss-img) center/contain no-repeat;mask:var(--boss-img) center/contain no-repeat;
  background:linear-gradient(90deg,rgba(234,102,89,.42) 0%,rgba(234,102,89,0) 34%,rgba(89,191,255,0) 66%,rgba(89,191,255,.40) 100%)}
html.siege .sg .boss .sol{position:absolute;left:14%;right:14%;bottom:-3%;height:10%;border-radius:50%;z-index:-1;background:radial-gradient(closest-side,rgba(0,0,0,.85),transparent)}
@keyframes sg-respire{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
@keyframes sg-halo{0%,100%{opacity:.7;transform:scale(.96)}50%{opacity:1;transform:scale(1.04)}}
@keyframes sg-coeur{0%,100%{opacity:.65;transform:scale(.88)}50%{opacity:1;transform:scale(1.1)}}

/* 3 états du boss, dérivés de la jauge (≥ 55 % assiégeants → fissures ; ≤ 45 % → bouclier) */
html.siege .sg .boss .fissures,html.siege .sg .boss .bouclier{position:absolute;inset:0;pointer-events:none;opacity:0;transition:opacity .6s}
html.siege .sg .boss .fissures{-webkit-mask:var(--boss-img) center/contain no-repeat;mask:var(--boss-img) center/contain no-repeat}
html.siege .sg .boss .fissures svg{width:100%;height:100%;display:block;animation:sg-crepite 2.8s ease-in-out infinite}
@keyframes sg-crepite{0%,100%{opacity:.75}40%{opacity:1}55%{opacity:.6}70%{opacity:1}}
html.siege .sg .boss .bouclier svg{position:absolute;inset:-7%;width:114%;height:114%}
html.siege .sg .boss .bouclier .anneau{transform-origin:50% 50%;animation:sg-tourne 60s linear infinite}
html.siege .sg .boss .bouclier .dome{animation:sg-dome 3.6s ease-in-out infinite}
@keyframes sg-tourne{to{transform:rotate(360deg)}}
@keyframes sg-dome{0%,100%{opacity:.75}50%{opacity:1}}
html.siege[data-sg-boss="fissure"] .sg .boss .fissures{opacity:1}
html.siege[data-sg-boss="bouclier"] .sg .boss .bouclier{opacity:1}
html.siege .sg .etiquette-boss{font-size:14px;font-weight:600;padding:4px 10px;border-radius:999px;white-space:nowrap;display:none;
  background:rgba(8,9,18,.78);border:1px solid rgba(255,255,255,.14)}
html.siege[data-sg-boss="fissure"] .sg .etiquette-boss.f,html.siege[data-sg-boss="bouclier"] .sg .etiquette-boss.b{display:inline-block}
html.siege .sg .etiquette-boss.lum{color:var(--lum-c)!important;border-color:rgba(89,191,255,.45)}
html.siege .sg .etiquette-boss.omb{color:var(--omb-c)!important;border-color:rgba(234,102,89,.45)}

/* armées */
html.siege .sg .armee{position:absolute;bottom:-8%;z-index:3;width:min(40vw,340px);pointer-events:none}
html.siege .sg .armee.lum{width:min(46vw,392px);bottom:-6%}
html.siege .sg .armee img{width:100%;height:auto;display:block;
  -webkit-mask:linear-gradient(180deg,#000 55%,rgba(0,0,0,.55) 75%,transparent 96%);mask:linear-gradient(180deg,#000 55%,rgba(0,0,0,.55) 75%,transparent 96%)}
html.siege .sg .armee::after{content:"";position:absolute;left:8%;right:8%;bottom:6%;height:22%;border-radius:50%;z-index:-1;background:radial-gradient(closest-side,rgba(0,0,0,.8),transparent)}
html.siege .sg .armee.omb{left:-3%;animation:sg-pas-g 8s ease-in-out infinite}
html.siege .sg .armee.lum{right:-3%;animation:sg-pas-d 8s ease-in-out infinite}
html.siege .sg .armee.lum img{transform:scaleX(-1)}
html.siege .sg .armee .voile{position:absolute;inset:0;pointer-events:none}
html.siege .sg .armee.omb .voile{-webkit-mask:var(--armee-omb) center/100% 100% no-repeat;mask:var(--armee-omb) center/100% 100% no-repeat;
  background:linear-gradient(90deg,rgba(10,6,14,.45),transparent 45%,rgba(255,214,150,.22) 100%),linear-gradient(180deg,transparent 45%,rgba(10,8,20,.55))}
html.siege .sg .armee.lum .voile{-webkit-mask:var(--armee-lum) center/100% 100% no-repeat;mask:var(--armee-lum) center/100% 100% no-repeat;transform:scaleX(-1);
  background:linear-gradient(90deg,rgba(10,10,24,.55),rgba(20,40,80,.25) 45%,rgba(255,214,150,.18) 100%),linear-gradient(180deg,rgba(40,90,160,.18) 0%,transparent 40%,rgba(10,8,20,.65))}
@keyframes sg-pas-g{0%,100%{transform:translateX(0)}50%{transform:translateX(8px)}}
@keyframes sg-pas-d{0%,100%{transform:translateX(0)}50%{transform:translateX(-8px)}}

/* particules */
html.siege .sg .particules{position:absolute;inset:0;z-index:4;pointer-events:none;overflow:hidden}
html.siege .sg .particules i{position:absolute;bottom:-6px;width:var(--t,4px);height:var(--t,4px);border-radius:50%;opacity:0;
  animation:sg-monte var(--d,9s) linear infinite;animation-delay:var(--r,0s);will-change:transform,opacity}
html.siege .sg .particules i.br{background:radial-gradient(circle,#FFE0B0 0 30%,#FF7A45 55%,transparent 72%)}
html.siege .sg .particules i.po{background:radial-gradient(circle,#FFFFFF 0 25%,#BFE6FF 50%,transparent 72%)}
@keyframes sg-monte{0%{transform:translate3d(0,0,0);opacity:0}12%{opacity:var(--o,.9)}80%{opacity:calc(var(--o,.9) * .5)}100%{transform:translate3d(var(--x,10px),calc(-1 * var(--h,260px)),0);opacity:0}}

/* ---- le duel ---- */
html.siege .sg .duel{position:relative;z-index:6;padding:0 14px 6px}
html.siege .sg .front{position:relative;height:70px}
html.siege .sg .front svg.energie{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
html.siege .sg .front .flux{animation:sg-flux 1.1s linear infinite}
@keyframes sg-flux{to{stroke-dashoffset:-30}}
html.siege .sg .front .blason{position:absolute;top:50%;width:70px;height:70px;margin-top:-35px;z-index:3}
html.siege .sg .front .blason img{width:100%;height:100%;display:block}
html.siege .sg .front .blason::before{content:"";position:absolute;inset:-14px;border-radius:50%;z-index:-1}
html.siege .sg .front .blason.omb{left:0}
html.siege .sg .front .blason.omb::before{background:radial-gradient(circle,rgba(234,102,89,.55),transparent 66%)}
html.siege .sg .front .blason.lum{right:0}
html.siege .sg .front .blason.lum::before{background:radial-gradient(circle,rgba(89,191,255,.55),transparent 66%)}
html.siege .sg .front.tendu svg.energie{animation:sg-tension .55s ease-out}
@keyframes sg-tension{0%{transform:scaleY(1)}30%{transform:scaleY(.7)}60%{transform:scaleY(1.12)}100%{transform:scaleY(1)}}

html.siege .sg .cristal{position:absolute;left:0;top:50%;width:58px;height:87px;margin:-44px 0 0 -29px;z-index:4;will-change:transform}
html.siege .sg .cristal .aura{position:absolute;left:50%;top:50%;width:150px;height:150px;margin:-75px 0 0 -75px;border-radius:50%;
  background:radial-gradient(circle,var(--aura,rgba(89,191,255,.75)) 0%,rgba(255,226,160,.25) 32%,transparent 64%);animation:sg-aura 2.2s ease-in-out infinite}
@keyframes sg-aura{0%,100%{transform:scale(.82);opacity:.75}50%{transform:scale(1.08);opacity:1}}
html.siege .sg .cristal svg{position:relative;width:100%;height:100%;display:block;animation:sg-pulse-c 2.2s ease-in-out infinite}
@keyframes sg-pulse-c{0%,100%{transform:scale(1)}50%{transform:scale(1.06)}}
html.siege .sg .cristal .eclats i{position:absolute;left:50%;top:50%;width:4px;height:4px;border-radius:50%;background:#FFF2CC;opacity:0;animation:sg-eclat 1.8s ease-out infinite}
@keyframes sg-eclat{0%{transform:translate(0,0) scale(1);opacity:1}100%{transform:translate(var(--ex),var(--ey)) scale(.3);opacity:0}}
html.siege .sg .gain{position:absolute;top:-34px;left:50%;z-index:6;white-space:nowrap;font-weight:800;font-size:15px;padding:4px 10px;border-radius:999px;pointer-events:none;
  background:rgba(8,9,18,.85);border:1px solid var(--moi);color:var(--moi-c)!important;opacity:0;transform:translate(-50%,6px)}
html.siege .sg .gain.vu{animation:sg-gain 1.9s ease-out forwards}
@keyframes sg-gain{0%{opacity:0;transform:translate(-50%,8px)}15%,70%{opacity:1;transform:translate(-50%,-6px)}100%{opacity:0;transform:translate(-50%,-16px)}}

html.siege .sg .scores{display:grid;grid-template-columns:1fr auto 1fr;align-items:end;gap:8px;margin-top:2px}
html.siege .sg .score .pct{display:block;white-space:nowrap;font-weight:800;font-size:clamp(40px,6.6vw,58px);line-height:.95;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
html.siege .sg .score .pct small{font-size:.55em;font-weight:800;margin-left:2px}
html.siege .sg .score .qui{display:block;margin-top:2px;font-size:14px;font-weight:600;color:var(--doux)!important}
html.siege .sg .score .qui b{display:block;font-family:var(--titre);font-weight:700;font-size:18px;letter-spacing:.03em;line-height:1.2}
html.siege .sg .score.omb{text-align:left}
html.siege .sg .score.omb .pct,html.siege .sg .score.omb .qui b{color:var(--omb)!important}
html.siege .sg .score.lum{text-align:right}
html.siege .sg .score.lum .pct,html.siege .sg .score.lum .qui b{color:var(--lum)!important}
html.siege .sg .score.devant .pct{text-shadow:0 0 22px currentColor!important}
html.siege .sg .ecart{align-self:center;text-align:center;font-size:14px;color:var(--doux)!important;line-height:1.3;padding-bottom:6px;max-width:190px}
html.siege .sg .ecart b{display:block;font-size:16px;color:var(--ivoire)!important}

/* ---- bannière de faction ---- */
html.siege .sg .moi{position:relative;z-index:6;margin:12px 16px 0;display:flex;align-items:stretch;border-radius:16px;overflow:hidden;
  background:var(--grain),linear-gradient(180deg,#1A1D2C,#11131F);
  box-shadow:0 14px 34px rgba(0,0,0,.55),inset 0 1px 0 rgba(242,230,201,.10),inset 0 0 0 1px rgba(217,173,99,.30)}
html.siege .sg .moi .etendard{position:relative;flex:none;width:128px;display:grid;place-items:center;padding:10px 0 18px;
  background:linear-gradient(180deg,var(--moi-f),var(--moi-f2));
  background:linear-gradient(180deg,var(--moi-f),color-mix(in srgb,var(--moi-f) 55%,#08080f));
  clip-path:polygon(0 0,100% 0,100% 100%,50% 88%,0 100%)}
html.siege .sg .moi .etendard::before{content:"";position:absolute;inset:0 0 0 auto;width:2px;background:linear-gradient(180deg,var(--or),transparent)}
html.siege .sg .moi .etendard .ailes{position:absolute;left:50%;top:42%;width:128px;height:64px;margin:-32px 0 0 -64px;object-fit:contain;opacity:.95}
html.siege .sg .moi .etendard .bl{position:relative;top:-6px;width:50px;height:50px;filter:drop-shadow(0 3px 6px rgba(0,0,0,.7))}
html.siege .sg .moi .etendard .rg{position:absolute;bottom:22px;left:0;right:0;text-align:center;font-size:13px;font-weight:800}
html.siege .sg .moi .infos{flex:1;min-width:0;padding:14px 14px 14px 16px;display:flex;flex-direction:column;justify-content:center;gap:4px}
html.siege .sg .moi .l1{font-size:14px;font-weight:600;color:var(--moi-c)!important}
html.siege .sg .moi .l2{font-size:20px;font-weight:800;line-height:1.2}
html.siege .sg .moi .l2 em{font-style:normal;color:var(--moi)!important}
html.siege .sg .moi .l3{display:flex;flex-wrap:wrap;gap:6px;margin-top:4px}
html.siege .sg .puce{display:inline-flex;align-items:center;gap:5px;font-size:14px;font-weight:600;padding:3px 10px;border-radius:999px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);white-space:nowrap}
html.siege .sg .puce.orp{background:linear-gradient(180deg,#F3D79A,#C9963F);color:#2A1A04!important;border-color:#FFE7B0;font-weight:800}
html.siege .sg .moi .action{flex:none;display:flex;align-items:center;padding:14px 16px 14px 4px}

/* bouton Combattre : métal biseauté couleur du camp */
html.siege .sg .combattre{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:66px;padding:0 26px;border-radius:14px;cursor:pointer;border:0;
  font-family:var(--titre);font-weight:700;font-size:23px;letter-spacing:.06em;color:#FFF6E6!important;text-shadow:0 -1px 0 rgba(0,0,0,.55),0 1px 0 rgba(255,255,255,.12)!important;
  background:linear-gradient(180deg,rgba(255,255,255,.34) 0%,rgba(255,255,255,.06) 46%,rgba(0,0,0,0) 50%,rgba(0,0,0,.22) 100%),linear-gradient(180deg,var(--moi-c) 0%,var(--moi) 30%,var(--moi-f) 100%);
  background:
    linear-gradient(180deg,rgba(255,255,255,.34) 0%,rgba(255,255,255,.06) 46%,rgba(0,0,0,0) 50%,rgba(0,0,0,.22) 100%),
    linear-gradient(180deg,color-mix(in srgb,var(--moi) 85%,#fff) 0%,var(--moi) 30%,var(--moi-f) 100%);
  box-shadow:inset 0 0 0 1px rgba(255,236,200,.55),inset 0 2px 0 rgba(255,255,255,.45),inset 0 -3px 0 rgba(0,0,0,.35),
    0 0 0 2px #2B2418,0 0 0 3px rgba(217,173,99,.75),0 5px 0 #14100A,0 12px 26px rgba(0,0,0,.6);
  transition:transform .09s ease-out,box-shadow .09s ease-out;-webkit-tap-highlight-color:transparent;touch-action:manipulation}
html.siege .sg .combattre .runes{display:inline-flex;gap:3px}
html.siege .sg .combattre .runes svg{width:14px;height:18px;display:block;stroke:rgba(30,10,5,.55);fill:none;stroke-width:1.6;transition:stroke .15s,filter .15s}
html.siege[data-sg-camp="lum"] .sg .combattre .runes svg{stroke:rgba(5,20,40,.55)}
html.siege .sg .combattre:active,html.siege .sg .combattre.appui{transform:translateY(3px);
  box-shadow:inset 0 0 0 1px rgba(255,236,200,.55),inset 0 2px 0 rgba(255,255,255,.3),inset 0 -1px 0 rgba(0,0,0,.35),
    0 0 0 2px #2B2418,0 0 0 3px rgba(217,173,99,.9),0 2px 0 #14100A,0 5px 12px rgba(0,0,0,.6)}
html.siege .sg .combattre:active .runes svg,html.siege .sg .combattre.appui .runes svg{stroke:#FFF4CF;filter:drop-shadow(0 0 4px #FFD98A)}
html.siege .sg .combattre:focus-visible{outline:3px solid var(--or-c);outline-offset:4px}
html.siege .sg .combattre[disabled]{filter:grayscale(.8) brightness(.6);cursor:default}

/* ---- paliers : médaillons ---- */
html.siege .sg .semaine{position:relative;z-index:6;margin:12px 16px 0;display:flex;align-items:center;gap:16px;padding:10px 16px;border-radius:16px;
  background:rgba(10,11,21,.6);border:1px solid rgba(255,255,255,.07)}
html.siege .sg .semaine .lbl{flex:none;font-size:14px;line-height:1.35;color:var(--doux)!important;max-width:150px}
html.siege .sg .semaine .lbl b{display:block;font-size:16px;color:var(--ivoire)!important}
html.siege .sg .reliques{flex:1;display:flex;justify-content:space-around;align-items:flex-start;position:relative;min-width:0}
html.siege .sg .reliques::before{content:"";position:absolute;left:12%;right:12%;top:25px;height:3px;border-radius:2px;background:linear-gradient(90deg,var(--or) 0 var(--fait,0%),#2E3246 var(--fait,0%))}
html.siege .sg .relique{position:relative;display:flex;flex-direction:column;align-items:center;gap:4px;min-width:84px}
html.siege .sg .relique .med{position:relative;width:52px;height:52px;border-radius:50%;display:grid;place-items:center;font-family:var(--titre);font-weight:700;font-size:18px;
  color:#8C90A3!important;background:radial-gradient(circle at 35% 30%,#5B6072,#2E3242 60%,#1C1F2B);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.25),inset 0 -2px 3px rgba(0,0,0,.6),0 0 0 2px #3E4356,0 0 0 4px #171A25,0 4px 10px rgba(0,0,0,.6)}
html.siege .sg .relique .med::after{content:"";position:absolute;inset:-10px;border-radius:50%;background:radial-gradient(circle,rgba(255,215,140,.75),transparent 66%);opacity:0;z-index:-1}
html.siege .sg .relique .t{font-size:14px;font-weight:600;color:var(--pale)!important;white-space:nowrap}
html.siege .sg .relique .t b{color:var(--doux)!important}
html.siege .sg .relique.ok .med{color:#3A2606!important;background:radial-gradient(circle at 35% 28%,#FFF2C8,#E9C27A 35%,#B98636 70%,#7A5418);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.7),inset 0 -2px 3px rgba(80,45,0,.6),0 0 0 2px #F3D79A,0 0 0 4px #4A3510,0 0 16px rgba(217,173,99,.55)}
html.siege .sg .relique.ok .med::after{opacity:.55}
html.siege .sg .relique.ok .t,html.siege .sg .relique.ok .t b{color:var(--or-c)!important}
html.siege .sg .relique.eveil .med{animation:sg-eveil .6s ease-out}
html.siege .sg .relique.eveil .med::after{animation:sg-eveil-h .9s ease-out}
@keyframes sg-eveil{0%{transform:scale(.85)}55%{transform:scale(1.18)}100%{transform:scale(1)}}
@keyframes sg-eveil-h{0%{opacity:0;transform:scale(.6)}40%{opacity:1;transform:scale(1.5)}100%{opacity:.55;transform:scale(1)}}
html.siege .sg .sg-toast{position:fixed;left:50%;top:74px;z-index:60;transform:translate(-50%,-20px);opacity:0;pointer-events:none;max-width:calc(100% - 32px);text-align:center;
  padding:10px 18px;border-radius:12px;font-weight:800;font-size:16px;color:#2A1A04!important;background:linear-gradient(180deg,#FFF0C4,#D9AD63);box-shadow:0 10px 30px rgba(0,0,0,.6),0 0 0 1px #FFE7B0;
  transition:opacity .3s,transform .3s}
html.siege .sg .sg-toast.vu{opacity:1;transform:translate(-50%,0)}

html.siege .sg .descendre{position:relative;z-index:6;text-align:center;font-size:14px;color:var(--pale)!important;padding:10px 0 6px}

/* ---- état « camp non choisi » ---- */
html.siege .sg .rallier{display:none;position:relative;z-index:6;margin:12px 16px 0;padding:16px;border-radius:16px;text-align:center;
  background:var(--grain),linear-gradient(180deg,#1A1D2C,#11131F);box-shadow:0 14px 34px rgba(0,0,0,.55),inset 0 0 0 1px rgba(217,173,99,.35)}
html.siege .sg .rallier .q{font-size:17px;font-weight:600;color:var(--doux)!important;margin:0 0 10px}
html.siege .sg .rallier .q .lum{color:var(--lum)!important}
html.siege .sg .rallier .q .omb{color:var(--omb)!important}
html.siege .sg .rallier .duo{display:flex;align-items:center;justify-content:center;gap:18px}
html.siege .sg .rallier .bla{display:flex;flex-direction:column;align-items:center;gap:4px;width:130px}
html.siege .sg .rallier .bla img{width:76px;height:76px}
html.siege .sg .rallier .bla b{font-family:var(--titre);font-size:17px}
html.siege .sg .rallier .bla span{font-size:14px;color:var(--doux)!important}
html.siege .sg .rallier .bla.omb b{color:var(--omb)!important}
html.siege .sg .rallier .bla.lum b{color:var(--lum)!important}
html.siege .sg .rallier .note{margin:10px 0 0;font-size:14px;color:var(--pale)!important}
html.siege .sg .btn-or{display:inline-flex;align-items:center;justify-content:center;min-height:62px;padding:0 26px;border:0;border-radius:14px;cursor:pointer;text-align:center;
  font-family:var(--titre);font-weight:700;font-size:21px;letter-spacing:.05em;color:#2A1A04!important;white-space:nowrap;
  background:linear-gradient(180deg,rgba(255,255,255,.45),rgba(255,255,255,0) 48%,rgba(0,0,0,.14)),linear-gradient(180deg,#FFF0C4,#E2B868 35%,#A87A30);
  box-shadow:inset 0 0 0 1px #FFF0C8,inset 0 -3px 0 rgba(90,55,10,.5),0 0 0 2px #2B2418,0 5px 0 #14100A,0 12px 26px rgba(0,0,0,.6),0 0 30px rgba(217,173,99,.35);
  transition:transform .09s,box-shadow .09s;touch-action:manipulation}
html.siege .sg .btn-or:active{transform:translateY(3px);box-shadow:inset 0 0 0 1px #FFF0C8,inset 0 -1px 0 rgba(90,55,10,.5),0 0 0 2px #2B2418,0 2px 0 #14100A,0 5px 12px rgba(0,0,0,.6)}
html.siege.sg-sans-camp .sg .moi,html.siege.sg-sans-camp .sg .duel{display:none}
html.siege.sg-sans-camp .sg .etat .mene,html.siege.sg-sans-camp .sg .etat .sep,html.siege.sg-sans-camp .sg .etiquette-boss{display:none!important}
html.siege.sg-sans-camp .sg .rallier{display:block}

/* feuille de choix (2 grandes cartes) */
html.siege .sg .voile-plein{position:fixed;inset:0;z-index:70;background:rgba(5,6,12,.92);display:none;align-items:center;justify-content:center;padding:16px;overflow:auto}
html.siege .sg .voile-plein.ouvert{display:flex}
html.siege .sg .feuille{width:min(880px,100%);text-align:center;margin:auto}
html.siege .sg .feuille h2{font-family:var(--titre);font-weight:700;font-size:28px;margin:0;color:var(--or-c)!important}
html.siege .sg .feuille .sous{font-size:16px;color:var(--doux)!important;margin:6px 0 16px}
html.siege .sg .cartes{display:grid;grid-template-columns:1fr 1fr;gap:16px}
html.siege .sg .carte-camp{position:relative;display:flex;flex-direction:column;border-radius:18px;overflow:hidden;cursor:pointer;text-align:left;border:0;padding:0;
  background:var(--grain),linear-gradient(180deg,#1A1D2C,#0F111C);box-shadow:0 16px 36px rgba(0,0,0,.6),inset 0 0 0 1px rgba(255,255,255,.12);transition:transform .2s,box-shadow .2s}
html.siege .sg .carte-camp.omb{order:-1}
html.siege .sg .carte-camp .illu{position:relative;height:200px;overflow:hidden}
html.siege .sg .carte-camp .illu img.ar{position:absolute;left:50%;bottom:-18%;width:118%;max-width:none;transform:translateX(-50%)}
html.siege .sg .carte-camp.lum .illu img.ar{transform:translateX(-50%) scaleX(-1)}
html.siege .sg .carte-camp .illu::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 45%,#151826 98%)}
html.siege .sg .carte-camp.omb .illu{background:radial-gradient(80% 90% at 50% 100%,rgba(234,102,89,.45),#14101A 75%)}
html.siege .sg .carte-camp.lum .illu{background:radial-gradient(80% 90% at 50% 100%,rgba(89,191,255,.42),#0E1322 75%)}
html.siege .sg .carte-camp .illu img.bl{position:absolute;left:16px;top:14px;width:64px;height:64px;z-index:2}
html.siege .sg .carte-camp .corps-c{padding:4px 18px 18px}
html.siege .sg .carte-camp h3{margin:0;font-family:var(--titre);font-weight:700;font-size:22px;line-height:1.15}
html.siege .sg .carte-camp.omb h3{color:var(--omb-c)!important}
html.siege .sg .carte-camp.lum h3{color:var(--lum-c)!important}
html.siege .sg .carte-camp p{margin:6px 0 0;font-size:15px;color:var(--doux)!important;line-height:1.4}
html.siege .sg .carte-camp .bas{display:flex;align-items:center;gap:8px;margin-top:10px;flex-wrap:wrap}
html.siege .sg .carte-camp .bonus-c{position:absolute;right:12px;top:12px;z-index:3}
html.siege .sg .carte-camp.choisie{transform:translateY(-4px)}
html.siege .sg .carte-camp.omb.choisie{box-shadow:0 0 0 3px var(--omb),0 0 40px rgba(234,102,89,.5),0 16px 36px rgba(0,0,0,.6)}
html.siege .sg .carte-camp.lum.choisie{box-shadow:0 0 0 3px var(--lum),0 0 40px rgba(89,191,255,.5),0 16px 36px rgba(0,0,0,.6)}
html.siege .sg .feuille .confirmer{margin-top:18px;display:flex;justify-content:center;gap:12px;flex-wrap:wrap}
html.siege .sg .feuille .erreur{margin:12px 0 0;font-size:15px;font-weight:600;color:var(--omb-c)!important}
html.siege .sg .btn-sobre{min-height:52px;padding:0 20px;border-radius:12px;border:1px solid rgba(255,255,255,.18);background:rgba(255,255,255,.05);font-weight:600;font-size:16px;cursor:pointer}
/* illumination du blason à la confirmation */
html.siege .sg .illumination{position:fixed;inset:0;z-index:80;display:none;align-items:center;justify-content:center;flex-direction:column;background:rgba(5,6,12,.94);text-align:center}
html.siege .sg .illumination.ouvert{display:flex}
html.siege .sg .illumination .bl{position:relative;width:180px;height:180px}
html.siege .sg .illumination .bl img{position:relative;width:100%;height:100%;z-index:2;animation:sg-eclos .9s cubic-bezier(.2,1.4,.4,1) both}
html.siege .sg .illumination .bl::before{content:"";position:absolute;inset:-60%;border-radius:50%;background:radial-gradient(circle,var(--moi) 0%,transparent 60%);opacity:0;animation:sg-irradie 1.2s ease-out .2s forwards}
html.siege .sg .illumination .bl::after{content:"";position:absolute;inset:-90%;background:repeating-conic-gradient(rgba(255,230,170,.35) 0 4deg,transparent 4deg 16deg);
  -webkit-mask:radial-gradient(circle,#000 10%,transparent 58%);mask:radial-gradient(circle,#000 10%,transparent 58%);opacity:0;animation:sg-irradie 1.4s ease-out .25s forwards}
html.siege .sg .illumination p{font-family:var(--titre);font-weight:700;font-size:28px;margin:22px 0 0;color:var(--moi-c)!important;opacity:0;animation:sg-apparait .5s ease-out .6s forwards}
@keyframes sg-eclos{from{transform:scale(.5);opacity:0}to{transform:scale(1);opacity:1}}
@keyframes sg-irradie{0%{opacity:0;transform:scale(.5)}50%{opacity:1}100%{opacity:.7;transform:scale(1)}}
@keyframes sg-apparait{to{opacity:1}}

/* ======================= SOUS LE PREMIER ÉCRAN ======================= */
html.siege .sg .bloc{position:relative;margin:18px 16px 0;padding:18px;border-radius:18px;
  background:var(--grain),linear-gradient(180deg,#171A29,#10121D);box-shadow:0 12px 30px rgba(0,0,0,.45),inset 0 1px 0 rgba(242,230,201,.07),inset 0 0 0 1px rgba(217,173,99,.18)}
html.siege .sg .bloc h2{margin:0;font-family:var(--titre);font-weight:700;font-size:22px;letter-spacing:.03em;color:var(--or-c)!important}
html.siege .sg .bloc .chapo{margin:4px 0 14px;font-size:15px;color:var(--doux)!important;line-height:1.45}
html.siege .sg .missions{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:12px}
html.siege .sg .missions .vide{grid-column:1/-1;margin:0;color:var(--pale)!important;font-size:15px}
html.siege .sg .mission{position:relative;display:grid;grid-template-columns:44px 1fr;gap:6px 12px;align-items:center;align-content:center;padding:14px;border-radius:14px;min-height:86px;
  background:linear-gradient(160deg,#1E2234,#141725);box-shadow:inset 0 0 0 1px rgba(255,255,255,.08),0 6px 14px rgba(0,0,0,.35);transition:transform .15s,box-shadow .15s}
html.siege .sg a.mission:hover{transform:translateY(-2px);box-shadow:inset 0 0 0 1px var(--moi),0 8px 18px rgba(0,0,0,.45)}
html.siege .sg .mission .ic{grid-row:1/3;width:44px;height:44px;border-radius:12px;display:grid;place-items:center;
  background:radial-gradient(circle at 35% 30%,var(--moi),var(--moi-f));
  background:radial-gradient(circle at 35% 30%,color-mix(in srgb,var(--moi) 55%,#fff 0%),var(--moi-f));box-shadow:inset 0 1px 0 rgba(255,255,255,.3),0 0 0 1px rgba(217,173,99,.5)}
html.siege .sg .mission .ic svg{width:24px;height:24px;stroke:#FFF4DC;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
html.siege .sg .mission .v{font-size:17px;font-weight:800;line-height:1.2}
html.siege .sg .mission .c{display:flex;flex-wrap:wrap;gap:6px;align-items:center;font-size:14px;color:var(--doux)!important;min-width:0}
html.siege .sg .mission .tag{font-size:14px;font-weight:700;padding:2px 9px;border-radius:999px;background:rgba(217,173,99,.16);border:1px solid rgba(217,173,99,.45);
  max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
html.siege .sg .mission .bonus{font-size:13px;font-weight:800;color:var(--or-c)!important}
html.siege .sg .mission.joue{background:linear-gradient(160deg,#171A27,#11131D)}
html.siege .sg .mission.joue .v{color:var(--doux)!important}
html.siege .sg .mission.joue .ic{filter:grayscale(.7) brightness(.8)}
html.siege .sg .mission .fait{grid-column:1/-1;font-size:14px;font-weight:600;color:#9EE2B8!important}
html.siege .sg .missions.verrou .mission{opacity:.55}
html.siege .sg .missions.eclaire a.mission:not(.joue){animation:sg-eclaire 1.1s ease-out}
@keyframes sg-eclaire{0%{box-shadow:inset 0 0 0 2px var(--or-c),0 0 24px rgba(217,173,99,.6)}100%{box-shadow:inset 0 0 0 1px rgba(255,255,255,.08),0 6px 14px rgba(0,0,0,.35)}}

/* carte du royaume (front de guerre) */
html.siege .sg .carte-front{position:relative;border-radius:14px;overflow:hidden;aspect-ratio:1100/704;background:#0E1020;box-shadow:inset 0 0 0 1px rgba(217,173,99,.4)}
html.siege .sg .carte-front img.fond{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:saturate(.75) brightness(.72)}
html.siege .sg .carte-front .teinte{position:absolute;inset:0}
html.siege .sg .carte-front svg{position:absolute;inset:0;width:100%;height:100%}
html.siege .sg .carte-front .ligne-feu{animation:sg-flux 1.4s linear infinite}
html.siege .sg .carte-front .cap{position:absolute;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;gap:2px}
html.siege .sg .carte-front .cap img{width:56px;height:56px;filter:drop-shadow(0 4px 8px rgba(0,0,0,.8))}
html.siege .sg .carte-front .cap span{font-family:var(--titre);font-weight:700;font-size:15px;padding:2px 10px;border-radius:999px;background:rgba(8,9,18,.82)}
html.siege .sg .carte-front .cap.lum span{color:var(--lum-c)!important;box-shadow:0 0 0 1px rgba(89,191,255,.6)}
html.siege .sg .carte-front .cap.omb span{color:var(--omb-c)!important;box-shadow:0 0 0 1px rgba(234,102,89,.6)}
html.siege .sg .carte-front .eclat{position:absolute;transform:translate(-50%,-50%);width:58px;height:58px}
html.siege .sg .carte-front .eclat img{width:100%;height:100%;object-fit:contain}
html.siege .sg .carte-front .eclat::before{content:"";position:absolute;inset:-14px;border-radius:50%;background:radial-gradient(circle,rgba(255,226,160,.7),transparent 66%);animation:sg-halo 3s ease-in-out infinite}
html.siege .sg .legende{display:flex;flex-wrap:wrap;gap:8px 16px;margin-top:12px;font-size:15px;color:var(--doux)!important}
html.siege .sg .legende b{color:var(--ivoire)!important}
html.siege .sg .palier-front{margin:8px 0 0;font-size:15px;line-height:1.45;color:#E4DCC8!important}

html.siege .sg .sg-deux{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:18px 16px 0}
html.siege .sg .sg-deux .bloc{margin:0}
html.siege .sg .podium{list-style:none;margin:10px 0 0;padding:0}
html.siege .sg .podium li{display:grid;grid-template-columns:26px 58px 1fr auto;align-items:center;gap:10px;padding:8px 10px;border-radius:12px;font-size:15px;margin-bottom:6px;background:rgba(255,255,255,.035)}
html.siege .sg .podium .r{font-weight:800;text-align:center;color:var(--or)!important}
html.siege .sg .podium .ail{width:58px;height:29px;object-fit:contain;display:block}
html.siege .sg .podium .a{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600}
html.siege .sg .podium .p{font-weight:800;white-space:nowrap;font-variant-numeric:tabular-nums}
html.siege .sg .podium li.n1{background:linear-gradient(90deg,rgba(217,173,99,.18),rgba(255,255,255,.03))}
html.siege .sg .podium li.toi{box-shadow:inset 0 0 0 2px var(--or)}
html.siege .sg .podium li.sep{display:block;text-align:center;color:var(--pale)!important;background:none;padding:0;margin:0 0 6px;font-size:14px}
html.siege .sg .podium li.vide{display:block;background:none;color:var(--pale)!important;padding:4px 0}
html.siege .sg h2.lum-t{color:var(--lum-c)!important}
html.siege .sg h2.omb-t{color:var(--omb-c)!important}
html.siege .sg .h2-camp{display:flex;align-items:center;gap:10px}
html.siege .sg .h2-camp img{width:34px;height:34px}
html.siege .sg details.bloc summary{cursor:pointer;list-style:none;font-family:var(--titre);font-weight:700;font-size:20px;color:var(--or-c)!important;display:flex;align-items:center;justify-content:space-between;gap:12px}
html.siege .sg details.bloc summary::-webkit-details-marker{display:none}
html.siege .sg details.bloc summary::after{content:"+";font-family:var(--texte);font-size:26px;color:var(--or)!important}
html.siege .sg details[open].bloc summary::after{content:"–"}
html.siege .sg details.bloc ul{margin:12px 0 0;padding-left:20px;line-height:1.6;font-size:16px;color:#E4DCC8!important}
html.siege .sg .fin{height:40px}

/* ======================= VERDICT DU DIMANCHE ======================= */
html.siege .sg .verdict{position:fixed;inset:0;z-index:90;display:none;background:#07080F;overflow:hidden}
html.siege .sg .verdict.ouvert{display:block}
html.siege .sg .verdict .vcarte{position:absolute;inset:0;transform:scale(1.18);opacity:0;transition:transform 1.6s cubic-bezier(.2,.7,.2,1),opacity 1s}
html.siege .sg .verdict.e1 .vcarte,html.siege .sg .verdict.e2 .vcarte,html.siege .sg .verdict.e3 .vcarte,html.siege .sg .verdict.e4 .vcarte{transform:scale(1);opacity:1}
html.siege .sg .verdict .vcarte img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:brightness(.6) saturate(.75)}
html.siege .sg .verdict .terr{position:absolute;inset:0;opacity:0;transition:opacity 1.2s ease-out .6s}
html.siege .sg .verdict.e1 .terr,html.siege .sg .verdict.e2 .terr,html.siege .sg .verdict.e3 .terr,html.siege .sg .verdict.e4 .terr{opacity:1}
html.siege .sg .verdict .terr.omb{background:radial-gradient(60% 45% at 46% 76%,rgba(234,102,89,.55),transparent 70%),radial-gradient(35% 25% at 72% 56%,rgba(234,102,89,.35),transparent 70%)}
html.siege .sg .verdict .terr.lum{background:radial-gradient(55% 40% at 50% 18%,rgba(89,191,255,.38),transparent 70%),radial-gradient(35% 25% at 30% 40%,rgba(89,191,255,.28),transparent 70%)}
html.siege .sg .verdict .vfront{position:absolute;inset:0;width:100%;height:100%}
html.siege .sg .verdict .vfront .trace{transition:stroke-dashoffset 1.6s ease-out .5s}
html.siege .sg .verdict.e1 .vfront .trace,html.siege .sg .verdict.e2 .vfront .trace,html.siege .sg .verdict.e3 .vfront .trace,html.siege .sg .verdict.e4 .vfront .trace{stroke-dashoffset:0}
html.siege .sg .verdict .conquis{position:absolute;width:30vmin;height:22vmin;transform:translate(-50%,-50%) scale(.6);border-radius:50%;opacity:0;transition:opacity .8s 1.2s,transform .8s 1.2s}
html.siege .sg .verdict .conquis.omb{background:radial-gradient(closest-side,rgba(255,120,100,.75),rgba(234,102,89,.3) 55%,transparent)}
html.siege .sg .verdict .conquis.lum{background:radial-gradient(closest-side,rgba(150,215,255,.75),rgba(89,191,255,.3) 55%,transparent)}
html.siege .sg .verdict.e1 .conquis,html.siege .sg .verdict.e2 .conquis,html.siege .sg .verdict.e3 .conquis,html.siege .sg .verdict.e4 .conquis{opacity:1;transform:translate(-50%,-50%) scale(1)}
html.siege .sg .verdict .vombre{position:absolute;inset:0;background:radial-gradient(70% 60% at 50% 40%,transparent 30%,rgba(5,6,12,.75))}
html.siege .sg .verdict .passer{position:absolute;top:14px;right:14px;z-index:5;min-height:44px;padding:0 16px;border-radius:999px;border:1px solid rgba(255,255,255,.25);background:rgba(8,9,18,.7);font-weight:600;font-size:15px;cursor:pointer}
html.siege .sg .verdict .semaine-v{position:absolute;top:20px;left:16px;z-index:5;font-size:14px;font-weight:600;color:var(--doux)!important}
html.siege .sg .verdict .banniere{position:absolute;left:50%;top:0;z-index:3;width:200px;margin-left:-100px;padding:26px 0 46px;text-align:center;transform:translateY(-110%);
  transition:transform .9s cubic-bezier(.2,1.25,.4,1) .9s;clip-path:polygon(0 0,100% 0,100% 100%,50% 86%,0 100%);
  background:var(--grain),linear-gradient(180deg,var(--v-f),var(--v-f2));
  background:var(--grain),linear-gradient(180deg,var(--v-f),color-mix(in srgb,var(--v-f) 60%,#000));box-shadow:inset 0 0 0 2px var(--or)}
html.siege .sg .verdict .banniere::before{content:"";position:absolute;inset:6px 6px 0;clip-path:polygon(0 0,100% 0,100% 100%,50% 86%,0 100%);box-shadow:inset 0 0 0 1px rgba(243,215,154,.6)}
html.siege .sg .verdict.e1 .banniere,html.siege .sg .verdict.e2 .banniere,html.siege .sg .verdict.e3 .banniere,html.siege .sg .verdict.e4 .banniere{transform:translateY(0)}
html.siege .sg .verdict .banniere img{width:96px;height:96px;filter:drop-shadow(0 6px 10px rgba(0,0,0,.7))}
html.siege .sg .verdict .banniere b{display:block;font-family:var(--titre);font-weight:700;font-size:24px;color:#FFF3DA!important;margin-top:4px}
html.siege .sg .verdict .banniere span{display:block;font-size:14px;font-weight:600;color:var(--or-c)!important;margin-top:2px}
html.siege .sg .verdict .panneau{position:absolute;left:50%;bottom:24px;z-index:4;width:min(560px,calc(100% - 32px));max-height:calc(100% - 120px);overflow:auto;transform:translate(-50%,30px);opacity:0;transition:transform .6s ease-out,opacity .6s;
  padding:20px 20px 18px;border-radius:20px;background:var(--grain),linear-gradient(180deg,#1A1D2C,#10121D);box-shadow:0 20px 50px rgba(0,0,0,.7),inset 0 0 0 1px rgba(217,173,99,.45)}
html.siege .sg .verdict.e2 .panneau,html.siege .sg .verdict.e3 .panneau,html.siege .sg .verdict.e4 .panneau{transform:translate(-50%,0);opacity:1}
html.siege .sg .verdict .etapes{display:flex;gap:6px;justify-content:center;margin-bottom:12px}
html.siege .sg .verdict .etapes i{width:30px;height:4px;border-radius:2px;background:#30354A}
html.siege .sg .verdict .etapes i.on{background:var(--or)}
html.siege .sg .verdict .vtexte{display:none;text-align:center}
html.siege .sg .verdict.e2 .vt1,html.siege .sg .verdict.e3 .vt2,html.siege .sg .verdict.e4 .vt3{display:block;animation:sg-apparait-b .45s ease-out}
@keyframes sg-apparait-b{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
html.siege .sg .verdict .vtexte h3{margin:0;font-family:var(--titre);font-weight:700;font-size:24px;color:var(--or-c)!important}
html.siege .sg .verdict .vtexte p{margin:8px 0 0;font-size:16px;line-height:1.45;color:#E4DCC8!important}
html.siege .sg .verdict .chiffres{display:flex;justify-content:center;gap:12px;margin-top:14px;flex-wrap:wrap}
html.siege .sg .verdict .chiffre{min-width:120px;padding:10px 12px;border-radius:12px;background:rgba(255,255,255,.05);box-shadow:inset 0 0 0 1px rgba(255,255,255,.1)}
html.siege .sg .verdict .chiffre b{display:block;font-size:30px;font-weight:800;font-variant-numeric:tabular-nums;line-height:1.1}
html.siege .sg .verdict .chiffre b.omb{color:var(--omb)!important}
html.siege .sg .verdict .chiffre b.lum{color:var(--lum)!important}
html.siege .sg .verdict .chiffre span{font-size:14px;color:var(--doux)!important}
html.siege .sg .verdict .recomp{list-style:none;margin:12px 0 0;padding:0;text-align:left}
html.siege .sg .verdict .recomp li{display:flex;justify-content:space-between;gap:10px;padding:8px 4px;border-bottom:1px solid rgba(255,255,255,.08);font-size:16px}
html.siege .sg .verdict .recomp li b{font-variant-numeric:tabular-nums;color:var(--or-c)!important;white-space:nowrap}
html.siege .sg .verdict .recomp li.total{border:0;font-size:19px;font-weight:800}
html.siege .sg .verdict .recomp li.total b{font-size:24px}
html.siege .sg .verdict .vbtn{display:flex;justify-content:center;margin-top:16px}
html.siege .sg .verdict .boss-v{position:absolute;left:50%;top:44%;z-index:2;width:min(46vw,40svh,330px);aspect-ratio:1;transform:translate(-50%,-50%) scale(.9);opacity:0;transition:opacity .8s 1.4s,transform .8s 1.4s}
html.siege .sg .verdict.e1 .boss-v,html.siege .sg .verdict.e2 .boss-v,html.siege .sg .verdict.e3 .boss-v,html.siege .sg .verdict.e4 .boss-v{opacity:1;transform:translate(-50%,-50%) scale(1)}
html.siege .sg .verdict .boss-v img{width:100%;height:100%;object-fit:contain;display:block}
html.siege .sg .verdict .boss-v .sceau{position:absolute;inset:-6%;width:112%;height:112%}
@media (orientation:landscape) and (max-height:820px){
  html.siege .sg .verdict.ouvert .banniere{left:24%}
  html.siege .sg .verdict .semaine-v{left:auto;right:130px;top:26px}
  html.siege .sg .verdict.ouvert .boss-v{width:min(44svh,320px);top:30%;left:66%}
}

/* ======================= PAYSAGE : 2 colonnes ======================= */
@media (orientation:landscape) and (min-width:900px){
  html.siege .sg .premier{display:grid;grid-template-columns:minmax(0,1.18fr) minmax(0,1fr);grid-template-rows:auto auto auto 1fr;
    grid-template-areas:"scene tete" "scene moi" "scene semaine" "scene bas";min-height:calc(100vh - 56px);min-height:calc(100svh - 56px);column-gap:6px}
  html.siege .sg .tete{grid-area:tete;text-align:left;padding:22px 20px 0 8px}
  html.siege .sg .tete h1{font-size:clamp(30px,3.6vw,46px)}
  html.siege .sg .etat{justify-content:flex-start}
  html.siege .sg .scene-col{grid-area:scene;display:flex;flex-direction:column;justify-content:flex-end;padding-bottom:14px;min-width:0}
  html.siege .sg .scene{height:auto;flex:1;margin-top:0;min-height:380px}
  html.siege .sg .boss{width:min(40vw,58svh,440px);bottom:4%}
  html.siege .sg .armee{width:min(28vw,310px)}
  html.siege .sg .armee.lum{width:min(32vw,356px)}
  html.siege .sg .moi,html.siege .sg .rallier{grid-area:moi;margin:16px 20px 0 8px}
  html.siege.sg-sans-camp .sg .rallier{display:block}
  html.siege .sg .moi{flex-wrap:wrap}
  html.siege .sg .moi .infos{flex:1 1 200px}
  html.siege .sg .moi .action{flex:1 1 100%;padding:0 14px 14px 14px}
  html.siege .sg .moi .action .combattre{width:100%}
  html.siege .sg .semaine{grid-area:semaine;margin:14px 20px 0 8px;flex-direction:column;align-items:stretch;gap:8px}
  html.siege .sg .semaine .lbl{max-width:none}
  html.siege .sg .descendre{grid-area:bas;align-self:end;padding-bottom:18px}
  html.siege .sg .duel{padding:0 10px 0 16px}
  html.siege .sg .score .pct{font-size:clamp(38px,4.4vw,54px)}
  html.siege.sg-sans-camp .sg .boss{bottom:16%}
  html.siege.sg-sans-camp .sg .armee{bottom:2%}
  html.siege .sg .rallier .bla{width:96px}
  html.siege .sg .rallier .duo{gap:10px}
  html.siege .sg .rallier .btn-or{font-size:18px;padding:0 16px}
}
@media (orientation:portrait),(max-width:899px){ html.siege .sg .scene-col{display:contents} }

/* téléphone */
@media (max-width:600px){
  html.siege .sg .moi{flex-wrap:wrap}
  html.siege .sg .moi .etendard{width:96px}
  html.siege .sg .moi .action{flex:1 1 100%;padding:0 14px 14px}
  html.siege .sg .moi .action .combattre{width:100%}
  html.siege .sg .semaine{flex-direction:column;align-items:stretch}
  html.siege .sg .semaine .lbl{max-width:none}
  html.siege .sg .relique{min-width:0}
  html.siege .sg .relique .t{font-size:13px}
  html.siege .sg .sg-deux{grid-template-columns:1fr}
  html.siege .sg .cartes{grid-template-columns:1fr}
  html.siege .sg .carte-camp .illu{height:140px}
  html.siege .sg .front .blason{width:52px;height:52px;margin-top:-26px}
  html.siege .sg .ecart{display:none}
  html.siege .sg .scores{grid-template-columns:1fr 1fr}
  html.siege .sg .rallier .duo{flex-wrap:wrap}
  html.siege .sg .rallier .btn-or{order:3;width:100%}
  html.siege .sg .missions{grid-template-columns:1fr}
}

/* ── Mouvement réduit, page masquée ───────────────────────────────────── */
@media (prefers-reduced-motion:reduce){
  html.siege .sg *,html.siege .sg *::before,html.siege .sg *::after{animation:none!important;transition:none!important}
  html.siege .sg .particules{display:none}
}
html.siege.sg-cache .sg *,html.siege.sg-cache .sg *::before,html.siege.sg-cache .sg *::after{animation-play-state:paused!important}