/* L'Oracle du chemin · une pièce à part, à la lueur d'une bougie.
   Forêt de nuit, braise et flamme ; Fraunces, Barlow Condensed, Caveat (charte Je marche donc je suis). */

.jmdjs-tirage {
	--ja-nuit: #0B0D09;
	--ja-foret: #15211A;
	--ja-mousse: #22332A;
	--ja-lichen: #3A4F42;
	--ja-braise: #E8742A;
	--ja-flamme: #F6A54A;
	--ja-ambre: #FFE2B0;
	--ja-parchemin: #EFE6D4;
	--ja-cendre: #AEB8AA;
	--ja-serif: "Fraunces", Georgia, "Times New Roman", serif;
	--ja-cond: "Barlow Condensed", "Arial Narrow", Arial, sans-serif;
	--ja-main: "Caveat", "Segoe Script", cursive;
	--ja-l: 88px;
	--ja-h: 128px;
	margin: 0;
	color: var(--ja-parchemin);
	font-family: var(--ja-serif);
}
.jmdjs-tirage *, .jmdjs-tirage *::before, .jmdjs-tirage *::after { box-sizing: border-box; }

/* 1.3.0 · La pièce garde son propre dessin.
   Le style global des boutons du site (Elementor : terracotta, capsule, capitales) s'appliquait à tous les boutons de l'Oracle :
   manières en pilules orange, cartes du paquet rognées en ovales, couleurs de bougie toutes pareilles.
   Ici, on le neutralise ; plus bas, chaque règle de l'Oracle est précédée de « html body .jmdjs-tirage »
   pour passer devant les styles du thème, au repos comme au survol. */
html body .jmdjs-tirage button { background-color: transparent; border-radius: 0; font-family: inherit; font-weight: inherit; text-transform: none; letter-spacing: normal; color: inherit; }
html .jmdjs-tirage .ja-atelier button:where(:hover) { background-color: transparent; }

html body .jmdjs-tirage .ja-atelier {
	position: relative;
	overflow: hidden;
	min-height: 680px;
	border-radius: 18px;
	background:
		radial-gradient(ellipse 70% 55% at 50% 36%, rgba(232, 116, 42, .14) 0%, rgba(21, 33, 26, 0) 70%),
		radial-gradient(ellipse at 50% 120%, #1A1511 0%, var(--ja-nuit) 70%),
		var(--ja-nuit);
	box-shadow: inset 0 0 120px rgba(0, 0, 0, .65);
	isolation: isolate;
	container-type: inline-size;
	container-name: atelier;
}
/* Le fond : une photo du coffret, dans la pénombre chaude, qui change à chaque pièce */
html body .jmdjs-tirage .ja-fond {
	position: absolute;
	inset: -4%;
	background-size: cover;
	background-position: center;
	opacity: 0;
	transition: opacity 2.4s ease;
	filter: saturate(.75) brightness(.55);
	z-index: 0;
}
html body .jmdjs-tirage .ja-fond--visible { opacity: .34; }
html body .jmdjs-tirage .ja-fond::after {
	content: "";
	position: absolute;
	inset: 0;
	background:
		linear-gradient(180deg, rgba(11, 13, 9, .55) 0%, rgba(11, 13, 9, .25) 35%, rgba(11, 13, 9, .78) 100%),
		radial-gradient(ellipse 60% 50% at 50% 30%, rgba(232, 116, 42, .18), transparent 70%);
}
html body .jmdjs-tirage .ja-atelier--table .ja-fond--visible { opacity: .18; }
/* Pause des mouvements */
html body .jmdjs-tirage .ja-pause {
	position: absolute;
	bottom: 12px;
	right: 12px;
	z-index: 5;
	min-height: 32px;
	padding: 6px 12px;
	font-family: var(--ja-cond);
	font-size: 12px;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--ja-cendre);
	background: rgba(11, 13, 9, .55);
	border: 1px solid rgba(174, 184, 170, .3);
	border-radius: 999px;
	cursor: pointer;
}
html body .jmdjs-tirage .ja-pause:hover, html body .jmdjs-tirage .ja-pause:focus-visible { color: var(--ja-parchemin); border-color: var(--ja-flamme); }
html body .jmdjs-tirage .ja-atelier--pause .ja-bougie__flamme, html body .jmdjs-tirage .ja-atelier--pause .ja-bougie__halo, html body .jmdjs-tirage .ja-atelier--pause::before, html body .jmdjs-tirage .ja-atelier--pause .ja-souffle { animation: none !important; transition: none !important; }
/* Brume qui passe, très lentement */
html body .jmdjs-tirage .ja-atelier::before {
	content: "";
	position: absolute;
	inset: -20%;
	background:
		radial-gradient(ellipse 40% 18% at 30% 70%, rgba(174, 184, 170, .07), transparent 70%),
		radial-gradient(ellipse 35% 16% at 72% 62%, rgba(174, 184, 170, .06), transparent 70%);
	animation: ja-brume 38s ease-in-out infinite alternate;
	pointer-events: none;
	z-index: 0;
}
html body .jmdjs-tirage .ja-lueur {
	position: absolute;
	inset: 0;
	background: radial-gradient(circle at 50% 22%, rgba(232, 116, 42, .24), rgba(232, 116, 42, .07) 34%, transparent 62%);
	opacity: 0;
	transition: opacity 2.2s ease;
	pointer-events: none;
	z-index: 0;
}
html body .jmdjs-tirage .ja-atelier--allume .ja-lueur { opacity: 1; }
html body .jmdjs-tirage .ja-braises { position: absolute; inset: 0; width: 100%; height: 100%; pointer-events: none; z-index: 1; }
html body .jmdjs-tirage .ja-scene { position: relative; z-index: 2; padding: clamp(32px, 6vw, 72px) clamp(16px, 4vw, 48px); padding: clamp(32px, 6cqi, 72px) clamp(16px, 4cqi, 48px); }

html body .jmdjs-tirage .ja-plan {
	max-width: 980px;
	margin: 0 auto;
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	gap: 14px;
	animation: ja-apparaitre .9s ease both;
}
html body .jmdjs-tirage .ja-plan:focus, html body .jmdjs-tirage .ja-titre:focus, html body .jmdjs-tirage .ja-surtitre:focus, html body .jmdjs-tirage .ja-souffle__mot:focus { outline: none; }

html body .jmdjs-tirage .ja-surtitre {
	font-family: var(--ja-cond);
	font-size: 13px;
	letter-spacing: .24em;
	text-transform: uppercase;
	color: var(--ja-flamme);
	margin: 0;
}
html body .jmdjs-tirage .ja-titre {
	font-family: var(--ja-serif);
	font-weight: 300;
	font-style: italic;
	font-size: clamp(30px, 4.4vw, 46px);
	line-height: 1.12;
	letter-spacing: -.01em;
	color: var(--ja-parchemin);
	margin: 0;
	text-wrap: balance;
}
html body .jmdjs-tirage .ja-texte { font-size: 17px; line-height: 1.65; color: var(--ja-cendre); max-width: 34em; margin: 0; }
html body .jmdjs-tirage .ja-texte--discret { font-size: 15px; font-style: italic; }

/* Boutons */
html body .jmdjs-tirage .ja-bouton {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 44px;
	padding: 10px 22px;
	border: 1px solid rgba(239, 230, 212, .3);
	border-radius: 999px;
	background: transparent;
	color: var(--ja-parchemin);
	font-family: var(--ja-cond);
	font-size: 15px;
	letter-spacing: .14em;
	text-transform: uppercase;
	text-decoration: none;
	cursor: pointer;
	transition: border-color .3s, color .3s, box-shadow .3s, background .3s;
}
html body .jmdjs-tirage .ja-bouton:hover, html body .jmdjs-tirage .ja-bouton:focus-visible { border-color: var(--ja-braise); color: var(--ja-flamme); }
html body .jmdjs-tirage .ja-bouton:focus-visible, html body .jmdjs-tirage .ja-photo:focus-visible, html body .jmdjs-tirage .ja-objet:focus-visible, html body .jmdjs-tirage .ja-maniere:focus-visible, html body .jmdjs-tirage .ja-vignette:focus-visible, html body .jmdjs-tirage .ja-teinte:focus-visible, html body .jmdjs-tirage .ja-lien:focus-visible, html body .jmdjs-tirage .ja-champ:focus-visible { outline: 2px solid var(--ja-flamme); outline-offset: 3px; }
html body .jmdjs-tirage .ja-bouton--braise {
	background: linear-gradient(180deg, #F2903F, #D45E1E);
	border-color: transparent;
	color: #1C0E05;
	box-shadow: 0 0 28px rgba(232, 116, 42, .35);
}
html body .jmdjs-tirage .ja-bouton--braise:hover, html body .jmdjs-tirage .ja-bouton--braise:focus-visible { color: #1C0E05; background: linear-gradient(180deg, #F7A257, #E06A26); box-shadow: 0 0 40px rgba(246, 165, 74, .5); border-color: transparent; }
html body .jmdjs-tirage .ja-bouton--discret { border-color: transparent; color: var(--ja-cendre); text-decoration: underline; text-underline-offset: 5px; text-transform: none; letter-spacing: .02em; font-family: var(--ja-serif); font-size: 15px; }
html body .jmdjs-tirage .ja-bouton--discret:hover, html body .jmdjs-tirage .ja-bouton--discret:focus-visible { border-color: transparent; color: var(--ja-parchemin); }
html body .jmdjs-tirage .ja-bouton--lien { border-color: rgba(232, 116, 42, .6); }

/* La bougie */
html body .jmdjs-tirage .ja-bougie { position: relative; width: 64px; height: 176px; margin: 0 auto 6px; flex: none; }
html body .jmdjs-tirage .ja-bougie__cire {
	position: absolute;
	bottom: 0;
	left: 50%;
	width: 36px;
	height: 112px;
	margin-left: -18px;
	border-radius: 8px 8px 5px 5px;
	background:
		linear-gradient(90deg, rgba(0, 0, 0, .34), rgba(255, 255, 255, .16) 36%, rgba(0, 0, 0, .1) 68%, rgba(0, 0, 0, .42)),
		var(--cire, #EFE5D2);
	box-shadow: 0 20px 30px -14px rgba(0, 0, 0, .9);
	transition: box-shadow 1.5s;
}
html body .jmdjs-tirage .ja-atelier--allume .ja-bougie__cire { box-shadow: 0 20px 30px -14px rgba(0, 0, 0, .9), inset 0 10px 16px -8px rgba(255, 200, 120, .7); }
html body .jmdjs-tirage .ja-bougie__meche { position: absolute; left: 50%; bottom: 112px; width: 3px; height: 13px; margin-left: -1.5px; border-radius: 2px; background: #15100C; }
html body .jmdjs-tirage .ja-bougie__flamme {
	position: absolute;
	left: 50%;
	bottom: 120px;
	width: 22px;
	height: 44px;
	margin-left: -11px;
	border-radius: 50% 50% 50% 50% / 62% 62% 38% 38%;
	background: radial-gradient(ellipse at 50% 74%, #FFF8E6 0%, var(--ja-ambre) 22%, var(--ja-flamme) 50%, rgba(232, 116, 42, .85) 68%, rgba(232, 116, 42, 0) 76%);
	transform-origin: 50% 100%;
	transform: scale(.15);
	opacity: 0;
	transition: opacity .9s ease, transform 1.2s cubic-bezier(.2, .8, .2, 1);
	filter: blur(.4px);
}
html body .jmdjs-tirage .ja-atelier--allume .ja-bougie__flamme { opacity: 1; transform: scale(1); animation: ja-vaciller 2.8s ease-in-out infinite alternate; }
html body .jmdjs-tirage .ja-bougie__halo {
	position: absolute;
	left: 50%;
	bottom: 96px;
	width: 200px;
	height: 200px;
	margin-left: -100px;
	border-radius: 50%;
	background: radial-gradient(circle, rgba(246, 165, 74, .34), rgba(232, 116, 42, .12) 42%, transparent 70%);
	opacity: 0;
	transition: opacity 1.6s;
	pointer-events: none;
}
html body .jmdjs-tirage .ja-atelier--allume .ja-bougie__halo { opacity: 1; animation: ja-respire 4.5s ease-in-out infinite alternate; }
html body .jmdjs-tirage .ja-bougie--petite { width: 40px; height: 100px; }
html body .jmdjs-tirage .ja-bougie--petite .ja-bougie__cire { width: 20px; height: 60px; margin-left: -10px; }
html body .jmdjs-tirage .ja-bougie--petite .ja-bougie__meche { bottom: 60px; height: 9px; }
html body .jmdjs-tirage .ja-bougie--petite .ja-bougie__flamme { bottom: 66px; width: 13px; height: 26px; margin-left: -6.5px; }
html body .jmdjs-tirage .ja-bougie--petite .ja-bougie__halo { bottom: 48px; width: 120px; height: 120px; margin-left: -60px; }

html body .jmdjs-tirage .ja-teintes { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 8px; margin: 4px 0 6px; }
html body .jmdjs-tirage .ja-teintes__legende { width: 100%; font-family: var(--ja-main); font-size: 21px; color: var(--ja-cendre); }
html body .jmdjs-tirage .ja-teinte { width: 26px; height: 26px; border-radius: 50%; border: 1px solid rgba(239, 230, 212, .35); background: var(--teinte); cursor: pointer; padding: 0; transition: transform .2s, box-shadow .2s; }
html body .jmdjs-tirage .ja-teinte[aria-pressed="true"] { box-shadow: 0 0 0 2px var(--ja-nuit), 0 0 0 4px var(--ja-flamme); transform: scale(1.08); }

/* Les manières de cheminer, avec un bord de paquet */
html body .jmdjs-tirage .ja-bande { display: flex; gap: 4px; height: 54px; margin-bottom: 8px; }
html body .jmdjs-tirage .ja-bande img { height: 100%; width: auto; max-width: 42%; border-radius: 4px; object-fit: cover; box-shadow: 0 6px 14px -8px #000; filter: saturate(.85); }
html body .jmdjs-tirage .ja-maniere--fermee .ja-bande img { filter: brightness(.5) saturate(.4); }

html body .jmdjs-tirage .ja-manieres { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; width: 100%; max-width: 760px; margin-top: 8px; }
html body .jmdjs-tirage .ja-maniere {
	font: inherit;
	display: flex;
	flex-direction: column;
	gap: 6px;
	text-align: left;
	padding: 20px 22px;
	border: 1px solid var(--ja-lichen);
	border-radius: 14px;
	background: rgba(15, 31, 23, .62);
	color: var(--ja-parchemin);
	cursor: pointer;
	transition: border-color .3s, box-shadow .3s, transform .3s;
	min-width: 0;
}
html body .jmdjs-tirage .ja-maniere:hover, html body .jmdjs-tirage .ja-maniere:focus-visible { border-color: var(--ja-braise); box-shadow: 0 0 36px -10px rgba(232, 116, 42, .55); transform: translateY(-2px); }
html body .jmdjs-tirage .ja-maniere__nom { font-family: var(--ja-serif); font-size: 21px; font-weight: 400; }
html body .jmdjs-tirage .ja-maniere__ligne { font-size: 15px; line-height: 1.55; color: var(--ja-cendre); }
html body .jmdjs-tirage .ja-maniere__etat { font-family: var(--ja-main); font-size: 21px; color: var(--ja-flamme); }
html body .jmdjs-tirage .ja-maniere__etat[style*="--etape"]::before { content: ""; display: inline-block; vertical-align: .15em; width: 8px; height: 8px; margin-right: 8px; border-radius: 50%; background: var(--etape); box-shadow: 0 0 8px var(--etape); }
/* La voie des jours offerts, en tête ; les recoins fermés, en retrait, avec leur clé */
html body .jmdjs-tirage .ja-maniere--voie { grid-column: 1 / -1; border-color: rgba(232, 116, 42, .55); background: linear-gradient(135deg, rgba(232, 116, 42, .12), rgba(15, 31, 23, .7) 60%); }
html body .jmdjs-tirage .ja-maniere--fermee { cursor: default; border-style: dashed; border-color: rgba(174, 184, 170, .28); background: rgba(7, 14, 11, .5); }
html body .jmdjs-tirage .ja-maniere--fermee:hover { transform: none; box-shadow: none; border-color: rgba(174, 184, 170, .45); }
html body .jmdjs-tirage .ja-maniere--fermee .ja-maniere__nom, html body .jmdjs-tirage .ja-maniere--fermee .ja-maniere__ligne { opacity: .55; }
html body .jmdjs-tirage .ja-maniere__cle { align-self: flex-start; margin-top: 4px; font-size: 13px; letter-spacing: .14em; text-transform: uppercase; color: var(--ja-flamme); text-decoration: none; border-bottom: 1px solid rgba(246, 165, 74, .45); padding-bottom: 2px; }
html body .jmdjs-tirage a.ja-maniere__cle:hover, html body .jmdjs-tirage a.ja-maniere__cle:focus-visible { color: var(--ja-parchemin); border-bottom-color: var(--ja-parchemin); }

/* La question */
html body .jmdjs-tirage .ja-champ {
	width: 100%;
	max-width: 560px;
	padding: 14px 16px;
	border: 1px solid var(--ja-lichen);
	border-radius: 12px;
	background: rgba(7, 14, 11, .7);
	color: var(--ja-parchemin);
	font-family: var(--ja-serif);
	font-size: 17px;
	line-height: 1.55;
	resize: vertical;
}
html body .jmdjs-tirage .ja-champ::placeholder { color: rgba(174, 184, 170, .55); font-style: italic; }
html body .jmdjs-tirage .ja-champ:focus { border-color: var(--ja-braise); outline: none; }

/* Le seuil : la clé par courriel */
html body .jmdjs-tirage .ja-formulaire { width: 100%; max-width: 460px; display: flex; flex-direction: column; align-items: stretch; gap: 8px; text-align: left; margin-top: 8px; }
html body .jmdjs-tirage .ja-etiquette { font-family: var(--ja-cond); font-size: 13px; letter-spacing: .16em; text-transform: uppercase; color: var(--ja-cendre); margin-top: 6px; }
html body .jmdjs-tirage .ja-formulaire--cle .ja-etiquette { text-transform: none; letter-spacing: .02em; font-family: var(--ja-serif); font-size: 16px; line-height: 1.5; color: var(--ja-parchemin); }
html body .jmdjs-tirage .ja-champ--ligne { max-width: none; min-height: 48px; padding: 10px 14px; }
html body .jmdjs-tirage .ja-case { display: grid; grid-template-columns: 22px minmax(0, 1fr); gap: 10px; align-items: start; margin: 8px 0 4px; font-size: 15px; line-height: 1.5; color: var(--ja-cendre); cursor: pointer; }
html body .jmdjs-tirage .ja-case input { width: 18px; height: 18px; margin: 2px 0 0; accent-color: var(--ja-braise); }
html body .jmdjs-tirage .ja-formulaire .ja-bouton--braise { align-self: center; margin-top: 10px; }
html body .jmdjs-tirage .ja-mention { font-size: 13px; line-height: 1.5; color: rgba(174, 184, 170, .8); margin: 4px 0 0; text-align: center; }
html body .jmdjs-tirage .ja-mention a { color: var(--ja-flamme); }
html body .jmdjs-tirage .ja-alerte { font-family: var(--ja-main); font-size: 21px; color: var(--ja-flamme); margin: 0; min-height: 1.2em; text-align: center; }
html body .jmdjs-tirage .ja-statut { font-family: var(--ja-main); font-size: 24px; line-height: 1.3; color: var(--ja-flamme); margin: 0; max-width: 32em; }
html body .jmdjs-tirage .ja-lettre { width: 100%; max-width: 640px; display: flex; flex-direction: column; align-items: center; gap: 8px; margin-top: 22px; padding: 18px; border: 1px solid var(--ja-lichen); border-radius: 14px; background: rgba(15, 31, 23, .55); }
html body .jmdjs-tirage .ja-lettre__titre { font-family: var(--ja-serif); font-size: 21px; margin: 0; color: var(--ja-parchemin); }
html body .jmdjs-tirage .ja-atelier--porte .ja-lueur { opacity: .35; }

/* Le silence */
html body .jmdjs-tirage .ja-souffle {
	width: 150px;
	height: 150px;
	margin: 18px auto 10px;
	border-radius: 50%;
	border: 1.5px solid rgba(246, 165, 74, .8);
	background: radial-gradient(circle, rgba(246, 165, 74, .26) 0%, rgba(232, 116, 42, .06) 62%, transparent 72%);
	box-shadow: 0 0 60px -10px rgba(232, 116, 42, .5);
	transform: scale(.6);
	transition: transform 4s cubic-bezier(.45, 0, .55, 1);
}
html body .jmdjs-tirage .ja-souffle--ouvre { transform: scale(1.12); }
html body .jmdjs-tirage .ja-souffle--ferme { transform: scale(.6); }
html body .jmdjs-tirage .ja-souffle__mot { font-family: var(--ja-main); font-size: 38px; color: var(--ja-flamme); margin: 0; min-height: 1.3em; }

/* Le paquet : les 70 photos, les unes sur les autres, étalées en rangées qui se chevauchent */
html body .jmdjs-tirage .ja-paquet {
	--h: 150px;
	/* La tranche visible de chaque carte dans le paquet étalé */
	--tranche: 44px;
	--large: calc(var(--h) * 827 / 562);
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: flex-end;
	padding: 30px 8px 10px 8px;
	padding-right: calc(var(--large) - var(--tranche) + 8px);
	margin: 10px auto 0;
	max-width: 1100px;
	width: 100%;
	box-sizing: border-box;
	row-gap: 26px;
}
html body .jmdjs-tirage .ja-carte-p {
	position: relative;
	flex: none;
	height: var(--h);
	width: var(--w);
	margin-right: calc(var(--tranche) - var(--w));
	padding: 0;
	border: 0;
	border-radius: 7px;
	overflow: hidden;
	background: var(--ja-foret);
	box-shadow: -6px 0 14px -8px #000, 0 10px 22px -12px #000, 0 0 0 1px rgba(255, 244, 225, .12);
	transform: rotate(var(--r, 0deg));
	transform-origin: 50% 100%;
	transition: transform .3s ease, box-shadow .3s ease, filter .5s ease, opacity .5s ease;
	z-index: 1;
}
html body .jmdjs-tirage .ja-carte-p--portrait { --w: calc(var(--h) * 562 / 827); }
html body .jmdjs-tirage .ja-carte-p--paysage { --w: var(--large); }
html body .jmdjs-tirage .ja-carte-p img { display: block; width: 100%; height: 100%; object-fit: cover; }
html body .jmdjs-tirage .ja-carte-p--eclairee { cursor: pointer; transform: translateY(-10px) rotate(var(--r, 0deg)); z-index: 2; }
html body .jmdjs-tirage .ja-carte-p--eclairee:hover, html body .jmdjs-tirage .ja-carte-p--eclairee:focus-visible, html body .jmdjs-tirage .ja-carte-p--levee {
	transform: translateY(-26px) rotate(0deg) scale(1.06);
	box-shadow: 0 0 0 1px var(--ja-flamme), 0 22px 40px -14px #000, 0 0 40px -8px rgba(232, 116, 42, .6);
	z-index: 40;
}
html body .jmdjs-tirage .ja-carte-p--ombre { filter: brightness(.38) saturate(.5); pointer-events: none; }
html body .jmdjs-tirage .ja-plan--table[style*="--etape"] .ja-carte-p--eclairee { box-shadow: -6px 0 14px -8px #000, 0 10px 22px -12px #000, 0 0 0 2px var(--etape); }
html body .jmdjs-tirage .ja-plan--table[style*="--etape"] .ja-carte-p--eclairee::after { content: ""; position: absolute; top: 6px; left: 6px; width: 9px; height: 9px; border-radius: 50%; background: var(--etape); box-shadow: 0 0 8px var(--etape); }
html body .jmdjs-tirage .ja-paquet--choisi .ja-carte-p { opacity: .22; filter: grayscale(.5) brightness(.5); }
html body .jmdjs-tirage .ja-paquet--choisi .ja-carte-p--choisie { opacity: 1; filter: none; transform: translateY(-30px) rotate(0deg) scale(1.14); box-shadow: 0 0 0 1px var(--ja-flamme), 0 0 60px -6px rgba(246, 165, 74, .85); z-index: 50; }
html body .jmdjs-tirage .ja-carte-p[disabled] { cursor: default; }

/* La table : les cartes posées côté photo */
html body .jmdjs-tirage .ja-photos {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	gap: 14px 12px;
	max-width: 900px;
	margin: 18px auto 6px;
	padding: 10px 0;
}
html body .jmdjs-tirage .ja-photo {
	--l: 86px;
	position: relative;
	flex: none;
	padding: 0;
	border: 0;
	border-radius: 7px;
	overflow: hidden;
	background: var(--ja-foret);
	cursor: pointer;
	box-shadow: 0 0 0 1px rgba(255, 244, 225, .14), 0 14px 26px -14px #000;
	transform: translateY(var(--y, 0px)) rotate(var(--r, 0deg));
	transition: transform .35s ease, box-shadow .35s ease, opacity .6s ease, filter .6s ease;
	filter: saturate(.9) brightness(.92);
}
html body .jmdjs-tirage .ja-photo--portrait { width: var(--l); aspect-ratio: 562 / 827; }
html body .jmdjs-tirage .ja-photo--paysage { width: calc(var(--l) * 1.47); aspect-ratio: 827 / 562; }
html body .jmdjs-tirage .ja-photo img { display: block; width: 100%; height: 100%; object-fit: cover; }
html body .jmdjs-tirage .ja-photo:hover, html body .jmdjs-tirage .ja-photo:focus-visible {
	transform: translateY(calc(var(--y, 0px) - 12px)) rotate(0deg) scale(1.04);
	box-shadow: 0 0 0 1px rgba(246, 165, 74, .7), 0 18px 34px -14px #000, 0 0 34px -8px rgba(232, 116, 42, .55);
	filter: none;
	z-index: 2;
}
html body .jmdjs-tirage .ja-photos--choisie .ja-photo { opacity: .18; filter: grayscale(.6) brightness(.6); }
html body .jmdjs-tirage .ja-photos--choisie .ja-photo--choisie { opacity: 1; filter: none; transform: translateY(-14px) scale(1.12); box-shadow: 0 0 0 1px var(--ja-flamme), 0 0 50px -6px rgba(246, 165, 74, .8); z-index: 3; }
html body .jmdjs-tirage .ja-photo[disabled] { cursor: default; }
html body .jmdjs-tirage .ja-photos--seule .ja-photo { --l: 210px; }
html body .jmdjs-tirage .ja-plan--table[style*="--etape"] .ja-surtitre::before { content: ""; display: inline-block; vertical-align: .12em; width: 9px; height: 9px; margin-right: 10px; border-radius: 50%; background: var(--etape); box-shadow: 0 0 10px var(--etape); }

/* La révélation */
html body .jmdjs-tirage .ja-entete { display: flex; flex-direction: column; align-items: center; gap: 8px; }
html body .jmdjs-tirage .ja-question-posee { font-family: var(--ja-main); font-size: 24px; color: var(--ja-parchemin); margin: 0; max-width: 34em; }
html body .jmdjs-tirage .ja-duo { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: clamp(24px, 4vw, 48px); align-items: start; text-align: left; margin-top: 12px; width: 100%; }
/* La carte comme objet : photo d'un côté, texte imprimé de l'autre, avec son épaisseur et son ombre */
html body .jmdjs-tirage .ja-objet-bloc { display: flex; flex-direction: column; align-items: center; gap: 12px; min-width: 0; max-width: 100%; }
html body .jmdjs-tirage .ja-objet {
	--tx: 0deg;
	--ty: 0deg;
	position: relative;
	perspective: 1600px;
	cursor: pointer;
	max-width: 100%;
	flex: none;
}
html body .jmdjs-tirage .ja-objet-bloc--portrait { width: 320px; max-width: 100%; }
html body .jmdjs-tirage .ja-objet-bloc--paysage { width: 460px; max-width: 100%; }
html body .jmdjs-tirage .ja-objet--portrait { width: 100%; aspect-ratio: 562 / 827; }
html body .jmdjs-tirage .ja-objet--paysage { width: 100%; aspect-ratio: 827 / 562; }
html body .jmdjs-tirage .ja-objet::after {
	content: "";
	position: absolute;
	left: 8%;
	right: 8%;
	bottom: -26px;
	height: 26px;
	border-radius: 50%;
	background: radial-gradient(ellipse at center, rgba(0, 0, 0, .65), transparent 70%);
	filter: blur(4px);
	pointer-events: none;
}
html body .jmdjs-tirage .ja-objet__carte {
	position: relative;
	width: 100%;
	height: 100%;
	transform-style: preserve-3d;
	transform: rotateX(var(--tx)) rotateY(var(--ty));
	transition: transform 1.1s cubic-bezier(.3, .7, .2, 1);
}
html body .jmdjs-tirage .ja-objet--verso .ja-objet__carte { transform: rotateX(var(--tx)) rotateY(calc(180deg + var(--ty))); }
html body .jmdjs-tirage .ja-objet--arrive { animation: ja-poser 1.2s cubic-bezier(.2, .8, .2, 1) both; }
html body .jmdjs-tirage .ja-objet__face {
	position: absolute;
	inset: 0;
	border-radius: 10px;
	overflow: hidden;
	backface-visibility: hidden;
	-webkit-backface-visibility: hidden;
	background: #FBF7EF;
	/* l'épaisseur du carton, la lumière de la bougie sur la tranche */
	box-shadow: 0 0 0 1px rgba(255, 244, 225, .35), 1px 1px 0 rgba(214, 200, 176, .9), 2px 2px 0 rgba(170, 156, 134, .9), 3px 3px 0 rgba(120, 108, 92, .8), 0 30px 60px -26px #000, 0 0 70px -26px rgba(232, 116, 42, .6);
}
html body .jmdjs-tirage .ja-objet__face img { display: block; width: 100%; height: 100%; object-fit: cover; }
html body .jmdjs-tirage .ja-objet__face--verso { transform: rotateY(180deg); }
html body .jmdjs-tirage .ja-objet__face--verso::after { content: ""; position: absolute; inset: 0; background: linear-gradient(135deg, rgba(255, 255, 255, .18), transparent 40%, rgba(232, 116, 42, .08)); pointer-events: none; }
html body .jmdjs-tirage .ja-objet__face--recto::after { content: ""; position: absolute; inset: 0; background: linear-gradient(135deg, rgba(255, 240, 210, .16), transparent 45%); pointer-events: none; }
html body .jmdjs-tirage .ja-objet__titre-secours { margin: 0; padding: 24px; color: #26241F; font-family: var(--ja-serif); text-align: center; position: absolute; inset: 0; display: grid; place-items: center; }
html body .jmdjs-tirage .ja-cotes { display: inline-flex; gap: 4px; padding: 4px; border: 1px solid var(--ja-lichen); border-radius: 999px; background: rgba(7, 14, 11, .6); margin-top: 18px; }
html body .jmdjs-tirage .ja-cote { min-height: 34px; padding: 6px 14px; border: 0; font-size: 13px; }
html body .jmdjs-tirage .ja-cote[aria-pressed="true"] { background: rgba(232, 116, 42, .9); color: #1C0E05; }

html body .jmdjs-tirage .ja-lecture { max-width: 38em; min-width: 0; animation: ja-apparaitre 1.2s .5s ease both; }
html body .jmdjs-tirage .ja-lecture__etape { display: flex; align-items: center; gap: 10px; font-family: var(--ja-cond); font-size: 13px; letter-spacing: .18em; text-transform: uppercase; color: var(--ja-cendre); margin: 0 0 6px; }
html body .jmdjs-tirage .ja-pastille { width: 10px; height: 10px; border-radius: 50%; background: var(--etape); box-shadow: 0 0 12px var(--etape); flex: none; }
html body .jmdjs-tirage .ja-lecture__numero { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; font-family: var(--ja-cond); font-size: 14px; letter-spacing: .14em; text-transform: uppercase; color: var(--ja-flamme); margin: 0 0 10px; }
html body .jmdjs-tirage .ja-action { display: inline-flex; align-items: center; gap: 6px; padding: 3px 10px 3px 6px; border: 1px solid rgba(246, 165, 74, .5); border-radius: 999px; color: var(--ja-ambre); }
html body .jmdjs-tirage .ja-coquille { color: var(--ja-flamme); }
html body .jmdjs-tirage .ja-lecture__titre { font-family: var(--ja-serif); font-weight: 500; font-size: clamp(22px, 2.8vw, 30px); line-height: 1.2; letter-spacing: .03em; margin: 0 0 16px; color: var(--ja-parchemin); text-wrap: balance; }
html body .jmdjs-tirage .ja-lecture__message { font-family: var(--ja-serif); font-size: 18px; line-height: 1.7; white-space: pre-line; color: #E7DDC9; margin: 0 0 18px; }
html body .jmdjs-tirage .ja-lecture__question { font-family: var(--ja-main); font-size: 24px; color: var(--ja-flamme); margin: 0 0 12px; }
html body .jmdjs-tirage .ja-consigne { font-family: var(--ja-main); font-size: 23px; line-height: 1.3; color: var(--ja-flamme); margin: 0 0 12px; padding-top: 14px; border-top: 1px solid rgba(46, 74, 58, .9); }
html body .jmdjs-tirage .ja-lien { color: var(--ja-flamme); text-underline-offset: 4px; font-size: 15px; }

html body .jmdjs-tirage .ja-rangee { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; margin-top: 10px; }
html body .jmdjs-tirage .ja-vignette { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 6px; border: 1px solid transparent; border-radius: 14px; background: transparent; color: var(--ja-cendre); cursor: pointer; transition: transform .3s, border-color .3s; }
html body .jmdjs-tirage .ja-vignette[aria-pressed="true"] { border-color: rgba(246, 165, 74, .6); transform: translateY(-4px); color: var(--ja-flamme); }
html body .jmdjs-tirage .ja-vignette__etape { font-family: var(--ja-cond); font-size: 13px; letter-spacing: .16em; }
html body .jmdjs-tirage .ja-vignette__photo { display: block; width: 62px; height: 88px; object-fit: cover; border-radius: 6px; box-shadow: 0 0 0 1px rgba(255, 244, 225, .2), 0 10px 18px -10px #000; }
html body .jmdjs-tirage .ja-zone { width: 100%; display: flex; justify-content: center; text-align: left; margin-top: 14px; }

/* Le carnet de route */
html body .jmdjs-tirage .ja-carnet-ecrire { width: 100%; max-width: 640px; display: flex; flex-direction: column; align-items: center; gap: 10px; margin-top: 26px; padding-top: 22px; border-top: 1px solid rgba(46, 74, 58, .9); }
html body .jmdjs-tirage .ja-carnet-ecrire__titre { font-family: var(--ja-main); font-size: 30px; color: var(--ja-parchemin); }
html body .jmdjs-tirage .ja-ok { font-family: var(--ja-main); font-size: 21px; color: var(--ja-flamme); min-height: 1.2em; }
html body .jmdjs-tirage .ja-actions { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 10px; margin-top: 14px; }
html body .jmdjs-tirage .ja-carnet { width: 100%; max-width: 640px; text-align: left; margin-top: 18px; border-top: 1px solid rgba(46, 74, 58, .9); padding-top: 14px; }
html body .jmdjs-tirage .ja-carnet summary { cursor: pointer; font-family: var(--ja-cond); font-size: 14px; letter-spacing: .16em; text-transform: uppercase; color: var(--ja-flamme); }
html body .jmdjs-tirage .ja-carnet__liste { margin: 12px 0 8px; padding-left: 20px; display: grid; gap: 12px; }
html body .jmdjs-tirage .ja-carnet__liste li { display: grid; gap: 2px; font-size: 15px; line-height: 1.5; color: var(--ja-cendre); }
html body .jmdjs-tirage .ja-carnet__date { font-family: var(--ja-cond); letter-spacing: .1em; text-transform: uppercase; font-size: 13px; color: var(--ja-flamme); }
html body .jmdjs-tirage .ja-carnet__question { font-family: var(--ja-main); font-size: 20px; color: var(--ja-parchemin); }
html body .jmdjs-tirage .ja-carnet__cartes { color: var(--ja-parchemin); }
html body .jmdjs-tirage .ja-carnet__note { white-space: pre-line; font-style: italic; }

/* Le mode atelier : la créatrice traverse l'Oracle librement (cinq manières, autant de tirages, la carte de son choix) */
html body .jmdjs-tirage .ja-outil { width: 100%; max-width: 760px; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 10px 14px; margin-top: 6px; padding: 16px 18px; border: 1px dashed rgba(246, 165, 74, .45); border-radius: 14px; background: rgba(7, 14, 11, .45); }
html body .jmdjs-tirage .ja-outil__titre { width: 100%; margin: 0; font-family: var(--ja-main); font-size: 23px; color: var(--ja-flamme); text-align: center; }
html body .jmdjs-tirage .ja-outil .ja-champ--numero { width: 104px; max-width: 104px; min-height: 44px; padding: 8px 12px; text-align: center; font-size: 18px; }
html body .jmdjs-tirage .ja-outil .ja-alerte { width: 100%; min-height: 0; }
html body .jmdjs-tirage .ja-etapes-choix { display: grid; grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); gap: 12px; width: 100%; max-width: 760px; margin-top: 8px; }
html body .jmdjs-tirage .ja-etape-choix { font: inherit; display: flex; align-items: center; gap: 12px; text-align: left; padding: 14px 16px; border: 1px solid var(--ja-lichen); border-radius: 14px; background: rgba(15, 31, 23, .62); color: var(--ja-parchemin); cursor: pointer; transition: border-color .3s, box-shadow .3s, transform .3s; min-width: 0; }
html body .jmdjs-tirage .ja-etape-choix:hover, html body .jmdjs-tirage .ja-etape-choix:focus-visible { border-color: var(--etape); box-shadow: 0 0 30px -10px var(--etape); transform: translateY(-2px); }
html body .jmdjs-tirage .ja-etape-choix:focus-visible { outline: 2px solid var(--ja-flamme); outline-offset: 3px; }
html body .jmdjs-tirage .ja-etape-choix__romain { flex: none; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; border: 1px solid var(--etape); box-shadow: 0 0 14px -2px var(--etape); font-family: var(--ja-cond); font-size: 15px; letter-spacing: .08em; color: var(--ja-parchemin); }
html body .jmdjs-tirage .ja-etape-choix__texte { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
html body .jmdjs-tirage .ja-etape-choix__nom { font-family: var(--ja-serif); font-size: 18px; line-height: 1.3; }
html body .jmdjs-tirage .ja-etape-choix__age { font-size: 14px; font-style: italic; color: var(--ja-cendre); }

@keyframes ja-apparaitre { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: none; } }
@keyframes ja-poser { from { opacity: 0; transform: translateY(-40px) rotate(-4deg) scale(.92); } to { opacity: 1; transform: none; } }
@keyframes ja-vaciller {
	0% { transform: scale(1, 1) rotate(-1.5deg); }
	30% { transform: scale(1.04, .96) rotate(1deg); }
	60% { transform: scale(.97, 1.06) rotate(-.6deg); }
	100% { transform: scale(1.02, .98) rotate(1.6deg); }
}
@keyframes ja-respire { from { transform: scale(.94); opacity: .85; } to { transform: scale(1.06); opacity: 1; } }
@keyframes ja-brume { from { transform: translateX(-4%); } to { transform: translateX(4%); } }

/* L'atelier s'adapte à la largeur qu'on lui donne (colonne étroite ou pleine page), pas seulement à l'écran */
@container atelier (min-width: 1000px) {
	html body .jmdjs-tirage .ja-photo { --l: 112px; }
	html body .jmdjs-tirage .ja-photos { gap: 18px 16px; }
	html body .jmdjs-tirage .ja-paquet { --h: 164px; --tranche: 46px; }
	html body .jmdjs-tirage .ja-objet-bloc--portrait { width: 360px; }
	html body .jmdjs-tirage .ja-objet-bloc--paysage { width: 520px; }
}
@container atelier (max-width: 860px) {
	html body .jmdjs-tirage .ja-duo { grid-template-columns: minmax(0, 1fr); justify-items: center; }
	html body .jmdjs-tirage .ja-duo .ja-lecture { width: 100%; }
}
@container atelier (max-width: 700px) {
	html body .jmdjs-tirage .ja-scene { --ja-l: 62px; --ja-h: 90px; }
	html body .jmdjs-tirage .ja-paquet { --h: 124px; --tranche: 34px; row-gap: 20px; }
	html body .jmdjs-tirage .ja-bande { height: 46px; }
	html body .jmdjs-tirage .ja-manieres { grid-template-columns: minmax(0, 1fr); }
	html body .jmdjs-tirage .ja-photo { --l: 66px; }
	html body .jmdjs-tirage .ja-photos { gap: 10px 8px; }
	html body .jmdjs-tirage .ja-vignette__photo { width: 50px; height: 72px; }
	html body .jmdjs-tirage .ja-rangee { gap: 6px; }
	html body .jmdjs-tirage .ja-vignette { padding: 4px; }
	html body .jmdjs-tirage .ja-photos--seule .ja-photo { --l: 170px; }
	html body .jmdjs-tirage .ja-lecture__message { font-size: 17px; }
}
@container atelier (max-width: 480px) {
	html body .jmdjs-tirage .ja-scene { padding-inline: 12px; }
	html body .jmdjs-tirage .ja-paquet { --h: 100px; --tranche: 24px; row-gap: 16px; }
	html body .jmdjs-tirage .ja-pause { bottom: 8px; right: 8px; font-size: 11px; padding: 5px 10px; }
	html body .jmdjs-tirage .ja-photo { --l: 52px; }
	html body .jmdjs-tirage .ja-vignette__photo { width: 36px; height: 52px; border-radius: 5px; }
	html body .jmdjs-tirage .ja-rangee { gap: 2px; }
	html body .jmdjs-tirage .ja-vignette { padding: 2px; }
	html body .jmdjs-tirage .ja-vignette__etape { font-size: 12px; }
}
@media (max-width: 720px) {
	html body .jmdjs-tirage .ja-atelier { border-radius: 0; min-height: 600px; }
}

@media (prefers-reduced-motion: reduce) {
	html body .jmdjs-tirage .ja-fond { transition: none; }
	html body .jmdjs-tirage .ja-atelier::before, html body .jmdjs-tirage .ja-plan, html body .jmdjs-tirage .ja-lecture, html body .jmdjs-tirage .ja-objet--arrive,
	html body .jmdjs-tirage .ja-atelier--allume .ja-bougie__flamme, html body .jmdjs-tirage .ja-atelier--allume .ja-bougie__halo { animation: none; }
	html body .jmdjs-tirage .ja-souffle, html body .jmdjs-tirage .ja-photo, html body .jmdjs-tirage .ja-objet__carte, html body .jmdjs-tirage .ja-bougie__flamme, html body .jmdjs-tirage .ja-lueur { transition: none; }
}

/* La carte de la semaine (rendu serveur, sur les pages claires du site) */
.jmdjs-semaine {
	--jt-or: #C9A24B;
	--jt-vert: #34433B;
	--jt-encre: #26241F;
	--jt-parchemin: #F4EFE4;
	--jt-sable: #E7E0D3;
	--jt-terracotta: #B85C38;
	--jt-serif: "Fraunces", Georgia, "Times New Roman", serif;
	--jt-cond: "Barlow Condensed", "Arial Narrow", Arial, sans-serif;
	--jt-main: "Caveat", "Segoe Script", cursive;
	color: var(--jt-encre);
	font-family: var(--jt-serif);
}
.jmdjs-semaine .jmdjs-surtitre { font-family: var(--jt-cond); font-size: 14px; letter-spacing: .16em; text-transform: uppercase; color: var(--jt-terracotta); margin: 0 0 8px; }
.jmdjs-semaine { display: flex; gap: 28px; align-items: flex-start; margin: 0; padding: 28px; background: var(--jt-parchemin); border: 1px solid var(--jt-sable); border-radius: 14px; }
.jmdjs-semaine__image { width: min(200px, 40%); height: auto; border-radius: 10px; border: 1px solid var(--jt-or); flex: none; }
.jmdjs-semaine__texte { flex: 1; min-width: 0; }
.jmdjs-semaine__titre { font-family: var(--jt-serif); font-size: 26px; font-weight: 500; margin: 0 0 12px; line-height: 1.2; }
.jmdjs-semaine__message { margin: 0 0 12px; padding: 0 0 0 16px; border-left: 2px solid var(--jt-or); font-style: italic; font-size: 18px; line-height: 1.6; white-space: pre-line; }
.jmdjs-semaine__question { font-family: var(--jt-main); font-size: 23px; color: var(--jt-vert); margin: 0 0 10px; }
.jmdjs-semaine__liens a { color: var(--jt-vert); }
@media (max-width: 720px) {
	.jmdjs-semaine { flex-direction: column; padding: 20px; }
	.jmdjs-semaine__image { width: 60%; }
}