/* Animation d'arrivée « REJOICE » : une fois par visite, par-dessus la page qui se charge dessous. */
html.arrivee-on,html.arrivee-on body{overflow:hidden}
html.sans-arrivee .arrivee{display:none}
.arrivee{--vert:#234d0b;--pale:#def8c6;--lime:#a3d96b;--violet:#6b5fe0;--lavande:#cfcbf8;--creme:#f6fdf0;--k:1;
  --titre:"VG5000","Courier New",monospace;--mono:"Geist Mono",ui-monospace,"SFMono-Regular",Menlo,Consolas,monospace;
  position:fixed;inset:0;z-index:1000;cursor:pointer;background:var(--pale);color:var(--vert);font-family:var(--mono)}
@media (min-width:1800px){.arrivee{--k:1.35}}
@media (min-width:2300px){.arrivee{--k:1.7}}
.arrivee.vague{background:none}
.arrivee canvas{position:absolute;inset:0;width:100%;height:100%;image-rendering:pixelated}
.a-cadre{position:absolute;inset:calc(env(safe-area-inset-top,0px) + 12px) max(12px,env(safe-area-inset-right,0px)) calc(env(safe-area-inset-bottom,0px) + 12px) max(12px,env(safe-area-inset-left,0px));pointer-events:none;font-size:10px;letter-spacing:.14em;text-transform:uppercase}
.a-coin{position:absolute;width:18px;height:18px;border:0 solid var(--vert)}
.a-coin.hg{left:0;top:0;border-width:3px 0 0 3px}.a-coin.hd{right:0;top:0;border-width:3px 3px 0 0}
.a-coin.bg{left:0;bottom:0;border-width:0 0 3px 3px}.a-coin.bd{right:0;bottom:0;border-width:0 3px 3px 0}
.a-haut{position:absolute;left:28px;right:28px;top:4px;display:flex;justify-content:space-between;gap:12px}
.a-haut b{font-weight:700}
.a-rayures{position:absolute;left:28px;width:min(46%,220px);top:24px;height:8px;background:repeating-linear-gradient(-45deg,var(--vert) 0 4px,transparent 4px 8px)}
.a-regle{position:absolute;right:4px;top:64px;bottom:96px;width:10px;background:repeating-linear-gradient(to bottom,var(--vert) 0 2px,transparent 2px 12px) right/6px 100% no-repeat,repeating-linear-gradient(to bottom,var(--vert) 0 2px,transparent 2px 60px) right/10px 100% no-repeat}
.a-cible{position:absolute;right:26px;top:44px;width:30px;height:30px}
.a-cible circle,.a-cible path{fill:none;stroke:var(--violet);stroke-width:2}
.a-bas{position:absolute;left:28px;right:28px;bottom:6px;display:flex;align-items:flex-end;justify-content:space-between;gap:12px}
.a-code{display:grid;gap:4px}
.a-barres{height:22px;width:112px;background:linear-gradient(90deg,var(--vert) 0 3px,transparent 3px 5px,var(--vert) 5px 6px,transparent 6px 9px,var(--vert) 9px 13px,transparent 13px 15px,var(--vert) 15px 16px,transparent 16px 18px,var(--vert) 18px 20px,transparent 20px 24px,var(--vert) 24px 25px,transparent 25px 27px,var(--vert) 27px 31px,transparent 31px 32px,var(--vert) 32px 33px,transparent 33px 36px) 0 0/36px 100% repeat-x}
.a-term{position:absolute;left:max(24px,env(safe-area-inset-left,0px));right:max(24px,env(safe-area-inset-right,0px));top:50%;transform:translateY(-50%);max-width:440px;margin:0 auto;font-size:clamp(12px,3.3vw,15px);line-height:1.75;font-variant-numeric:tabular-nums}
.a-ent{display:flex;align-items:baseline;gap:10px;font-family:var(--titre);font-size:clamp(17px,5vw,22px);letter-spacing:.03em}
.a-sec{font-family:var(--mono);font-size:12px;color:var(--pale);background:var(--vert);padding:2px 6px}
.a-trait{color:var(--violet);letter-spacing:.2em;margin:4px 0 8px;white-space:nowrap;overflow:hidden}
.a-term p{margin:0;white-space:pre;visibility:hidden;display:flex;align-items:center;gap:8px}
.a-term p.on{visibility:visible}
.a-ok{font-weight:700}
.a-ferme{color:var(--violet);font-weight:700}
.a-f{flex:none;width:8px;height:8px;background:var(--violet)}
.a-f.rond{border-radius:50%}
.a-f.tri{background:none;width:0;height:0;border:5px solid transparent;border-bottom:8px solid var(--violet);border-top:0}
.a-f.los{transform:rotate(45deg) scale(.8)}
.a-f.creux{background:none;box-shadow:inset 0 0 0 2px var(--violet)}
.a-charge{margin-top:12px;display:flex;align-items:center;gap:10px}
.a-pl{flex:1;height:14px;box-shadow:inset 0 0 0 2px var(--vert);padding:3px;display:flex;gap:2px}
.a-pl b{flex:1;background:var(--vert);opacity:0}
.a-pl b.on{opacity:1}
.a-pc{min-width:4ch;text-align:right;font-weight:700}
.a-rejoice{margin-top:20px;min-height:2.6em;font-family:var(--titre);font-size:clamp(14px,5vw,24px);line-height:1.3;letter-spacing:.06em;white-space:pre}
.a-cur{display:inline-block;width:.55em;height:1em;margin-left:3px;vertical-align:-.12em;background:var(--violet);animation:a-clin 900ms steps(1) infinite}
@keyframes a-clin{50%{opacity:0}}
.a-passer{pointer-events:auto;font:inherit;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--vert);background:none;border:0;padding:12px 4px;box-shadow:inset 0 -2px 0 var(--vert);cursor:pointer}
.arrivee.fin .a-term,.arrivee.fin .a-cadre{opacity:0;transition:opacity 120ms steps(2,end)}
@media (min-width:1000px){.a-term{max-width:calc(540px * var(--k));font-size:calc(17px * var(--k))}.a-ent{font-size:calc(26px * var(--k))}.a-sec{font-size:calc(12px * var(--k))}.a-rejoice{font-size:calc(24px * var(--k))}.a-cadre{font-size:calc(10px * var(--k))}}
@media (max-width:420px){.a-rayures{display:none}.a-haut span:last-child{display:none}}
