/* ==========================================================================
   Ange Voyance — jeux et outils (chargé uniquement sur les pages concernées)
   ========================================================================== */

/* ---------- Cadre commun des outils ---------- */
.tool { position: relative; max-width: 1080px; margin: 0 auto; padding: clamp(22px, 4vw, 46px); border-radius: 32px; background: radial-gradient(90% 70% at 50% 0%, rgba(164, 107, 232, .3), transparent 70%), linear-gradient(170deg, rgba(255, 255, 255, .07), rgba(255, 255, 255, .02)); border: 1px solid rgba(242, 210, 126, .26); box-shadow: 0 50px 100px -50px rgba(0, 0, 0, .8), inset 0 1px 0 rgba(255, 255, 255, .08); color: var(--text); scroll-margin-top: calc(var(--header-h) + 16px); }
.tool::before { content: ""; position: absolute; left: 50%; top: -2px; width: 160px; height: 3px; margin-left: -80px; border-radius: 3px; background: linear-gradient(90deg, transparent, var(--gold-2), transparent); box-shadow: 0 0 22px var(--gold-2); }
.tool__steps { display: flex; justify-content: center; gap: clamp(10px, 3vw, 34px); margin: 0 0 26px; padding: 0; list-style: none; }
.tool__steps li { display: flex; align-items: center; gap: 8px; font: 600 13.5px/1 var(--f-body); color: var(--muted); transition: color .3s; }
.tool__steps span { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; border: 1px solid rgba(255, 255, 255, .2); font: 400 13px/1 var(--f-display); transition: all .3s; }
.tool__steps li.is-active { color: #fff; }
.tool__steps li.is-active span { background: var(--grad-gold); color: #2a1446; border-color: transparent; box-shadow: 0 0 18px var(--gold-glow); }
.tool__steps li.is-done span { background: rgba(242, 210, 126, .16); color: var(--gold-2); border-color: rgba(242, 210, 126, .4); }
.tool__intro { display: flex; flex-direction: column; align-items: center; gap: 18px; max-width: 660px; margin: 0 auto; text-align: center; }
.tool__title { font: 400 clamp(27px, 3.4vw, 40px)/1.15 var(--f-display); color: #fff; }
.tool__hint { color: var(--text); font-size: 16.5px; }
.tool__q { display: block; width: 100%; max-width: 520px; }
.tool__q input, .datef select { width: 100%; height: 56px; padding: 0 20px; border-radius: 18px; background: rgba(255, 255, 255, .08); border: 1px solid rgba(255, 255, 255, .22); color: #fff; font-size: 16px; transition: border-color .25s, box-shadow .25s, background-color .25s; }
.tool__q input::placeholder { color: rgba(232, 222, 248, .55); }
.tool__q input:focus, .datef select:focus { outline: none; border-color: var(--gold-2); background: rgba(255, 255, 255, .12); box-shadow: 0 0 0 4px rgba(242, 210, 126, .16); }
.datef select { appearance: none; -webkit-appearance: none; padding-right: 40px; cursor: pointer; background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23f2d27e' stroke-width='2'><path d='m6 9 6 6 6-6'/></svg>"); background-repeat: no-repeat; background-position: right 14px center; background-size: 18px; }
.datef option { background: #22093f; color: #fff; }
.tool__privacy { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; color: var(--muted); }
.tool__privacy .icon { width: 14px; height: 14px; color: var(--gold-2); }
.tool__noscript { text-align: center; color: var(--text); }
.tool .chips { justify-content: center; }
.tool .chip { border-color: rgba(255, 255, 255, .22); color: var(--text); }
.tool .chip.is-active { color: #2a1446; }

/* ---------- Résultat commun ---------- */
.tool__result { margin-top: 30px; scroll-margin-top: calc(var(--header-h) + 20px); }
.result__head { text-align: center; margin-bottom: 26px; }
.result__q { font: 400 clamp(20px, 2.3vw, 25px)/1.4 var(--f-display); color: #fff; margin-bottom: 12px; }
.result__answer { display: inline-flex; align-items: center; justify-content: center; min-width: 210px; padding: 14px 36px; border-radius: 999px; font: 400 clamp(38px, 6vw, 58px)/1 var(--f-display); letter-spacing: .03em; animation: popIn .8s var(--ease-out) both; }
.result__answer--oui { background: var(--grad-gold); color: #2a1446; box-shadow: 0 0 60px var(--gold-glow); }
.result__answer--non { background: rgba(255, 255, 255, .08); color: #fff; border: 1px solid rgba(255, 255, 255, .25); }
.result__answer--peut-etre, .result__answer--nuance { background: rgba(164, 107, 232, .22); color: #e9d7ff; border: 1px solid rgba(201, 165, 255, .45); }
@keyframes popIn { from { opacity: 0; transform: scale(.7); } to { opacity: 1; transform: none; } }
.result__tone { display: inline-flex; align-items: center; gap: 12px; font: 400 19px/1.2 var(--f-display); color: #fff; }
.result__meter { position: relative; width: 120px; height: 6px; border-radius: 3px; background: rgba(255, 255, 255, .12); overflow: hidden; }
.result__meter i { position: absolute; inset: 0 auto 0 0; width: var(--v, 50%); border-radius: inherit; background: var(--grad-gold); animation: grow 1.2s var(--ease-out) both; }
@keyframes grow { from { width: 0; } }
.result__items { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 14px; }
.result__item { padding: 22px; border-radius: 22px; background: rgba(255, 255, 255, .06); border: 1px solid rgba(255, 255, 255, .1); animation: fadeUp .7s var(--ease-out) both; animation-delay: calc(var(--d, 0) * 120ms); }
@keyframes fadeUp { from { opacity: 0; transform: translateY(16px); } }
.result__pos { font: 700 11.5px/1 var(--f-body); letter-spacing: .18em; text-transform: uppercase; color: var(--gold-2); }
.result__name { margin-top: 8px; font: 400 23px/1.2 var(--f-display); color: #fff; }
.result__name small { font-size: .62em; color: var(--muted); letter-spacing: .08em; }
.result__msg { margin-top: 10px; font: 400 21px/1.35 var(--f-script); font-size: 28px; color: var(--gold-2); }
.result__kw { display: flex; flex-wrap: wrap; gap: 6px; margin: 10px 0 12px; }
.result__kw span { padding: 4px 10px; border-radius: 999px; background: rgba(164, 107, 232, .2); font-size: 12px; color: #e3d2ff; }
.result__text { font-size: 15.5px; line-height: 1.7; color: var(--text); }
.result__more { display: inline-flex; align-items: center; gap: 6px; margin-top: 12px; font-size: 14px; font-weight: 700; color: var(--gold-2); border-bottom: 1px solid rgba(242, 210, 126, .4); }
.result__more .icon { width: 15px; height: 15px; }
.result__synth { margin-top: 18px; padding: 20px 22px; border-radius: 20px; background: rgba(242, 210, 126, .08); border: 1px solid rgba(242, 210, 126, .26); font-size: 15.5px; color: var(--text); }
.result__synth p + p { margin-top: 8px; }
.result__synth strong { color: var(--gold-2); }
.result__cta { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 560px); gap: 18px 30px; align-items: center; margin-top: 22px; padding: 26px; border-radius: 24px; background: radial-gradient(90% 120% at 100% 0%, rgba(164, 107, 232, .38), transparent 60%), rgba(255, 255, 255, .04); border: 1px solid rgba(242, 210, 126, .3); }
.result__cta-t { font: 400 22px/1.25 var(--f-display); color: #fff; }
.result__cta-p { margin-top: 6px; font-size: 14.5px; color: var(--text); }
.result__cta .btn--ghost { background: rgba(255, 255, 255, .06); color: #fff; border-color: rgba(255, 255, 255, .26); box-shadow: none; }
.result__cta .btn--ghost .btn__icon { background: rgba(255, 255, 255, .1); color: var(--gold-2); }
.result__again { margin-top: 20px; text-align: center; }
.btn-again { display: inline-flex; align-items: center; gap: 8px; padding: 12px 20px; border-radius: 999px; border: 1px solid rgba(255, 255, 255, .22); font: 700 14.5px/1 var(--f-body); color: var(--text); transition: all .25s; }
.btn-again .icon { width: 17px; height: 17px; color: var(--gold-2); }
.btn-again:hover { border-color: rgba(242, 210, 126, .55); color: #fff; }
.result__disclaimer { margin-top: 18px; text-align: center; font-size: 12.5px; color: var(--muted); }

/* ---------- Cartes ---------- */
.tcard { position: relative; width: 100%; aspect-ratio: 7 / 12; border-radius: 10px; container-type: inline-size; isolation: isolate; overflow: hidden; }
.tcard__frame { position: absolute; inset: 0; z-index: 3; width: 100%; height: 100%; pointer-events: none; }
.tcard__frame rect { fill: none; stroke: url(#ange-gold) var(--gold); }
.tcard__f1 { stroke-width: 1; }
.tcard__f2 { stroke-width: .4; opacity: .85; }
.tcard__fs { fill: url(#ange-gold) var(--gold); }
/* Face : carte nacrée, fenêtre en arche */
.tcard--face {
	--glow: rgba(214, 180, 255, .75);
	--sky-1: #6b33b8;
	--sky-2: #22093f;
	display: grid; grid-template-rows: auto minmax(0, 1fr) auto; justify-items: center; gap: 5%;
	padding: 14% 12% 11%;
	background: radial-gradient(100% 45% at 50% 0%, #ffffff, transparent 70%), linear-gradient(172deg, #fffdf8 0%, #f8f1ff 55%, #ebdcfb 100%);
	box-shadow: inset 0 0 0 1px rgba(201, 146, 54, .25), 0 18px 34px -16px rgba(18, 5, 42, .7);
}
.tcard--face::after { content: ""; position: absolute; inset: 0; z-index: 4; pointer-events: none; opacity: 0; background: linear-gradient(115deg, transparent 30%, rgba(255, 247, 220, .75) 45%, rgba(220, 200, 255, .45) 52%, transparent 64%); background-size: 260% 100%; background-position: 125% 0; transition: background-position 1.2s var(--ease), opacity .35s; }
.tcard--face:hover::after, .is-flipped .tcard--face::after { opacity: .9; background-position: -35% 0; }
.tcard__num { position: relative; z-index: 1; display: flex; align-items: center; gap: 4cqi; min-height: 1em; font: 400 11.5cqi/1 var(--f-display); letter-spacing: .14em; color: #5b23a0; white-space: nowrap; }
.tcard__num::before, .tcard__num::after { content: ""; width: 4.4cqi; height: 4.4cqi; background: url(#) ; background: linear-gradient(135deg, #f4d47f, #c9973a); clip-path: polygon(50% 0, 62% 38%, 100% 50%, 62% 62%, 50% 100%, 38% 62%, 0 50%, 38% 38%); }
.tcard__window { position: relative; z-index: 1; width: 100%; height: 100%; display: grid; place-items: center; overflow: hidden; border-radius: 999px 999px 7% 7% / 50cqi 50cqi 7% 7%; background: radial-gradient(80% 50% at 50% 58%, var(--glow), transparent 72%), linear-gradient(180deg, var(--sky-1), var(--sky-2)); box-shadow: inset 0 0 0 1px rgba(233, 196, 106, .7), inset 0 -18px 30px -18px rgba(233, 196, 106, .35); }
.tcard__sky { position: absolute; inset: 0; background-image: radial-gradient(1px 1px at 18% 30%, #fff, transparent), radial-gradient(1px 1px at 72% 22%, #fff, transparent), radial-gradient(1.4px 1.4px at 40% 70%, #fff, transparent), radial-gradient(1px 1px at 85% 64%, #fff, transparent), radial-gradient(1px 1px at 30% 86%, #fff, transparent), radial-gradient(1.2px 1.2px at 60% 42%, #fff, transparent); opacity: .75; }
.tcard__glyph { position: relative; z-index: 1; width: 74%; height: auto; color: #fff6dc; stroke-width: 1.35; filter: drop-shadow(0 0 2px var(--glow)) drop-shadow(0 0 10px var(--glow)); }
.tcard__name { position: relative; z-index: 1; max-width: 100%; padding-top: 3cqi; border-top: 1px solid rgba(201, 146, 54, .45); font: 400 9.6cqi/1.05 var(--f-display); letter-spacing: .06em; text-align: center; text-transform: uppercase; color: #3b1366; }
.tcard__name--long { font-size: 7.6cqi; letter-spacing: .02em; }
.tcard[data-tone="soleil"] { --glow: rgba(255, 196, 120, .75); --sky-1: #8a4a2a; --sky-2: #3a1636; }
.tcard[data-tone="lune"] { --glow: rgba(206, 214, 255, .7); --sky-1: #3a3f8c; --sky-2: #1a1640; }
.tcard[data-tone="mercure"] { --glow: rgba(140, 228, 214, .6); --sky-1: #22626a; --sky-2: #12223a; }
.tcard[data-tone="venus"] { --glow: rgba(255, 150, 200, .75); --sky-1: #8a2f7a; --sky-2: #2c0c3a; }
.tcard[data-tone="mars"] { --glow: rgba(255, 120, 120, .7); --sky-1: #8a2a3a; --sky-2: #2a0c22; }
.tcard[data-tone="jupiter"] { --glow: rgba(196, 160, 255, .75); --sky-1: #5a33a8; --sky-2: #1e0b40; }
.tcard[data-tone="saturne"] { --glow: rgba(190, 198, 220, .6); --sky-1: #3d4660; --sky-2: #161a2c; }
.tcard[data-tone="hors_planete"], .tcard[data-tone="bleue"] { --glow: rgba(160, 200, 255, .7); --sky-1: #2c56a8; --sky-2: #12204a; }
.tcard[data-tone="rouge"] { --glow: rgba(255, 130, 160, .72); --sky-1: #7a2560; --sky-2: #2a0a30; }
.tcard[data-tone="noir"] { --glow: rgba(200, 176, 255, .65); --sky-1: #3e2c80; --sky-2: #160c34; }
.tcard[data-tone="saisons"] { --glow: rgba(255, 214, 140, .66); --sky-1: #7a5a2a; --sky-2: #2e1a14; }
.tcard[data-tone="personnages"] { --glow: rgba(210, 176, 255, .66); --sky-1: #553394; --sky-2: #1e0f3c; }
/* Oracle des anges : fenêtre claire, aube dorée */
.tcard--anges .tcard__window { background: radial-gradient(70% 45% at 50% 42%, #fff, rgba(255, 255, 255, 0) 70%), linear-gradient(180deg, var(--dawn-1, #fff4dc) 0%, var(--dawn-2, #d8c1f5) 100%); box-shadow: inset 0 0 0 1px rgba(201, 146, 54, .8); }
.tcard--anges .tcard__sky { opacity: 0; }
.tcard--anges .tcard__glyph { color: #5b23a0; stroke-width: 1.5; filter: drop-shadow(0 0 4px #fff) drop-shadow(0 0 10px rgba(255, 236, 190, .9)); }
.tcard--anges[data-tone="protection"] { --dawn-1: #eef2ff; --dawn-2: #b9c3f3; }
.tcard--anges[data-tone="amour"] { --dawn-1: #fff0f4; --dawn-2: #f0bfd8; }
.tcard--anges[data-tone="chemin"] { --dawn-1: #f6fbea; --dawn-2: #c9dfb4; }
.tcard--mini { grid-template-rows: minmax(0, 1fr); padding: 12%; }
/* Dos : nuit violette, arche, auréole et ailes dorées */
.tcard--back { display: grid; place-items: center; padding: 11% 10%; color: var(--gold); background: radial-gradient(70% 42% at 50% 50%, rgba(164, 107, 232, .55), transparent 72%), repeating-radial-gradient(circle at 50% 52%, rgba(242, 210, 126, .07) 0 1px, transparent 1px 7px), linear-gradient(170deg, #3a1470 0%, #1d0840 60%, #2a0d50 100%); box-shadow: inset 0 0 0 1px rgba(242, 210, 126, .2), 0 18px 34px -16px rgba(0, 0, 0, .85); }
.tcard--back::after { content: ""; position: absolute; inset: 0; z-index: 4; pointer-events: none; background: linear-gradient(120deg, transparent 35%, rgba(255, 236, 190, .25) 50%, transparent 65%); background-size: 260% 100%; background-position: 130% 0; transition: background-position 1.1s var(--ease); }
.tcard--back:hover::after, .deck-card:hover .tcard--back::after { background-position: -30% 0; }
.tcard__sigil { position: relative; z-index: 1; width: 96%; height: auto; fill: none; stroke: url(#ange-gold) var(--gold); stroke-width: 1; stroke-linecap: round; stroke-linejoin: round; filter: drop-shadow(0 0 4px rgba(242, 210, 126, .5)); }
.tcard__sigil .fill { fill: url(#ange-gold) var(--gold); stroke: none; }
.tcard__arch { stroke-width: .7; opacity: .8; }
.tcard__halo { stroke-width: 1.4; }
.tcard__wings { stroke-width: .95; }
.tcard__rays { stroke-width: .6; opacity: .7; }

/* Retournement */
.flip { position: relative; width: 100%; perspective: 1200px; }
.flip__inner { position: relative; width: 100%; aspect-ratio: 7 / 12; transform-style: preserve-3d; transition: transform .9s var(--ease-out); }
.flip.is-flipped .flip__inner { transform: rotateY(180deg); }
.flip__side { position: absolute; inset: 0; backface-visibility: hidden; -webkit-backface-visibility: hidden; }
.flip__side--face { transform: rotateY(180deg); }

/* ---------- Tirage de cartes ---------- */
.tirage__board { margin-top: 6px; }
.tirage__instr { text-align: center; font: 400 19px/1.4 var(--f-display); color: #fff; min-height: 2.8em; }
.tirage__instr strong { color: var(--gold-2); font-weight: 400; }
.tirage__swipe { display: block; margin-top: 4px; font: 400 13px/1.3 var(--f-body); color: var(--muted); }
.tirage__deck { position: relative; height: 230px; margin: 10px 0 30px; }
.deck-card { position: absolute; left: 50%; top: 20px; width: 104px; margin-left: -52px; border-radius: 10px; transform: translate(var(--x, 0), var(--y, 0)) rotate(var(--r, 0)); transform-origin: 50% 120%; transition: transform .7s var(--ease-out), opacity .4s, filter .3s; }
.deck-card .tcard { pointer-events: none; }
.deck-card:hover, .deck-card:focus-visible { transform: translate(var(--x, 0), calc(var(--y, 0px) - 22px)) rotate(var(--r, 0)); filter: drop-shadow(0 0 16px rgba(242, 210, 126, .6)); z-index: 200 !important; }
.deck-card.is-picked { opacity: 0; pointer-events: none; transform: translate(var(--x, 0), calc(var(--y, 0px) - 60px)) rotate(var(--r, 0)); }
.tirage__deck.is-shuffling .deck-card { transition-duration: .38s; }
.tirage__deck.is-locked .deck-card { pointer-events: none; opacity: .4; }
.tirage__deck.is-grid { display: flex; height: auto; gap: 8px; overflow-x: auto; padding: 18px 6px 14px; scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch; scrollbar-width: thin; }
.tirage__deck.is-grid .deck-card { position: relative; left: auto; top: auto; margin: 0; flex: 0 0 72px; transform: none; scroll-snap-align: center; }
.tirage__deck.is-grid .deck-card.is-picked { display: none; }
.tirage__slots { display: flex; justify-content: center; gap: clamp(12px, 3vw, 30px); flex-wrap: wrap; }
.slot { display: flex; flex-direction: column; align-items: center; gap: 12px; width: clamp(110px, 17vw, 168px); }
.slot__place { position: relative; width: 100%; aspect-ratio: 7 / 12; border-radius: 12px; border: 1px dashed rgba(242, 210, 126, .4); background: rgba(255, 255, 255, .04); transition: border-color .3s, box-shadow .3s; }
.slot.is-next .slot__place { border-color: var(--gold-2); box-shadow: 0 0 0 4px rgba(242, 210, 126, .1), 0 0 30px rgba(242, 210, 126, .22); animation: slotPulse 1.8s ease-in-out infinite; }
@keyframes slotPulse { 50% { box-shadow: 0 0 0 7px rgba(242, 210, 126, .06), 0 0 40px rgba(242, 210, 126, .32); } }
.slot.is-filled .slot__place { border-color: transparent; background: none; }
.slot__place .flip { position: absolute; inset: 0; transition: transform .2s; }
.slot__label { font: 700 12px/1.3 var(--f-body); letter-spacing: .12em; text-transform: uppercase; color: var(--muted); text-align: center; }
.slot.is-revealed .slot__label { color: var(--gold-2); }
.slot.is-revealed .slot__place { filter: drop-shadow(0 0 24px rgba(214, 180, 255, .5)); }
.tirage__slots--croix { display: grid; grid-template-columns: repeat(3, clamp(96px, 15vw, 150px)); grid-template-areas: ". c3 ." "c1 c5 c2" ". c4 ."; justify-content: center; gap: 12px 18px; }
.tirage__slots--croix .slot { width: auto; }
.tirage__slots--croix .slot:nth-child(1) { grid-area: c1; }
.tirage__slots--croix .slot:nth-child(2) { grid-area: c2; }
.tirage__slots--croix .slot:nth-child(3) { grid-area: c3; }
.tirage__slots--croix .slot:nth-child(4) { grid-area: c4; }
.tirage__slots--croix .slot:nth-child(5) { grid-area: c5; }
.tirage__slots--croix .slot:nth-child(5) .slot__place { border-color: rgba(214, 180, 255, .5); }

/* Carte du jour */
.tirage--mini { display: flex; flex-direction: column; align-items: center; gap: 22px; }
.tirage--mini .tirage__deck { display: flex; justify-content: center; gap: clamp(12px, 3vw, 24px); height: auto; margin: 0; }
.mini-card-wrap { width: clamp(96px, 15vw, 150px); border-radius: 12px; transition: transform .5s var(--ease-out), opacity .5s, filter .3s; }
.mini-card-wrap:nth-child(1) { transform: rotate(-6deg) translateY(10px); }
.mini-card-wrap:nth-child(3) { transform: rotate(6deg) translateY(10px); }
.mini-card-wrap:hover { transform: translateY(-14px) rotate(0); filter: drop-shadow(0 0 22px rgba(242, 210, 126, .55)); }
.tirage--mini.is-done .mini-card-wrap:not(.is-chosen) { opacity: .25; transform: scale(.92); pointer-events: none; }
.mini-card-wrap.is-chosen { transform: translateY(-8px) scale(1.06) rotate(0); filter: drop-shadow(0 0 30px rgba(214, 180, 255, .65)); }
.tirage--mini .tirage__result { max-width: 520px; padding: 22px 24px; border-radius: 22px; background: rgba(255, 255, 255, .07); border: 1px solid rgba(242, 210, 126, .28); text-align: center; animation: fadeUp .7s var(--ease-out) both; }
.tirage--mini .result__text { margin-top: 8px; }
.mini__links { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px 20px; margin-top: 14px; font: 700 14px/1 var(--f-body); }
.mini__links button, .mini__links a { color: var(--gold-2); border-bottom: 1px solid rgba(242, 210, 126, .4); padding-bottom: 2px; }

/* ---------- Pendule ---------- */
.pend { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(20px, 4vw, 50px); align-items: center; }
.pend__stage { position: relative; aspect-ratio: 300 / 330; max-width: 420px; width: 100%; margin: 0 auto; }
.pend__svg { width: 100%; height: 100%; overflow: visible; cursor: pointer; }
.pend__ring { fill: none; stroke: rgba(214, 180, 255, .4); stroke-width: 1.2; }
.pend__ring--2 { stroke: rgba(242, 210, 126, .35); stroke-dasharray: 3 5; }
.pend__axis { stroke: rgba(214, 180, 255, .18); stroke-width: 1; }
.pend__pivot { fill: var(--gold-2); filter: drop-shadow(0 0 6px var(--gold-2)); }
.pend__string { stroke: url(#ange-gold) var(--gold); stroke-width: 1.3; }
.pend__bob { filter: drop-shadow(0 6px 10px rgba(0, 0, 0, .5)); }
.pend__trail { fill: none; stroke: rgba(242, 210, 126, .6); stroke-width: 1.6; stroke-linecap: round; filter: drop-shadow(0 0 6px var(--gold-2)); }
.pend__panel { display: flex; flex-direction: column; gap: 16px; }
.pend__status { min-height: 1.5em; font: 400 18px/1.4 var(--f-display); color: var(--gold-2); }

/* ---------- Ange gardien ---------- */
.ag { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); gap: clamp(20px, 4vw, 50px); align-items: center; }
.ag__panel { display: flex; flex-direction: column; gap: 16px; }
.ag__fields { display: flex; flex-direction: column; gap: 12px; }
.datef { display: flex; flex-wrap: wrap; gap: 10px; }
.datef__f { display: flex; flex-direction: column; gap: 6px; font: 700 12px/1 var(--f-body); letter-spacing: .1em; text-transform: uppercase; color: var(--muted); }
.datef__f select { width: 110px; height: 54px; }
.datef__f--m select { width: 170px; }
.datef__more { margin-top: 2px; }
.datef__more summary { display: inline-flex; align-items: center; gap: 8px; list-style: none; cursor: pointer; font-size: 14.5px; font-weight: 700; color: var(--gold-2); }
.datef__more summary::-webkit-details-marker { display: none; }
.datef__more summary .icon { width: 17px; height: 17px; }
.datef__more[open] summary { margin-bottom: 12px; }
.ag__err { min-height: 1.2em; font-size: 14px; color: #ffb3c6; }
.ag__halo { position: relative; display: grid; place-items: center; aspect-ratio: 1; width: min(100%, 340px); margin: 0 auto; }
.ag__ring { position: absolute; inset: 6%; border-radius: 50%; border: 1px solid rgba(242, 210, 126, .4); background: radial-gradient(closest-side, rgba(214, 180, 255, .35), transparent); }
.ag__ring--2 { inset: 0; border-style: dashed; border-color: rgba(214, 180, 255, .35); background: none; animation: spinc 70s linear infinite; }
.ag__angel { position: relative; width: 92%; animation: float2 7s ease-in-out infinite; }
.ag__name { position: absolute; bottom: 8%; left: 0; right: 0; text-align: center; font: 400 clamp(38px, 5vw, 54px)/1 var(--f-script); background: linear-gradient(100deg, #fff4d6, #f2d27e 50%, #e3c6ff); -webkit-background-clip: text; background-clip: text; color: transparent; filter: drop-shadow(0 0 10px rgba(0, 0, 0, .4)); }
.ag__name.is-pop { animation: popIn .9s var(--ease-out) both; }
.ag-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 16px; }
.ag-card { position: relative; padding: 28px; border-radius: 26px; background: radial-gradient(90% 80% at 0% 0%, rgba(242, 210, 126, .14), transparent 60%), rgba(255, 255, 255, .06); border: 1px solid rgba(242, 210, 126, .35); animation: fadeUp .6s var(--ease-out) both; }
.ag-card--hour { border-color: rgba(214, 180, 255, .35); background: radial-gradient(90% 80% at 0% 0%, rgba(164, 107, 232, .22), transparent 60%), rgba(255, 255, 255, .05); animation-delay: .15s; }
.ag-card__k { font: 700 11.5px/1 var(--f-body); letter-spacing: .16em; text-transform: uppercase; color: var(--gold-2); }
.ag-card__name { margin-top: 10px; font: 400 clamp(42px, 5vw, 58px)/1 var(--f-script); background: linear-gradient(100deg, #fff4d6, #f2d27e 50%, #e3c6ff); -webkit-background-clip: text; background-clip: text; color: transparent; }
.ag-card__meta { display: flex; flex-wrap: wrap; gap: 6px 14px; margin-top: 10px; font-size: 13.5px; color: var(--muted); }
.ag-card__meta b { color: #fff; font-weight: 600; }
.ag-card__q { margin-top: 14px; font-size: 15.5px; line-height: 1.7; color: var(--text); }
.ag-card__msg { margin-top: 14px; padding: 16px 18px; border-radius: 16px; background: rgba(255, 255, 255, .06); border-left: 3px solid var(--gold-2); font: 400 18px/1.5 var(--f-display); color: #fff; }
.ag-card__link { display: inline-flex; margin-top: 14px; font-size: 14px; font-weight: 700; color: var(--gold-2); border-bottom: 1px solid rgba(242, 210, 126, .4); }

/* ---------- Nombres angéliques ---------- */
.nb__panel { display: flex; flex-direction: column; align-items: center; gap: 16px; max-width: 760px; margin: 0 auto; text-align: center; }
.nb__row { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; width: 100%; }
.nb__row .tool__q { max-width: 220px; }
.nb__row .tool__q input { text-align: center; font: 400 26px/1 var(--f-display); letter-spacing: .14em; }
.nb__chips { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; }
.nb__chip { min-width: 62px; padding: 9px 12px; border-radius: 12px; border: 1px solid rgba(255, 255, 255, .2); font: 400 16px/1 var(--f-display); letter-spacing: .06em; color: var(--text); transition: all .2s; }
.nb__chip:hover, .nb__chip.is-active { background: var(--grad-gold); color: #2a1446; border-color: transparent; }
.nb-card { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 28px; align-items: center; padding: 30px; border-radius: 26px; background: radial-gradient(90% 90% at 0% 0%, rgba(164, 107, 232, .25), transparent 60%), rgba(255, 255, 255, .06); border: 1px solid rgba(242, 210, 126, .35); animation: fadeUp .6s var(--ease-out) both; }
.nb-card__n { font: 400 clamp(62px, 9vw, 104px)/1 var(--f-display); background: var(--grad-gold); -webkit-background-clip: text; background-clip: text; color: transparent; filter: drop-shadow(0 0 22px rgba(233, 196, 106, .35)); }
.nb-card__k { font: 700 11.5px/1 var(--f-body); letter-spacing: .16em; text-transform: uppercase; color: var(--gold-2); }
.nb-card__t { margin-top: 8px; font: 400 26px/1.2 var(--f-display); color: #fff; }
.nb-card__msg { margin-top: 10px; font-size: 15.5px; line-height: 1.7; color: var(--text); }
.nb-card__grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin-top: 16px; }
.nb-card__grid div { padding: 14px; border-radius: 16px; background: rgba(255, 255, 255, .05); border: 1px solid rgba(255, 255, 255, .1); font-size: 14px; line-height: 1.55; color: var(--text); }
.nb-card__grid b { display: block; margin-bottom: 4px; font: 700 11px/1 var(--f-body); letter-spacing: .14em; text-transform: uppercase; color: var(--gold-2); }

/* ---------- Responsive ---------- */
@media (max-width: 980px) {
	.pend, .ag { grid-template-columns: minmax(0, 1fr); }
	.pend__stage { max-width: 300px; }
	.ag__halo { width: min(70%, 260px); order: -1; }
	.result__cta { grid-template-columns: minmax(0, 1fr); }
	.nb-card { grid-template-columns: minmax(0, 1fr); text-align: center; }
	.nb-card__grid { grid-template-columns: minmax(0, 1fr); text-align: left; }
}
@media (max-width: 720px) {
	.tool { border-radius: 24px; padding: 22px 16px; }
	.tool__steps li { font-size: 0; gap: 0; }
	.tool__steps span { font-size: 12.5px; }
	.tirage__deck { height: auto; }
	.slot { width: 30%; min-width: 90px; }
	.tirage__slots--croix { grid-template-columns: repeat(3, minmax(0, 92px)); gap: 10px; }
	.tirage__slots--croix .slot { min-width: 0; }
	.tirage__slots--croix .slot__label { font-size: 9.5px; letter-spacing: .06em; }
	.result__item { padding: 18px; }
	.datef__f select { width: 92px; }
	.datef__f--m select { width: 150px; }
	.ag-card { padding: 22px; }
	.nb-card { padding: 22px; }
}
.pend__panel > .btn, .ag__panel > .btn { align-self: flex-start; }
@media (max-width: 720px) { .pend__panel > .btn, .ag__panel > .btn { align-self: stretch; } }