/* ===== Accueil festif ===== */
:root {
  --lego-red: #d01012; --lego-yellow: #f5c518; --lego-blue: #0a5fbf;
  --lego-green: #1f8a3b; --lego-orange: #f07a13; --lego-purple: #7a3fb0;
}

/* Hero : ciel étoilé */
.home-hero {
  position: relative; overflow: hidden; isolation: isolate;
  margin: 0 0 2.5rem; padding: 3.5rem 2rem 3rem; border-radius: 1.2rem;
  text-align: center; color: #fff;
  background: radial-gradient(ellipse at 20% 0%, #3b2a7a 0%, transparent 55%),
              radial-gradient(ellipse at 90% 100%, #0a4a8f 0%, transparent 60%),
              linear-gradient(160deg, #0b0f2a, #120b2e 60%, #05060f);
  box-shadow: 0 1.2rem 3rem -1rem rgba(20, 10, 60, .55);
}
.home-stars {
  position: absolute; inset: 0; z-index: -1; opacity: .9;
  background-image:
    radial-gradient(1.5px 1.5px at 10% 20%, #fff 50%, transparent 51%),
    radial-gradient(1px 1px at 30% 70%, #fff 50%, transparent 51%),
    radial-gradient(2px 2px at 55% 30%, #ffe9a8 50%, transparent 51%),
    radial-gradient(1px 1px at 75% 60%, #fff 50%, transparent 51%),
    radial-gradient(1.5px 1.5px at 88% 15%, #cfe3ff 50%, transparent 51%),
    radial-gradient(1px 1px at 45% 90%, #fff 50%, transparent 51%),
    radial-gradient(1.5px 1.5px at 20% 50%, #fff 50%, transparent 51%),
    radial-gradient(1px 1px at 65% 85%, #ffe9a8 50%, transparent 51%);
  background-size: 260px 260px;
  animation: home-twinkle 4s ease-in-out infinite alternate;
}
@keyframes home-twinkle { from { opacity: .45; } to { opacity: 1; } }

.md-typeset .home-kicker {
  margin: 0 0 .6rem; font-style: italic; letter-spacing: .02em;
  color: #9fc3ff; font-size: .8rem;
}
.md-typeset .home-hero h1 {
  margin: 0 0 1rem; font-weight: 800; font-size: clamp(2rem, 6vw, 3.4rem); line-height: 1.1;
  color: var(--lego-yellow);
  background: linear-gradient(90deg, #ffd84d, #ff9a3c, #ff5fa2, #ffd84d);
  background-size: 300% 100%;
  -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent;
  animation: home-shimmer 6s linear infinite;
}
.md-typeset .home-hero h1 .twemoji, .md-typeset .home-hero h1 img { -webkit-text-fill-color: initial; }
@keyframes home-shimmer { to { background-position: 300% 0; } }

.md-typeset .home-lead { max-width: 36rem; margin: 0 auto 1.8rem; font-size: .95rem; color: #e6e9ff; }
.md-typeset .home-actions { display: flex; gap: .8rem; justify-content: center; flex-wrap: wrap; margin: 0; }
.md-typeset .home-hero .md-button { border-radius: 2rem; font-weight: 700; font-size: .8rem; text-decoration: none; }
.md-typeset .home-hero .md-button--primary {
  background: var(--lego-yellow); border-color: var(--lego-yellow); color: #1a1233;
}
.md-typeset .home-hero .md-button--primary:hover { background: #ffd84d; border-color: #ffd84d; }
.md-typeset .home-confetti-btn { color: #fff; border-color: rgba(255,255,255,.6); background: transparent; cursor: pointer; }
.md-typeset .home-confetti-btn:hover { background: rgba(255,255,255,.12); color: #fff; border-color: #fff; }

/* Recette : 4 ingrédients */
.home-trio { display: grid; grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr)); gap: .8rem; }
.home-ingredient {
  display: flex; flex-direction: column; align-items: center; text-align: center; gap: .15rem;
  padding: 1rem .6rem; border-radius: .9rem; border: 2px solid var(--c);
  background: color-mix(in srgb, var(--c) 10%, transparent);
}
.home-ingredient span:last-child { font-size: .75rem; opacity: .8; }
.home-ingredient--blue { --c: var(--lego-blue); } .home-ingredient--red { --c: var(--lego-red); }
.home-ingredient--yellow { --c: var(--lego-yellow); } .home-ingredient--green { --c: var(--lego-green); }
.home-emoji { font-size: 1.8rem; line-height: 1.2; }

/* Briques LEGO cliquables */
.home-bricks { display: grid; grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr)); gap: 1.6rem 1rem; margin-top: 1.6rem; }
.md-typeset a.home-brick {
  position: relative; display: flex; flex-direction: column; gap: .2rem;
  padding: 1.1rem 1.1rem 1rem; border-radius: .5rem;
  background: var(--c); color: var(--fg, #fff); text-decoration: none;
  box-shadow: inset 0 -.35rem 0 rgba(0,0,0,.18), 0 .4rem .9rem -.3rem rgba(0,0,0,.35);
  transition: transform .15s ease, box-shadow .15s ease;
}
/* Les tenons sur le dessus */
.md-typeset a.home-brick::before {
  content: ""; position: absolute; top: -.55rem; left: 1rem; right: 1rem; height: .6rem;
  background: radial-gradient(ellipse .7rem .6rem at 50% 100%, var(--c) 97%, transparent 100%) 0 0 / 2.4rem .6rem repeat-x;
  filter: brightness(1.12);
}
.md-typeset a.home-brick:hover { transform: translateY(-4px) rotate(-.6deg); box-shadow: inset 0 -.35rem 0 rgba(0,0,0,.18), 0 .9rem 1.4rem -.4rem rgba(0,0,0,.4); color: var(--fg, #fff); }
.md-typeset a.home-brick strong { font-size: 1rem; }
.md-typeset a.home-brick span:last-child { font-size: .75rem; opacity: .92; }
.home-brick--red { --c: var(--lego-red); } .home-brick--yellow { --c: var(--lego-yellow); --fg: #2a2000; }
.home-brick--blue { --c: var(--lego-blue); } .home-brick--green { --c: var(--lego-green); }
.home-brick--orange { --c: var(--lego-orange); } .home-brick--purple { --c: var(--lego-purple); }

/* Code de l'atelier */
.home-rules { display: grid; grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr)); gap: .8rem; }
.home-rule {
  display: flex; align-items: center; gap: .8rem; padding: .8rem 1rem; border-radius: .8rem;
  background: var(--md-code-bg-color);
}
.md-typeset .home-rule p { margin: 0; font-size: .8rem; }
.home-rule-num {
  flex: none; display: grid; place-items: center; width: 2rem; height: 2rem; border-radius: 50%;
  background: var(--lego-yellow); color: #2a2000; font-weight: 800;
}
.md-typeset .home-signoff { margin-top: 2.5rem; text-align: center; font-size: 1.1rem; font-weight: 700; }

/* Confettis */
.home-confetti { position: fixed; inset: 0; pointer-events: none; z-index: 1000; }

@media (prefers-reduced-motion: reduce) {
  .home-stars, .md-typeset .home-hero h1 { animation: none; }
  .md-typeset a.home-brick { transition: none; }
}

/* ===== Banc de test : holo-briefing ===== */
.mission-hero {
  position: relative; overflow: hidden; isolation: isolate;
  padding: 2rem 2rem 1.5rem; border-radius: 1.2rem; color: #e6e9ff; margin-bottom: 2rem;
  background: radial-gradient(ellipse at 50% 50%, #1b2a6b 0%, #0b0f2a 55%, #05060f 100%);
  box-shadow: 0 1.2rem 3rem -1rem rgba(20, 10, 60, .55);
}
/* Traînées d'hyperespace */
.mission-hyper { position: absolute; inset: 0; z-index: -1; }
.mission-hyper i {
  position: absolute; left: 50%; top: 50%; width: 30%; height: 2px; transform-origin: 0 50%;
  background: linear-gradient(90deg, transparent, rgba(180, 210, 255, .8));
  animation: mission-warp 2.4s linear infinite; opacity: 0;
}
.mission-hyper i:nth-child(1)  { --a: 8deg;   animation-delay: 0s; }
.mission-hyper i:nth-child(2)  { --a: 38deg;  animation-delay: .6s; }
.mission-hyper i:nth-child(3)  { --a: 70deg;  animation-delay: 1.2s; }
.mission-hyper i:nth-child(4)  { --a: 100deg; animation-delay: .3s; }
.mission-hyper i:nth-child(5)  { --a: 135deg; animation-delay: 1.8s; }
.mission-hyper i:nth-child(6)  { --a: 165deg; animation-delay: .9s; }
.mission-hyper i:nth-child(7)  { --a: 195deg; animation-delay: 1.5s; }
.mission-hyper i:nth-child(8)  { --a: 225deg; animation-delay: .2s; }
.mission-hyper i:nth-child(9)  { --a: 255deg; animation-delay: 2.1s; }
.mission-hyper i:nth-child(10) { --a: 290deg; animation-delay: 1.1s; }
.mission-hyper i:nth-child(11) { --a: 320deg; animation-delay: .5s; }
.mission-hyper i:nth-child(12) { --a: 348deg; animation-delay: 1.7s; }
@keyframes mission-warp {
  0%   { transform: rotate(var(--a)) translateX(2%) scaleX(.1); opacity: 0; }
  20%  { opacity: .9; }
  100% { transform: rotate(var(--a)) translateX(160%) scaleX(1); opacity: 0; }
}

.mission-briefing { display: flex; gap: 1.5rem; align-items: center; }
.mission-droid { flex: none; width: 7.5rem; filter: drop-shadow(0 0 1rem rgba(90, 150, 255, .45)); }
.mission-droid-tip { animation: mission-blink 1.2s steps(2, jump-none) infinite; }
.mission-droid-eyes { animation: mission-scan 4s ease-in-out infinite; }
@keyframes mission-blink { 50% { fill: #5a1a1a; } }
@keyframes mission-scan { 0%, 100% { transform: translateX(0); } 30% { transform: translateX(-4px); } 60% { transform: translateX(4px); } }

.mission-bubble {
  position: relative; flex: 1; padding: 1rem 1.3rem; border-radius: 1rem;
  background: rgba(80, 160, 255, .12); border: 1px solid rgba(120, 190, 255, .45);
  box-shadow: inset 0 0 1.5rem rgba(80, 160, 255, .15);
}
.mission-bubble::before {
  content: ""; position: absolute; left: -.6rem; top: 2.2rem; width: 1rem; height: 1rem; transform: rotate(45deg);
  background: #13204a; border-left: 1px solid rgba(120, 190, 255, .45); border-bottom: 1px solid rgba(120, 190, 255, .45);
}
.md-typeset .mission-tag {
  margin: 0; font-size: .65rem; letter-spacing: .12em; text-transform: uppercase; color: #7fd4ff;
}
.md-typeset .mission-bubble h1 { margin: .2rem 0 .5rem; color: #f5c518; font-weight: 800; font-size: 1.8rem; }
.md-typeset .mission-bubble p { margin: 0; }
.md-typeset .mission-bubble strong { color: #fff; }

.mission-progress { display: flex; align-items: center; gap: .8rem; margin-top: 1.4rem; font-size: .75rem; flex-wrap: wrap; }
.mission-progress-label { text-transform: uppercase; letter-spacing: .08em; color: #9fc3ff; }
.mission-progress-bar { flex: 1; min-width: 8rem; height: .6rem; border-radius: 1rem; background: rgba(255,255,255,.12); overflow: hidden; }
.mission-progress-bar span { display: block; height: 100%; width: 0; border-radius: inherit; background: linear-gradient(90deg, #f5c518, #ff7a3c); transition: width .8s ease; }
.mission-progress-count { font-weight: 700; color: #fff; }

/* Carte de la galaxie */
.mission-defs { position: absolute; width: 0; height: 0; overflow: hidden; }
.mission-map svg.mission-map-h, .mission-map svg.mission-map-v { width: 100%; height: auto; display: block; border-radius: 1rem; }
.mission-map-v { display: none !important; max-width: 24rem; margin: 0 auto; }
@media (max-width: 44.9375em) {
  .mission-map-h { display: none !important; }
  .mission-map-v { display: block !important; }
}
.mission-route { animation: mission-dash 1.5s linear infinite; }
@keyframes mission-dash { to { stroke-dashoffset: -28; } }
.mission-planet { cursor: pointer; }
.mission-planet circle, .mission-planet ellipse { transition: transform .2s ease, filter .2s ease; transform-box: fill-box; transform-origin: center; }
.mission-planet:hover circle, .mission-planet:focus circle { transform: scale(1.12); filter: drop-shadow(0 0 10px rgba(255, 255, 255, .6)); }
.mission-planet .pn { fill: #fff; font: 800 20px/1 var(--md-text-font-family, sans-serif); text-anchor: middle; paint-order: stroke; stroke: rgba(0,0,0,.35); stroke-width: 3px; }
.mission-planet .pl { fill: #cfe0ff; font: 600 17px/1 var(--md-text-font-family, sans-serif); }
.mission-map-h .pl { text-anchor: middle; }
.mission-planet.is-done circle:first-of-type { filter: drop-shadow(0 0 12px #f5c518); }
.mission-planet.is-done .pl { fill: #f5c518; }
.mission-ship { animation: mission-float 3s ease-in-out infinite; }
@keyframes mission-float { 50% { translate: 0 -6px; } }

/* Fiches de mission */
.md-typeset .mission-hint { margin-top: -.4rem; }
.mission-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(15rem, 1fr)); gap: 1rem; }
.md-typeset a.mission-card {
  position: relative; display: flex; flex-direction: column; gap: .35rem;
  padding: 1rem 1.1rem; border-radius: .9rem; text-decoration: none; color: var(--md-default-fg-color);
  background: var(--md-code-bg-color); border: 1px solid var(--md-default-fg-color--lightest);
  border-left: .35rem solid #9fc3ff;
  transition: transform .15s ease, box-shadow .15s ease;
}
.md-typeset a.mission-card:hover { transform: translateY(-3px); box-shadow: 0 .6rem 1.2rem -.5rem rgba(0,0,0,.35); color: var(--md-default-fg-color); }
.md-typeset a.mission-card[data-status="done"] { border-left-color: #f5c518; }
.mission-card-head { display: flex; align-items: center; gap: .5rem; }
.mission-num {
  display: grid; place-items: center; width: 1.7rem; height: 1.7rem; border-radius: 50%;
  background: #0b0f2a; color: #f5c518; font-weight: 800; font-size: .8rem;
}
.mission-planet-name { font-size: .65rem; text-transform: uppercase; letter-spacing: .1em; opacity: .7; }
.mission-status { margin-left: auto; font-size: .65rem; font-weight: 700; padding: .1rem .5rem; border-radius: 1rem; }
[data-status="todo"] .mission-status::after { content: "À explorer"; }
[data-status="todo"] .mission-status { background: var(--md-default-fg-color--lightest); }
[data-status="done"] .mission-status::after { content: "✓ Validée"; }
[data-status="done"] .mission-status { background: #f5c518; color: #2a2000; }
.md-typeset a.mission-card strong { font-size: .95rem; }
.mission-meta, .mission-goal { font-size: .75rem; }
.mission-rank { align-self: flex-start; margin-top: .3rem; font-size: .65rem; font-weight: 700; padding: .15rem .6rem; border-radius: 1rem; color: #fff; }
.mission-rank--1 { background: #1f8a3b; } .mission-rank--2 { background: #0a5fbf; }
.mission-rank--3 { background: #7a3fb0; } .mission-rank--4 { background: #d01012; }

.mission-final {
  margin: 2rem 0 1rem; padding: 1rem 1.3rem; border-radius: 1rem; text-align: center;
  background: linear-gradient(90deg, rgba(245,197,24,.18), rgba(255,122,60,.18));
  border: 1px solid rgba(245,197,24,.6);
}
.md-typeset .mission-final p { margin: 0; }

@media (max-width: 44.9375em) {
  .mission-hero { padding: 1.4rem 1rem 1.2rem; }
  .mission-briefing { flex-direction: column; text-align: center; }
  .mission-droid { width: 5.5rem; }
  .mission-bubble::before { left: 50%; top: -.55rem; margin-left: -.5rem; transform: rotate(135deg); }
}
@media (prefers-reduced-motion: reduce) {
  .mission-hyper i, .mission-droid-tip, .mission-droid-eyes, .mission-route, .mission-ship { animation: none; }
  .mission-hyper { display: none; }
}
.mission-quip { font-size: .72rem; font-style: italic; opacity: .8; padding-top: .2rem; border-top: 1px dashed var(--md-default-fg-color--lightest); }
.md-typeset .mission-bubble p + p { margin-top: .6rem; }

/* ===== Images fournies ===== */
.home-hero {
  background:
    linear-gradient(180deg, rgba(5,6,15,.35), rgba(5,6,15,.55)),
    url("../images/mission/bandeau-accueil.webp") center / cover no-repeat, #0b0f2a;
}
.home-hero .home-stars { opacity: .5; }

.mission-hero {
  background:
    linear-gradient(180deg, rgba(5,6,15,.72), rgba(5,6,15,.85)),
    url("../images/mission/fond-briefing.webp") center / cover no-repeat, #0b0f2a;
}
img.mission-droid { width: 10rem; height: auto; filter: drop-shadow(0 0 1.2rem rgba(90,150,255,.5)); animation: mission-hover 4s ease-in-out infinite; }
@keyframes mission-hover { 50% { transform: translateY(-6px); } }

.mission-planet image { transition: transform .2s ease, filter .2s ease; transform-box: fill-box; transform-origin: center; }
.mission-planet:hover image, .mission-planet:focus image { transform: scale(1.1); filter: drop-shadow(0 0 10px rgba(255,255,255,.55)); }
.mission-planet .pb { fill: #0b0f2a; stroke: #9fc3ff; stroke-width: 2; }
.mission-planet .pn { font-size: 17px; }
.mission-planet.is-done image { filter: drop-shadow(0 0 12px #f5c518); }
.mission-planet.is-done .pb { fill: #f5c518; stroke: #fff; }
.mission-planet.is-done .pn { fill: #2a2000; stroke: none; }
.mission-planet:focus { outline: none; }

.mission-art {
  display: block; height: 11rem; margin: -1rem -1.1rem .5rem; border-radius: .8rem .8rem 0 0;
  background: radial-gradient(ellipse at 50% 60%, #26336e 0%, #0b0f2a 70%);
  overflow: hidden;
}
.mission-art img { display: block; height: 100%; width: 100%; object-fit: contain; padding: .5rem; transition: transform .25s ease; }
.md-typeset a.mission-card:hover .mission-art img { transform: scale(1.06) rotate(-1.5deg); }
.md-typeset a.mission-card { overflow: hidden; }

.mission-final { display: flex; align-items: center; gap: 1rem; text-align: left; }
.mission-final-art { flex: none; width: 7.5rem; height: auto; }
@media (max-width: 44.9375em) {
  img.mission-droid { width: 7.5rem; }
  .mission-final { flex-direction: column; text-align: center; }
}
@media (prefers-reduced-motion: reduce) {
  img.mission-droid { animation: none; }
}

/* ===== Voix de R2-DuPont ===== */
.r2-player { display: flex; align-items: center; flex-wrap: wrap; gap: .6rem .8rem; margin-top: 1rem; }
.md-typeset .r2-play {
  display: inline-flex; align-items: center; gap: .4rem; cursor: pointer;
  padding: .45rem 1rem; border-radius: 2rem; border: 1px solid #7fd4ff;
  background: rgba(127, 212, 255, .15); color: #e6f6ff; font: inherit; font-size: .75rem; font-weight: 700;
  transition: background .15s ease, transform .15s ease;
}
.md-typeset .r2-play:hover { background: rgba(127, 212, 255, .3); transform: translateY(-1px); }
.r2-player.is-playing .r2-play { background: #f5c518; border-color: #f5c518; color: #1a1233; }
.r2-wave { display: inline-flex; align-items: flex-end; gap: 3px; height: 1rem; opacity: .35; }
.r2-wave i { width: 3px; height: 30%; background: #7fd4ff; border-radius: 2px; }
.r2-player.is-playing .r2-wave { opacity: 1; }
.r2-player.is-playing .r2-wave i { animation: r2-eq .5s ease-in-out infinite alternate; }
.r2-wave i:nth-child(2) { animation-delay: .1s !important; } .r2-wave i:nth-child(3) { animation-delay: .25s !important; }
.r2-wave i:nth-child(4) { animation-delay: .05s !important; } .r2-wave i:nth-child(5) { animation-delay: .18s !important; }
@keyframes r2-eq { from { height: 20%; } to { height: 100%; } }
.md-typeset .r2-caption {
  flex-basis: 100%; min-height: 1.2em; font-family: var(--md-code-font-family, monospace); font-size: .72rem; color: #7fd4ff;
}
.r2-caption:not(:empty)::before { content: "> "; color: #f5c518; }
.mission-hero.is-talking img.mission-droid { animation: r2-talk .35s ease-in-out infinite alternate; filter: drop-shadow(0 0 1.6rem rgba(127, 212, 255, .9)); }
@keyframes r2-talk { from { transform: translateY(0) rotate(-1.5deg); } to { transform: translateY(-5px) rotate(1.5deg); } }
@media (prefers-reduced-motion: reduce) {
  .r2-player.is-playing .r2-wave i, .mission-hero.is-talking img.mission-droid { animation: none; }
}

/* ===== Accueil : légions ===== */
.lg-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(14rem, 1fr)); gap: 1.2rem; margin-top: 1rem; }
.md-typeset a.lg {
  position: relative; display: flex; flex-direction: column; align-items: center; text-align: center;
  padding: 1.2rem 1rem 1.1rem; border-radius: .6rem; color: #e9ecf2; text-decoration: none;
  background: linear-gradient(160deg, #2a2f3a, #161920 70%); border: 1px solid #3a404c; border-top: 4px solid var(--c);
  box-shadow: 0 .5rem 1rem -.4rem rgba(0,0,0,.5); transition: transform .2s, box-shadow .2s;
}
.md-typeset a.lg:hover { transform: translateY(-4px); color: #fff; box-shadow: 0 .8rem 1.5rem -.5rem rgba(0,0,0,.6), 0 0 1.2rem -.2rem var(--c); }
.lg-emb { width: 5.5rem; height: auto; filter: drop-shadow(0 0 .6rem color-mix(in srgb, var(--c) 45%, transparent)); transition: transform .3s; }
.md-typeset a.lg:hover .lg-emb { transform: scale(1.08) rotate(-3deg); }
.lg-num { font: 900 12px/1 "Arial Black", Impact, sans-serif; fill: #12151c; letter-spacing: .5px; }
.lg-name { margin-top: .6rem; font: 800 .62rem/1.2 var(--md-code-font-family); letter-spacing: .14em; text-transform: uppercase; color: var(--c); }
.lg-motto { font-size: .62rem; font-style: italic; opacity: .65; margin: .15rem 0 .5rem; }
.md-typeset a.lg strong { font-size: 1.02rem; }
.lg-desc { font-size: .7rem; opacity: .8; margin-top: .15rem; }
@media (prefers-reduced-motion: reduce) { .md-typeset a.lg, .lg-emb { transition: none; } }

/* ===== Accueil : bandeau d'appel à l'action ===== */
.home-cta {
  display: flex; align-items: center; gap: 1.2rem; margin: 2rem 0 1rem; padding: 1rem 1.4rem; border-radius: 1rem;
  background: linear-gradient(100deg, #1b2a6b, #3b2a7a 55%, #6b2a6b); color: #fff;
  box-shadow: 0 .8rem 2rem -1rem rgba(60, 40, 140, .7);
}
.home-cta-droid { flex: none; width: 5.5rem; height: auto; animation: mission-hover 4s ease-in-out infinite; }
.home-cta-text { flex: 1; display: flex; flex-direction: column; gap: .2rem; }
.home-cta-text strong { font-size: 1.05rem; }
.home-cta-text span { font-size: .78rem; opacity: .85; }
.md-typeset .home-cta .home-cta-btn {
  flex: none; border-radius: 2rem; font-weight: 800; font-size: .85rem; padding: .7rem 1.4rem;
  background: #f5c518; border-color: #f5c518; color: #1a1233; text-decoration: none;
  box-shadow: 0 0 0 0 rgba(245, 197, 24, .7); animation: cta-pulse 2.2s ease-out infinite;
}
.md-typeset .home-cta .home-cta-btn:hover { background: #ffd84d; border-color: #ffd84d; color: #1a1233; }
@keyframes cta-pulse { 0% { box-shadow: 0 0 0 0 rgba(245,197,24,.65); } 70%,100% { box-shadow: 0 0 0 .9rem rgba(245,197,24,0); } }
@media (max-width: 44.9375em) { .home-cta { flex-direction: column; text-align: center; } }

/* ===== Accueil : le conseil (côté lumineux / obscur) ===== */
.council { border-radius: 1rem; padding: 1rem 1.2rem 1.3rem; transition: background .5s ease;
  background: radial-gradient(ellipse at 15% 60%, #123a52, #07111f 70%); color: #e6f7ff; }
.council[data-side="dark"] { background: radial-gradient(ellipse at 15% 60%, #4a0d0d, #120606 70%); color: #ffe3e3; }
.md-typeset .council-hint { margin: 0 0 1rem; font-size: .72rem; font-style: italic; opacity: .8; }
.council-switch { display: flex; align-items: center; flex-wrap: wrap; gap: .5rem; margin-bottom: 1rem; }
.council-q { font: 700 .62rem var(--md-code-font-family); letter-spacing: .14em; text-transform: uppercase; opacity: .7; margin-right: .3rem; }
.md-typeset .council-btn { cursor: pointer; border-radius: 2rem; padding: .35rem .9rem; font: inherit; font-size: .72rem; font-weight: 700;
  background: transparent; color: inherit; border: 1px solid rgba(255,255,255,.35); transition: background .2s, color .2s, box-shadow .2s; }
.md-typeset .council-btn[data-side="light"][aria-pressed="true"] { background: #5fd6ff; border-color: #5fd6ff; color: #07111f; box-shadow: 0 0 1rem rgba(95,214,255,.6); }
.md-typeset .council-btn[data-side="dark"][aria-pressed="true"] { background: #e0453a; border-color: #e0453a; color: #fff; box-shadow: 0 0 1rem rgba(224,69,58,.7); }
.council-stage { display: grid; grid-template-columns: 11rem 1fr; gap: 1.2rem; align-items: center; }
@media (max-width: 44.9375em) { .council-stage { grid-template-columns: 1fr; } .council-art { margin: 0 auto; } }
.council-art { position: relative; width: 11rem; height: 11rem; }
.council-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; transition: opacity .5s, transform .5s; }
.council-img--light { filter: drop-shadow(0 0 1rem rgba(95,214,255,.35)); }
.council-img--dark { filter: drop-shadow(0 0 1rem rgba(224,69,58,.5)); }
.council[data-side="light"] .council-img--dark, .council[data-side="dark"] .council-img--light { opacity: 0; transform: scale(.85) rotate(-6deg); }
.council-bubbles { display: flex; flex-direction: column; gap: .7rem; }
.council[data-side="light"] .council-bubbles--dark, .council[data-side="dark"] .council-bubbles--light { display: none; }
.council-b {
  position: relative; padding: .75rem 1rem; border-radius: .9rem; font: italic 600 .85rem/1.45 Georgia, serif;
  background: rgba(95, 214, 255, .1); border: 1px solid rgba(120, 210, 255, .5); color: #fff;
  box-shadow: 0 0 1rem rgba(60, 180, 255, .18), inset 0 0 1rem rgba(60, 180, 255, .1);
  opacity: 0; transform: translateX(-10px); animation: council-in .45s ease forwards;
}
.council-b:nth-child(2) { animation-delay: .35s; } .council-b:nth-child(3) { animation-delay: .7s; }
@keyframes council-in { to { opacity: 1; transform: none; } }
.council-b small { display: block; margin-top: .3rem; font: normal .66rem/1.35 var(--md-text-font-family, sans-serif); color: #9fdcf0; }
.council-b .n { display: inline-grid; place-items: center; width: 1.3rem; height: 1.3rem; margin-right: .45rem; border-radius: 50%;
  background: #5fd6ff; color: #07111f; font: 800 .65rem sans-serif; vertical-align: 1px; }
.council[data-side="dark"] .council-b { background: rgba(224, 69, 58, .12); border-color: rgba(255, 110, 100, .55);
  box-shadow: 0 0 1rem rgba(224, 69, 58, .25), inset 0 0 1rem rgba(224, 69, 58, .12); }
.council[data-side="dark"] .council-b small { color: #ffb3a8; font-weight: 700; }
.council[data-side="dark"] .council-b .n { background: #e0453a; color: #fff; }
.md-typeset .lg-intro { margin-top: -.3rem; opacity: .8; }
@media (prefers-reduced-motion: reduce) {
  .council-b { animation: none; opacity: 1; transform: none; }
  .home-cta-droid, .md-typeset .home-cta .home-cta-btn { animation: none; }
}

/* ===== Accueil : bouton principal mis en avant ===== */
.md-typeset .home-hero .home-go {
  font-size: 1rem; padding: .85rem 2rem; letter-spacing: .01em;
  box-shadow: 0 0 0 0 rgba(245,197,24,.7), 0 .5rem 1.4rem -.3rem rgba(245,197,24,.55);
  animation: cta-pulse 2.2s ease-out infinite; transition: transform .15s ease;
}
.md-typeset .home-hero .home-go:hover { transform: translateY(-2px) scale(1.03); }
.md-typeset .home-actions { flex-direction: column; align-items: center; gap: .6rem; }
.md-typeset .home-confetti-btn {
  cursor: pointer; background: none; border: none; padding: .2rem .4rem; font: inherit; font-size: .72rem;
  color: rgba(255,255,255,.75); text-decoration: underline dotted; text-underline-offset: 3px;
}
.md-typeset .home-confetti-btn:hover { color: #fff; }

/* ===== Accueil : suite discrète en bas de page ===== */
.home-next { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .8rem;
  margin-top: 2.5rem; padding-top: 1.2rem; border-top: 1px solid var(--md-default-fg-color--lightest); }
.md-typeset a.home-next-main { display: flex; align-items: center; gap: .7rem; text-decoration: none; color: var(--md-default-fg-color);
  padding: .4rem .9rem .4rem .4rem; border-radius: 2rem; transition: background .2s; }
.md-typeset a.home-next-main:hover { background: var(--md-code-bg-color); color: var(--md-default-fg-color); }
.home-next-main img { width: 2.6rem; height: auto; }
.home-next-main span { display: flex; flex-direction: column; font-weight: 700; font-size: .8rem; }
.home-next-main small { font: 600 .58rem var(--md-code-font-family); letter-spacing: .12em; text-transform: uppercase; color: #3d8bff; }
.home-next-main small::before { content: "● "; animation: pvBlink 1.3s steps(2) infinite; }
.home-next-main b { font-size: 1.1rem; transition: transform .2s; }
.md-typeset a.home-next-main:hover b { transform: translateX(4px); }
.md-typeset a.home-next-alt { font-size: .72rem; color: var(--md-default-fg-color--light); text-decoration: none; }
.md-typeset a.home-next-alt:hover { color: var(--md-accent-fg-color); }
@keyframes pvBlink { 50% { opacity: .2; } }
@media (prefers-reduced-motion: reduce) { .md-typeset .home-hero .home-go, .home-next-main small::before { animation: none; } }
/* Accueil : on masque « Suivant : Les pièces », remplacé par le lien vers R2 */
body:has(.home-hero) .md-footer__inner { display: none; }
.md-typeset p.home-next { justify-content: center; margin-top: 1.2rem; border-top: none; padding-top: 0; }

/* ===== Barre du haut : ambiance vaisseau ===== */
.md-header, .md-tabs {
  background:
    radial-gradient(1px 1px at 12% 30%, rgba(255,255,255,.8) 50%, transparent 51%),
    radial-gradient(1px 1px at 37% 70%, rgba(255,255,255,.6) 50%, transparent 51%),
    radial-gradient(1.5px 1.5px at 63% 25%, rgba(255,233,168,.8) 50%, transparent 51%),
    radial-gradient(1px 1px at 86% 60%, rgba(255,255,255,.7) 50%, transparent 51%),
    linear-gradient(90deg, #0b0f2a, #1a1447 60%, #0b0f2a);
  color: #fff;
}
.md-tabs { background: #0e1234; border-bottom: 1px solid rgba(245,197,24,.35); }
.md-header { box-shadow: none; }
.md-header__button.md-logo img, .md-header__button.md-logo svg { height: 1.9rem; width: auto; filter: drop-shadow(0 0 .35rem rgba(245,197,24,.45)); }
.md-header__title { font-weight: 800; }
.md-header__topic:first-child .md-ellipsis {
  font-size: .95rem; letter-spacing: .04em;
  background: linear-gradient(90deg, #ffe27a, #f5c518 40%, #ff9a3c); -webkit-background-clip: text; background-clip: text; color: transparent;
}
/* slogan à côté du titre */
.md-header__topic:first-child::after {
  content: "Un petit pas pour un servo, un grand pas pour Nathan";
  margin-left: .8rem; padding-left: .8rem; border-left: 1px solid rgba(255,255,255,.25);
  font: italic 500 .66rem/1 var(--md-text-font-family, sans-serif); color: #9fc3ff; white-space: nowrap;
}
@media (max-width: 59.9375em) { .md-header__topic:first-child::after { display: none; } }
.md-tabs__link { color: rgba(255,255,255,.72); opacity: 1; font-weight: 600; }
.md-tabs__item--active .md-tabs__link, .md-tabs__link:hover { color: #f5c518; }
.md-header .md-search__form { background: rgba(255,255,255,.1); }
.md-header .md-search__input, .md-header .md-search__input::placeholder, .md-header .md-search__icon, .md-header .md-header__button, .md-header .md-search__form kbd { color: #fff; }
.md-header__topic:first-child { display: flex; align-items: center; }
.md-header .md-search__form { background-color: rgba(255,255,255,.12) !important; }
.md-header .md-search__form:hover { background-color: rgba(255,255,255,.2) !important; }
.md-header .md-search__input { color: #fff !important; }
.md-header .md-search__input::placeholder { color: rgba(255,255,255,.75) !important; }
.md-header .md-search__form kbd, .md-header .md-search__form .md-search__options * { color: #fff !important; background: rgba(255,255,255,.12) !important; border-color: transparent !important; }
.md-header .md-search__button { background-color: rgba(255,255,255,.12) !important; color: rgba(255,255,255,.85) !important; }
.md-header .md-search__button:hover { background-color: rgba(255,255,255,.2) !important; color: #fff !important; }
.md-header .md-search__button::after { background: rgba(255,255,255,.14) !important; color: #fff !important; }
.md-header .md-search__button::before { background-color: #fff !important; } .md-header .md-search__button svg { fill: #fff !important; color: #fff !important; }
.md-header__topic:first-child .md-ellipsis { flex: none; overflow: visible; }
@media (max-width: 71.9375em) { .md-header__topic:first-child::after { display: none; } }

/* Bouton « Commencer l'aventure » : effet discret */
.md-typeset .home-hero .home-go {
  animation: none;
  box-shadow: 0 .4rem 1rem -.4rem rgba(245,197,24,.5);
  transition: transform .2s ease, box-shadow .2s ease, background-color .2s ease;
}
.md-typeset .home-hero .home-go:hover {
  transform: translateY(-2px);
  box-shadow: 0 .6rem 1.4rem -.4rem rgba(245,197,24,.7);
}

/* Bouton « Commencer l'aventure » : immobile, effet lumineux qui fait le tour du contour au survol */
@property --go-angle { syntax: "<angle>"; inherits: false; initial-value: 0deg; }
.md-typeset .home-hero .home-go { position: relative; isolation: isolate; transform: none !important; }
.md-typeset .home-hero .home-go:hover { transform: none !important; box-shadow: 0 .4rem 1rem -.4rem rgba(245,197,24,.5), 0 0 1.1rem rgba(127,212,255,.45); }
.md-typeset .home-hero .home-go::before {
  content: ""; position: absolute; inset: -3px; border-radius: inherit; padding: 3px; pointer-events: none;
  background: conic-gradient(from var(--go-angle), transparent 0 55%, rgba(127,212,255,.2) 65%, #7fd4ff 80%, #fff 88%, transparent 96%);
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor; mask-composite: exclude;
  opacity: 0; transition: opacity .25s ease;
}
.md-typeset .home-hero .home-go:hover::before, .md-typeset .home-hero .home-go:focus-visible::before { opacity: 1; animation: go-orbit 1.4s linear infinite; }
@keyframes go-orbit { to { --go-angle: 360deg; } }
@media (prefers-reduced-motion: reduce) {
  .md-typeset .home-hero .home-go:hover::before { animation: none; background: linear-gradient(90deg, #7fd4ff, #fff, #7fd4ff); }
}
.md-typeset .home-hero .home-go:hover, .md-typeset .home-hero .home-go:focus { background-color: #f5c518 !important; border-color: #f5c518 !important; color: #1a1233 !important; opacity: 1 !important; }

/* ===== En-tête des pages de mission ===== */
.mp-head {
  position: relative; display: grid; grid-template-columns: 7rem 1fr 8rem; align-items: center; gap: 1rem;
  margin: 0 0 1.8rem; padding: 1rem 1.2rem; border-radius: 1rem; overflow: hidden; color: #e6e9ff;
  background: radial-gradient(ellipse at 10% 50%, #26336e, #0b0f2a 70%);
  box-shadow: 0 .8rem 1.8rem -1rem rgba(20,10,60,.7);
}
.mp-planet { width: 7rem; height: auto; filter: drop-shadow(0 0 .8rem rgba(120,170,255,.35)); animation: mp-spin 60s linear infinite; }
@keyframes mp-spin { to { transform: rotate(360deg); } }
.mp-txt { display: flex; flex-direction: column; align-items: flex-start; gap: .35rem; }
.mp-kicker { font: 700 .6rem var(--md-code-font-family); letter-spacing: .16em; text-transform: uppercase; color: #7fd4ff; }
.md-typeset .mp-head h1 { margin: 0; color: #f5c518; font-weight: 800; font-size: 1.5rem; line-height: 1.2; }
.mp-quip { font-size: .72rem; font-style: italic; color: #cfd8ff; }
.mp-char { width: 8rem; height: auto; justify-self: end; filter: drop-shadow(0 .4rem .8rem rgba(0,0,0,.5)); }
@media (max-width: 44.9375em) {
  .mp-head { grid-template-columns: 4.5rem 1fr; }
  .mp-planet { width: 4.5rem; }
  .mp-char { display: none; }
}
@media (prefers-reduced-motion: reduce) { .mp-planet { animation: none; } }

/* ===== Schémas de l'Arsenal ===== */
svg.esp-board, svg.usb-cut { width: 100%; max-width: 46rem; height: auto; display: block; margin: 0 auto; }
.eb-chip { font: 700 16px var(--md-code-font-family); fill: #2b3240; }
.eb-small { font: 700 9px var(--md-code-font-family); fill: #ddd; }
.eb-lbl line { stroke: var(--md-default-fg-color--light); stroke-width: 1.2; stroke-dasharray: 3 3; }
.eb-lbl text, .eb-lbl-t { font: 600 13px var(--md-text-font-family, sans-serif); fill: var(--md-default-fg-color); }
.uc-title { font: 800 17px var(--md-text-font-family, sans-serif); fill: var(--md-default-fg-color); }
.uc-sheath { fill: var(--md-code-bg-color); stroke: var(--md-default-fg-color--light); stroke-width: 3; }
.uc-w { font: 800 11px var(--md-code-font-family); fill: #fff; }
.uc-dark { fill: #222; }
.uc-cap { font: 500 13px var(--md-text-font-family, sans-serif); fill: var(--md-default-fg-color--light); }
.md-typeset figure { max-width: 100%; } .md-typeset figure svg.esp-board, .md-typeset figure svg.usb-cut { width: min(46rem, 90vw); }

/* ===== Correctif : schémas et photos restent dans la colonne de contenu ===== */
.md-typeset figure svg.esp-board, .md-typeset figure svg.usb-cut { width: 100%; max-width: 100%; }
.md-typeset figure { max-width: 100%; }
.md-typeset figure img { max-width: 100%; height: auto; }

/* ===== Photo annotée ===== */
.photo-annot { display: grid; grid-template-columns: minmax(0, 12rem) 1fr; gap: 1.2rem; align-items: start; margin: 1rem 0; }
@media (max-width: 44.9375em) { .photo-annot { grid-template-columns: 1fr; } .pa-img { max-width: 15rem; margin: 0 auto; } }
.pa-img { position: relative; }
.pa-img img { display: block; width: 100%; height: auto; border-radius: .6rem; }
.pa-pin { position: absolute; transform: translate(-50%, -50%); width: 1.4rem; height: 1.4rem; border-radius: 50%;
  display: grid; place-items: center; font: 800 .7rem/1 sans-serif; color: #1a1233; background: #f5c518;
  border: 2px solid #fff; box-shadow: 0 0 0 2px rgba(0,0,0,.35); }
.pa-legend { min-width: 0; }
.md-typeset .pa-legend table { font-size: .72rem; }

/* ===== Deux figures côte à côte ===== */
.grid-2 { display: grid; grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr)); gap: 1rem; align-items: start; }
.md-typeset .grid-2 figure { margin: 0; }

/* ===== Équipement de mission ===== */
.kit { display: grid; grid-template-columns: repeat(auto-fill, minmax(13rem, 1fr)); gap: .8rem; margin: .6rem 0 1.6rem; }
.kit-card { padding: .7rem .9rem; border-radius: .7rem; background: var(--md-code-bg-color); border-left: 4px solid var(--c, #9fc3ff); font-size: .75rem; }
.kit-card ul { margin: .3rem 0 0 !important; padding-left: 1rem; }
.md-typeset .kit-card ul li { margin: .1rem 0; }
.md-typeset .kit-card p { margin: .3rem 0 0; }
.kit-t { display: block; font-weight: 800; font-size: .72rem; letter-spacing: .03em; }
.kit-mat { --c: #f5c518; } .kit-log { --c: #3d8bff; } .kit-net { --c: #26c6da; }
.kit-pre { --c: #b061ff; } .kit-out { --c: #f07a13; } .kit-dur { --c: #1f8a3b; }

/* ===== Test de la LED ===== */
.led-test { display: grid; grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr)); gap: 1rem; align-items: start; margin: .8rem 0; }
.md-typeset .led-test figure { margin: 0; }
svg.lt-svg { width: 100%; height: auto; display: block; }
.lt-line path, .lt-leg { fill: none; stroke: #9aa3b2; stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; }
.lt-node { fill: var(--md-default-bg-color); stroke: var(--md-default-fg-color); stroke-width: 3; }
.lt-res { fill: #d9b98a; stroke: #8a6a3a; stroke-width: 2; }
.lt-band rect:nth-child(1) { fill: #f07a13; } .lt-band rect:nth-child(2) { fill: #f07a13; } .lt-band rect:nth-child(3) { fill: #6b3a1e; }
.lt-led { fill: #ff4d4d; stroke: #b3261e; stroke-width: 2; }
.lt-bar { stroke: #b3261e; stroke-width: 4; }
.lt-ray { fill: none; stroke: #f5c518; stroke-width: 2; stroke-linecap: round; }
.lt-bulb { fill: rgba(255,77,77,.85); stroke: #b3261e; stroke-width: 2; }
.lt-flat { stroke: #b3261e; stroke-width: 4; }
.lt-block { fill: #1f8a3b; opacity: .85; }
.lt-screw circle { fill: #cfd6de; stroke: #6b7488; stroke-width: 2; }
.lt-sock rect { fill: #1b1b1b; stroke: #555; stroke-width: 2; }
.lt-name text { font: 700 13px var(--md-code-font-family); fill: var(--md-default-fg-color); }
.lt-lbl { font: 700 14px var(--md-text-font-family, sans-serif); fill: var(--md-default-fg-color); }
.lt-sm { font: 500 11.5px var(--md-text-font-family, sans-serif); fill: var(--md-default-fg-color--light); }

/* ===== Plaque d'essai ===== */
svg.bb-svg { width: 100%; max-width: 30rem; height: auto; display: block; margin: 0 auto; }
.bb-body { fill: #f3f1ea; stroke: #cfcabb; stroke-width: 2; }
.bb-gap { fill: #dcd7c8; }
.bb-hole { fill: #3b3b3b; }
.bb-plus { stroke: #d01012; stroke-width: 2; } .bb-minus { stroke: #3d4fd0; stroke-width: 2; }
.bb-rl { font: 800 14px sans-serif; fill: #555; }
.bb-lab { font: 600 10px var(--md-code-font-family); fill: #777; }
.bb-hl { opacity: .45; }
.bb-wire { fill: none; stroke-width: 5; stroke-linecap: round; }
.bb-leg { fill: none; stroke: #9aa3b2; stroke-width: 3; stroke-linecap: round; }
.bb-res { fill: #d9b98a; stroke: #8a6a3a; stroke-width: 1.5; }
.bb-ledtop { fill: rgba(255,77,77,.9); stroke: #b3261e; stroke-width: 2; }
.bb-flat { stroke: #b3261e; stroke-width: 3; }
.bb-pin { fill: #c9a44c; stroke: #6b5a2a; stroke-width: 1; }
.bb-tag { fill: #1b2a4a; } .bb-tagt { font: 800 12px var(--md-code-font-family); fill: #fff; }
.bb-note { font: 600 11px var(--md-text-font-family, sans-serif); fill: #333; }
.bb-arrow { stroke: #333; stroke-width: 1.2; }
.rc-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr)); gap: .6rem 1rem; }
.md-typeset .rc-fig { margin: 0; }
svg.rc-svg { width: 100%; height: auto; display: block; }
.rc-body { fill: #d9b98a; stroke: #8a6a3a; stroke-width: 2; }
.rc-leg { stroke: #9aa3b2; stroke-width: 4; }
.rc-n { font: 600 11px var(--md-text-font-family, sans-serif); fill: var(--md-default-fg-color--light); }
.bb-note { paint-order: stroke; stroke: #f3f1ea; stroke-width: 5px; stroke-linejoin: round; font-weight: 800; }

/* ===== Photos et vidéos de l'atelier ===== */
.media-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(11rem, 1fr)); gap: 1rem; align-items: start; margin: 1rem 0; }
.md-typeset .media-row figure, .md-typeset .gal figure { margin: 0; max-width: 100%; }
.md-typeset figure.ph img { display: block; width: 100%; height: auto; border-radius: .6rem; }
.md-typeset figure.vid video { display: block; width: 100%; height: auto; border-radius: .6rem; background: #000; }
.md-typeset figure.vid--portrait video { max-height: 26rem; object-fit: cover; aspect-ratio: 9 / 16; }
.md-typeset figure.vid--paysage video { aspect-ratio: 16 / 9; }
.md-typeset .media-row figcaption, .md-typeset .gal figcaption { font-size: .68rem; margin-top: .3rem; }
.gal { display: grid; grid-template-columns: repeat(auto-fill, minmax(10rem, 1fr)); gap: .8rem; margin: 1rem 0 1.5rem; align-items: start; }
.md-typeset .gal figure.ph img { aspect-ratio: 3 / 4; object-fit: cover; }
.md-typeset .gal figure.vid--paysage { grid-column: span 2; }
@media (prefers-reduced-motion: reduce) { .md-typeset figure.vid video { animation: none; } }

/* ===== Holocrons : solutions des défis bonus, sous code d'accès ===== */
.md-typeset .holocron {
  position: relative; margin: 1.2em 0; padding: .9rem 1.1rem 1rem;
  border-radius: .8rem; border: 1px solid rgba(245, 197, 24, .55);
  background:
    radial-gradient(ellipse at 100% 0%, rgba(245, 197, 24, .16), transparent 60%),
    linear-gradient(160deg, #11152e, #0b0d1e);
  color: #e8ecff; box-shadow: 0 .6rem 1.4rem -.8rem rgba(10, 10, 40, .7);
}
.md-typeset .holocron:not([data-ct]) { display: none; }
.md-typeset .holocron .hc-head { display: flex; align-items: center; gap: .75rem; }
.md-typeset .holocron .hc-ico {
  flex: none; display: grid; place-items: center; width: 2.4rem; height: 2.4rem;
  border-radius: .6rem; font-size: 1.2rem;
  background: linear-gradient(135deg, #f5c518, #b8860b);
  box-shadow: 0 0 .9rem rgba(245, 197, 24, .55);
}
.md-typeset .holocron .hc-head > div { flex: 1; min-width: 0; }
.md-typeset .holocron .hc-kicker {
  display: block; font-size: .62rem; letter-spacing: .14em; text-transform: uppercase; color: #f5c518;
}
.md-typeset .holocron .hc-titre { color: #fff; font-size: .82rem; }
.md-typeset .holocron .hc-txt { margin: .7em 0 .6em; font-size: .74rem; color: #c7cdf0; }
.md-typeset .holocron .hc-form { display: flex; flex-wrap: wrap; gap: .5rem; }
.md-typeset .holocron .hc-input {
  flex: 1 1 10rem; min-width: 0; padding: .45rem .7rem; border-radius: .45rem;
  border: 1px solid rgba(245, 197, 24, .45); background: rgba(255, 255, 255, .06);
  color: #fff; font: 600 .8rem/1.2 var(--md-code-font-family, monospace); letter-spacing: .12em; text-transform: uppercase;
}
.md-typeset .holocron .hc-input::placeholder { color: #8a90b8; letter-spacing: .04em; text-transform: none; font-weight: 400; }
.md-typeset .holocron .hc-input:focus { outline: 2px solid #f5c518; outline-offset: 1px; }
.md-typeset .holocron .hc-btn, .md-typeset .holocron .hc-reseal, .md-typeset .holocron .hc-copy {
  cursor: pointer; border: 0; border-radius: .45rem; font-weight: 700;
}
.md-typeset .holocron .hc-btn { padding: .45rem .95rem; font-size: .75rem; background: #f5c518; color: #1a1400; }
.md-typeset .holocron .hc-btn:hover { background: #ffd84a; }
.md-typeset .holocron .hc-msg { min-height: 1.1em; margin: .5em 0 0; font-size: .72rem; color: #ffb4a8; }
.md-typeset .holocron .hc-reseal {
  flex: none; padding: .3rem .6rem; font-size: .62rem; background: rgba(255, 255, 255, .08); color: #c7cdf0;
}
.md-typeset .holocron .hc-reseal:hover { background: rgba(255, 255, 255, .16); }
.md-typeset .holocron .hc-body { margin-top: .6rem; font-size: .76rem; }
.md-typeset .holocron .hc-body p { color: #dfe4ff; }
.md-typeset .holocron .hc-body code { color: #ffe9a8; background: rgba(255, 255, 255, .08); }
.md-typeset .holocron .hc-body .highlight { position: relative; }
.md-typeset .holocron .hc-body .highlight pre { margin: .4em 0 0; }
.md-typeset .holocron .hc-body .highlight pre > code {
  background: var(--md-code-bg-color); color: var(--md-code-fg-color);
}
.md-typeset .holocron .hc-copy {
  position: absolute; top: .45rem; right: .45rem; z-index: 1; padding: .2rem .55rem; font-size: .6rem;
  background: rgba(10, 13, 30, .75); color: #f5c518; border: 1px solid rgba(245, 197, 24, .5);
}
.md-typeset .holocron.is-open { border-color: rgba(120, 220, 160, .6); }
.md-typeset .holocron.is-open .hc-ico { background: linear-gradient(135deg, #7be0a0, #1f8a3b); box-shadow: 0 0 .9rem rgba(120, 220, 160, .55); }
.hc-non { animation: hc-non .45s; }
@keyframes hc-non { 20%, 60% { transform: translateX(-6px); } 40%, 80% { transform: translateX(6px); } }
.hc-oui .hc-body { animation: hc-oui .6s ease-out; }
@keyframes hc-oui { from { opacity: 0; transform: translateY(-6px); filter: blur(3px); } to { opacity: 1; transform: none; filter: none; } }
@media (prefers-reduced-motion: reduce) { .hc-non, .hc-oui .hc-body { animation: none; } }

/* ===== L'Académie : fiches de notions ===== */
.md-typeset .aca-head {
  margin: 0 0 1.6rem; padding: 1.2rem 1.4rem; border-radius: .9rem; color: #fff;
  background: radial-gradient(ellipse at 90% 0%, rgba(245, 197, 24, .22), transparent 55%),
              linear-gradient(150deg, #13204a, #0b0f2a 70%);
}
.md-typeset .aca-head h1 { margin: .2rem 0 .5rem; color: #fff; font-weight: 700; }
.md-typeset .aca-kicker { font-size: .65rem; letter-spacing: .14em; text-transform: uppercase; color: #f5c518; }
.md-typeset .aca-une { margin: 0; color: #d9def7; }
.md-typeset .aca-une b, .md-typeset .aca-une code { color: #fff; }
.md-typeset .aca-une code { background: rgba(255,255,255,.1); }
.md-typeset .aca-formule {
  margin: 1em auto; padding: .7rem 1rem; max-width: 34rem; text-align: center; border-radius: .6rem;
  font: 600 .85rem/1.5 var(--md-code-font-family, monospace); background: var(--md-code-bg-color);
}
.md-typeset .aca-svg { display: block; width: 100%; max-width: 560px; height: auto; margin: 0 auto; }
.md-typeset .aca-svg--small { max-width: 300px; }
.aca-svg .aca-t { font-size: 13px; fill: currentColor; }
.aca-svg .aca-strong { font-weight: 700; }
.aca-svg .aca-big { font-size: 40px; font-weight: 700; fill: currentColor; }
.aca-svg .aca-line { fill: none; stroke: currentColor; stroke-width: 2; }
.aca-svg .aca-thick { stroke-width: 4; }
.aca-svg .aca-dim { fill: none; stroke: #f07a13; stroke-width: 2; }
.aca-svg .aca-water { fill: #0a5fbf; opacity: .55; }
.aca-svg .aca-pipe { fill: none; stroke: #0a5fbf; stroke-width: 8; stroke-linejoin: round; opacity: .7; }
.aca-svg .aca-arrow { fill: none; stroke: #fff; stroke-width: 2.5; }
.aca-svg .aca-tri { fill: rgba(245, 197, 24, .18); stroke: #f5c518; stroke-width: 3; stroke-linejoin: round; }
.aca-svg .aca-led { fill: rgba(208, 16, 18, .75); stroke: currentColor; stroke-width: 2; }
.aca-svg .aca-flat { stroke: currentColor; stroke-width: 4; }
.aca-svg .aca-leg { stroke: #9aa0a6; stroke-width: 4; stroke-linecap: round; }
.aca-svg .aca-sym { fill: rgba(245, 197, 24, .5); stroke: currentColor; stroke-width: 2; stroke-linejoin: round; }
.aca-svg .aca-wave { fill: none; stroke: #f07a13; stroke-width: 2.5; stroke-linejoin: round; }

/* Cartes de l'index */
.md-typeset .aca-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(12.5rem, 1fr)); gap: .8rem; margin: 1rem 0 1.6rem; }
.md-typeset .aca-grid > p { display: contents; }
.md-typeset a.aca-card {
  display: flex; flex-direction: column; gap: .15rem; padding: .9rem 1rem; border-radius: .8rem;
  border: 1px solid var(--md-default-fg-color--lightest); background: var(--md-default-bg-color);
  color: var(--md-default-fg-color); transition: transform .15s, box-shadow .15s, border-color .15s;
}
.md-typeset a.aca-card:hover { transform: translateY(-3px); border-color: #f5c518; box-shadow: 0 .6rem 1.2rem -.7rem rgba(0,0,0,.35); color: var(--md-default-fg-color); }
.md-typeset .aca-card .aca-ico { font-size: 1.5rem; }
.md-typeset .aca-card strong { font-size: .85rem; }
.md-typeset .aca-card span:last-child { font-size: .7rem; color: var(--md-default-fg-color--light); }

/* Renvois vers l'Académie dans les pages */
.md-typeset .aca-notions, .md-typeset .aca-ref {
  padding: .5rem .8rem; border-radius: .6rem; font-size: .72rem; line-height: 1.9;
  border-left: 3px solid #f5c518; background: rgba(245, 197, 24, .09);
}
.md-typeset .aca-notions { margin: 1rem 0 1.4rem; }
.md-typeset .aca-ref { margin: .9rem 0; }
.md-typeset .aca-notions a, .md-typeset .aca-ref a { font-weight: 600; white-space: nowrap; }
@media (prefers-reduced-motion: reduce) { .md-typeset a.aca-card { transition: none; } }
.md-typeset a.aca-card, .md-typeset a.aca-card:hover { text-decoration: none; }
.aca-svg .aca-box { fill: rgba(10, 95, 191, .12); stroke: currentColor; stroke-width: 2; }
.aca-svg .aca-res { fill: #e9d3a8; stroke: #8a6a2f; stroke-width: 2; }
.md-typeset figure:has(.aca-svg) { width: 100%; }
.md-typeset .aca-svg { width: 100%; max-width: 680px; }
.md-typeset .aca-svg--small { max-width: 300px; }

/* ===== Acronymes (infobulles) et glossaire ===== */
.md-typeset abbr {
  text-decoration: none; cursor: help;
  border-bottom: 1px dotted currentColor;
}
.md-typeset abbr:focus { outline: 2px solid #f5c518; outline-offset: 1px; border-radius: 2px; }
.md-typeset .glo-lettres { display: flex; flex-wrap: wrap; gap: .35rem; margin: 1rem 0; }
.md-typeset .glo-lettres a {
  display: grid; place-items: center; min-width: 2rem; height: 2rem; padding: 0 .4rem; border-radius: .45rem;
  font-weight: 700; text-decoration: none; background: rgba(245, 197, 24, .14); border: 1px solid rgba(245, 197, 24, .5);
}
.md-typeset .glo-lettres a:hover { background: #f5c518; color: #1a1400; }
.md-typeset .glo-legende { display: flex; flex-wrap: wrap; gap: .4rem; }
.md-typeset .glo-cat {
  display: inline-block; padding: .05rem .5rem; border-radius: 1rem; font-size: .62rem; font-weight: 600;
  vertical-align: middle; white-space: nowrap;
}
.glo-cat--elec  { background: rgba(240, 122, 19, .18); color: #b85600; }
.glo-cat--compo { background: rgba(208, 16, 18, .14); color: #b00e10; }
.glo-cat--carte { background: rgba(10, 95, 191, .15); color: #0a5fbf; }
.glo-cat--code  { background: rgba(122, 63, 176, .16); color: #6a32a0; }
.glo-cat--outil { background: rgba(31, 138, 59, .16); color: #1a7a33; }
[data-md-color-scheme="slate"] .glo-cat--elec  { color: #ffb36b; }
[data-md-color-scheme="slate"] .glo-cat--compo { color: #ff8a8b; }
[data-md-color-scheme="slate"] .glo-cat--carte { color: #8cc0ff; }
[data-md-color-scheme="slate"] .glo-cat--code  { color: #c9a3f0; }
[data-md-color-scheme="slate"] .glo-cat--outil { color: #7fdc98; }
.md-typeset dl.glo { margin: .5rem 0 1.5rem; }
.md-typeset dl.glo dt {
  margin-top: 1rem; padding-top: .9rem; border-top: 1px solid var(--md-default-fg-color--lightest);
  scroll-margin-top: 4rem;
}
.md-typeset dl.glo dt:first-child { border-top: 0; padding-top: 0; }
.md-typeset dl.glo .glo-terme { font-size: .9rem; font-weight: 700; }
.md-typeset dl.glo dt:target .glo-terme { background: rgba(245, 197, 24, .35); border-radius: .3rem; padding: 0 .3rem; }
.md-typeset dl.glo dd { margin: .3rem 0 0 0; }
.md-typeset dl.glo dd > p { margin: .3rem 0; }
.md-typeset .glo-voir { font-size: .72rem; }

/* Planète dessinée en CSS (mission 1 bis, en attendant une illustration) */
.mp-planet--css {
  display: block; aspect-ratio: 1; border-radius: 50%;
  background:
    radial-gradient(circle at 32% 30%, rgba(255,255,255,.55), transparent 28%),
    repeating-linear-gradient(165deg, rgba(255,255,255,.10) 0 6px, transparent 6px 14px),
    radial-gradient(circle at 40% 40%, #5fd3e6, #1b7fa6 55%, #0b3552 100%);
  box-shadow: inset -10px -12px 24px rgba(0,0,0,.45), 0 0 1.2rem rgba(95,211,230,.45);
}

/* Aperçus de l'holo-écran */
.md-typeset .ecran-row { grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr)); }
.md-typeset .ecran-row figure.ph img { border-radius: .4rem; box-shadow: 0 0 0 1px rgba(127, 216, 255, .25); }
.md-typeset .ecran-note { font-size: .7rem; font-style: italic; opacity: .75; margin-top: -.4rem; }

/* Tableaux et schémas à l'intérieur d'un holocron (carte toujours sombre) */
.md-typeset .holocron .hc-body table:not([class]) { background: rgba(255, 255, 255, .04); border: 1px solid rgba(255, 255, 255, .14); font-size: .72rem; display: table; width: 100%; }
.md-typeset .holocron .hc-body table:not([class]) th { background: rgba(255, 255, 255, .08); color: #fff; }
.md-typeset .holocron .hc-body table:not([class]) td { color: #dfe4ff; border-top: 1px solid rgba(255, 255, 255, .1); }
.md-typeset .holocron .hc-body figcaption { color: #c7cdf0; }
@media (max-width: 600px) { .md-typeset .holocron .hc-body table:not([class]) { display: block; overflow-x: auto; } }

/* ===== Univers : la Force ou le côté obscur ===== */
html:not(.univers-obscur) .v-obscur, html.univers-obscur .v-force { display: none !important; }

.univers-switch {
  display: inline-flex; flex: none; gap: 2px; margin: 0 .4rem 0 .8rem; padding: 2px; border-radius: 2rem;
  background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.3);
}
.univers-q {
  align-self: center; padding: 0 .5rem 0 .6rem; white-space: nowrap;
  font: italic 600 .6rem/1 var(--md-text-font-family, sans-serif); color: rgba(255,255,255,.75);
}
@media screen and (max-width: 76.1875em) { .univers-q { display: none; } }
.univers-switch button {
  cursor: pointer; border: 0; border-radius: 2rem; padding: .28rem .7rem; color: rgba(255,255,255,.8); background: transparent;
  font: 700 .62rem/1 var(--md-text-font-family, sans-serif); white-space: nowrap; transition: background .2s ease, box-shadow .2s ease;
}
.univers-switch button:hover { color: #fff; background: rgba(255,255,255,.12); }
.univers-switch button:focus-visible { outline: 2px solid #fff; outline-offset: 1px; }
.univers-switch button[data-univers-set="force"][aria-pressed="true"] { background: #5fd6ff; color: #07111f; box-shadow: 0 0 .8rem rgba(95,214,255,.6); }
.univers-switch button[data-univers-set="obscur"][aria-pressed="true"] { background: #e0453a; color: #fff; box-shadow: 0 0 .8rem rgba(224,69,58,.7); }
@media screen and (max-width: 63.9375em) { .univers-txt { display: none; } .univers-switch button { padding: .28rem .45rem; font-size: .75rem; } }
/* le slogan laisse la place aux boutons tant que l'écran n'est pas très large */
/* le slogan cède sa place aux boutons de camp */
.md-header__topic:first-child::after { display: none !important; }
.univers-switch button [aria-hidden] { filter: drop-shadow(0 0 2px rgba(255,255,255,.75)); }
@media screen and (max-width: 44.9375em) { .univers-switch { margin: 0; padding: 1px; gap: 0; } .univers-switch button { padding: .2rem .22rem; font-size: .7rem; } }

/* Couleurs du côté obscur : rouge Sith à la place de l'indigo */
html.univers-obscur [data-md-color-primary] {
  --md-primary-fg-color: #8a1015; --md-primary-fg-color--light: #b3262b; --md-primary-fg-color--dark: #5a070b;
  --md-accent-fg-color: #e3262e; --md-accent-fg-color--transparent: rgba(227,38,46,.1);
  --md-typeset-a-color: #b3161d;
}
html.univers-obscur [data-md-color-scheme="slate"][data-md-color-primary] {
  --md-primary-fg-color: #160608; --md-primary-fg-color--dark: #0d0304;
  --md-typeset-a-color: #ff7b7f;
}
html.univers-obscur .md-header {
  background:
    radial-gradient(1px 1px at 12% 30%, rgba(255,255,255,.8) 50%, transparent 51%),
    radial-gradient(1px 1px at 37% 70%, rgba(255,255,255,.6) 50%, transparent 51%),
    radial-gradient(1.5px 1.5px at 63% 25%, rgba(255,200,200,.8) 50%, transparent 51%),
    radial-gradient(1px 1px at 86% 60%, rgba(255,255,255,.7) 50%, transparent 51%),
    linear-gradient(90deg, #14060a, #4a0d14 60%, #14060a);
}
html.univers-obscur .md-tabs { background: #1c070b; border-bottom-color: rgba(227,38,46,.55); }
html.univers-obscur .mission-hero {
  background:
    linear-gradient(180deg, rgba(40,4,8,.72), rgba(15,2,4,.88)),
    url("../images/mission/fond-briefing.webp") center / cover no-repeat, #1a070b;
}
html.univers-obscur .mission-bubble { background: rgba(255, 60, 60, .1); border-color: rgba(255, 120, 120, .45); box-shadow: inset 0 0 1.5rem rgba(255, 60, 60, .15); }
html.univers-obscur .mission-bubble::before { background: #3a0c12; border-color: rgba(255, 120, 120, .45); }
html.univers-obscur .md-typeset .mission-tag { color: #ff9b9b; }
html.univers-obscur img.mission-droid { filter: drop-shadow(0 0 1.2rem rgba(255,80,80,.5)); }
html.univers-obscur .mp-head { background: radial-gradient(ellipse at 10% 50%, #5c1820, #14060a 70%); }
html.univers-obscur .mp-kicker, html.univers-obscur .mission-progress-label { color: #ff8a8a; }
html.univers-obscur .mission-route { stroke: #ff8a8a; }
html.univers-obscur .mission-planet .pb { stroke: #ff8a8a; }
html.univers-obscur .mission-planet .pl { fill: #ffd6d6; }
html.univers-obscur .r2-wave i { background: #ff6b6b; }
html.univers-obscur .mission-hero.is-talking img.mission-droid { filter: drop-shadow(0 0 1.6rem rgba(255, 70, 70, .85)); }
html.univers-obscur .mission-rank--2 { background: #6b1a8a; }
html.univers-obscur .mission-rank--4 { background: #111; box-shadow: inset 0 0 0 1px #e3262e; }

/* Choisir son camp sur la page des missions */
.univers-choix { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; margin: 0 0 1.2rem; }
.univers-choix-q { font: 700 .6rem var(--md-code-font-family); letter-spacing: .14em; text-transform: uppercase; opacity: .8; margin-right: .2rem; }
.univers-choix button {
  cursor: pointer; padding: .35rem .8rem; border-radius: 2rem; font: 700 .7rem var(--md-text-font-family, sans-serif);
  color: #e6e9ff; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.3);
}
.univers-choix button[aria-pressed="true"][data-univers-set="force"] { background: #5fd6ff; border-color: #5fd6ff; color: #07111f; box-shadow: 0 0 .8rem rgba(95,214,255,.6); }
.univers-choix button[aria-pressed="true"][data-univers-set="obscur"] { background: #e0453a; border-color: #e0453a; color: #fff; box-shadow: 0 0 .8rem rgba(224,69,58,.7); }

/* Briefing en tête de chaque mission */
.mp-brief {
  margin: -.6rem 0 1.4rem; padding: .8rem 1rem .8rem 1.1rem; border-radius: .8rem;
  border-left: .3rem solid #7fd4ff; background: rgba(127,212,255,.08); font-size: .75rem;
}
.mp-brief p { margin: .2rem 0; }
.mp-brief .mp-brief-t { display: block; font: 700 .58rem var(--md-code-font-family); letter-spacing: .14em; text-transform: uppercase; color: #3a8fc4; }
.mp-brief.v-obscur { border-left-color: #e3262e; background: rgba(227,38,46,.08); }
.mp-brief.v-obscur .mp-brief-t { color: #c4262d; }
[data-md-color-scheme="slate"] .mp-brief .mp-brief-t { color: #7fd4ff; }
[data-md-color-scheme="slate"] .mp-brief.v-obscur .mp-brief-t { color: #ff8a8a; }
.mp-brief em.mp-brief-sig { display: block; text-align: right; font-size: .65rem; opacity: .75; }

/* Kaminoled, l'escale bonus de la carte */
.mission-planet--bonus .pb { stroke-dasharray: 3 3; }
.mission-bonus-route { fill: none; stroke: #5fd3e6; stroke-width: 2.5; stroke-dasharray: 2 8; stroke-linecap: round; opacity: .85; }
.mission-planet .pt { fill: #5fd3e6; font: 700 12px/1 var(--md-text-font-family, sans-serif); letter-spacing: .08em; }
.md-typeset .mp-brief a.mp-brief-ecoute { font-size: .65rem; font-weight: 700; text-decoration: none; }
.r2-duree { font: 600 .6rem var(--md-code-font-family); opacity: .6; }
@media screen and (max-width: 44.9375em) {
  .md-header__topic:first-child .md-ellipsis { font-size: .8rem; letter-spacing: 0; }
  .univers-choix { justify-content: center; gap: .4rem; }
  .univers-choix-q { flex-basis: 100%; text-align: center; margin: 0; }
  .univers-choix button { font-size: .62rem; padding: .3rem .6rem; }
}
@media screen and (max-width: 24em) { .md-header__topic:first-child .md-ellipsis { font-size: .7rem; } }
@media screen and (max-width: 21em) { .md-header__topic:first-child .md-ellipsis { font-size: .56rem; } .univers-switch button { font-size: .58rem; padding: .2rem .15rem; } }
html.univers-obscur .md-typeset a.mission-card:not([data-status="done"]) { border-left-color: #e3262e; }
html.univers-obscur .mission-art { background: radial-gradient(ellipse at 50% 60%, #5c1820 0%, #14060a 70%); }
