0.7){ _playAnim('run'); flashRoot.rotation.x = 0.12; } else if(pct > 0.08){ _playAnim('walk'); flashRoot.rotation.x = 0.04; } else { _playAnim('breathing'); flashRoot.rotation.x *= 0.9; } bones.glow.intensity = pct > 0.1 ? 0.5 + pct * 2.5 : 0.2; bones.glow.color.set(pct > 0.75 ? 0xFF4400 : 0xFFD700); } if (pct > 0.01) { segments.forEach(function (seg) { seg.position.z += spd; if (seg.position.z > SEG) seg.position.z -= NSEGS * SEG; }); dashes.forEach(function (d) { d.position.z += spd; if (d.position.z > 12) d.position.z -= dashes.length * 9; }); } var t2 = frameN * 0.05, freq = 3.5 + pct * 9, amp = 0.45 + pct * 0.65; // Animate Flash model if (bones.loaded) { var _t = frameN * 0.05; var _freq = 3.5 + pct * 9; var _amp = 0.5 + pct * 0.7; if (pct > 0.04) { // Forward lean flashRoot.rotation.x = pct * 0.2; flashRoot.position.y = Math.abs(Math.sin(_t * _freq)) * 0.06; // Leg bones if (bones.lH) { bones.lH.rotation.x = Math.sin(_t * _freq) * _amp; } if (bones.rH) { bones.rH.rotation.x = -Math.sin(_t * _freq) * _amp; } if (bones.lK) { bones.lK.rotation.x = Math.max(0, Math.sin(_t * _freq + 0.8)) * _amp * 0.8; } if (bones.rK) { bones.rK.rotation.x = Math.max(0, -Math.sin(_t * _freq + 0.8)) * _amp * 0.8; } if (bones.lAn) { bones.lAn.rotation.x = -Math.sin(_t * _freq) * 0.25; } if (bones.rAn) { bones.rAn.rotation.x = Math.sin(_t * _freq) * 0.25; } // Arm bones if (bones.lA) { bones.lA.rotation.x = -Math.sin(_t * _freq) * _amp * 0.5; } if (bones.rA) { bones.rA.rotation.x = Math.sin(_t * _freq) * _amp * 0.5; } if (bones.lE) { bones.lE.rotation.x = Math.max(0, -Math.sin(_t * _freq)) * 0.7; } if (bones.rE) { bones.rE.rotation.x = Math.max(0, Math.sin(_t * _freq)) * 0.7; } // Spine lean if (bones.spine) { bones.spine.rotation.x = pct * 0.15; } // Head stable if (bones.hp2 && bones.hp2 !== flashRoot) { bones.hp2.rotation.x = -pct * 0.1; } // Glow bones.glow.intensity = 0.8 + pct * 3; bones.glow.color.set(pct > 0.75 ? 0xFF4400 : 0xFFD700); } else { // Idle: gentle breathing flashRoot.rotation.x *= 0.95; flashRoot.position.y = Math.sin(frameN * 0.025) * 0.025; // Reset all bones smoothly var resetBone = function resetBone(b) { if (b && b !== flashRoot) { b.rotation.x *= 0.9; b.rotation.z *= 0.9; } }; [bones.lH, bones.rH, bones.lK, bones.rK, bones.lAn, bones.rAn, bones.lA, bones.rA, bones.lE, bones.rE, bones.spine].forEach(resetBone); bones.glow.intensity = 0.2; bones.glow.color.set(0xFFD700); } } if (pct > 0.3 && frameN % 4 === 0) { var free = trails.find(function (t3) { return !t3.active; }); if (free) { free.active = true; free.life = 1; var side = Math.random() > 0.5 ? 1 : -1, y = 0.4 + Math.random() * 1.5; var len = 0.4 + pct * 2.8; free.line.geometry.setFromPoints([new THREE.Vector3(side * 0.3, y, 3.5), new THREE.Vector3(side * (0.3 + len), y, 3.5)]); free.line.material.opacity = 0.7 * pct; free.line.material.color.set(pct > 0.8 ? 0xFF6600 : 0xFFD700); } } trails.forEach(function (tr) { if (!tr.active) return; tr.life -= 0.07; tr.line.material.opacity = tr.life * 0.55 * pct; tr.line.position.z += spd * 0.3; if (tr.life <= 0) { tr.active = false; tr.line.material.opacity = 0; tr.line.position.z = 0; } }); if (pct > 0.8) { camera.position.x = (Math.random() - 0.5) * 0.01; camera.position.y = 4 + (Math.random() - 0.5) * 0.01; } else { camera.position.x = 0; camera.position.y = 4; } renderer.render(scene, camera); } animate(); var onR = function onR() { var W2 = mount.clientWidth, H2 = mount.clientHeight; camera.aspect = W2 / H2; camera.updateProjectionMatrix(); renderer.setSize(W2, H2); }; window.addEventListener("resize", onR); return function () { cancelAnimationFrame(raf2); window.removeEventListener("resize", onR); mount.removeChild(renderer.domElement); renderer.dispose(); }; }, [THREE]); return /*#__PURE__*/React.createElement("div", { ref: ref, onClick: onTap, style: { position: "absolute", inset: 0, cursor: "pointer" } }); } function RunScreen(_ref2) { var G = _ref2.G, setG = _ref2.setG, onHub = _ref2.onHub, onCombat = _ref2.onCombat; var _useState3 = useState(0), _useState4 = _slicedToArray(_useState3, 2), speed = _useState4[0], setSpeed = _useState4[1]; var _useState5 = useState(0), _useState6 = _slicedToArray(_useState5, 2), dist = _useState6[0], setDist = _useState6[1]; var _useState7 = useState(0), _useState8 = _slicedToArray(_useState7, 2), ec = _useState8[0], setEc = _useState8[1]; var _useState9 = useState(0), _useState0 = _slicedToArray(_useState9, 2), xp = _useState0[0], setXp = _useState0[1]; var _useState1 = useState(null), _useState10 = _slicedToArray(_useState1, 2), event = _useState10[0], setEvent = _useState10[1]; var r = useRef({ speed: 0, dist: 0, ec: 0, xp: 0, active: true }); var EVENTS = [{ icon: "⚡", title: "ZOOM", desc: "Zoom bloque ta route.", enemy: "ZOOM", emo: "🌪️", hp: 1.2 }, { icon: "🔫", title: "BRAQUEUR", desc: "Un braqueur fonce vers toi.", enemy: "BRAQUEUR", emo: "🔫", hp: 0.75 }, { icon: "🌀", title: "ANOMALIE", desc: "Un vortex s'ouvre...", enemy: "FANTÔME", emo: "👻", hp: 1.0 }, { icon: "📡", title: "STAR LABS", desc: "Méta-humaine à ta position !", enemy: "META", emo: "🦹", hp: 0.9 }, { icon: "🥶", title: "CAPT. COLD", desc: "Snart surgit avec son pistolet.", enemy: "CAPT. COLD", emo: "🥶", hp: 1.1 }]; useEffect(function () { r.current.active = true; var d1 = setInterval(function () { if (!r.current.active) return; r.current.speed = Math.max(0, r.current.speed - G.stats.endurance.val); setSpeed(r.current.speed); }, 200); var d2 = setInterval(function () { if (!r.current.active || r.current.speed <= 0) return; var g2 = Math.max(1, Math.floor(r.current.speed / 8)); r.current.dist += g2; setDist(r.current.dist); if (r.current.dist % 150 < g2 + 3) { var e = Math.max(1, Math.floor(r.current.speed / 18)); r.current.ec += e; r.current.xp += Math.ceil(e * 0.6); setEc(r.current.ec); setXp(r.current.xp); } }, 300); var d3 = setInterval(function () { if (!r.current.active || r.current.dist < 80 || event) return; if (Math.random() < 0.38) setEvent(EVENTS[Math.floor(Math.random() * EVENTS.length)]); }, 7000); return function () { r.current.active = false; clearInterval(d1); clearInterval(d2); clearInterval(d3); }; }, []); var tap = function tap() { if (event) return; r.current.speed = Math.min(G.stats.energyMax.val, r.current.speed + G.stats.tapGain.val); setSpeed(r.current.speed); if (navigator.vibrate) navigator.vibrate(12); }; var save = function save() { r.current.active = false; setG(function (g) { return _objectSpread(_objectSpread({}, g), {}, { eclairs: g.eclairs + r.current.ec, xp: g.xp + r.current.xp, totalRuns: g.totalRuns + 1, totalDist: g.totalDist + r.current.dist }); }); }; var pct = speed / G.stats.energyMax.val; var tag = pct > 0.85 ? "🔥 TURBO" : pct > 0.6 ? "⚡ RAPIDE" : pct > 0.3 ? "👟 LANCÉ" : "EN VEILLE"; var hour = new Date().getHours(); var isDay = hour >= 7 && hour < 20; var hudBg = isDay ? "rgba(200,225,255,0.92)" : "rgba(4,4,14,0.92)"; var mutedCol = isDay ? "#334455" : "#444460"; return /*#__PURE__*/React.createElement("div", { style: { position: "absolute", inset: 0, background: isDay ? "#87CEEB" : "#04040E" } }, /*#__PURE__*/React.createElement(Scene, { speed: speed, eMax: G.stats.energyMax.val, onTap: event ? undefined : tap }), /*#__PURE__*/React.createElement("div", { style: { position: "absolute", top: 0, left: 0, right: 0, zIndex: 30, padding: "44px 16px 10px", background: "linear-gradient(to bottom,".concat(hudBg, " 55%,transparent)") } }, /*#__PURE__*/React.createElement("div", { style: { display: "flex", justifyContent: "space-between", marginBottom: 8 } }, [[Math.round(pct * 320) + " km/h", "VITESSE"], [dist + "M", "DIST"], ["⚡" + ec, "ÉCLAIRS"]].map(function (_ref3) { var _ref4 = _slicedToArray(_ref3, 2), v = _ref4[0], l = _ref4[1]; return /*#__PURE__*/React.createElement("div", { key: l, style: { textAlign: "center" } }, /*#__PURE__*/React.createElement("div", { style: { fontSize: 24, fontWeight: "bold", color: l === "DIST" ? C : Y, lineHeight: 1 } }, v), /*#__PURE__*/React.createElement("div", { style: { fontSize: 10, color: mutedCol, letterSpacing: 2 } }, l)); })), /*#__PURE__*/React.createElement("div", { style: { display: "flex", justifyContent: "space-between", fontSize: 10, color: mutedCol, marginBottom: 3 } }, /*#__PURE__*/React.createElement("span", null, "VITESSE"), /*#__PURE__*/React.createElement("span", { style: { color: Y, fontWeight: "bold" } }, tag)), /*#__PURE__*/React.createElement("div", { style: { height: 8, background: "rgba(0,0,0,0.12)", borderRadius: 4, border: "1px solid rgba(255,215,0,0.2)", overflow: "hidden" } }, /*#__PURE__*/React.createElement("div", { style: { height: "100%", width: "".concat(pct * 100, "%"), background: "linear-gradient(to right,#FF4400,".concat(Y, ")"), borderRadius: 4, transition: "width 0.08s" } })), pct < 0.05 && /*#__PURE__*/React.createElement("div", { style: { textAlign: "center", marginTop: 10, fontSize: 12, fontWeight: "bold", letterSpacing: 4, color: "rgba(255,215,0,0.65)" } }, "TAPE POUR COURIR")), /*#__PURE__*/React.createElement("div", { style: { position: "absolute", bottom: 0, left: 0, right: 0, zIndex: 30, height: 80, padding: "0 20px", background: "linear-gradient(to top,".concat(isDay ? "rgba(180,215,245,0.95)" : "rgba(4,4,14,0.95)", " 55%,transparent)"), display: "flex", alignItems: "center", justifyContent: "space-between" } }, /*#__PURE__*/React.createElement("button", { onClick: function onClick() { save(); onHub(); }, style: { background: "rgba(0,0,0,0.18)", border: "1px solid rgba(255,255,255,0.2)", borderRadius: 8, padding: "9px 14px", color: isDay ? "#223344" : "#aaaacc", fontSize: 13, fontWeight: "bold", cursor: "pointer" } }, "\u2261 HUB"), /*#__PURE__*/React.createElement("div", { style: { textAlign: "center" } }, /*#__PURE__*/React.createElement("div", { style: { fontSize: 20, fontWeight: "bold", color: C } }, "+", xp, " XP"), /*#__PURE__*/React.createElement("div", { style: { fontSize: 10, color: mutedCol, letterSpacing: 1 } }, "SESSION")), /*#__PURE__*/React.createElement("div", { style: { fontSize: 13, fontWeight: "bold", color: pct > 0.05 ? Y : "#666680" } }, pct > 0.05 ? "⚡ EN COURSE" : "ARRÊTÉ")), event && /*#__PURE__*/React.createElement("div", { style: { position: "absolute", inset: 0, zIndex: 60, display: "flex", flexDirection: "column", alignItems: "center", justifyContent: "flex-end", padding: "20px 20px 100px", background: "linear-gradient(to top,rgba(0,0,0,0.92) 40%,rgba(0,0,0,0.3))" } }, /*#__PURE__*/React.createElement("div", { style: { width: "100%", maxWidth: 360, background: "#12121A", border: "1px solid rgba(255,215,0,0.4)", borderRadius: 14, padding: "22px 20px", textAlign: "center" } }, /*#__PURE__*/React.createElement("div", { style: { fontSize: 44, marginBottom: 6 } }, event.icon), /*#__PURE__*/React.createElement("div", { style: { fontSize: 20, fontWeight: "bold", color: Y, marginBottom: 6 } }, event.title), /*#__PURE__*/React.createElement("div", { style: { fontSize: 13, color: "#444460", lineHeight: 1.55, marginBottom: 18 } }, event.desc), /*#__PURE__*/React.createElement("div", { style: { display: "flex", gap: 10 } }, /*#__PURE__*/React.createElement("button", { onClick: function onClick() { save(); onCombat(event, false); }, style: { flex: 1, padding: 14, borderRadius: 8, fontSize: 14, fontWeight: "bold", background: Y, color: "#000", border: "none", cursor: "pointer" } }, "\u2694\uFE0F COMBATTRE"), /*#__PURE__*/React.createElement("button", { onClick: function onClick() { return setEvent(null); }, style: { flex: 1, padding: 14, borderRadius: 8, fontSize: 14, fontWeight: "bold", background: "transparent", border: "1px solid #222232", color: "#444460", cursor: "pointer" } }, "IGNORER"))))); } function CombatScreen(_ref5) { var G = _ref5.G, setG = _ref5.setG, event = _ref5.event, isPvp = _ref5.isPvp, onDone = _ref5.onDone; var enemy = isPvp ? { enemy: "SPEEDSTER #".concat(Math.floor(Math.random() * 9999)), emo: "⚡", hp: 0.9 + (G.pvpElo - 1200) / 2000 } : event; var pm = G.stats.hp.val, em = Math.max(40, Math.round(75 * ((enemy === null || enemy === void 0 ? void 0 : enemy.hp) || 1))); var _useState11 = useState(pm), _useState12 = _slicedToArray(_useState11, 2), pH = _useState12[0], setPH = _useState12[1]; var _useState13 = useState(em), _useState14 = _slicedToArray(_useState13, 2), eH = _useState14[0], setEH = _useState14[1]; var _useState15 = useState(60), _useState16 = _slicedToArray(_useState15, 2), timer = _useState16[0], setTimer = _useState16[1]; var _useState17 = useState(["⚡ Combat !", "Choisis une action"]), _useState18 = _slicedToArray(_useState17, 2), log = _useState18[0], setLog = _useState18[1]; var _useState19 = useState({ atk: 0, dge: 0, ctr: 0, bst: 0 }), _useState20 = _slicedToArray(_useState19, 2), cds = _useState20[0], setCds = _useState20[1]; var _useState21 = useState(null), _useState22 = _slicedToArray(_useState21, 2), result = _useState22[0], setResult = _useState22[1]; var _useState23 = useState(null), _useState24 = _slicedToArray(_useState23, 2), flash = _useState24[0], setFlash = _useState24[1]; var st = useRef({ pH: pm, eH: em, dg: false, ct: false, done: false }); var al = function al(m) { return setLog(function (l) { return [].concat(_toConsumableArray(l.slice(-8)), [m]); }); }; var df = function df(w) { setFlash(w); setTimeout(function () { return setFlash(null); }, 220); }; var end = function end(win) { if (st.current.done) return; st.current.done = true; var xp = win ? isPvp ? 80 : 50 : ~~((isPvp ? 80 : 50) / 3), ec = win ? isPvp ? 50 : 30 : ~~((isPvp ? 50 : 30) / 4); setG(function (g) { return _objectSpread(_objectSpread({}, g), {}, { eclairs: g.eclairs + ec, xp: g.xp + xp, totalWins: win ? g.totalWins + 1 : g.totalWins, pvpW: win && isPvp ? g.pvpW + 1 : g.pvpW, pvpL: !win && isPvp ? g.pvpL + 1 : g.pvpL, pvpElo: isPvp ? Math.max(800, g.pvpElo + (win ? 25 : -20)) : g.pvpElo }); }); setResult({ win: win, xp: xp, ec: ec }); }; useEffect(function () { var t = setInterval(function () { if (st.current.done) return; setTimer(function (t) { if (t <= 1) { end(st.current.pH >= st.current.eH); return 0; } return t - 1; }); }, 1000); var et = setInterval(function () { if (st.current.done) return; if (st.current.dg) { al("💨 Tu esquives !"); st.current.dg = false; return; } if (st.current.ct) { var d = 20 + ~~(Math.random() * 15); st.current.eH = Math.max(0, st.current.eH - d); setEH(st.current.eH); al("\u26A1 COUNTER -".concat(d, "!")); df("e"); st.current.ct = false; if (st.current.eH <= 0) end(true); return; } if (Math.random() < 0.72) { var _d = 7 + ~~(Math.random() * 11); st.current.pH = Math.max(0, st.current.pH - _d); setPH(st.current.pH); al("".concat(enemy === null || enemy === void 0 ? void 0 : enemy.emo, " attaque -").concat(_d, "HP")); df("p"); if (navigator.vibrate) navigator.vibrate(22); if (st.current.pH <= 0) end(false); } else al("".concat(enemy === null || enemy === void 0 ? void 0 : enemy.emo, " se pr\xE9pare...")); }, 2500 + ~~(Math.random() * 1500)); return function () { clearInterval(t); clearInterval(et); }; }, []); var scd = function scd(k, s) { setCds(function (c) { return _objectSpread(_objectSpread({}, c), {}, _defineProperty({}, k, s)); }); var iv = setInterval(function () { return setCds(function (c) { var n = c[k] - 1; if (n <= 0) clearInterval(iv); return _objectSpread(_objectSpread({}, c), {}, _defineProperty({}, k, Math.max(0, n))); }); }, 1000); }; var act = function act(tp) { if (st.current.done || result) return; if (tp === "atk" && !cds.atk) { var d = 10 + ~~(Math.random() * 10); st.current.eH = Math.max(0, st.current.eH - d); setEH(st.current.eH); al("\uD83D\uDC4A -".concat(d, "HP")); df("e"); scd("atk", 2); if (st.current.eH <= 0) end(true); } else if (tp === "dge" && !cds.dge) { st.current.dg = true; al("💨 Esquive!"); scd("dge", 3); setTimeout(function () { st.current.dg = false; }, 3000); } else if (tp === "ctr" && !cds.ctr) { st.current.ct = true; al("⚡ Counter!"); scd("ctr", 4); setTimeout(function () { st.current.ct = false; }, 4000); } else if (tp === "bst" && !cds.bst) { var _d2 = 28 + ~~(Math.random() * 18); st.current.eH = Math.max(0, st.current.eH - _d2); setEH(st.current.eH); al("\uD83C\uDF00 BURST -".concat(_d2, "!")); df("e"); scd("bst", 12); if (st.current.eH <= 0) end(true); } if (navigator.vibrate) navigator.vibrate(14); }; var btns = [{ k: "atk", i: "👊", l: "ATTAQUE", c: R }, { k: "dge", i: "💨", l: "ESQUIVE", c: C }, { k: "ctr", i: "⚡", l: "COUNTER", c: Y }, { k: "bst", i: "🌀", l: "BURST", c: "#A064FF" }]; return /*#__PURE__*/React.createElement("div", { style: { position: "absolute", inset: 0, display: "flex", flexDirection: "column", background: "#08080E" } }, flash === "p" && /*#__PURE__*/React.createElement("div", { style: { position: "absolute", inset: 0, zIndex: 100, background: "rgba(255,59,48,0.22)", pointerEvents: "none" } }), flash === "e" && /*#__PURE__*/React.createElement("div", { style: { position: "absolute", inset: 0, zIndex: 100, background: "rgba(0,238,255,0.15)", pointerEvents: "none" } }), /*#__PURE__*/React.createElement("div", { style: { display: "flex", justifyContent: "space-between", alignItems: "center", padding: "44px 18px 0" } }, /*#__PURE__*/React.createElement("div", { style: { fontSize: 16, fontWeight: "bold", color: R } }, enemy === null || enemy === void 0 ? void 0 : enemy.emo, " VS ", enemy === null || enemy === void 0 ? void 0 : enemy.enemy), /*#__PURE__*/React.createElement("div", { style: { fontSize: 26, fontWeight: "bold", color: Y } }, timer, "s")), /*#__PURE__*/React.createElement("div", { style: { padding: "12px 18px", display: "flex", flexDirection: "column", gap: 8 } }, [{ i: enemy === null || enemy === void 0 ? void 0 : enemy.emo, n: enemy === null || enemy === void 0 ? void 0 : enemy.enemy, h: eH, m: em, c: "linear-gradient(to right,#FF3B30,#FF8800)" }, { i: "⚡", n: "TOI", h: pH, m: pm, c: "linear-gradient(to right,#00CC44,#00EEFF)" }].map(function (f, idx) { return /*#__PURE__*/React.createElement("div", { key: idx }, idx === 1 && /*#__PURE__*/React.createElement("div", { style: { display: "flex", alignItems: "center", gap: 10, margin: "6px 0" } }, /*#__PURE__*/React.createElement("div", { style: { flex: 1, height: 1, background: "#222232" } }), /*#__PURE__*/React.createElement("div", { style: { fontSize: 16, fontWeight: "bold", color: "#333348" } }, "VS"), /*#__PURE__*/React.createElement("div", { style: { flex: 1, height: 1, background: "#222232" } })), /*#__PURE__*/React.createElement("div", { style: { display: "flex", alignItems: "center", gap: 12 } }, /*#__PURE__*/React.createElement("div", { style: { fontSize: 30, flexShrink: 0 } }, f.i), /*#__PURE__*/React.createElement("div", { style: { flex: 1 } }, /*#__PURE__*/React.createElement("div", { style: { display: "flex", justifyContent: "space-between", marginBottom: 4 } }, /*#__PURE__*/React.createElement("span", { style: { fontSize: 14, fontWeight: "bold" } }, f.n), /*#__PURE__*/React.createElement("span", { style: { fontSize: 12, color: "#444460" } }, Math.max(0, f.h), "/", f.m)), /*#__PURE__*/React.createElement("div", { style: { height: 8, background: "rgba(255,255,255,0.05)", borderRadius: 4, overflow: "hidden" } }, /*#__PURE__*/React.createElement("div", { style: { height: "100%", width: "".concat(Math.max(0, f.h / f.m * 100), "%"), background: f.c, borderRadius: 4, transition: "width 0.35s" } }))))); })), /*#__PURE__*/React.createElement("div", { style: { margin: "0 18px", background: "#0E0E18", border: "1px solid #222232", borderRadius: 8, padding: "8px 12px", maxHeight: 90, overflowY: "auto", display: "flex", flexDirection: "column", gap: 3, flex: 1 } }, log.map(function (l, i) { return /*#__PURE__*/React.createElement("div", { key: i, style: { fontSize: 12, color: l.includes("attaque") ? "#FF6060" : l.startsWith("💨") || l.startsWith("⚡") || l.startsWith("👊") || l.startsWith("🌀") ? C : Y } }, l); })), /*#__PURE__*/React.createElement("div", { style: { display: "grid", gridTemplateColumns: "1fr 1fr", gap: 10, padding: "10px 18px 28px" } }, btns.map(function (b) { return /*#__PURE__*/React.createElement("button", { key: b.k, onClick: function onClick() { return act(b.k); }, style: { background: "#0E0E18", border: "1px solid ".concat(cds[b.k] > 0 ? "#222232" : b.c + "55"), borderRadius: 10, padding: "13px 8px", display: "flex", flexDirection: "column", alignItems: "center", gap: 3, cursor: "pointer", opacity: cds[b.k] > 0 ? 0.32 : 1 } }, /*#__PURE__*/React.createElement("span", { style: { fontSize: 24 } }, b.i), /*#__PURE__*/React.createElement("span", { style: { fontSize: 14, fontWeight: "bold", color: b.c } }, b.l), /*#__PURE__*/React.createElement("span", { style: { fontSize: 10, color: "#444460" } }, cds[b.k] > 0 ? "".concat(cds[b.k], "s") : "PRÊT")); })), result && /*#__PURE__*/React.createElement("div", { style: { position: "absolute", inset: 0, zIndex: 200, background: "rgba(8,8,14,0.95)", display: "flex", flexDirection: "column", alignItems: "center", justifyContent: "center", gap: 10 } }, /*#__PURE__*/React.createElement("div", { style: { fontSize: 68 } }, result.win ? "🏆" : "💀"), /*#__PURE__*/React.createElement("div", { style: { fontSize: 40, fontWeight: "bold", color: result.win ? Y : R } }, result.win ? "VICTOIRE !" : "DÉFAITE"), /*#__PURE__*/React.createElement("div", { style: { display: "flex", gap: 24, margin: "6px 0" } }, [["XP", result.xp], ["ÉCLAIRS", result.ec]].map(function (_ref6) { var _ref7 = _slicedToArray(_ref6, 2), l = _ref7[0], v = _ref7[1]; return /*#__PURE__*/React.createElement("div", { key: l, style: { textAlign: "center" } }, /*#__PURE__*/React.createElement("div", { style: { fontSize: 28, fontWeight: "bold", color: Y } }, "+", v), /*#__PURE__*/React.createElement("div", { style: { fontSize: 11, color: "#444460" } }, l)); })), /*#__PURE__*/React.createElement("button", { onClick: function onClick() { return onDone(); }, style: { background: Y, color: "#000", border: "none", borderRadius: 8, padding: "14px 32px", fontSize: 18, fontWeight: "bold", cursor: "pointer" } }, "CONTINUER \u2192"))); } function HubScreen(_ref8) { var G = _ref8.G, onRun = _ref8.onRun, onUpgrade = _ref8.onUpgrade, onPvp = _ref8.onPvp, toast = _ref8.toast; var xm = G.level * 100; var hour = new Date().getHours(); var isDay = hour >= 7 && hour < 20; var bg = isDay ? "#E8F4FD" : "#08080E", card = isDay ? "#F0F8FF" : "#10101A", border = isDay ? "#CBD8E8" : "#222232", muted = isDay ? "#556677" : "#444460"; var locs = [{ i: "🏃", t: "CITY RUN", d: isDay ? "Journée ensoleillée ☀️" : "Nuit néon 🌙", badge: "GO", bc: Y, bt: "#000", a: onRun }, { i: "🔬", t: "STAR LABS", d: "Améliore stats et skills", badge: "NEW", bc: R, bt: "#fff", a: onUpgrade }, { i: "⚔️", t: "PVP ARENA", d: "Affronte d'autres speedsters", badge: "GO", bc: Y, bt: "#000", a: onPvp }, { i: "🏛️", t: "IRON HEIGHTS", d: "Capture de criminels", badge: "BIENTÔT", bc: border, bt: muted, a: function a() { return toast("Bientôt !"); } }]; return /*#__PURE__*/React.createElement("div", { style: { position: "absolute", inset: 0, display: "flex", flexDirection: "column", background: bg, color: isDay ? "#1A2A3A" : "#E8E8F2" } }, /*#__PURE__*/React.createElement("div", { style: { display: "flex", alignItems: "center", justifyContent: "space-between", padding: "44px 18px 10px", background: card, borderBottom: "1px solid ".concat(border) } }, /*#__PURE__*/React.createElement("div", { style: { display: "flex", alignItems: "center", gap: 12 } }, /*#__PURE__*/React.createElement("div", { style: { width: 44, height: 44, borderRadius: "50%", background: "linear-gradient(135deg,".concat(Y, ",#FF8C00)"), display: "flex", alignItems: "center", justifyContent: "center", fontSize: 20 } }, "\u26A1"), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", { style: { fontSize: 18, fontWeight: "bold" } }, isDay ? "☀️" : "🌙", " SPEEDSTER"), /*#__PURE__*/React.createElement("div", { style: { fontSize: 11, color: Y } }, "LEVEL ", G.level))), /*#__PURE__*/React.createElement("div", { style: { fontSize: 17, fontWeight: "bold", color: Y } }, "\u26A1 ", G.eclairs)), /*#__PURE__*/React.createElement("div", { style: { display: "flex", background: card, borderBottom: "1px solid ".concat(border) } }, [[(G.totalDist / 1000).toFixed(1), "km total"], [G.totalRuns, "runs"], [G.totalWins, "victoires"]].map(function (_ref9) { var _ref0 = _slicedToArray(_ref9, 2), v = _ref0[0], l = _ref0[1]; return /*#__PURE__*/React.createElement("div", { key: l, style: { flex: 1, textAlign: "center", padding: "10px 0" } }, /*#__PURE__*/React.createElement("div", { style: { fontSize: 21, fontWeight: "bold", color: C } }, v), /*#__PURE__*/React.createElement("div", { style: { fontSize: 10, color: muted, letterSpacing: 1, textTransform: "uppercase" } }, l)); })), /*#__PURE__*/React.createElement("div", { style: { padding: "8px 18px", background: card, borderBottom: "1px solid ".concat(border) } }, /*#__PURE__*/React.createElement("div", { style: { display: "flex", justifyContent: "space-between", fontSize: 10, color: muted, marginBottom: 4 } }, /*#__PURE__*/React.createElement("span", null, "XP"), /*#__PURE__*/React.createElement("span", null, G.xp, "/", xm)), /*#__PURE__*/React.createElement("div", { style: { height: 4, background: border, borderRadius: 2, overflow: "hidden" } }, /*#__PURE__*/React.createElement("div", { style: { height: "100%", width: "".concat(Math.min(100, G.xp / xm * 100), "%"), background: "linear-gradient(to right,".concat(C, ",").concat(Y, ")"), borderRadius: 2 } }))), /*#__PURE__*/React.createElement("div", { style: { flex: 1, overflowY: "auto", padding: 14, display: "flex", flexDirection: "column", gap: 11 } }, locs.map(function (loc) { return /*#__PURE__*/React.createElement("div", { key: loc.t, onClick: loc.a, style: { background: card, border: "1px solid ".concat(border), borderRadius: 10, padding: 14, display: "flex", alignItems: "center", gap: 12, cursor: "pointer" } }, /*#__PURE__*/React.createElement("div", { style: { width: 48, height: 48, borderRadius: 8, background: "rgba(255,215,0,0.12)", border: "1px solid rgba(255,215,0,0.3)", display: "flex", alignItems: "center", justifyContent: "center", fontSize: 24 } }, loc.i), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("div", { style: { fontSize: 17, fontWeight: "bold" } }, loc.t), /*#__PURE__*/React.createElement("div", { style: { fontSize: 12, color: muted, marginTop: 2 } }, loc.d)), /*#__PURE__*/React.createElement("div", { style: { marginLeft: "auto", fontSize: 10, fontWeight: "bold", padding: "4px 8px", borderRadius: 4, background: loc.bc, color: loc.bt } }, loc.badge)); }))); } function UpgradeScreen(_ref1) { var G = _ref1.G, setG = _ref1.setG, onBack = _ref1.onBack, toast = _ref1.toast; var hour = new Date().getHours(); var isDay = hour >= 7 && hour < 20; var bg = isDay ? "#E8F4FD" : "#08080E", card = isDay ? "#F0F8FF" : "#10101A", border = isDay ? "#CBD8E8" : "#222232", muted = isDay ? "#556677" : "#444460"; var buy = function buy(k) { var s = G.stats[k]; if (s.lvl >= s.maxLvl) return; var c = s.cost * s.lvl; if (G.eclairs < c) { toast("Pas assez d'éclairs ⚡"); return; } setG(function (g) { var ns = _objectSpread({}, g.stats[k]); ns.lvl++; if (k === "tapGain") ns.val = 5 + ns.lvl * 2; if (k === "energyMax") ns.val = 100 + ns.lvl * 20; if (k === "endurance") ns.val = Math.max(0.8, 4 - ns.lvl * 0.65); if (k === "hp") ns.val = 80 + ns.lvl * 25; return _objectSpread(_objectSpread({}, g), {}, { eclairs: g.eclairs - c, stats: _objectSpread(_objectSpread({}, g.stats), {}, _defineProperty({}, k, ns)) }); }); toast("✅ Upgradé!"); }; var bsk = function bsk(k) { var sk = G.skills[k]; if (sk.unlocked) return; if (G.eclairs < sk.cost) { toast("Pas assez d'éclairs ⚡"); return; } setG(function (g) { return _objectSpread(_objectSpread({}, g), {}, { eclairs: g.eclairs - sk.cost, skills: _objectSpread(_objectSpread({}, g.skills), {}, _defineProperty({}, k, _objectSpread(_objectSpread({}, sk), {}, { unlocked: true }))) }); }); toast("\u26A1 ".concat(sk.name, " d\xE9bloqu\xE9!")); }; return /*#__PURE__*/React.createElement("div", { style: { position: "absolute", inset: 0, display: "flex", flexDirection: "column", background: bg } }, /*#__PURE__*/React.createElement("div", { style: { display: "flex", alignItems: "center", gap: 12, padding: "44px 18px 10px", background: card, borderBottom: "1px solid ".concat(border) } }, /*#__PURE__*/React.createElement("button", { onClick: onBack, style: { background: "rgba(0,0,0,0.08)", border: "1px solid ".concat(border), borderRadius: 6, padding: "8px 12px", fontSize: 13, fontWeight: "bold", cursor: "pointer" } }, "\u2190 HUB"), /*#__PURE__*/React.createElement("div", { style: { fontSize: 20, fontWeight: "bold", color: C } }, "\u2697\uFE0F STAR LABS"), /*#__PURE__*/React.createElement("div", { style: { marginLeft: "auto", fontSize: 17, fontWeight: "bold", color: Y } }, "\u26A1 ", G.eclairs)), /*#__PURE__*/React.createElement("div", { style: { flex: 1, overflowY: "auto", padding: 14, display: "flex", flexDirection: "column", gap: 10 } }, /*#__PURE__*/React.createElement("div", { style: { fontSize: 12, fontWeight: "bold", letterSpacing: 3, color: muted } }, "STATS"), Object.entries(G.stats).map(function (_ref10) { var _ref11 = _slicedToArray(_ref10, 2), k = _ref11[0], s = _ref11[1]; var mx = s.lvl >= s.maxLvl, c = s.cost * s.lvl, p = s.lvl / s.maxLvl * 100; return /*#__PURE__*/React.createElement("div", { key: k, style: { background: card, border: "1px solid ".concat(border), borderRadius: 8, padding: 13, display: "flex", alignItems: "center", gap: 11 } }, /*#__PURE__*/React.createElement("div", { style: { fontSize: 24 } }, s.icon), /*#__PURE__*/React.createElement("div", { style: { flex: 1 } }, /*#__PURE__*/React.createElement("div", { style: { fontSize: 15, fontWeight: "bold" } }, s.name, " ", /*#__PURE__*/React.createElement("span", { style: { color: Y, fontSize: 11 } }, "LV", s.lvl)), /*#__PURE__*/React.createElement("div", { style: { fontSize: 11, color: muted, marginTop: 2 } }, s.desc), /*#__PURE__*/React.createElement("div", { style: { height: 3, background: border, borderRadius: 2, overflow: "hidden", marginTop: 6 } }, /*#__PURE__*/React.createElement("div", { style: { height: "100%", width: "".concat(p, "%"), background: "linear-gradient(to right,".concat(C, ",").concat(Y, ")") } }))), /*#__PURE__*/React.createElement("div", { onClick: function onClick() { return buy(k); }, style: { background: "rgba(255,215,0,0.1)", border: "1px solid ".concat(mx ? border : "rgba(255,215,0,0.35)"), borderRadius: 6, padding: "8px 11px", cursor: mx ? "default" : "pointer", textAlign: "center" } }, /*#__PURE__*/React.createElement("div", { style: { fontSize: 13, fontWeight: "bold", color: Y } }, mx ? "MAX" : "\u26A1".concat(c)), /*#__PURE__*/React.createElement("div", { style: { fontSize: 10, color: muted } }, mx ? "———" : "UPGRADE"))); }), /*#__PURE__*/React.createElement("div", { style: { fontSize: 12, fontWeight: "bold", letterSpacing: 3, color: muted, marginTop: 4 } }, "SKILLS"), Object.entries(G.skills).map(function (_ref12) { var _ref13 = _slicedToArray(_ref12, 2), k = _ref13[0], sk = _ref13[1]; return /*#__PURE__*/React.createElement("div", { key: k, style: { background: card, border: "1px solid ".concat(border), borderRadius: 8, padding: 13, display: "flex", alignItems: "center", gap: 11 } }, /*#__PURE__*/React.createElement("div", { style: { fontSize: 24 } }, sk.icon), /*#__PURE__*/React.createElement("div", { style: { flex: 1 } }, /*#__PURE__*/React.createElement("div", { style: { fontSize: 15, fontWeight: "bold" } }, sk.name), /*#__PURE__*/React.createElement("div", { style: { fontSize: 11, color: muted, marginTop: 2 } }, sk.desc)), /*#__PURE__*/React.createElement("div", { onClick: function onClick() { return bsk(k); }, style: { background: "rgba(255,215,0,0.1)", border: "1px solid ".concat(sk.unlocked ? border : "rgba(255,215,0,0.35)"), borderRadius: 6, padding: "8px 11px", cursor: sk.unlocked ? "default" : "pointer", textAlign: "center" } }, /*#__PURE__*/React.createElement("div", { style: { fontSize: 13, fontWeight: "bold", color: Y } }, sk.unlocked ? "✅" : "\u26A1".concat(sk.cost)), /*#__PURE__*/React.createElement("div", { style: { fontSize: 10, color: muted } }, sk.unlocked ? "DÉBLOQUÉ" : "ACHETER"))); }))); } function PvpScreen(_ref14) { var G = _ref14.G, onBack = _ref14.onBack, onCombat = _ref14.onCombat; var _useState25 = useState(false), _useState26 = _slicedToArray(_useState25, 2), s2 = _useState26[0], setS = _useState26[1]; var t = useRef(null); var rk = G.pvpElo >= 1800 ? "DIAMOND" : G.pvpElo >= 1600 ? "PLATINE" : G.pvpElo >= 1400 ? "GOLD I" : "SILVER II"; var ic = G.pvpElo >= 1800 ? "💎" : G.pvpElo >= 1600 ? "🔷" : G.pvpElo >= 1400 ? "🥇" : "🥈"; return /*#__PURE__*/React.createElement("div", { style: { position: "absolute", inset: 0, display: "flex", flexDirection: "column", background: "#08080E" } }, /*#__PURE__*/React.createElement("div", { style: { display: "flex", alignItems: "center", gap: 12, padding: "44px 18px 10px", background: "#0E0E18", borderBottom: "1px solid #222232" } }, /*#__PURE__*/React.createElement("button", { onClick: onBack, style: { background: "rgba(255,255,255,0.04)", border: "1px solid #222232", borderRadius: 6, padding: "8px 12px", color: "#555570", fontSize: 13, fontWeight: "bold", cursor: "pointer" } }, "\u2190 HUB"), /*#__PURE__*/React.createElement("div", { style: { fontSize: 20, fontWeight: "bold", color: R } }, "\u2694\uFE0F PVP ARENA")), /*#__PURE__*/React.createElement("div", { style: { flex: 1, display: "flex", flexDirection: "column", alignItems: "center", justifyContent: "center", padding: 20, gap: 18 } }, /*#__PURE__*/React.createElement("div", { style: { width: "100%", maxWidth: 320, background: "#10101A", border: "1px solid #222232", borderRadius: 14, padding: 22, textAlign: "center" } }, /*#__PURE__*/React.createElement("div", { style: { fontSize: 54 } }, ic), /*#__PURE__*/React.createElement("div", { style: { fontSize: 24, fontWeight: "bold", color: Y } }, rk), /*#__PURE__*/React.createElement("div", { style: { fontSize: 13, color: "#444460", marginTop: 4 } }, "ELO : ", G.pvpElo), /*#__PURE__*/React.createElement("div", { style: { display: "flex", justifyContent: "center", gap: 28, marginTop: 14 } }, [["WINS", G.pvpW, "#00CC44"], ["LOSSES", G.pvpL, R]].map(function (_ref15) { var _ref16 = _slicedToArray(_ref15, 3), l = _ref16[0], v = _ref16[1], c = _ref16[2]; return /*#__PURE__*/React.createElement("div", { key: l, style: { textAlign: "center" } }, /*#__PURE__*/React.createElement("div", { style: { fontSize: 22, fontWeight: "bold", color: c } }, v), /*#__PURE__*/React.createElement("div", { style: { fontSize: 10, color: "#444460" } }, l)); }))), !s2 ? /*#__PURE__*/React.createElement("button", { onClick: function onClick() { setS(true); t.current = setTimeout(function () { setS(false); onCombat(); }, 2000 + ~~(Math.random() * 3000)); }, style: { width: "100%", maxWidth: 320, padding: 18, background: "linear-gradient(135deg,".concat(R, ",#FF8800)"), color: "#fff", fontSize: 20, fontWeight: "bold", border: "none", borderRadius: 10, cursor: "pointer" } }, "\u26A1 TROUVER UN MATCH") : /*#__PURE__*/React.createElement("div", { style: { display: "flex", flexDirection: "column", alignItems: "center", gap: 12 } }, /*#__PURE__*/React.createElement("div", { style: { width: 38, height: 38, border: "3px solid #222232", borderTopColor: R, borderRadius: "50%", animation: "spin 0.8s linear infinite" } }), /*#__PURE__*/React.createElement("div", { style: { fontSize: 12, color: "#444460", letterSpacing: 2 } }, "RECHERCHE..."), /*#__PURE__*/React.createElement("button", { onClick: function onClick() { clearTimeout(t.current); setS(false); }, style: { background: "rgba(255,255,255,0.04)", border: "1px solid #222232", borderRadius: 8, padding: "9px 14px", color: "#555570", fontSize: 13, cursor: "pointer" } }, "ANNULER")))); } function App() { var _useState27 = useState("run"), _useState28 = _slicedToArray(_useState27, 2), sc = _useState28[0], setSc = _useState28[1]; var _useState29 = useState(null), _useState30 = _slicedToArray(_useState29, 2), cev = _useState30[0], setCev = _useState30[1]; var _useState31 = useState(false), _useState32 = _slicedToArray(_useState31, 2), pvp = _useState32[0], setPvp = _useState32[1]; var _useState33 = useState(""), _useState34 = _slicedToArray(_useState33, 2), msg = _useState34[0], setMsg = _useState34[1]; var tr = useRef(null); var _useState35 = useState({ eclairs: 50, xp: 0, level: 1, totalDist: 0, totalRuns: 0, totalWins: 0, pvpW: 0, pvpL: 0, pvpElo: 1200, stats: { tapGain: { lvl: 1, maxLvl: 5, cost: 30, icon: "👆", name: "GAIN PAR TAP", desc: "Vitesse par tap", val: 5 }, energyMax: { lvl: 1, maxLvl: 5, cost: 40, icon: "🔋", name: "ÉNERGIE MAX", desc: "Capacité max", val: 100 }, endurance: { lvl: 1, maxLvl: 5, cost: 35, icon: "🏃", name: "ENDURANCE", desc: "Perte réduite", val: 3 }, hp: { lvl: 1, maxLvl: 5, cost: 45, icon: "❤️", name: "POINTS DE VIE", desc: "HP combat", val: 100 } }, skills: { burst: { unlocked: true, cost: 0, icon: "🌀", name: "BURST SPEED", desc: "Triple dégâts CD 12s" }, dash: { unlocked: false, cost: 60, icon: "💨", name: "DASH RAPIDE", desc: "+50% vitesse 3s" }, auto: { unlocked: false, cost: 80, icon: "⚡", name: "AUTO COUNTER", desc: "Contre auto ennemi" } } }), _useState36 = _slicedToArray(_useState35, 2), G = _useState36[0], setG = _useState36[1]; useEffect(function () { if (G.xp >= G.level * 100) { setG(function (g) { return _objectSpread(_objectSpread({}, g), {}, { xp: g.xp - g.level * 100, level: g.level + 1 }); }); t2("🎉 LEVEL UP!"); } }, [G.xp]); var t2 = function t2(m) { setMsg(m); clearTimeout(tr.current); tr.current = setTimeout(function () { return setMsg(""); }, 2200); }; return /*#__PURE__*/React.createElement("div", { style: { position: "fixed", inset: 0, background: "#08080E", color: "#E8E8F2", fontFamily: "Arial,sans-serif", overflow: "hidden", WebkitUserSelect: "none", userSelect: "none", touchAction: "manipulation" } }, /*#__PURE__*/React.createElement("style", null, "@keyframes spin{to{transform:rotate(360deg)}}"), msg && /*#__PURE__*/React.createElement("div", { style: { position: "fixed", top: 52, left: "50%", transform: "translateX(-50%)", background: "#12121A", border: "1px solid ".concat(Y), borderRadius: 8, padding: "8px 18px", fontSize: 13, fontWeight: "bold", color: Y, zIndex: 9999, whiteSpace: "nowrap" } }, msg), sc === "run" && /*#__PURE__*/React.createElement(RunScreen, { G: G, setG: setG, onHub: function onHub() { return setSc("hub"); }, onCombat: function onCombat(ev, p) { setCev(ev); setPvp(p || false); setSc("combat"); } }), sc === "hub" && /*#__PURE__*/React.createElement(HubScreen, { G: G, onRun: function onRun() { return setSc("run"); }, onUpgrade: function onUpgrade() { return setSc("upgrade"); }, onPvp: function onPvp() { return setSc("pvp"); }, toast: t2 }), sc === "combat" && /*#__PURE__*/React.createElement(CombatScreen, { G: G, setG: setG, event: cev, isPvp: pvp, onDone: function onDone() { if (pvp) setSc("pvp");else setSc("run"); } }), sc === "upgrade" && /*#__PURE__*/React.createElement(UpgradeScreen, { G: G, setG: setG, onBack: function onBack() { return setSc("hub"); }, toast: t2 }), sc === "pvp" && /*#__PURE__*/React.createElement(PvpScreen, { G: G, onBack: function onBack() { return setSc("hub"); }, onCombat: function onCombat() { setCev(null); setPvp(true); setSc("combat"); } })); } ReactDOM.createRoot(document.getElementById('root')).render(/*#__PURE__*/React.createElement(App, null));