/* DIGIMANZÉ — la couche vivante n° 2 (04/09/2026). Sur les jetons d'app.css.
   Rien à jouer : la terrasse tourne seule, le QR se scanne seul, la carte se retourne seule. */
.confettis{position:fixed;inset:0;z-index:90;pointer-events:none}
/* ── la terrasse : deux services côte à côte ─────────────── */
.duel{display:grid;grid-template-columns:1fr 1fr;gap:16px;position:relative}
@media(max-width:820px){.duel{grid-template-columns:1fr}}
.terr{background:var(--ink);color:#fff;border-radius:22px;padding:18px 18px 16px;box-shadow:var(--sh2);position:relative;overflow:hidden;display:flex;flex-direction:column;gap:12px;min-height:420px}
.terr::before{content:'';position:absolute;inset:-30%;pointer-events:none;background:radial-gradient(circle at 80% 10%,rgba(255,255,255,.06),transparent 45%)}
.terr.avec::before{background:radial-gradient(circle at 80% 10%,color-mix(in srgb,var(--em) 45%,transparent),transparent 45%)}
.terr>*{position:relative}
.terr header{display:flex;align-items:center;justify-content:space-between;gap:10px}
.terr header b{font:800 17px/1.2 var(--h);letter-spacing:-.01em}
.terr header small{display:block;font-size:12.5px;color:rgba(255,255,255,.6);margin-top:2px}
.terr header .tag{font:700 10px/1 var(--h);letter-spacing:.12em;text-transform:uppercase;padding:6px 9px;border-radius:99px;background:rgba(255,255,255,.1);color:rgba(255,255,255,.8)}
.terr.avec header .tag{background:var(--em);color:#fff}
.tables{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;flex:1;padding-top:26px}
.t{position:relative;height:104px;border-radius:16px;border:2px dashed rgba(255,255,255,.16);background:rgba(255,255,255,.04);display:grid;place-items:center;transition:background .35s,border-color .35s}
.t.libre::after{content:'🍽️';font-size:26px;opacity:.22;filter:grayscale(1)}
.t.occ{border-style:solid;border-color:rgba(255,255,255,.3);background:rgba(255,255,255,.09)}
.t.arrive .cli{animation:tassied .5s cubic-bezier(.2,.8,.2,1)}
@keyframes tassied{from{transform:translateY(18px) scale(.7);opacity:0}to{transform:none;opacity:1}}
.t .cli b{display:block;font-size:34px;line-height:1;text-align:center}
.t .cli small{display:block;font-size:11px;letter-spacing:-3px;margin-top:3px;text-align:center}
.t.mange{border-color:var(--mint);background:color-mix(in srgb,var(--em) 45%,transparent)}
.t.perdu{border-color:#f0a08c;background:rgba(194,74,50,.4)}
.t.part .cli{animation:tpart .7s ease-in forwards}
@keyframes tpart{to{transform:translateY(-22px);opacity:0}}
.t .bulle{position:absolute;left:50%;top:-8px;transform:translate(-50%,-100%) scale(.8);opacity:0;background:#fff;color:var(--ink);font:700 11.5px/1.2 var(--h);padding:7px 10px;border-radius:12px;white-space:nowrap;pointer-events:none;transition:opacity .25s,transform .25s;z-index:2;box-shadow:0 8px 20px rgba(0,0,0,.35)}
.t .bulle::after{content:'';position:absolute;left:50%;bottom:-5px;width:10px;height:10px;background:inherit;transform:translateX(-50%) rotate(45deg)}
.t .bulle.on{opacity:1;transform:translate(-50%,-100%) scale(1)}
.t .bulle.ok{background:var(--mint);color:var(--ink)}
.t .bulle.ko{background:#ffd7cf;color:#7a2e1f;font-size:13px}
.t .fx{position:absolute;left:50%;top:38%;transform:translate(-50%,0);font:800 15px/1 var(--h);white-space:nowrap;opacity:0;pointer-events:none;text-shadow:0 2px 8px rgba(0,0,0,.5)}
.t .fx.ok{color:var(--mint)}.t .fx.ko{color:#f0a08c}
.t .fx.go{animation:flotte 1.1s ease-out forwards}
@keyframes flotte{0%{opacity:0;transform:translate(-50%,0)}15%{opacity:1}100%{opacity:0;transform:translate(-50%,-46px)}}
.terr footer{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.terr footer div{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.1);border-radius:12px;padding:9px 11px}
.terr footer small{display:block;font:700 10px/1 var(--h);letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.6)}
.terr footer b{display:block;font:800 19px/1.1 var(--h);margin-top:4px;font-variant-numeric:tabular-nums;color:#fff}
.terr footer .ok b{color:var(--mint)}.terr footer .ko b{color:#f0a08c}
.h-log{font-size:12.5px;color:rgba(255,255,255,.7);min-height:1.4em;margin:0}
.duel-bilan{position:absolute;inset:0;z-index:5;display:grid;place-items:center;text-align:center;padding:24px;border-radius:22px;background:color-mix(in srgb,var(--ink) 90%,transparent);backdrop-filter:blur(4px);color:#fff;font:600 clamp(17px,2.2vw,24px)/1.4 var(--h);opacity:0;pointer-events:none;transition:opacity .5s}
.duel-bilan b{color:var(--gold);font-size:1.5em;display:block}
.duel.bilan .duel-bilan{opacity:1}
.duel-leg{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px;font-size:13px;color:var(--slate)}
.duel-leg span{display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:99px;background:var(--white);border:1px solid var(--line)}
/* ── quiz : rang · calculette : le chiffre saute ────────── */
.q-rang{display:inline-block;margin:8px 0 4px;padding:8px 14px;border-radius:99px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.18);font:800 14px/1 var(--h);color:#fff}
.q-rang span{color:var(--mint);font-weight:700;letter-spacing:.1em;text-transform:uppercase;font-size:11px;margin-right:6px}
.verdict .big.saute{animation:saute .5s cubic-bezier(.2,.8,.2,1)}
@keyframes saute{0%{transform:scale(1)}35%{transform:scale(1.12);color:#fff}100%{transform:scale(1)}}
/* ── le tirage de cartes (option) ───────────────────────── */
.tirage{margin-top:14px;perspective:1000px}
.cartej{position:relative;width:100%;aspect-ratio:5/3;border:0;background:transparent;padding:0;cursor:pointer;transform-style:preserve-3d;transition:transform .7s cubic-bezier(.2,.8,.2,1);text-align:left;color:var(--ink)}
.cartej.ouverte{transform:rotateY(180deg)}
.cj-f,.cj-b{position:absolute;inset:0;border-radius:14px;backface-visibility:hidden;-webkit-backface-visibility:hidden;padding:16px 18px;display:flex;flex-direction:column;justify-content:center;box-shadow:var(--sh)}
.cj-f{background:var(--ink);color:#fff;border:6px solid var(--white);outline:1px solid var(--line2);align-items:center;text-align:center;background-image:radial-gradient(circle at 20% 30%,color-mix(in srgb,var(--em) 60%,transparent) 0 6px,transparent 7px),radial-gradient(circle at 80% 70%,color-mix(in srgb,var(--gold) 60%,transparent) 0 6px,transparent 7px),repeating-linear-gradient(45deg,rgba(255,255,255,.05) 0 6px,transparent 6px 14px)}
.cj-f b{font:800 18px/1.2 var(--h);margin-bottom:6px}
.cj-f small{font-size:12.5px;color:rgba(255,255,255,.7)}
.cj-f .dodo{font-size:34px;line-height:1;margin-bottom:8px}
.cj-b{background:var(--white);border:1px solid var(--line2);transform:rotateY(180deg)}
.cj-b small{font:700 10px/1 var(--h);letter-spacing:.12em;text-transform:uppercase;color:var(--em);margin-bottom:8px}
.cj-b b{font:800 16px/1.3 var(--h);letter-spacing:-.01em;text-wrap:balance}
.cj-rep{align-self:flex-start;margin-top:10px;background:var(--emsoft);color:var(--emd);border:0;border-radius:99px;padding:7px 12px;font:700 12.5px/1 var(--h);cursor:pointer}
.cj-b em{display:block;margin-top:10px;font-style:normal;font-size:14px;color:var(--ink);padding:8px 10px;border-left:3px solid var(--gold);background:var(--sand)}
/* ── le QR « Scannez-moi » (section carte exemple) ; l'auto-scan a été retiré le 05/09/2026 ── */
.qrbox{cursor:pointer;overflow:hidden}
.qrbox:hover{transform:rotate(0) scale(1.04)}
.lien-jeu{display:inline-block;margin-top:6px;color:var(--em);font-weight:700;text-decoration:none;border-bottom:2px solid color-mix(in srgb,var(--em) 35%,transparent)}
.lien-jeu:hover{border-bottom-color:var(--em)}