/* Polices hébergées sur le site (licence SIL Open Font License) : aucune requête vers un serveur tiers */
@font-face{font-family:"Cinzel"; font-style:normal; font-weight:500; font-display:swap; src:url("fonts/cinzel-latin-500-normal.woff2") format("woff2")}
@font-face{font-family:"Cinzel"; font-style:normal; font-weight:700; font-display:swap; src:url("fonts/cinzel-latin-700-normal.woff2") format("woff2")}
@font-face{font-family:"Cinzel"; font-style:normal; font-weight:800; font-display:swap; src:url("fonts/cinzel-latin-800-normal.woff2") format("woff2")}
@font-face{font-family:"Cormorant Garamond"; font-style:normal; font-weight:500; font-display:swap; src:url("fonts/cormorant-garamond-latin-500-normal.woff2") format("woff2")}
@font-face{font-family:"Cormorant Garamond"; font-style:normal; font-weight:600; font-display:swap; src:url("fonts/cormorant-garamond-latin-600-normal.woff2") format("woff2")}
@font-face{font-family:"Cormorant Garamond"; font-style:normal; font-weight:700; font-display:swap; src:url("fonts/cormorant-garamond-latin-700-normal.woff2") format("woff2")}
@font-face{font-family:"Great Vibes"; font-style:normal; font-weight:400; font-display:swap; src:url("fonts/great-vibes-latin-400-normal.woff2") format("woff2")}


:root{
  --wine:#4a0b18; --wine-2:#6e1226; --ink:#120609;
  --gold:#d9ae55; --gold-hi:#f6e0a0; --gold-lo:#8a5f1a;
  --red:#c1272d; --ivory:#f7efe0; --pine:#1b4d33;
  --row:clamp(72px,24vw,104px);
  --goldgrad:linear-gradient(135deg,#fff3c4,#d9ae55 28%,#8a5f1a 52%,#f6e0a0 76%,#b8862b);
  color-scheme:dark;
  box-sizing:border-box;
  padding-top:env(safe-area-inset-top,0px);
  padding-bottom:env(safe-area-inset-bottom,0px);
}
html{scroll-padding-top:env(safe-area-inset-top,0px)}
*,*::before,*::after{box-sizing:border-box}
body{
  position:relative; margin:0; min-height:100vh; overflow-x:hidden; color:var(--ivory);
  font-family:"Cormorant Garamond",Georgia,"Times New Roman",serif; font-size:20px; line-height:1.45;
  background:
    radial-gradient(1000px 620px at 50% -6%, #3aa56f 0%, transparent 66%),
    radial-gradient(circle at 10% 90%, rgba(246,224,160,.32), transparent 42%),
    radial-gradient(circle at 90% 85%, rgba(246,224,160,.26), transparent 38%),
    linear-gradient(#237a50,#145030);
  background-color:#145030;
}
h1,h2,h3,p{margin:0}
button,input{font:inherit}
[hidden]{display:none!important}
.wrap{position:relative; z-index:2; max-width:600px; margin:0 auto; padding:58px 10px 20px}
@media(min-width:480px){.wrap{padding-left:16px;padding-right:16px}}

/* ---------- décor de fond ---------- */
.curtain{
  position:fixed; top:0; bottom:0; width:clamp(14px,4.5vw,90px); z-index:0; pointer-events:none;
  background:
    linear-gradient(90deg,rgba(0,0,0,.22),transparent 30%,transparent 70%,rgba(0,0,0,.22)),
    repeating-linear-gradient(90deg,#1f7a4d 0 10px,#145a38 10px 17px,#2a9460 17px 28px);
  box-shadow:0 0 40px rgba(0,0,0,.6);
}
.curtain.l{left:0; border-right:3px solid var(--gold-lo)}
.curtain.r{right:0; border-left:3px solid var(--gold-lo)}
.curtain::after{content:""; position:absolute; left:-2px; right:-2px; top:64%; height:16px; background:var(--goldgrad); box-shadow:0 4px 8px rgba(0,0,0,.5)}
.curtain::before{content:""; position:absolute; left:28%; right:28%; top:calc(64% + 16px); height:46px; background:linear-gradient(90deg,#8a5f1a,#f6e0a0,#8a5f1a); border-radius:0 0 50% 50%/0 0 30% 30%}
.valance{
  position:absolute; top:0; left:0; right:0; height:34px; z-index:3; pointer-events:none;
  background:linear-gradient(#145a38,#2a9460); border-bottom:3px solid var(--gold);
}
.valance::after{
  content:""; position:absolute; left:0; right:0; top:100%; height:26px; margin-top:0;
  background:radial-gradient(circle at 50% 0,#2a9460 19px,var(--gold) 19px 22px,transparent 23px) 0 0/46px 26px repeat-x;
}
.valance::before{ /* guirlande lumineuse */
  content:""; position:absolute; left:0; right:0; bottom:-14px; height:12px; z-index:2;
  background:radial-gradient(circle,#fffbe0 0 2px,#ffd25a 3px,rgba(255,170,50,.35) 5px,transparent 7px) 0 50%/26px 12px repeat-x;
  animation:twinkle 2.4s ease-in-out infinite alternate;
}
@keyframes twinkle{from{opacity:.45}to{opacity:1}}
.bokeh{position:fixed; inset:0; z-index:0; pointer-events:none; overflow:hidden}
.bokeh i{position:absolute; border-radius:50%; background:radial-gradient(circle,rgba(255,226,140,.55),rgba(255,190,70,.12) 55%,transparent 70%); filter:blur(2px); animation:drift 9s ease-in-out infinite alternate}
@keyframes drift{from{opacity:.25;transform:translateY(0) scale(.9)}to{opacity:.9;transform:translateY(-22px) scale(1.1)}}
.hang{display:none; position:fixed; top:56px; width:50px; height:140px; z-index:1; pointer-events:none; transform-origin:50% 0; animation:swing 4.5s ease-in-out infinite alternate}
.hang svg{width:100%; height:100%}
.hang.a{left:clamp(30px,6vw,110px)} .hang.b{right:clamp(30px,6vw,110px); animation-delay:-2s; animation-duration:5.5s}
@keyframes swing{from{transform:rotate(-6deg)}to{transform:rotate(6deg)}}
@media(min-width:900px){.hang{display:block}}
canvas#fx{position:fixed; inset:0; width:100%; height:100%; pointer-events:none; z-index:40}
.flash{position:fixed; inset:0; z-index:39; pointer-events:none; opacity:0; background:radial-gradient(circle at 50% 45%,rgba(255,244,196,.95),rgba(246,224,160,.5) 40%,transparent 70%)}
.flash.go{animation:flash 1.1s ease-out}
@keyframes flash{0%{opacity:0}15%{opacity:1}100%{opacity:0}}

/* ---------- barre du haut ---------- */
.bar{display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:10px; margin-bottom:14px}
.bar .right{display:flex; flex-wrap:wrap; gap:8px}
.pills{display:flex; border:2px solid var(--gold); border-radius:999px; overflow:hidden; background:rgba(8,50,30,.72)}
.pill,.mini{
  background:transparent; color:var(--gold-hi); border:0; padding:8px 14px; min-height:42px; cursor:pointer;
  font-family:Cinzel,Georgia,serif; font-weight:700; font-size:14px; letter-spacing:.06em;
}
.pill[aria-pressed="true"]{background:linear-gradient(#fff0b8,#d9ae55); color:#2a070d}
.mini{border:2px solid var(--gold); border-radius:999px; font-size:13px; background:rgba(8,50,30,.72)}
.mini:hover,.pill:hover{background:rgba(217,174,85,.2)}
.pill[aria-pressed="true"]:hover{background:linear-gradient(#fff0b8,#d9ae55)}

/* ---------- marque ---------- */
.brand{text-align:center; margin:4px 0 22px}
.crown{width:52px; height:36px; fill:var(--gold-hi); display:block; margin:0 auto 4px; filter:drop-shadow(0 0 10px rgba(246,224,160,.7))}
.gold-text{
  background:linear-gradient(100deg,#9a6b1f 0%,#fff3c4 22%,#d9ae55 45%,#fff3c4 68%,#9a6b1f 100%) 0 0/220% 100%;
  -webkit-background-clip:text; background-clip:text; color:transparent;
  animation:shine 5s linear infinite;
}
@keyframes shine{to{background-position:-220% 0}}
.brand h1{font-family:Cinzel,Georgia,serif; font-weight:800; font-size:clamp(40px,13vw,68px); letter-spacing:.07em; line-height:1.05; filter:drop-shadow(0 3px 0 rgba(0,0,0,.55)) drop-shadow(0 0 16px rgba(246,224,160,.35))}
.brand .sub{font-family:Cinzel,Georgia,serif; font-weight:700; letter-spacing:.22em; font-size:clamp(12px,3.8vw,17px); color:var(--gold-hi); margin-top:2px}
.merry{font-family:"Great Vibes","Brush Script MT",cursive; font-size:clamp(30px,9vw,44px); line-height:1.1; margin-top:8px; color:var(--gold-hi); text-shadow:0 0 14px rgba(246,224,160,.6),0 2px 0 #0c3a24}

/* ---------- cartes ---------- */
.card{
  position:relative; padding:34px 22px 24px; border-radius:20px; text-align:center;
  background:linear-gradient(160deg,#d3232f,#8a1220) padding-box,var(--goldgrad) border-box;
  border:5px solid transparent;
  box-shadow:0 0 0 5px rgba(0,0,0,.4),0 0 0 7px var(--gold-lo),0 26px 56px rgba(0,0,0,.6),0 0 50px rgba(217,174,85,.18);
}
.card::before,.card::after{content:"✦"; position:absolute; top:10px; color:var(--gold-hi); font-size:18px; text-shadow:0 0 8px rgba(246,224,160,.9)}
.card::before{left:14px} .card::after{right:14px}
.card h2{font-family:Cinzel,Georgia,serif; font-size:clamp(21px,6vw,28px); color:var(--gold-hi); margin-bottom:10px; font-weight:700}
.card p{margin-bottom:12px}
.lead{font-size:23px}
.roundel{
  width:80px; height:80px; margin:0 auto 12px; border-radius:50%; display:grid; place-items:center;
  border:6px solid var(--red); background:var(--ivory); color:#2a070d; font-family:Cinzel,Georgia,serif; font-weight:800; font-size:26px;
  box-shadow:0 0 0 3px var(--gold),0 8px 18px rgba(0,0,0,.5),0 0 24px rgba(246,224,160,.45);
}
.sign{font-family:Cinzel,Georgia,serif; font-weight:700; letter-spacing:.1em; font-size:15px; color:var(--gold-hi); margin-bottom:6px}
.law{font-size:23px; font-weight:700; margin-bottom:10px}
.fine{color:#f0e2c6; font-size:20px}
.holly{position:absolute; top:-18px; width:84px; height:52px; pointer-events:none; z-index:3}
.holly.hl{left:-12px} .holly.hr{right:-12px; transform:scaleX(-1)}

.card h2{background:var(--goldgrad) 0 0/220% 100%; -webkit-background-clip:text; background-clip:text; color:transparent; animation:shine 6s linear infinite}
.rule{height:3px; width:min(70%,340px); margin:12px auto 0; background:linear-gradient(90deg,transparent,#f6e0a0,#d9ae55,#f6e0a0,transparent); position:relative}
.rule::after{content:""; position:absolute; left:50%; top:50%; width:12px; height:12px; margin:-6px 0 0 -6px; transform:rotate(45deg); background:var(--goldgrad); box-shadow:0 0 10px #f6e0a0}
.sp{position:fixed; z-index:3; pointer-events:none; width:var(--s,16px); height:var(--s,16px); opacity:0; background:radial-gradient(circle,#fff 0,#fff3c4 30%,#d9ae55 62%); clip-path:polygon(50% 0,60% 40%,100% 50%,60% 60%,50% 100%,40% 60%,0 50%,40% 40%); animation:sparkle var(--d,3s) ease-in-out infinite}
@keyframes sparkle{0%,100%{opacity:0; transform:scale(.3) rotate(0)}50%{opacity:1; transform:scale(1) rotate(45deg)}}
.motionbar{position:relative; z-index:5; margin-bottom:14px; padding:12px 14px 14px; border:3px solid var(--gold); border-radius:14px; background:rgba(20,4,8,.92); text-align:center; font-size:19px}
.motionbar .btn{margin-top:8px; min-height:50px}
.floor .co{width:clamp(26px,8vw,40px); height:clamp(26px,8vw,40px); margin:0 -2px 2px}
/* ---------- boutons ---------- */
.btn{
  position:relative; display:block; width:100%; min-height:58px; padding:14px 18px; margin-top:12px; cursor:pointer; border-radius:999px;
  font-family:Cinzel,Georgia,serif; font-weight:800; letter-spacing:.06em; font-size:clamp(14px,4.2vw,18px);
  color:#2a070d; background:linear-gradient(#fff6c8,#e8bf5e 50%,#b98a2e); border:2px solid #fff3c4;
  box-shadow:0 5px 0 var(--gold-lo),0 12px 24px rgba(0,0,0,.5),0 0 22px rgba(246,224,160,.45);
  transition:transform .12s,box-shadow .12s,filter .2s; overflow:hidden;
}
.btn.pulse{animation:glow 2s ease-in-out infinite alternate}
@keyframes glow{from{box-shadow:0 5px 0 var(--gold-lo),0 12px 24px rgba(0,0,0,.5),0 0 14px rgba(246,224,160,.3)}to{box-shadow:0 5px 0 var(--gold-lo),0 12px 24px rgba(0,0,0,.5),0 0 38px rgba(255,230,140,.9)}}
.btn:hover{filter:brightness(1.07)}
.btn:active{transform:translateY(4px); box-shadow:0 1px 0 var(--gold-lo),0 6px 14px rgba(0,0,0,.5)}
.btn[disabled]{filter:grayscale(.6) brightness(.7); cursor:default; animation:none}
.btn.ghost{background:rgba(60,8,14,.45); color:var(--gold-hi); border:2px solid var(--gold); box-shadow:none}
.btn.ghost:hover{background:rgba(217,174,85,.18)}
:focus-visible{outline:3px solid #fff; outline-offset:3px}

/* ---------- formulaire ---------- */
label{display:block; text-align:left; font-family:Cinzel,Georgia,serif; font-size:13px; letter-spacing:.08em; color:var(--gold-hi); margin:14px 0 6px}
input{width:100%; min-height:56px; padding:10px 14px; border-radius:12px; border:2px solid var(--gold-lo); background:rgba(90,12,22,.6); color:var(--ivory); font-size:23px}
input:focus{border-color:var(--gold-hi); outline:none; box-shadow:0 0 0 3px rgba(246,224,160,.35)}
#code{letter-spacing:.5em; text-align:center; font-size:26px}
.err{min-height:26px; margin-top:12px; color:#ffb4a8; font-weight:700}

/* ---------- machine à sous ---------- */
.greet{text-align:center; margin-bottom:34px}
.greet h2{font-family:Cinzel,Georgia,serif; font-weight:800; font-size:clamp(26px,8vw,38px)}
.greet p{font-size:22px; margin-top:6px}
.stage{position:relative}
.tree{display:none; position:absolute; bottom:-10px; width:170px; height:238px; pointer-events:none; filter:drop-shadow(0 0 18px rgba(246,224,160,.25))}
.tree.tl{left:-190px} .tree.tr{right:-190px}
@media(min-width:1040px){.tree{display:block}}
.rig{position:relative; display:grid; grid-template-columns:1fr 28px; gap:4px; align-items:start; margin-top:30px}
.machine{
  position:relative; padding:8px 4px 14px; border-radius:38px 38px 16px 16px;
  background:linear-gradient(145deg,#e8262f,#b01521 50%,#d3202c) padding-box,var(--goldgrad) border-box;
  border:7px solid transparent;
  box-shadow:0 0 0 3px #3a0a12,0 30px 60px rgba(0,0,0,.65),0 0 90px rgba(246,224,160,.4);
}
.bow{position:absolute; left:50%; top:-48px; width:190px; height:95px; transform:translateX(-50%); z-index:5; pointer-events:none; filter:drop-shadow(0 4px 6px rgba(0,0,0,.5))}
.marquee{
  position:relative; margin:0 2px; padding:34px 8px 22px; text-align:center;
  border-radius:60px 60px 10px 10px/44px 44px 10px 10px;
  background:radial-gradient(120% 150% at 50% 0,#dc2a34,#92121d 72%) padding-box,var(--goldgrad) border-box;
  border:5px solid transparent; box-shadow:inset 0 0 20px rgba(0,0,0,.65),0 0 22px rgba(246,224,160,.35);
}
.marquee .crown{width:34px; height:24px; margin-bottom:0}
.marquee b{display:block; font-family:Cinzel,Georgia,serif; font-weight:800; font-size:clamp(24px,8vw,36px); letter-spacing:.09em; line-height:1.1}
.marquee span.sub{display:block; font-family:Cinzel,Georgia,serif; font-weight:700; font-size:clamp(10px,3.2vw,14px); letter-spacing:.2em; color:var(--gold-hi); margin-top:2px}
.frame{position:relative; margin:8px 2px 0; padding:15px 14px; border-radius:14px; background:linear-gradient(#14452e,#14452e) padding-box,var(--goldgrad) border-box; border:5px solid transparent; box-shadow:inset 0 0 20px #000,0 0 18px rgba(246,224,160,.3)}
.window{
  position:relative; display:grid; grid-template-columns:repeat(3,1fr); gap:5px; padding:5px; border-radius:10px;
  background:linear-gradient(90deg,#8a5f1a,#f6e0a0,#8a5f1a); box-shadow:0 0 0 2px #5a3a0a,inset 0 0 0 1px #fff3c4;
}
.reel{position:relative; height:calc(var(--row)*3); overflow:hidden; border-radius:6px; background:linear-gradient(90deg,#cbbf9f,#f6efdc 18%,#fffbf1 50%,#f6efdc 82%,#cbbf9f)}
.reel::after{content:""; position:absolute; inset:0; pointer-events:none; background:linear-gradient(rgba(40,8,14,.36),transparent 32%,transparent 68%,rgba(40,8,14,.36))}
.strip{will-change:transform}
.it{height:var(--row); display:flex; align-items:center; justify-content:center; padding:0 3px}
.ico{width:calc(var(--row)*.68); height:calc(var(--row)*.68)}
.nm{font-family:"Cormorant Garamond",Georgia,serif; font-weight:700; color:#8f1019; text-transform:uppercase; white-space:nowrap; letter-spacing:.03em}
.it.hit .nm{color:#7a0f22; text-shadow:0 0 14px rgba(217,174,85,1),0 0 4px rgba(255,255,255,.8)}
.it.hit .ico{filter:drop-shadow(0 0 8px rgba(217,174,85,1))}
.payline{position:absolute; left:2px; right:2px; top:calc(5px + var(--row)); height:var(--row); z-index:2; pointer-events:none; border-radius:6px; border-top:2px solid rgba(190,30,40,.9); border-bottom:2px solid rgba(190,30,40,.9)}
.payline::before,.payline::after{content:""; position:absolute; top:50%; margin-top:-9px; border:9px solid transparent}
.payline::before{left:-1px; border-left-color:#c1272d; border-right-width:0}
.payline::after{right:-1px; border-right-color:#c1272d; border-left-width:0}
.window.win .payline{border-color:var(--gold-hi); box-shadow:0 0 26px 6px rgba(246,224,160,1),inset 0 0 26px rgba(246,224,160,.8); background:rgba(246,224,160,.22); animation:throb .5s ease-in-out infinite alternate}
@keyframes throb{from{box-shadow:0 0 14px 2px rgba(246,224,160,.7),inset 0 0 14px rgba(246,224,160,.5)}to{box-shadow:0 0 34px 10px rgba(255,244,196,1),inset 0 0 30px rgba(246,224,160,.9)}}
.plate{
  display:flex; align-items:center; justify-content:center; gap:10px; margin:10px 2px 0; padding:10px 8px; text-align:center; border-radius:12px;
  background:linear-gradient(#34945f,#1f6e43) padding-box,var(--goldgrad) border-box; border:4px solid transparent; box-shadow:inset 0 0 14px rgba(0,0,0,.5),0 0 14px rgba(246,224,160,.3); font-size:21px; color:var(--ivory); min-height:58px;
}
.plate svg{width:22px; height:22px; flex:none}

/* ampoules en chenillard */
.bl,.bv{position:absolute; display:block; pointer-events:none}
.bl{height:10px; left:14px; right:14px} .bl.t{top:3px} .bl.b{bottom:3px}
.bv{width:10px; top:16px; bottom:16px} .bv.l{left:3px} .bv.r{right:3px}
.bl::before,.bl::after,.bv::before,.bv::after{content:""; position:absolute; inset:0; animation:chase var(--chase,1.5s) steps(1) infinite}
.bl::before,.bl::after{background:radial-gradient(circle,#fffbe0 0 2px,#ffd25a 3px,rgba(255,160,40,.4) 5px,transparent 6px) 0 50%/24px 10px repeat-x}
.bl::after{background-position:12px 50%; animation-delay:calc(var(--chase,1.5s)/-2)}
.bv::before,.bv::after{background:radial-gradient(circle,#fffbe0 0 2px,#ffd25a 3px,rgba(255,160,40,.4) 5px,transparent 6px) 50% 0/10px 24px repeat-y}
.bv::after{background-position:50% 12px; animation-delay:calc(var(--chase,1.5s)/-2)}
@keyframes chase{0%,49%{opacity:1}50%,100%{opacity:.18}}
.machine.spinning{--chase:.38s}
.machine.win{--chase:.22s}

/* levier */
.lever{display:flex; flex-direction:column; align-items:center; margin-top:70px; cursor:pointer; -webkit-tap-highlight-color:transparent; border-radius:14px}
.lever .ball{width:30px; height:30px; border-radius:50%; z-index:2; background:radial-gradient(circle at 35% 30%,#ffb3a8,#c1272d 45%,#6e0d16); box-shadow:0 3px 8px rgba(0,0,0,.6),0 0 14px rgba(255,80,60,.6)}
.lever .arm{width:9px; height:120px; margin-top:-4px; border-radius:5px; background:linear-gradient(90deg,#8a5f1a,#fff3c4 40%,#b98a2e); transition:height .22s ease-in}
.lever .base{width:26px; height:34px; margin-top:-2px; border-radius:8px; background:linear-gradient(90deg,#8a5f1a,#f6e0a0,#8a5f1a); border:2px solid #6b4812}
.lever.pulled .arm{height:36px}
.lever:not(.busy) .ball{animation:nudge 3.2s ease-in-out infinite}
@keyframes nudge{0%,78%,100%{transform:translateY(0)}86%{transform:translateY(10px)}93%{transform:translateY(-2px)}}
.lever.busy{cursor:default}

/* décor au sol */
.floor{display:flex; justify-content:center; align-items:flex-end; margin:26px 0 0; padding-bottom:6px; pointer-events:none}
.floor svg{flex:none; margin:0 -6px; filter:drop-shadow(0 6px 8px rgba(0,0,0,.55))}
.floor .b1{width:clamp(70px,22vw,120px); height:clamp(70px,22vw,120px)}
.floor .b2{width:clamp(56px,17vw,92px); height:clamp(56px,17vw,92px)}
.floor .ch{width:clamp(56px,17vw,90px); height:clamp(48px,14vw,76px)}
.floor .bl2{width:clamp(34px,10vw,56px); height:clamp(40px,12vw,66px); margin-bottom:6px}
.floor::after{content:""; position:absolute; left:0; right:0; height:0}

/* résultat */
.result{
  position:relative; overflow:hidden; margin-top:22px; padding:26px 16px 22px; text-align:center; border-radius:20px; border:5px solid transparent;
  background:linear-gradient(160deg,#d3232f,#8a1220) padding-box,var(--goldgrad) border-box;
  box-shadow:0 0 50px rgba(246,224,160,.5),0 0 0 6px rgba(0,0,0,.35); opacity:0; transform:scale(.94); transition:opacity .6s,transform .6s;
}
.result.show{opacity:1; transform:none}
.result::before{content:""; position:absolute; left:50%; top:50%; width:240%; aspect-ratio:1; margin:-120% 0 0 -120%; background:repeating-conic-gradient(rgba(246,224,160,.2) 0 7deg,transparent 7deg 14deg); animation:rays 24s linear infinite; pointer-events:none}
@keyframes rays{to{transform:rotate(360deg)}}
.result>*{position:relative}
.result .jp{font-family:Cinzel,Georgia,serif; font-weight:800; font-size:clamp(22px,6.6vw,32px); letter-spacing:.06em}
.result .line{font-family:Cinzel,Georgia,serif; font-weight:700; font-size:clamp(14px,4.2vw,19px); letter-spacing:.08em; margin-top:12px; color:var(--ivory)}
.result .who{display:block; margin-top:6px; font-family:Cinzel,Georgia,serif; font-weight:800; font-size:clamp(40px,14vw,70px); letter-spacing:.06em; text-transform:uppercase; filter:drop-shadow(0 0 16px rgba(246,224,160,.7)); animation:shine 2.4s linear infinite}
.result .saved{font-size:19px; color:#f0e2c6; margin-top:10px}

.portrait{position:relative; width:min(46vw,170px); aspect-ratio:1; margin:16px auto 0; border-radius:50%; overflow:hidden; border:6px solid transparent; background:linear-gradient(#f7efe0,#f7efe0) padding-box,var(--goldgrad) border-box; box-shadow:0 0 0 3px rgba(0,0,0,.35),0 0 34px rgba(246,224,160,.95); opacity:0; transform:scale(.3) rotate(-14deg)}
.portrait.show{opacity:1; transform:none; animation:popin 1s cubic-bezier(.2,1.5,.4,1)}
@keyframes popin{0%{opacity:0; transform:scale(.2) rotate(-14deg)}100%{opacity:1; transform:none}}
.portrait svg,.portrait img{width:100%; height:100%; display:block; object-fit:cover}
.dogline{font-size:21px; margin-top:12px; color:var(--ivory)}
.vipline{font-family:Cinzel,Georgia,serif; font-size:14px; letter-spacing:.06em; color:var(--gold-hi); margin-top:8px}
.tabs{display:flex; justify-content:center; gap:8px; margin-top:14px}
.tab{min-height:44px; padding:8px 18px; cursor:pointer; border-radius:999px; border:2px solid var(--gold); background:rgba(8,50,30,.72); color:var(--gold-hi); font-family:Cinzel,Georgia,serif; font-weight:700; font-size:14px; letter-spacing:.06em}
.tab[aria-pressed="true"]{background:linear-gradient(#fff0b8,#d9ae55); color:#2a070d}
.finalnote{margin-top:14px; padding:10px 14px; border:2px dashed var(--gold); border-radius:12px; background:rgba(8,50,30,.55); font-size:20px; font-weight:700; color:var(--gold-hi); text-align:center; animation:noteblink 1.2s ease-in-out infinite alternate}
@keyframes noteblink{from{opacity:1}to{opacity:.3}}
.linkbtn{background:none; border:0; color:var(--gold-hi); text-decoration:underline; font:inherit; cursor:pointer; min-height:40px}
.toast{display:none; position:fixed; left:50%; bottom:20px; transform:translateX(-50%); z-index:60; background:#14452e; color:#fff; border:2px solid var(--gold); border-radius:12px; padding:10px 16px; font:16px system-ui,sans-serif; max-width:90vw; text-align:center}
body.wide .wrap{max-width:980px}
body.wide .floor{display:none}
body.quiet .sp{display:none}
.adm{padding:16px; border:5px solid transparent; border-radius:16px; background:linear-gradient(#fbf6ea,#fbf6ea) padding-box,var(--goldgrad) border-box; color:#2b1a14; font-family:system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif; font-size:16px; line-height:1.45; box-shadow:0 20px 50px rgba(0,0,0,.5)}
.adm h2{font-family:Cinzel,Georgia,serif; font-size:22px; margin:0; color:#8a1220}
.adm h3{margin:18px 0 8px; font-size:17px; color:#14452e}
.adm p{margin:0 0 10px}
.adm ul{margin:0 0 10px; padding-left:20px}
.ahead{display:flex; justify-content:space-between; align-items:center; gap:10px; flex-wrap:wrap; margin-bottom:12px}
.stats{display:grid; grid-template-columns:repeat(auto-fit,minmax(120px,1fr)); gap:8px; margin-bottom:12px}
.stat{background:#fff; border:1px solid #e0cfa0; border-radius:10px; padding:8px 10px}
.stat b{display:block; font-size:19px; color:#8a1220}
.stat span{font-size:13px; color:#6a5a48}
.anav{display:flex; gap:6px; flex-wrap:wrap; margin-bottom:14px; padding-bottom:10px; border-bottom:2px solid #e0cfa0}
.ab{min-height:40px; padding:6px 12px; border-radius:8px; border:1.5px solid #14452e; background:#fff; color:#14452e; font:inherit; font-weight:600; cursor:pointer}
.ab:hover{background:#eef6f0}
.ab.main,.ab.on{background:#14452e; color:#fff}
.ab.danger{border-color:#a8141f; color:#a8141f}
.adm input,.adm select{width:100%; min-height:42px; padding:6px 10px; border:1.5px solid #c9a24a; border-radius:8px; background:#fff; color:#2b1a14; font:inherit; font-size:16px; letter-spacing:normal; text-align:left; box-shadow:none}
.adm input[type=checkbox]{width:20px; min-height:20px; height:20px}
.adm label{display:block; margin:10px 0 4px; font-family:inherit; font-size:14px; letter-spacing:0; font-weight:600; color:#4a3a2c; text-align:left}
.adm label.chk{display:flex; gap:8px; align-items:center; font-weight:500; margin:10px 0}
.fgrid{display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:0 14px}
.pc{display:flex; gap:12px; align-items:flex-start; flex-wrap:wrap; padding:12px; margin-bottom:10px; background:#fff; border:1px solid #e0cfa0; border-radius:12px}
.pav{width:60px; height:60px; border-radius:50%; overflow:hidden; border:3px solid #d9ae55; flex:none; background:#f7efe0}
.pav svg,.pav img{width:100%; height:100%; object-fit:cover; display:block}
.pinfo{flex:1; min-width:180px}
.ptags span{display:inline-block; margin:3px 4px 0 0; padding:2px 9px; border-radius:999px; background:#f3ead2; color:#4a3a2c; font-size:13px}
.pmail{font-size:14px; color:#6a5a48}
.pact{display:flex; gap:6px; flex-wrap:wrap}
.aflash{margin-bottom:12px; padding:10px 12px; border:1px solid #14452e; border-radius:10px; background:#e8f4ea; color:#14452e}
.aflash.err{border-color:#a8141f; background:#fdeceb; color:#a8141f}
.rtab{width:100%; border-collapse:collapse; font-size:15px}
.rtab th,.rtab td{padding:7px 8px; text-align:left; border-bottom:1px solid #eadfc2}
.chk-ok{color:#14452e} .chk-ko{color:#a8141f}
.adm textarea{width:100%; padding:8px 10px; border:1.5px solid #c9a24a; border-radius:8px; background:#fff; color:#2b1a14; font:inherit; font-size:16px; line-height:1.4; resize:vertical}
.prev{white-space:pre-wrap; margin:8px 0 0; padding:12px; background:#fff; border:1px dashed #c9a24a; border-radius:10px; font:15px/1.5 system-ui,sans-serif; color:#2b1a14}
.langwrap{display:flex; flex-direction:column; gap:4px}
.langhint{font-family:Cinzel,Georgia,serif; font-size:12px; font-weight:700; letter-spacing:.14em; color:#fff; text-shadow:0 1px 3px rgba(0,0,0,.7)}
.bar .pills{border:3px solid #fff; background:#fff7e0; animation:langglow 1.1s ease-in-out infinite alternate}
.bar .pill{min-height:48px; padding:8px 22px; font-size:17px; color:#8a1220; background:transparent}
.bar .pill[aria-pressed="true"]{background:linear-gradient(#e8363c,#b01521); color:#fff}
.bar .pill[aria-pressed="false"]{animation:langblink .9s ease-in-out infinite alternate}
.bar .pill:hover{background:rgba(200,16,46,.14)}
.bar .pill[aria-pressed="true"]:hover{background:linear-gradient(#e8363c,#b01521)}
@keyframes langglow{from{box-shadow:0 0 0 3px #c8102e,0 0 8px rgba(255,255,255,.4)}to{box-shadow:0 0 0 3px #c8102e,0 0 28px rgba(255,255,255,1)}}
@keyframes langblink{from{background:transparent}to{background:#ffd54a}}
body.wide .langwrap{visibility:hidden}
body.rv-on{overflow:hidden}
.reveal{position:fixed; inset:0; z-index:30; display:flex; flex-direction:column; gap:10px; padding:calc(12px + env(safe-area-inset-top,0px)) 14px calc(14px + env(safe-area-inset-bottom,0px)); overflow:auto; color:var(--ivory); background:radial-gradient(900px 620px at 50% 15%,#e0303a,#9a1420 55%,#4a0a12)}
.reveal.s2{--chase:.22s}
.rv-top{display:flex; justify-content:space-between; align-items:center; gap:10px}
.rv-count{font-family:Cinzel,Georgia,serif; font-weight:700; letter-spacing:.1em; color:var(--gold-hi); font-size:clamp(14px,3vw,20px)}
.rv-b{display:inline-block; width:auto; margin:4px; padding:12px 26px}
.rv-stage{position:relative; flex:1; display:flex; align-items:center; justify-content:center; min-height:min(60vh,480px); border:6px solid transparent; border-radius:22px; overflow:hidden; background:linear-gradient(#6a0f1c,#35080f) padding-box,var(--goldgrad) border-box; box-shadow:0 0 60px rgba(246,224,160,.55)}
.rv-pair{display:grid; grid-template-columns:1fr 1fr; gap:18px; width:100%; max-width:1000px; padding:26px 22px; opacity:0; transition:opacity .8s .5s}
.s1 .rv-pair,.s2 .rv-pair{opacity:1}
@media(max-width:640px){.rv-pair{grid-template-columns:1fr; gap:6px; padding:30px 12px}}
.rv-slot{text-align:center}
.rv-lab{font-family:Cinzel,Georgia,serif; font-weight:700; letter-spacing:.14em; color:var(--gold-hi); font-size:clamp(12px,2.4vw,18px)}
.rv-photo{width:clamp(100px,20vw,210px); aspect-ratio:1; margin:10px auto; border-radius:50%; overflow:hidden; border:7px solid transparent; background:linear-gradient(#f7efe0,#f7efe0) padding-box,var(--goldgrad) border-box; box-shadow:0 0 34px rgba(246,224,160,.85)}
.rv-photo svg,.rv-photo img{width:100%; height:100%; object-fit:cover; display:block}
.nophoto .rv-photo{display:none}
.rv-name{display:block; margin-top:6px; font-family:Cinzel,Georgia,serif; font-weight:800; font-size:clamp(26px,6.5vw,62px); letter-spacing:.05em; text-transform:uppercase; filter:drop-shadow(0 0 14px rgba(246,224,160,.6))}
.rv-sub{font-size:clamp(17px,2.4vw,24px); margin-top:4px}
.rv-gift{width:clamp(100px,20vw,200px); height:clamp(100px,20vw,200px); margin:10px auto 0; display:block; filter:drop-shadow(0 6px 10px rgba(0,0,0,.5))}
.rv-q{color:var(--gold-hi); animation:rvq 1s ease-in-out infinite alternate}
@keyframes rvq{from{opacity:1}to{opacity:.3}}
.rv-real{display:none}
.s2 .rv-mystery{display:none}
.s2 .rv-real{display:block; animation:rvpop 1.1s cubic-bezier(.2,1.5,.4,1)}
@keyframes rvpop{0%{opacity:0; transform:scale(.3) rotate(-12deg)}100%{opacity:1; transform:none}}
.rv-end{position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; padding:20px}
.rv-curtain{position:absolute; top:0; bottom:0; width:50.5%; z-index:3; transition:transform 1.8s cubic-bezier(.7,0,.3,1); background:repeating-linear-gradient(90deg,#c8102e 0 14px,#8e0b20 14px 22px,#e0313f 22px 36px); box-shadow:inset 0 0 50px rgba(0,0,0,.45)}
.rv-curtain.l{left:0; border-right:4px solid var(--gold)}
.rv-curtain.r{right:0; border-left:4px solid var(--gold)}
.s1 .rv-curtain.l,.s2 .rv-curtain.l{transform:translateX(-102%)}
.s1 .rv-curtain.r,.s2 .rv-curtain.r{transform:translateX(102%)}
.rv-intro{position:absolute; z-index:4; text-align:center; padding:0 24px; transition:opacity .6s}
.rv-intro-t{display:block; margin-top:12px; font-family:Cinzel,Georgia,serif; font-weight:800; font-size:clamp(20px,4.6vw,40px); letter-spacing:.05em; color:var(--gold-hi); text-shadow:0 2px 10px rgba(0,0,0,.6)}
.s1 .rv-intro,.s2 .rv-intro{opacity:0; pointer-events:none}
.rv-actions{display:flex; justify-content:center; flex-wrap:wrap; gap:4px}
.floor .sa{width:clamp(72px,21vw,118px); height:clamp(101px,29vw,165px); margin:0 4px}
.tree.santa{transform-origin:50% 100%; animation:sway 3.6s ease-in-out infinite alternate}
@keyframes sway{from{transform:rotate(-1.6deg)}to{transform:rotate(1.6deg)}}
.aboutmodal{position:fixed; inset:0; z-index:55; display:flex; align-items:center; justify-content:center; padding:20px; background:rgba(0,0,0,.65)}
.aboutmodal .card{max-width:480px; width:100%}
.ab[disabled]{opacity:.4; cursor:not-allowed}
.wishbox{margin-top:16px; padding:14px 16px; border:2px solid var(--gold); border-radius:14px; background:rgba(8,50,30,.55); text-align:center}
.wishbox h3{margin:0 0 6px; font-family:Cinzel,Georgia,serif; font-size:17px; color:var(--gold-hi); letter-spacing:.06em}
.wishbox p{margin:0 0 8px; font-size:18px}
.wishbox textarea{width:100%; padding:8px 10px; border:2px solid var(--gold-lo); border-radius:10px; background:rgba(90,12,22,.55); color:var(--ivory); font:inherit; font-size:19px; resize:vertical}
.wishof{margin:14px auto 0; padding:10px 14px; max-width:420px; border:2px dashed var(--gold); border-radius:12px; background:rgba(0,0,0,.25)}
.wishof b{font-family:Cinzel,Georgia,serif; letter-spacing:.06em; color:var(--gold-hi)}
.wishof p{margin:6px 0 0; font-size:20px; white-space:pre-wrap}
.room{display:none; position:fixed; inset:0; z-index:0; pointer-events:none}
.room .chand{position:absolute; top:34px; left:50%; width:clamp(200px,24vw,320px); transform:translateX(-50%); filter:drop-shadow(0 0 14px rgba(255,226,140,.7))}
.room .cbulbs circle{fill:#ffe9a0; animation:cglow 2.2s ease-in-out infinite alternate}
.room .cbulbs circle:nth-child(even){animation-delay:-1.1s}
@keyframes cglow{from{opacity:.55}to{opacity:1}}
.room .win{position:absolute; top:110px; width:clamp(110px,11vw,160px); opacity:.95; filter:drop-shadow(0 0 16px rgba(246,224,160,.35))}
.room .win.l{left:max(5.5vw,70px)} .room .win.r{right:max(5.5vw,70px)}
.room .win{display:none}
@media(min-width:760px){.room{display:block}}
@media(min-width:1180px){.room .win{display:block}}
body.wide .room{display:none}
/* démo */
.ver{margin-top:14px; text-align:center; font-size:16px; color:#cdb98d}

body.calm *,body.calm *::before,body.calm *::after{animation:none!important; transition:none!important}
body.calm .sp{opacity:.7}

/* cases à cocher bien visibles dans l administration */
.adm{color-scheme:light}
.adm input[type=checkbox]{accent-color:#14452e; cursor:pointer}
 
.confide{max-width:460px; margin:16px auto 0; font-style:italic; font-size:22px; color:var(--gold-hi); text-shadow:0 0 12px rgba(0,0,0,.45)}
.wishnudge{margin:0 0 8px; font-weight:700; color:var(--gold-hi)}
.wishof .btn{min-height:44px; margin-top:10px; font-size:15px}

.barkbubble{display:inline-block; margin:12px auto 0; padding:6px 18px; font-family:Cinzel,Georgia,serif; font-weight:800; font-size:clamp(20px,6vw,30px); letter-spacing:.08em; color:#2a070d; background:linear-gradient(#fff6c8,#e8bf5e); border:3px solid #fff3c4; border-radius:20px; box-shadow:0 0 18px rgba(246,224,160,.8); animation:popin .6s cubic-bezier(.2,1.5,.4,1)}

/* décor de salle : guirlandes, lanternes, roulette, dés et jetons */
.room .garland{display:none; position:absolute; top:56px; left:0; right:0; height:70px; background:url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%22300%22 height=%2270%22 viewBox=%220 0 300 70%22%3E%3Cpath d=%22M-10 8Q150 66 310 8%22 fill=%22none%22 stroke=%22%230e5a35%22 stroke-width=%2213%22 stroke-linecap=%22round%22/%3E%3Cpath d=%22M-10 8Q150 66 310 8%22 fill=%22none%22 stroke=%22%232a9460%22 stroke-width=%227%22 stroke-linecap=%22round%22 stroke-dasharray=%223 5%22/%3E%3Cpath d=%22M-10 8Q150 66 310 8%22 fill=%22none%22 stroke=%22%23fff3c4%22 stroke-width=%222.6%22 stroke-linecap=%22round%22 stroke-dasharray=%221 16%22/%3E%3Ccircle cx=%2270%22 cy=%2232%22 r=%226.5%22 fill=%22%23c8102e%22/%3E%3Ccircle cx=%22150%22 cy=%2239%22 r=%227.5%22 fill=%22%23e8b84a%22/%3E%3Ccircle cx=%22230%22 cy=%2232%22 r=%226.5%22 fill=%22%23c8102e%22/%3E%3Cg fill=%22%23c8102e%22%3E%3Ccircle cx=%22106%22 cy=%2238%22 r=%223.2%22/%3E%3Ccircle cx=%22111%22 cy=%2241%22 r=%223.2%22/%3E%3Ccircle cx=%22190%22 cy=%2238%22 r=%223.2%22/%3E%3Ccircle cx=%22195%22 cy=%2241%22 r=%223.2%22/%3E%3C/g%3E%3Cg fill=%22%23c8102e%22 stroke=%22%23f6e0a0%22 stroke-width=%221.4%22%3E%3Cpath d=%22M0 12C-14-2-26 4-22 14C-18 22-6 18 0 12Z%22/%3E%3Cpath d=%22M0 12C14-2 26 4 22 14C18 22 6 18 0 12Z%22/%3E%3Ccircle cx=%220%22 cy=%2212%22 r=%225%22/%3E%3Cpath d=%22M-3 16L-8 30M3 16L8 30%22 fill=%22none%22/%3E%3Cpath d=%22M300 12C286-2 274 4 278 14C282 22 294 18 300 12Z%22/%3E%3Cpath d=%22M300 12C314-2 326 4 322 14C318 22 306 18 300 12Z%22/%3E%3Ccircle cx=%22300%22 cy=%2212%22 r=%225%22/%3E%3Cpath d=%22M297 16L292 30M303 16L308 30%22 fill=%22none%22/%3E%3C/g%3E%3C/svg%3E") repeat-x 0 0/300px 70px; filter:drop-shadow(0 4px 4px rgba(0,0,0,.35))}
.room .sconce,.room .roulette,.room .dice,.room .rchips{display:none; position:absolute}
.room .sconce{top:150px; width:44px; filter:drop-shadow(0 0 12px rgba(255,210,90,.8))}
.room .sconce.l{left:calc(max(5.5vw,70px) + 12vw)} .room .sconce.r{right:calc(max(5.5vw,70px) + 12vw)}
.room .flame{animation:flame .9s ease-in-out infinite alternate; transform-origin:50% 90%}
@keyframes flame{from{transform:scale(.9,.95); opacity:.8}to{transform:scale(1.05,1.08); opacity:1}}
.room .roulette{left:1.5vw; bottom:-40px; width:clamp(150px,15vw,240px); animation:spinwheel 60s linear infinite; filter:drop-shadow(0 0 16px rgba(0,0,0,.5))}
@keyframes spinwheel{to{transform:rotate(360deg)}}
.room .rchips{right:2vw; bottom:10px; width:clamp(80px,8vw,125px); height:clamp(70px,7vw,108px); filter:drop-shadow(0 6px 8px rgba(0,0,0,.5))}
.room .dice{right:calc(2vw + 9vw); bottom:12px; width:clamp(70px,7vw,108px); filter:drop-shadow(0 6px 8px rgba(0,0,0,.5))}
@media(min-width:900px){.room .garland{display:block}}
@media(min-width:1180px){.room .sconce,.room .roulette,.room .dice,.room .rchips{display:block}}
/* levier plus travaillé */
.lever .ball{width:32px; height:32px; box-shadow:inset -4px -6px 8px rgba(0,0,0,.35),0 3px 8px rgba(0,0,0,.6),0 0 18px rgba(255,80,60,.7)}
.lever .arm{width:12px; background:linear-gradient(90deg,#8a5f1a,#fff3c4 35%,#d9ae55 55%,#8a5f1a)}
.lever .base{width:28px; height:42px; background:radial-gradient(circle at 25% 20%,#fff3c4 0 2px,transparent 3px),radial-gradient(circle at 75% 20%,#fff3c4 0 2px,transparent 3px),radial-gradient(circle at 25% 80%,#fff3c4 0 2px,transparent 3px),radial-gradient(circle at 75% 80%,#fff3c4 0 2px,transparent 3px),linear-gradient(90deg,#8a5f1a,#f6e0a0 50%,#8a5f1a)}

.countdown{display:inline-block; margin:6px auto 12px; padding:6px 16px; font-family:Cinzel,Georgia,serif; font-weight:700; letter-spacing:.06em; font-size:17px; color:#fff3c4; background:rgba(8,40,24,.55); border:1.5px solid var(--gold-lo); border-radius:999px; text-shadow:0 0 10px rgba(0,0,0,.5)}

/* étiquettes cadeaux (impression) */
#labelsheet{position:absolute; left:-99999px; top:0; width:210mm; background:#fff}
.labpage{position:relative; width:210mm; height:297mm; overflow:hidden; background:#fff; break-after:page; page-break-after:always}
.labcrop{position:absolute; left:0; top:0; width:210mm; height:297mm}
.labgrid{position:absolute; left:20mm; top:28.5mm; display:grid; grid-template-columns:repeat(2,85mm); grid-auto-rows:40mm}
.labgrid .lab{display:block; width:85mm; height:40mm}
@media print{
  body.printing-labels>*:not(#labelsheet){display:none!important}
  body.printing-labels{background:#fff!important}
  body.printing-labels #labelsheet{position:static; left:auto; width:auto}
  body.printing-labels, body.printing-labels *{-webkit-print-color-adjust:exact; print-color-adjust:exact}
}

.trnote{display:block; margin:4px 0 8px; font-size:15px; opacity:.85}

/* indication sur la poignée : une bulle avec une flèche et une boule qui clignote tant que la personne n'a pas tiré */
.lever{position:relative}
.leverhint{position:absolute; bottom:100%; right:-12px; margin-bottom:12px; padding:6px 12px; white-space:pre; text-align:center; z-index:6; pointer-events:none; font-family:Cinzel,Georgia,serif; font-weight:800; font-size:14px; line-height:1.15; letter-spacing:.06em; text-transform:uppercase; color:#3a0a10; background:linear-gradient(#fff3c4,#e8bf5e); border:2px solid #fff6d8; border-radius:14px; box-shadow:0 4px 12px rgba(0,0,0,.45),0 0 14px rgba(255,214,102,.8); animation:hintbob 1.1s ease-in-out infinite}
.leverhint::after{content:""; position:absolute; top:100%; right:17px; border:9px solid transparent; border-top-color:#e8bf5e; filter:drop-shadow(0 2px 1px rgba(0,0,0,.3))}
@keyframes hintbob{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
.lever.hint:not(.busy) .ball{animation:ballblink .9s ease-in-out infinite}
@keyframes ballblink{0%,100%{box-shadow:inset -4px -6px 8px rgba(0,0,0,.35),0 3px 8px rgba(0,0,0,.6),0 0 10px rgba(255,80,60,.6); transform:scale(1)}50%{box-shadow:inset -4px -6px 8px rgba(0,0,0,.35),0 3px 8px rgba(0,0,0,.6),0 0 26px 8px rgba(255,214,102,.95); transform:scale(1.18)}}

/* fiche de suivi des envois (impression) */
#followsheet{position:absolute; left:-99999px; top:0; width:277mm; background:#fff; color:#111; font:9.5pt Georgia,serif}
#followsheet h1{font:700 15pt Georgia,serif; margin:0 0 1.5mm; color:#14452e}
#followsheet h2{font:700 12pt Georgia,serif; margin:5mm 0 2mm; color:#14452e}
#followsheet .fsmeta{margin:0 0 2.5mm; font-size:9pt; color:#444}
#followsheet .fsleg{margin:2.5mm 0 0; font-size:8pt; color:#444}
#followsheet table{border-collapse:collapse; width:100%}
#followsheet th,#followsheet td{border:1px solid #555; padding:1.1mm 1mm; text-align:center; vertical-align:middle}
#followsheet th{background:#e9e2cc; font-size:8pt; line-height:1.15; white-space:nowrap}
#followsheet td.nm{text-align:left; font-weight:700; white-space:nowrap}
#followsheet td.ct{font-size:9pt; color:#555; white-space:nowrap}
#followsheet td.rem{min-width:24mm}
#followsheet tr.tot td{background:#f4efdd; font-weight:700; font-size:8.5pt; white-space:nowrap}
#followsheet tr{break-inside:avoid}
#followsheet .fcb{display:inline-block; width:4.6mm; height:4.6mm; border:1.3px solid #222; border-radius:1mm; vertical-align:middle; text-align:center; line-height:4.3mm; font-size:3.8mm; font-weight:700; background:#fff}
#followsheet .fcb.on{background:#d8ecd2}
#followsheet .fcb.on::after{content:"\2713"}
@media print{
  body.printing-follow>*:not(#followsheet){display:none!important}
  body.printing-follow{background:#fff!important}
  body.printing-follow #followsheet{position:static; left:auto; width:auto}
  body.printing-follow, body.printing-follow *{-webkit-print-color-adjust:exact; print-color-adjust:exact}
}

/* écran projeté bilingue : la ligne italienne sous la ligne française */
.rv-it{display:block; font-size:.78em; font-weight:500; opacity:.88; letter-spacing:.06em; margin-top:2px}
.rv-lab .rv-it{letter-spacing:.1em}

/* téléphone : les décors qui dépassent ne doivent pas élargir la page (sinon la révélation en plein écran est coupée à droite) */
html,body{overflow-x:hidden; max-width:100vw}