:root{--bg: #0c1024;--bg2: rgba(255, 255, 255, .06);--glass-border: rgba(255, 255, 255, .12);--accent: #ffcb05;--accent2: #4da3ff;--text: #f5f6ff;--muted: #9aa3d4;--ok: #5ef0b0;--err: #ff8a8a;--glow-gold: 0 0 18px rgba(255, 203, 5, .45);--glow-blue: 0 0 22px rgba(77, 163, 255, .45)}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;background:var(--bg);color:var(--text);overflow-x:hidden}body:before{content:"";position:fixed;top:-30%;right:-30%;bottom:-30%;left:-30%;z-index:-1;background:radial-gradient(40% 35% at 20% 20%,rgba(77,163,255,.35),transparent 60%),radial-gradient(45% 40% at 85% 15%,rgba(168,85,247,.32),transparent 60%),radial-gradient(50% 45% at 70% 90%,rgba(255,203,5,.18),transparent 60%),radial-gradient(45% 40% at 10% 85%,rgba(94,240,176,.16),transparent 60%);filter:blur(40px) saturate(1.2);animation:drift 22s ease-in-out infinite alternate}@keyframes drift{0%{transform:translate(0) scale(1)}50%{transform:translate(3%,-2%) scale(1.08)}to{transform:translate(-3%,2%) scale(1.04)}}.app{max-width:640px;margin:0 auto;min-height:100%;display:flex;flex-direction:column;padding:env(safe-area-inset-top) 16px env(safe-area-inset-bottom)}header{display:flex;align-items:center;justify-content:space-between;padding:16px 0 12px}header h1{font-size:1.45rem;margin:0;font-weight:800;letter-spacing:.5px;background:linear-gradient(100deg,var(--accent),#fff 40%,var(--accent2));-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 0 14px rgba(77,163,255,.4))}header h1 .logo-btn{background:none;border:none;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;padding:0;border-radius:0;font:inherit;letter-spacing:inherit;color:inherit}header h1 .logo-btn:hover{transform:none}.header-controls{display:flex;gap:8px;align-items:center}select,input,button{font:inherit;border-radius:12px;border:1px solid var(--glass-border);background:var(--bg2);color:var(--text);padding:10px 12px;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);transition:transform .15s ease,box-shadow .2s ease,border-color .2s ease}select:focus,input:focus{outline:none;border-color:var(--accent2);box-shadow:var(--glow-blue)}select{color-scheme:dark}option{background:#11162e;color:var(--text)}button{cursor:pointer;font-weight:700;background:linear-gradient(135deg,var(--accent2),#2f6fd6);border:none;box-shadow:0 6px 18px #2f6fd659}button:hover{transform:translateY(-1px)}button:active{transform:translateY(1px) scale(.99)}button:disabled{opacity:.45;cursor:not-allowed;transform:none;box-shadow:none}button.secondary{background:var(--bg2);border:1px solid var(--glass-border);box-shadow:none}.icon-btn{position:relative;background:var(--bg2);border:1px solid var(--glass-border);padding:10px 12px;box-shadow:none}.badge{position:absolute;top:-6px;right:-6px;background:var(--accent);color:#0c1024;font-size:.7rem;font-weight:800;min-width:19px;height:19px;border-radius:10px;padding:0 5px;display:flex;align-items:center;justify-content:center;box-shadow:var(--glow-gold)}main{flex:1;display:flex;flex-direction:column;gap:14px}.instruction{color:var(--muted);margin:4px 0;line-height:1.5}.instruction strong{color:var(--text)}.panel{background:var(--bg2);border:1px solid var(--glass-border);border-radius:16px;padding:16px;display:flex;flex-direction:column;gap:10px;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);animation:fadeUp .4s ease both}.panel label{display:flex;flex-direction:column;gap:6px;font-size:.9rem;color:var(--muted)}.hint{color:var(--muted);font-size:.85rem}.camera{position:relative;border-radius:20px;overflow:hidden;background:#000;aspect-ratio:3 / 4;box-shadow:0 18px 50px #0000008c,inset 0 0 0 1px var(--glass-border)}.camera video{width:100%;height:100%;object-fit:cover;display:block}.reticle{position:absolute;top:9%;left:50%;height:82%;aspect-ratio:63 / 88;transform:translate(-50%);pointer-events:none}.reticle .corner{position:absolute;width:34px;height:34px;border:3px solid var(--accent);filter:drop-shadow(var(--glow-gold));transition:border-color .3s ease}.reticle .tl{top:0;left:0;border-right:none;border-bottom:none;border-top-left-radius:10px}.reticle .tr{top:0;right:0;border-left:none;border-bottom:none;border-top-right-radius:10px}.reticle .bl{bottom:0;left:0;border-right:none;border-top:none;border-bottom-left-radius:10px}.reticle .br{bottom:0;right:0;border-left:none;border-top:none;border-bottom-right-radius:10px}.reticle .scanline{position:absolute;left:6px;right:6px;height:3px;top:0;background:linear-gradient(90deg,transparent,var(--accent2),transparent);box-shadow:var(--glow-blue);border-radius:3px;animation:scan 2.4s cubic-bezier(.45,0,.55,1) infinite}@keyframes scan{0%{top:2%;opacity:0}10%{opacity:1}90%{opacity:1}to{top:98%;opacity:0}}.reticle.checking .corner{border-color:var(--ok);filter:drop-shadow(0 0 14px rgba(94,240,176,.7))}.reticle.checking .scanline{background:linear-gradient(90deg,transparent,var(--ok),transparent);animation-duration:1s}.scan-status{position:absolute;top:12px;left:12px;right:12px;display:flex;align-items:center;gap:8px;background:#080b1c8c;color:#fff;padding:9px 12px;border-radius:12px;font-size:.85rem;border:1px solid var(--glass-border);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}.scan-status .read{color:var(--accent);font-variant-numeric:tabular-nums}.scan-status .diag{opacity:.5;font-variant-numeric:tabular-nums;font-size:.85em}.scan-status .dot{width:9px;height:9px;border-radius:50%;background:var(--accent);flex:none;box-shadow:var(--glow-gold)}.scan-status .dot.busy{background:var(--ok);box-shadow:0 0 12px #5ef0b0b3;animation:blink .8s infinite}@keyframes blink{50%{opacity:.3}}.manual-btn{position:absolute;bottom:16px;left:50%;transform:translate(-50%);background:#080b1c99;border:1px solid rgba(255,255,255,.3);color:#fff;padding:11px 20px;border-radius:26px;font-weight:700;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}.camera-error{background:var(--bg2);border:1px solid var(--glass-border);border-radius:16px;padding:18px}.import-btn{display:block;text-align:center;cursor:pointer;background:var(--bg2);border:1px solid var(--glass-border);color:var(--text);border-radius:12px;padding:12px;font-weight:700;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);transition:transform .15s ease,border-color .2s ease}.import-btn:active{transform:scale(.99)}.review{display:flex;flex-direction:column;gap:14px;animation:fadeUp .4s ease both}.preview{width:100%;max-height:50vh;object-fit:contain;border-radius:16px;background:#000;box-shadow:0 14px 40px #00000080}.progress{position:relative;height:30px;background:var(--bg2);border:1px solid var(--glass-border);border-radius:10px;overflow:hidden}.progress .bar{position:absolute;inset:0 auto 0 0;background:linear-gradient(90deg,var(--accent2),var(--accent));transition:width .2s;box-shadow:var(--glow-blue)}.progress span{position:relative;display:block;text-align:center;line-height:30px;font-size:.85rem}.fields{display:flex;flex-direction:column;gap:12px}.fields label{display:flex;flex-direction:column;gap:6px;color:var(--muted);font-size:.9rem}.actions{display:flex;gap:12px}.actions button{flex:1}.raw summary{color:var(--muted);cursor:pointer}.raw pre{background:var(--bg2);border:1px solid var(--glass-border);padding:10px;border-radius:12px;overflow:auto;font-size:.8rem;white-space:pre-wrap}.results{display:flex;flex-direction:column;gap:12px}.card{display:flex;gap:14px;background:var(--bg2);border:1px solid var(--glass-border);border-radius:18px;padding:14px;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);box-shadow:0 10px 30px #00000059;animation:fadeUp .45s ease both}.results .card:nth-child(2){animation-delay:.05s}.results .card:nth-child(3){animation-delay:.1s}.results .card:nth-child(4){animation-delay:.15s}.card img{width:104px;border-radius:10px;align-self:flex-start;box-shadow:0 8px 22px #00000080;transition:transform .3s ease;display:block}.card img:hover{transform:scale(1.04) rotate(-1deg)}.thumb{position:relative;flex:none;border-radius:10px;overflow:hidden;align-self:flex-start;box-shadow:0 8px 22px #00000080}.thumb img{box-shadow:none}.thumb.holo:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none;background:linear-gradient(115deg,transparent 25%,rgba(255,255,255,.55) 38%,rgba(120,220,255,.5) 46%,rgba(255,120,220,.5) 54%,rgba(180,255,170,.45) 62%,transparent 75%);background-size:250% 250%;mix-blend-mode:color-dodge;animation:holo 3.5s linear infinite}.thumb.holo:before{content:"✦";position:absolute;top:6px;right:6px;z-index:1;color:#fff;font-size:12px;filter:drop-shadow(var(--glow-gold));animation:twinkle 1.6s ease-in-out infinite}@keyframes holo{0%{background-position:0% 0%}to{background-position:200% 200%}}@keyframes twinkle{0%,to{opacity:.4;transform:scale(.8)}50%{opacity:1;transform:scale(1.2)}}.sparkles{position:fixed;top:0;right:0;bottom:0;left:0;z-index:51;pointer-events:none}.sparkle{position:absolute;width:var(--s);height:var(--s);border-radius:50%;background:radial-gradient(circle,#fff 0%,var(--hue) 45%,transparent 70%);box-shadow:0 0 10px var(--hue);opacity:0;animation:spark var(--d) ease-out var(--delay) forwards}@keyframes spark{0%{transform:scale(0) translateY(0);opacity:0}35%{opacity:1}to{transform:scale(1.5) translateY(-22px);opacity:0}}.card-info{flex:1;min-width:0}.card-info h2{margin:0 0 4px;font-size:1.1rem}.meta{color:var(--muted);font-size:.85rem;margin:0 0 8px}.price{font-size:1.6rem;font-weight:800;margin:0;background:linear-gradient(120deg,var(--ok),#aef7d6);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 0 10px rgba(94,240,176,.4));animation:pricePop .5s cubic-bezier(.2,1.2,.4,1) both}.price.muted{color:var(--muted);background:none;-webkit-text-fill-color:var(--muted);font-size:1rem;font-weight:600;filter:none}.price-alt{font-size:1rem;color:var(--text);margin:2px 0 0}.src{font-size:.72rem;color:var(--muted);font-weight:600;-webkit-text-fill-color:var(--muted)}.links{display:flex;gap:12px;margin-top:10px;flex-wrap:wrap}.links a{color:var(--accent);font-size:.85rem;font-weight:600;text-decoration:none;border-bottom:1px solid rgba(255,203,5,.4)}.keep-btn{margin-top:12px;width:100%;background:linear-gradient(135deg,var(--accent),#ffb800);color:#0c1024;border:none;font-weight:800;padding:11px;border-radius:12px;box-shadow:var(--glow-gold)}.keep-btn.kept{background:transparent;border:1px solid var(--ok);color:var(--ok);box-shadow:none}.history-summary{color:var(--muted);margin:0}.history-summary strong{color:var(--ok)}.error{color:var(--err);background:#ff8a8a1f;border:1px solid rgba(255,138,138,.3);padding:11px 13px;border-radius:12px}.flash{position:fixed;top:0;right:0;bottom:0;left:0;z-index:50;pointer-events:none;background:radial-gradient(circle at center,rgba(94,240,176,.35),transparent 65%);animation:flashOut .7s ease-out forwards}@keyframes fadeUp{0%{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}@keyframes pricePop{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}@keyframes flashOut{0%{opacity:1}to{opacity:0}}.splash{position:fixed;top:0;right:0;bottom:0;left:0;z-index:100;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;overflow:hidden;text-align:center;background:radial-gradient(45% 40% at 30% 25%,rgba(77,163,255,.4),transparent 60%),radial-gradient(45% 40% at 75% 30%,rgba(168,85,247,.38),transparent 60%),radial-gradient(55% 50% at 55% 90%,rgba(255,203,5,.22),transparent 60%),#0c1024;animation:splashBgIn .4s ease both}.splash.leaving{animation:splashOut .6s ease forwards}@keyframes splashBgIn{0%{opacity:0}to{opacity:1}}@keyframes splashOut{to{opacity:0;transform:scale(1.12);visibility:hidden}}.splash-sparks{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.splash-spark{position:absolute;width:var(--s);height:var(--s);border-radius:50%;background:radial-gradient(circle,#fff 0%,var(--hue) 45%,transparent 70%);box-shadow:0 0 10px var(--hue);opacity:0;animation:sparkTwinkle var(--d) ease-in-out var(--delay) infinite}@keyframes sparkTwinkle{0%,to{opacity:0;transform:scale(.4)}50%{opacity:1;transform:scale(1.2)}}.splash-logo svg{filter:drop-shadow(0 0 26px rgba(77,163,255,.55));animation:logoPop .8s cubic-bezier(.2,1.3,.4,1) both,bob 3s ease-in-out .8s infinite}@keyframes logoPop{0%{transform:scale(0) rotate(-45deg);opacity:0}to{transform:scale(1) rotate(0);opacity:1}}@keyframes bob{50%{transform:translateY(-10px)}}.splash-hello{margin:14px 0 0;font-size:1.1rem;color:var(--muted);letter-spacing:6px;text-transform:uppercase;opacity:0;animation:fadeUp .6s ease .5s forwards}.splash-names{margin:0;font-weight:900;line-height:1.05;font-size:clamp(2.6rem,14vw,4.4rem);overflow-wrap:anywhere;max-width:100%;padding:0 12px;background:linear-gradient(100deg,var(--accent),#ffffff 45%,var(--accent2));-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 0 26px rgba(77,163,255,.5));opacity:0;animation:namesPop .9s cubic-bezier(.2,1.2,.3,1) .85s forwards}@keyframes namesPop{0%{opacity:0;transform:scale(.6) translateY(20px)}60%{opacity:1}to{opacity:1;transform:none}}.splash-tap{margin-top:26px;color:var(--muted);font-size:.8rem;opacity:0;animation:fadeUp .5s ease 1.9s forwards,pulseTap 1.6s ease-in-out 2.4s infinite}@keyframes pulseTap{50%{opacity:.45}}@media (prefers-reduced-motion: reduce){*,body:before{animation:none!important}.splash-hello,.splash-names,.splash-tap{opacity:1!important}.gold-overlay{animation:goldFade .3s ease both!important}.gold-confetti,.premium-fx{display:none}}.gold-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:90;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:20px;text-align:center;overflow:hidden;background:#000c;backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px)}@keyframes goldFade{0%{opacity:0}to{opacity:1}}.gold-overlay>*{position:relative}.gold-burst{position:absolute!important;top:0;right:0;bottom:0;left:0;pointer-events:none}.gold-rays{position:absolute;left:50%;top:38%;width:340px;height:340px;margin:-170px;border-radius:50%;animation:goldSpin 12s linear infinite;background:repeating-conic-gradient(#ffcb0533 0 10deg,transparent 10deg 20deg);-webkit-mask:radial-gradient(circle,#000 30%,transparent 70%);mask:radial-gradient(circle,#000 30%,transparent 70%)}.gold-tw{position:absolute;color:#fff;text-shadow:0 0 10px #ffcb05;animation:goldTwinkle 1.4s ease-in-out infinite}.gold-star{font-size:4.2rem;filter:drop-shadow(0 0 18px #ffcb05);animation:goldFloat 2.4s ease-in-out infinite}.gold-star.pop{animation:goldPop .8s ease-out,goldFloat 2.4s ease-in-out .8s infinite}.gold-title{margin:0;font-size:1.7rem;color:var(--accent);text-shadow:0 0 16px #ffcb0588;overflow-wrap:anywhere;max-width:100%}.gold-glass{background:#ffffff10;border:1px solid #ffffff22;border-radius:18px;padding:14px;margin:6px 0;text-align:left;font-size:.9rem;width:min(100%,340px)}.perks{list-style:none;display:flex;flex-direction:column;gap:8px}.gold-cta{width:min(100%,340px);border:0;border-radius:14px;padding:13px;font-weight:800;font-size:1rem;color:#1a1300;box-shadow:none;background:linear-gradient(90deg,#ffb800,#ffe066,#ffb800);background-size:200% 100%;animation:goldSlide 2.5s linear infinite,goldPulse 1.6s ease-in-out infinite}.gold-link{background:none;box-shadow:none;color:var(--muted);font-weight:600}.gold-confetti{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.gold-confetti i{position:absolute;top:0;width:7px;height:12px;border-radius:2px;animation:goldFall linear infinite}.badge-overlay{perspective:600px}.coin-wrap{transform-style:preserve-3d;animation:coinFlip 1.6s cubic-bezier(.2,.8,.2,1) both}.coin{width:180px;height:180px;border-radius:50%;background-size:122%;background-position:center;mix-blend-mode:screen;filter:drop-shadow(0 0 20px #ffcb05);animation:coinWobble 3s ease-in-out infinite}@keyframes coinFlip{0%{transform:scale(0) rotateY(0)}55%{transform:scale(1.15) rotateY(540deg)}to{transform:scale(1) rotateY(720deg)}}@keyframes coinWobble{0%,to{transform:rotateY(-18deg) rotateX(6deg)}50%{transform:rotateY(18deg) rotateX(-6deg)}}.premium-fx{position:fixed;top:0;right:0;bottom:0;left:0;z-index:80;pointer-events:none;overflow:hidden}.premium-fx .beam{position:absolute;left:0;right:0;height:40px;filter:blur(2px);background:linear-gradient(transparent,#ffe066cc,transparent);animation:goldSweep 1.2s ease-in-out both}.premium-fx .wave{position:absolute;left:50%;top:50%;width:160px;height:160px;margin:-80px;border-radius:50%;border:3px solid #ffcb05;animation:goldRing 1.2s ease-out both}@keyframes goldSweep{0%{top:-10%}to{top:110%}}@keyframes goldRing{0%{transform:scale(.3);opacity:1}to{transform:scale(2.4);opacity:0}}@keyframes goldSpin{to{transform:rotate(360deg)}}@keyframes goldTwinkle{50%{opacity:.2;transform:scale(.5)}}@keyframes goldFloat{50%{transform:translateY(-6px) rotate(-3deg)}}@keyframes goldPop{0%{transform:scale(0) rotate(-30deg)}70%{transform:scale(1.25) rotate(8deg)}to{transform:scale(1)}}@keyframes goldSlide{to{background-position:-200% 0}}@keyframes goldPulse{50%{box-shadow:0 0 24px #ffcb05aa;transform:scale(1.03)}}@keyframes goldFall{0%{transform:translateY(-40px) rotate(0)}to{transform:translateY(110vh) rotate(720deg)}}.premium-banner{position:relative;display:block;width:fit-content;margin:0 auto 6px;padding:0 18px;font-weight:900;font-size:.85rem;letter-spacing:3px;text-transform:uppercase;pointer-events:none;background:linear-gradient(90deg,#b8860b,#ffe066,#fff6c8,#ffe066,#b8860b);background-size:200% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:goldSlide 3s linear infinite,goldGlow 2.4s ease-in-out infinite}@keyframes goldGlow{50%{filter:drop-shadow(0 0 10px #ffcb05cc)}}.username-card{position:relative;display:flex;flex-direction:column;gap:12px;width:min(100%,340px);padding:22px;border-radius:18px;background:var(--bg2);border:1px solid var(--glass-border)}.username-card h2{margin:0;color:var(--accent)}.username-card .hint{margin:0}.match{font-weight:600}.match-forte{color:#5ef0b0}.match-moyenne{color:#ffcb05}.match-faible{color:var(--muted)}.instruction.warn{color:#ffcb05}.progress.indeterminate .bar{width:40%;background:linear-gradient(90deg,transparent,var(--accent2),var(--accent),transparent);animation:indeterminate 1.1s ease-in-out infinite}@keyframes indeterminate{0%{transform:translate(-100%)}to{transform:translate(350%)}}@media (prefers-reduced-motion: reduce){.progress.indeterminate .bar{animation:none;width:100%;opacity:.6}}
