Kardiolog Pro - Prezent dla Lewego<\/title>\n <script src=\"https:\/\/cdn.tailwindcss.com\"><\/script>\n <style>\n body {\n background-color: #050505;\n color: #e2e8f0;\n font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif;\n overflow: hidden;\n touch-action: none;\n }\n\n .medical-grid {\n background-image: radial-gradient(#1e293b 1px, transparent 1px);\n background-size: 30px 30px;\n }\n\n \/* Preloader Styles *\/\n #preloader {\n position: fixed;\n inset: 0;\n background: #0a0a0a;\n z-index: 2000;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n padding: 30px;\n text-align: center;\n transition: opacity 0.6s ease-out, visibility 0.6s;\n }\n\n #preloader.fade-out {\n opacity: 0;\n visibility: hidden;\n }\n\n .heart-container {\n position: relative;\n width: 340px;\n height: 340px;\n }\n\n #heart-svg {\n width: 100%;\n height: 100%;\n filter: drop-shadow(0 0 15px rgba(220, 38, 38, 0.4));\n }\n\n .beating {\n animation: beat 1s infinite ease-in-out;\n }\n\n @keyframes beat {\n 0%, 100% { transform: scale(1); }\n 15% { transform: scale(1.06); }\n 30% { transform: scale(1); }\n }\n\n .critical-beat {\n animation: fast-beat 0.25s infinite linear !important;\n }\n\n @keyframes fast-beat {\n 0% { transform: scale(1.1) translate(0, 0); }\n 25% { transform: scale(1.1) translate(3px, -3px); }\n 50% { transform: scale(1.1) translate(-3px, 3px); }\n 75% { transform: scale(1.1) translate(3px, 3px); }\n 100% { transform: scale(1.1) translate(0, 0); }\n }\n\n .step-path {\n fill: none;\n stroke-width: 6;\n stroke-linecap: round;\n }\n\n .path-bg { stroke: rgba(255,255,255,0.1); }\n .path-active { \n stroke: #ef4444; \n stroke-width: 8; \n transition: stroke-dashoffset 0.1s;\n filter: drop-shadow(0 0 8px rgba(239, 68, 68, 0.8));\n }\n\n .hint-pulse {\n animation: pulse-ring 1.5s cubic-bezier(0.4, 0, 0.6, 1) infinite;\n }\n\n @keyframes pulse-ring {\n 0% { transform: scale(0.8); opacity: 0.8; }\n 50% { transform: scale(1.2); opacity: 0.3; }\n 100% { transform: scale(0.8); opacity: 0.8; }\n }\n\n .stab-btn {\n background: linear-gradient(135deg, #2563eb, #1d4ed8);\n box-shadow: 0 4px 15px rgba(37, 99, 235, 0.4);\n }\n\n .stab-btn:active { transform: scale(0.95); filter: brightness(1.2); }\n\n .modal {\n display: none;\n position: fixed;\n inset: 0;\n background: rgba(0,0,0,0.98);\n z-index: 1000;\n align-items: center;\n justify-content: center;\n padding: 20px;\n }\n\n .modal.active { display: flex; }\n\n #instrument {\n position: fixed;\n pointer-events: none;\n z-index: 100;\n display: none;\n transform: translate(-50%, -120%);\n }\n\n #instruction-overlay {\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n background: rgba(15, 23, 42, 0.95);\n padding: 20px;\n border-radius: 16px;\n border: 1px solid #3b82f6;\n text-align: center;\n z-index: 60;\n width: 280px;\n transition: opacity 0.4s;\n }\n\n .bleed-spot {\n fill: #ff0000;\n animation: bleed 0.6s ease-out forwards;\n }\n\n @keyframes bleed {\n from { r: 0; opacity: 1; }\n to { r: 12; opacity: 0.6; }\n }\n\n .suture-dot {\n fill: #3b82f6;\n stroke: white;\n stroke-width: 1;\n }\n\n \/* Pulse line effect for preloader *\/\n .pulse-line {\n width: 100px;\n height: 2px;\n background: #22c55e;\n position: relative;\n margin: 20px 0;\n overflow: hidden;\n }\n .pulse-line::after {\n content: '';\n position: absolute;\n top: 0; left: -100%; width: 100%; height: 100%;\n background: linear-gradient(90deg, transparent, #fff, transparent);\n animation: pulse-move 1.5s infinite;\n }\n @keyframes pulse-move {\n to { left: 100%; }\n }\n <\/style>\n<\/head>\n<body class=\"medical-grid min-h-screen flex flex-col items-center select-none\">\n\n \n <div id=\"preloader\">\n <div class=\"mb-8\">\n <svg class=\"w-20 h-20 text-red-600 animate-pulse\" fill=\"currentColor\" viewBox=\"0 0 24 24\">\n <path d=\"M12 21.35l-1.45-1.32C5.4 15.36 2 12.28 2 8.5 2 5.42 4.42 3 7.5 3c1.74 0 3.41.81 4.5 2.09C13.09 3.81 14.76 3 16.5 3 19.58 3 22 5.42 22 8.5c0 3.78-3.4 6.86-8.55 11.54L12 21.35z\"\/>\n <\/svg>\n <\/div>\n <h1 class=\"text-3xl font-black text-white mb-4 uppercase tracking-tighter\">Wszystkiego najlepszego Lewy!<\/h1>\n <p class=\"text-xl font-medium text-slate-400 mb-2 italic\">Wyka\u017c si\u0119 a dostaniesz prezent xd<\/p>\n \n <div class=\"pulse-line\"><\/div>\n \n <button id=\"start-game-btn\" class=\"mt-8 bg-red-600 hover:bg-red-500 text-white px-10 py-4 rounded-2xl font-black uppercase tracking-widest transition-all active:scale-90 shadow-lg shadow-red-600\/20\">\n Rozpocznij Operacj\u0119\n <\/button>\n <p class=\"mt-4 text-[10px] text-slate-600 uppercase tracking-widest\">Wymagana precyzja kardiologiczna<\/p>\n <\/div>\n\n \n <div class=\"w-full bg-slate-900\/95 border-b border-slate-700 p-4 flex justify-between items-center z-50\">\n <div class=\"flex items-center gap-3\">\n <div id=\"status-dot\" class=\"w-2.5 h-2.5 rounded-full bg-green-500 animate-pulse\"><\/div>\n <div>\n <div class=\"text-[9px] text-slate-500 font-bold uppercase\">Monitor<\/div>\n <div class=\"flex items-center gap-1\">\n <div class=\"text-xl font-black text-green-400 font-mono\" id=\"bpm-val\">72<\/div>\n <div class=\"text-[9px] text-green-400\/60 font-bold uppercase\">BPM<\/div>\n <\/div>\n <\/div>\n <\/div>\n <div class=\"text-right\">\n <div id=\"phase-label\" class=\"text-[10px] text-blue-400 font-black uppercase mb-1\">Faza 1\/4: Odka\u017canie<\/div>\n <div class=\"w-32 bg-slate-800 h-2.5 rounded-full overflow-hidden border border-slate-700\">\n <div id=\"main-progress\" class=\"bg-blue-500 h-full transition-all duration-300\" style=\"width: 0%\"><\/div>\n <\/div>\n <\/div>\n <\/div>\n\n \n <div id=\"warning-msg\" class=\"w-full bg-red-600 text-white text-[10px] font-black py-1 text-center opacity-0 transition-opacity uppercase tracking-widest\">\n \u26a0 KRYTYCZNE T\u0118TNO! STABILIZUJ! \u26a0\n <\/div>\n\n \n <div class=\"flex-1 relative w-full flex items-center justify-center overflow-hidden\">\n \n <div id=\"instruction-overlay\" class=\"hidden\">\n <div id=\"inst-text\" class=\"text-sm font-bold text-white uppercase mb-2\">Zdezynfekuj obszar<\/div>\n <div id=\"inst-icon\" class=\"w-12 h-12 mx-auto mb-2 flex items-center justify-center\">\n <svg viewBox=\"0 0 24 24\" fill=\"white\" width=\"32\" height=\"32\"><path d=\"M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2M12,4A8,8 0 0,1 20,12A8,8 0 0,1 12,20A8,8 0 0,1 4,12A8,8 0 0,1 12,4Z\"\/><\/svg>\n <\/div>\n <div class=\"text-[10px] text-slate-400 uppercase italic\">Dotknij, aby zacz\u0105\u0107<\/div>\n <\/div>\n\n <div id=\"instrument\">\n <div id=\"tool-visual\" class=\"w-14 h-14 flex items-center justify-center\">\n <svg width=\"48\" height=\"48\" viewBox=\"0 0 24 24\">\n <circle id=\"tool-circle\" cx=\"12\" cy=\"12\" r=\"10\" fill=\"rgba(255,255,255,0.3)\" stroke=\"white\" stroke-width=\"2\"\/>\n <\/svg>\n <\/div>\n <\/div>\n\n <div class=\"heart-container\" id=\"game-area\">\n <svg id=\"heart-svg\" viewBox=\"0 0 200 200\" class=\"beating\">\n <path d=\"M100 170c-20-15-70-60-70-100 0-30 25-45 45-45 15 0 25 10 25 10s10-10 25-10c20 0 45 15 45 45 0 40-50 85-70 100z\" fill=\"#b91c1c\" \/>\n <path d=\"M85 35c0 0-10-15-5-25M115 35c0 0 10-15 5-25\" stroke=\"#7f1d1d\" stroke-width=\"8\" stroke-linecap=\"round\"\/>\n \n \n <g id=\"prep-group\">\n <circle id=\"prep-zone\" cx=\"100\" cy=\"95\" r=\"45\" fill=\"rgba(255,255,0,0.02)\" stroke=\"rgba(255,255,0,0.3)\" stroke-width=\"1\" stroke-dasharray=\"4\" \/>\n <circle class=\"hint-pulse\" cx=\"100\" cy=\"95\" r=\"15\" fill=\"rgba(255,255,0,0.1)\" \/>\n <\/g>\n \n \n <path id=\"target-path\" d=\"M60 85 Q 100 135 140 85\" class=\"step-path path-bg hidden\" \/>\n <path id=\"progress-path\" d=\"M60 85 Q 100 135 140 85\" class=\"step-path path-active hidden\" \/>\n <circle id=\"cut-hint\" cx=\"60\" cy=\"85\" r=\"8\" fill=\"#ef4444\" class=\"hidden hint-pulse\" \/>\n\n \n <g id=\"bleeding-container\"><\/g>\n\n \n <g id=\"suture-container\" class=\"hidden\"><\/g>\n <\/svg>\n <\/div>\n\n <div id=\"vignette\" class=\"absolute inset-0 pointer-events-none transition-all duration-300 shadow-[inset_0_0_120px_rgba(220,38,38,0)]\"><\/div>\n <\/div>\n\n \n <div class=\"w-full p-6 pb-12 bg-slate-900\/90 border-t border-slate-800\">\n <button id=\"stabilize-btn\" class=\"stab-btn w-full py-5 rounded-2xl text-white font-black text-xl uppercase tracking-widest disabled:opacity-10 transition-all active:scale-90\">\n STABILIZUJ\n <\/button>\n <div class=\"flex justify-between mt-4\">\n <span class=\"text-[9px] text-slate-500 font-bold uppercase\">Oddzia\u0142 Kardiologii<\/span>\n <span class=\"text-[9px] text-blue-500 font-bold uppercase animate-pulse\" id=\"instruction-hint\">Gotowy do zabiegu<\/span>\n <\/div>\n <\/div>\n\n \n <div id=\"reward-modal\" class=\"modal\">\n <div class=\"w-full max-w-xs text-center\">\n <div class=\"w-20 h-20 bg-green-500 rounded-full flex items-center justify-center mx-auto mb-6 shadow-xl\">\n <svg class=\"w-12 h-12 text-white\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"4\" d=\"M5 13l4 4L19 7\" \/>\n <\/svg>\n <\/div>\n <h2 class=\"text-3xl font-black mb-1 text-white uppercase italic\">KARDIOLOG ROKU!<\/h2>\n <p class=\"text-slate-400 text-xs mb-6\">4\/4 etapy uko\u0144czone bez powik\u0142a\u0144.<\/p>\n \n <div class=\"bg-white p-4 rounded-3xl inline-block mb-8 shadow-2xl\">\n \n <img decoding=\"async\" src=\"https:\/\/api.qrserver.com\/v1\/create-qr-code\/?size=180x180&data=https:\/\/drive.google.com\/file\/d\/1XqBLFdoUmYesZC15N4NkOAy_PtXC1ImD\/view?usp=sharing\" alt=\"QR Code\">\n <\/div>\n \n <button onclick=\"location.reload()\" class=\"w-full bg-blue-600 text-white py-4 rounded-xl font-black uppercase text-xs tracking-widest\">\n KOLEJNY DY\u017bUR\n <\/button>\n <\/div>\n <\/div>\n\n <script>\n const state = {\n gameStarted: false,\n phase: 1, \/\/ 1: Prep, 2: Cut, 3: Clamp, 4: Suture\n progress: 0,\n bpm: 72,\n isCritical: false,\n interactionStarted: false,\n bleedsLeft: 5,\n suturesDone: 0\n };\n\n const els = {\n preloader: document.getElementById('preloader'),\n startBtn: document.getElementById('start-game-btn'),\n tool: document.getElementById('instrument'),\n toolVisual: document.getElementById('tool-visual'),\n overlay: document.getElementById('instruction-overlay'),\n instText: document.getElementById('inst-text'),\n instIcon: document.getElementById('inst-icon'),\n heart: document.getElementById('heart-svg'),\n prepGroup: document.getElementById('prep-group'),\n prepZone: document.getElementById('prep-zone'),\n targetPath: document.getElementById('target-path'),\n progressPath: document.getElementById('progress-path'),\n cutHint: document.getElementById('cut-hint'),\n bleedBox: document.getElementById('bleeding-container'),\n sutureBox: document.getElementById('suture-container'),\n bpmVal: document.getElementById('bpm-val'),\n statusDot: document.getElementById('status-dot'),\n phaseLabel: document.getElementById('phase-label'),\n mainProgress: document.getElementById('main-progress'),\n vignette: document.getElementById('vignette'),\n warning: document.getElementById('warning-msg'),\n stabBtn: document.getElementById('stabilize-btn'),\n modal: document.getElementById('reward-modal')\n };\n\n const pathLen = els.targetPath.getTotalLength();\n els.progressPath.style.strokeDasharray = pathLen;\n els.progressPath.style.strokeDashoffset = pathLen;\n\n \/\/ --- Interaction Controller ---\n const handleInteraction = (e) => {\n if (!state.gameStarted) return;\n const touch = e.touches ? e.touches[0] : e;\n els.tool.style.display = 'block';\n els.tool.style.left = touch.clientX + 'px';\n els.tool.style.top = touch.clientY + 'px';\n\n if (!state.interactionStarted) {\n state.interactionStarted = true;\n els.overlay.style.opacity = '0';\n setTimeout(() => els.overlay.classList.add('hidden'), 400);\n }\n\n if (state.phase === 1) processPrep(touch.clientX, touch.clientY);\n if (state.phase === 2) processCut(touch.clientX, touch.clientY);\n if (state.phase === 3) processClamp(touch.clientX, touch.clientY);\n if (state.phase === 4) processSuture(touch.clientX, touch.clientY);\n };\n\n document.addEventListener('touchstart', handleInteraction, { passive: false });\n document.addEventListener('touchmove', handleInteraction, { passive: false });\n document.addEventListener('touchend', () => els.tool.style.display = 'none');\n\n \/\/ --- Vitals System (Starts only after preloader) ---\n function startVitalsSystem() {\n setInterval(() => {\n if (state.phase === 5 || !state.gameStarted) return;\n\n if (!state.isCritical && Math.random() > 0.96) {\n state.isCritical = true;\n els.heart.classList.add('critical-beat');\n els.warning.style.opacity = '1';\n els.vignette.style.boxShadow = 'inset 0 0 120px rgba(220,38,38,0.7)';\n els.statusDot.classList.replace('bg-green-500', 'bg-red-500');\n }\n\n if (state.isCritical) {\n state.bpm = Math.min(220, state.bpm + 10);\n if (state.bpm > 190 && state.progress > 0) {\n state.progress = Math.max(0, state.progress - 0.01);\n updateUI();\n }\n } else {\n state.bpm = Math.max(60, state.bpm + (Math.random() * 4 - 2));\n els.warning.style.opacity = '0';\n els.vignette.style.boxShadow = 'inset 0 0 120px rgba(220,38,38,0)';\n els.statusDot.classList.replace('bg-red-500', 'bg-green-500');\n }\n\n els.bpmVal.innerText = Math.round(state.bpm);\n els.bpmVal.className = `text-xl font-black font-mono ${state.bpm > 160 ? 'text-red-500 scale-110' : 'text-green-400'}`;\n els.stabBtn.disabled = !state.isCritical;\n }, 150);\n }\n\n els.stabBtn.onclick = () => {\n state.isCritical = false;\n state.bpm = 75;\n els.heart.classList.remove('critical-beat');\n navigator.vibrate?.(40);\n };\n\n \/\/ --- Start Button Trigger ---\n els.startBtn.onclick = () => {\n state.gameStarted = true;\n els.preloader.classList.add('fade-out');\n els.overlay.classList.remove('hidden');\n startVitalsSystem();\n navigator.vibrate?.(100);\n };\n\n \/\/ --- Phase 1: Prep ---\n let prepAcc = 0;\n function processPrep(x, y) {\n const rect = els.prepZone.getBoundingClientRect();\n const d = Math.hypot(x - (rect.left + rect.width\/2), y - (rect.top + rect.height\/2));\n if (d < 70) {\n prepAcc += 2.5;\n state.progress = Math.min(1, prepAcc \/ 200);\n els.prepZone.style.fill = `rgba(34, 197, 94, ${state.progress})`;\n updateUI();\n if (state.progress >= 1) startPhase2();\n }\n }\n\n \/\/ --- Phase 2: Cut ---\n function startPhase2() {\n state.phase = 2; state.progress = 0; state.interactionStarted = false;\n els.prepGroup.classList.add('hidden');\n els.targetPath.classList.remove('hidden');\n els.progressPath.classList.remove('hidden');\n els.cutHint.classList.remove('hidden');\n els.phaseLabel.innerText = \"Faza 2\/4: Naci\u0119cie\";\n showPhaseInstruction(\"Wykonaj naci\u0119cie\", `<svg viewBox=\"0 0 24 24\" fill=\"white\" width=\"32\" height=\"32\"><path d=\"M17.58,3.08L14,6.66L15.42,8.08L17,6.5L18,7.5L16.5,9L17.92,10.42L21.5,6.83C22.1,6.24 22.1,5.29 21.5,4.7L19.3,2.5C18.71,1.9 17.76,1.9 17.17,2.5L17.58,3.08M13.29,7.38L3,17.67V21H6.33L16.62,10.71L13.29,7.38Z\"\/><\/svg>`);\n els.toolVisual.innerHTML = `<svg width=\"48\" height=\"48\" viewBox=\"0 0 24 24\" fill=\"#cbd5e1\" style=\"transform: rotate(-45deg)\"><path d=\"M17.58,3.08L14,6.66L15.42,8.08L17,6.5L18,7.5L16.5,9L17.92,10.42L21.5,6.83C22.1,6.24 22.1,5.29 21.5,4.7L19.3,2.5C18.71,1.9 17.76,1.9 17.17,2.5L17.58,3.08M13.29,7.38L3,17.67V21H6.33L16.62,10.71L13.29,7.38Z\"\/><\/svg>`;\n }\n\n function processCut(x, y) {\n if (state.isCritical) return;\n const pt = els.heart.createSVGPoint(); pt.x = x; pt.y = y;\n const loc = pt.matrixTransform(els.heart.getScreenCTM().inverse());\n const xs = 60, xe = 140;\n if (loc.x >= xs - 5 && loc.x <= xe + 5) {\n const norm = (loc.x - xs) \/ (xe - xs);\n if (norm > state.progress && norm < state.progress + 0.15) {\n if (loc.y > 70 && loc.y < 150) {\n state.progress = norm;\n els.cutHint.setAttribute('cx', loc.x);\n els.cutHint.setAttribute('cy', loc.y);\n updateUI();\n if (state.progress >= 0.98) startPhase3();\n }\n }\n }\n }\n\n \/\/ --- Phase 3: Hemostasis (Clamp) ---\n function startPhase3() {\n state.phase = 3; state.progress = 0; state.interactionStarted = false;\n els.cutHint.classList.add('hidden');\n els.phaseLabel.innerText = \"Faza 3\/4: Hemostaza\";\n showPhaseInstruction(\"Zatamuj krwawienie\", `<svg viewBox=\"0 0 24 24\" fill=\"white\" width=\"32\" height=\"32\"><path d=\"M18.67,13.33L15.33,16.67L13.29,14.63L11.87,16.05L15.33,19.5L20.08,14.75L18.67,13.33M6.33,21H3V17.67L13.29,7.38L16.62,10.71L6.33,21M17.58,3.08L14,6.66L15.42,8.08L17,6.5L18,7.5L16.5,9L17.92,10.42L21.5,6.83L17.58,3.08Z\"\/><\/svg>`);\n els.toolVisual.innerHTML = `<svg width=\"48\" height=\"48\" viewBox=\"0 0 24 24\" fill=\"white\"><path d=\"M7 2v2h10V2H7zm0 18v2h10v-2H7zM5 7v10h2V7H5zm12 0v10h2V7h-2z\"\/><\/svg>`;\n \n for(let i=0; i<5; i++) {\n const bleed = document.createElementNS(\"http:\/\/www.w3.org\/2000\/svg\", \"circle\");\n bleed.setAttribute(\"class\", \"bleed-spot\");\n const point = els.targetPath.getPointAtLength(pathLen * (0.1 + i * 0.2));\n bleed.setAttribute(\"cx\", point.x);\n bleed.setAttribute(\"cy\", point.y);\n bleed.setAttribute(\"r\", \"10\");\n els.bleedBox.appendChild(bleed);\n }\n }\n\n function removeBleed(el) {\n el.remove();\n state.bleedsLeft--;\n state.progress = (5 - state.bleedsLeft) \/ 5;\n updateUI();\n navigator.vibrate?.(20);\n if (state.bleedsLeft <= 0) startPhase4();\n }\n\n function processClamp(x, y) {\n const spots = document.querySelectorAll('.bleed-spot');\n spots.forEach(spot => {\n const r = spot.getBoundingClientRect();\n const d = Math.hypot(x - (r.left + r.width\/2), y - (r.top + r.height\/2));\n if (d < 35) removeBleed(spot);\n });\n }\n\n \/\/ --- Phase 4: Suture ---\n function startPhase4() {\n state.phase = 4; state.progress = 0; state.interactionStarted = false;\n els.phaseLabel.innerText = \"Faza 4\/4: Szew\";\n showPhaseInstruction(\"Za\u0142\u00f3\u017c szwy\", `<svg viewBox=\"0 0 24 24\" fill=\"white\" width=\"32\" height=\"32\"><path d=\"M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2M12,4A8,8 0 0,1 20,12A8,8 0 0,1 12,20A8,8 0 0,1 4,12A8,8 0 0,1 12,4Z\"\/><\/svg>`);\n els.toolVisual.innerHTML = `<svg width=\"48\" height=\"48\" viewBox=\"0 0 24 24\" fill=\"white\" style=\"transform: rotate(45deg)\"><path d=\"M12 2L4.5 20.29L5.21 21L12 18L18.79 21L19.5 20.29L12 2Z\"\/><\/svg>`;\n els.sutureBox.classList.remove('hidden');\n\n for(let i=0; i<8; i++) {\n const dot = document.createElementNS(\"http:\/\/www.w3.org\/2000\/svg\", \"circle\");\n const p = els.targetPath.getPointAtLength(pathLen * (i\/7));\n dot.setAttribute(\"cx\", p.x);\n dot.setAttribute(\"cy\", p.y);\n dot.setAttribute(\"r\", \"4\");\n dot.setAttribute(\"class\", \"suture-dot\");\n dot.dataset.id = i;\n els.sutureBox.appendChild(dot);\n }\n }\n\n function processSuture(x, y) {\n const dots = document.querySelectorAll('.suture-dot');\n dots.forEach(dot => {\n const r = dot.getBoundingClientRect();\n const d = Math.hypot(x - (r.left + r.width\/2), y - (r.top + r.height\/2));\n const id = parseInt(dot.dataset.id);\n if (d < 30 && id === state.suturesDone) {\n dot.style.fill = \"#4ade80\";\n state.suturesDone++;\n state.progress = state.suturesDone \/ 8;\n updateUI();\n navigator.vibrate?.(15);\n if (state.suturesDone >= 8) finishGame();\n }\n });\n }\n\n \/\/ --- Utils ---\n function updateUI() {\n els.mainProgress.style.width = (state.progress * 100) + '%';\n if (state.phase === 2) {\n const offset = pathLen - (state.progress * pathLen);\n els.progressPath.style.strokeDashoffset = offset;\n }\n }\n\n function showPhaseInstruction(text, iconHtml) {\n els.instText.innerText = text;\n els.instIcon.innerHTML = iconHtml;\n els.overlay.classList.remove('hidden');\n els.overlay.style.opacity = '1';\n }\n\n function finishGame() {\n state.phase = 5;\n els.phaseLabel.innerText = \"OPERACJA ZAKO\u0143CZONA\";\n els.phaseLabel.style.color = \"#22c55e\";\n setTimeout(() => {\n els.modal.classList.add('active');\n navigator.vibrate?.([50, 50, 50, 400]);\n }, 600);\n }\n <\/script>\n<\/body>\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Kardiolog Pro – Prezent dla Lewego Wszystkiego najlepszego Lewy! Wyka\u017c si\u0119 a dostaniesz prezent xd Rozpocznij Operacj\u0119 Wymagana precyzja kardiologiczna Monitor 72 BPM Faza 1\/4: Odka\u017canie \u26a0 KRYTYCZNE T\u0118TNO! STABILIZUJ! \u26a0 Zdezynfekuj obszar Dotknij, aby zacz\u0105\u0107 STABILIZUJ Oddzia\u0142 Kardiologii Gotowy do zabiegu KARDIOLOG ROKU! 4\/4 etapy uko\u0144czone bez powik\u0142a\u0144. KOLEJNY DY\u017bUR<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_canvas","meta":{"footnotes":""},"class_list":["post-10","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/prezentlewego.szczepanskipawel.pl\/index.php?rest_route=\/wp\/v2\/pages\/10","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/prezentlewego.szczepanskipawel.pl\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/prezentlewego.szczepanskipawel.pl\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/prezentlewego.szczepanskipawel.pl\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/prezentlewego.szczepanskipawel.pl\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=10"}],"version-history":[{"count":5,"href":"https:\/\/prezentlewego.szczepanskipawel.pl\/index.php?rest_route=\/wp\/v2\/pages\/10\/revisions"}],"predecessor-version":[{"id":18,"href":"https:\/\/prezentlewego.szczepanskipawel.pl\/index.php?rest_route=\/wp\/v2\/pages\/10\/revisions\/18"}],"wp:attachment":[{"href":"https:\/\/prezentlewego.szczepanskipawel.pl\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=10"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

\n\t\t\t\t

\n\t\t\t\t\t

\n\t\t\t\t

\n\t\t\t\t\t\n\n\n \n \n Kardiolog Pro - Prezent dla Lewego<\/title>\n <script src=\"https:\/\/cdn.tailwindcss.com\"><\/script>\n <style>\n body {\n background-color: #050505;\n color: #e2e8f0;\n font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif;\n overflow: hidden;\n touch-action: none;\n }\n\n .medical-grid {\n background-image: radial-gradient(#1e293b 1px, transparent 1px);\n background-size: 30px 30px;\n }\n\n \/* Preloader Styles *\/\n #preloader {\n position: fixed;\n inset: 0;\n background: #0a0a0a;\n z-index: 2000;\n display: flex;\n flex-direction: column;\n align-items: center;\n justify-content: center;\n padding: 30px;\n text-align: center;\n transition: opacity 0.6s ease-out, visibility 0.6s;\n }\n\n #preloader.fade-out {\n opacity: 0;\n visibility: hidden;\n }\n\n .heart-container {\n position: relative;\n width: 340px;\n height: 340px;\n }\n\n #heart-svg {\n width: 100%;\n height: 100%;\n filter: drop-shadow(0 0 15px rgba(220, 38, 38, 0.4));\n }\n\n .beating {\n animation: beat 1s infinite ease-in-out;\n }\n\n @keyframes beat {\n 0%, 100% { transform: scale(1); }\n 15% { transform: scale(1.06); }\n 30% { transform: scale(1); }\n }\n\n .critical-beat {\n animation: fast-beat 0.25s infinite linear !important;\n }\n\n @keyframes fast-beat {\n 0% { transform: scale(1.1) translate(0, 0); }\n 25% { transform: scale(1.1) translate(3px, -3px); }\n 50% { transform: scale(1.1) translate(-3px, 3px); }\n 75% { transform: scale(1.1) translate(3px, 3px); }\n 100% { transform: scale(1.1) translate(0, 0); }\n }\n\n .step-path {\n fill: none;\n stroke-width: 6;\n stroke-linecap: round;\n }\n\n .path-bg { stroke: rgba(255,255,255,0.1); }\n .path-active { \n stroke: #ef4444; \n stroke-width: 8; \n transition: stroke-dashoffset 0.1s;\n filter: drop-shadow(0 0 8px rgba(239, 68, 68, 0.8));\n }\n\n .hint-pulse {\n animation: pulse-ring 1.5s cubic-bezier(0.4, 0, 0.6, 1) infinite;\n }\n\n @keyframes pulse-ring {\n 0% { transform: scale(0.8); opacity: 0.8; }\n 50% { transform: scale(1.2); opacity: 0.3; }\n 100% { transform: scale(0.8); opacity: 0.8; }\n }\n\n .stab-btn {\n background: linear-gradient(135deg, #2563eb, #1d4ed8);\n box-shadow: 0 4px 15px rgba(37, 99, 235, 0.4);\n }\n\n .stab-btn:active { transform: scale(0.95); filter: brightness(1.2); }\n\n .modal {\n display: none;\n position: fixed;\n inset: 0;\n background: rgba(0,0,0,0.98);\n z-index: 1000;\n align-items: center;\n justify-content: center;\n padding: 20px;\n }\n\n .modal.active { display: flex; }\n\n #instrument {\n position: fixed;\n pointer-events: none;\n z-index: 100;\n display: none;\n transform: translate(-50%, -120%);\n }\n\n #instruction-overlay {\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n background: rgba(15, 23, 42, 0.95);\n padding: 20px;\n border-radius: 16px;\n border: 1px solid #3b82f6;\n text-align: center;\n z-index: 60;\n width: 280px;\n transition: opacity 0.4s;\n }\n\n .bleed-spot {\n fill: #ff0000;\n animation: bleed 0.6s ease-out forwards;\n }\n\n @keyframes bleed {\n from { r: 0; opacity: 1; }\n to { r: 12; opacity: 0.6; }\n }\n\n .suture-dot {\n fill: #3b82f6;\n stroke: white;\n stroke-width: 1;\n }\n\n \/* Pulse line effect for preloader *\/\n .pulse-line {\n width: 100px;\n height: 2px;\n background: #22c55e;\n position: relative;\n margin: 20px 0;\n overflow: hidden;\n }\n .pulse-line::after {\n content: '';\n position: absolute;\n top: 0; left: -100%; width: 100%; height: 100%;\n background: linear-gradient(90deg, transparent, #fff, transparent);\n animation: pulse-move 1.5s infinite;\n }\n @keyframes pulse-move {\n to { left: 100%; }\n }\n <\/style>\n<\/head>\n<body class=\"medical-grid min-h-screen flex flex-col items-center select-none\">\n\n \n <div id=\"preloader\">\n <div class=\"mb-8\">\n <svg class=\"w-20 h-20 text-red-600 animate-pulse\" fill=\"currentColor\" viewBox=\"0 0 24 24\">\n <path d=\"M12 21.35l-1.45-1.32C5.4 15.36 2 12.28 2 8.5 2 5.42 4.42 3 7.5 3c1.74 0 3.41.81 4.5 2.09C13.09 3.81 14.76 3 16.5 3 19.58 3 22 5.42 22 8.5c0 3.78-3.4 6.86-8.55 11.54L12 21.35z\"\/>\n <\/svg>\n <\/div>\n <h1 class=\"text-3xl font-black text-white mb-4 uppercase tracking-tighter\">Wszystkiego najlepszego Lewy!<\/h1>\n <p class=\"text-xl font-medium text-slate-400 mb-2 italic\">Wyka\u017c si\u0119 a dostaniesz prezent xd<\/p>\n \n <div class=\"pulse-line\"><\/div>\n \n <button id=\"start-game-btn\" class=\"mt-8 bg-red-600 hover:bg-red-500 text-white px-10 py-4 rounded-2xl font-black uppercase tracking-widest transition-all active:scale-90 shadow-lg shadow-red-600\/20\">\n Rozpocznij Operacj\u0119\n <\/button>\n <p class=\"mt-4 text-[10px] text-slate-600 uppercase tracking-widest\">Wymagana precyzja kardiologiczna<\/p>\n <\/div>\n\n \n <div class=\"w-full bg-slate-900\/95 border-b border-slate-700 p-4 flex justify-between items-center z-50\">\n <div class=\"flex items-center gap-3\">\n <div id=\"status-dot\" class=\"w-2.5 h-2.5 rounded-full bg-green-500 animate-pulse\"><\/div>\n <div>\n <div class=\"text-[9px] text-slate-500 font-bold uppercase\">Monitor<\/div>\n <div class=\"flex items-center gap-1\">\n <div class=\"text-xl font-black text-green-400 font-mono\" id=\"bpm-val\">72<\/div>\n <div class=\"text-[9px] text-green-400\/60 font-bold uppercase\">BPM<\/div>\n <\/div>\n <\/div>\n <\/div>\n <div class=\"text-right\">\n <div id=\"phase-label\" class=\"text-[10px] text-blue-400 font-black uppercase mb-1\">Faza 1\/4: Odka\u017canie<\/div>\n <div class=\"w-32 bg-slate-800 h-2.5 rounded-full overflow-hidden border border-slate-700\">\n <div id=\"main-progress\" class=\"bg-blue-500 h-full transition-all duration-300\" style=\"width: 0%\"><\/div>\n <\/div>\n <\/div>\n <\/div>\n\n \n <div id=\"warning-msg\" class=\"w-full bg-red-600 text-white text-[10px] font-black py-1 text-center opacity-0 transition-opacity uppercase tracking-widest\">\n \u26a0 KRYTYCZNE T\u0118TNO! STABILIZUJ! \u26a0\n <\/div>\n\n \n <div class=\"flex-1 relative w-full flex items-center justify-center overflow-hidden\">\n \n <div id=\"instruction-overlay\" class=\"hidden\">\n <div id=\"inst-text\" class=\"text-sm font-bold text-white uppercase mb-2\">Zdezynfekuj obszar<\/div>\n <div id=\"inst-icon\" class=\"w-12 h-12 mx-auto mb-2 flex items-center justify-center\">\n <svg viewBox=\"0 0 24 24\" fill=\"white\" width=\"32\" height=\"32\"><path d=\"M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2M12,4A8,8 0 0,1 20,12A8,8 0 0,1 12,20A8,8 0 0,1 4,12A8,8 0 0,1 12,4Z\"\/><\/svg>\n <\/div>\n <div class=\"text-[10px] text-slate-400 uppercase italic\">Dotknij, aby zacz\u0105\u0107<\/div>\n <\/div>\n\n <div id=\"instrument\">\n <div id=\"tool-visual\" class=\"w-14 h-14 flex items-center justify-center\">\n <svg width=\"48\" height=\"48\" viewBox=\"0 0 24 24\">\n <circle id=\"tool-circle\" cx=\"12\" cy=\"12\" r=\"10\" fill=\"rgba(255,255,255,0.3)\" stroke=\"white\" stroke-width=\"2\"\/>\n <\/svg>\n <\/div>\n <\/div>\n\n <div class=\"heart-container\" id=\"game-area\">\n <svg id=\"heart-svg\" viewBox=\"0 0 200 200\" class=\"beating\">\n <path d=\"M100 170c-20-15-70-60-70-100 0-30 25-45 45-45 15 0 25 10 25 10s10-10 25-10c20 0 45 15 45 45 0 40-50 85-70 100z\" fill=\"#b91c1c\" \/>\n <path d=\"M85 35c0 0-10-15-5-25M115 35c0 0 10-15 5-25\" stroke=\"#7f1d1d\" stroke-width=\"8\" stroke-linecap=\"round\"\/>\n \n \n <g id=\"prep-group\">\n <circle id=\"prep-zone\" cx=\"100\" cy=\"95\" r=\"45\" fill=\"rgba(255,255,0,0.02)\" stroke=\"rgba(255,255,0,0.3)\" stroke-width=\"1\" stroke-dasharray=\"4\" \/>\n <circle class=\"hint-pulse\" cx=\"100\" cy=\"95\" r=\"15\" fill=\"rgba(255,255,0,0.1)\" \/>\n <\/g>\n \n \n <path id=\"target-path\" d=\"M60 85 Q 100 135 140 85\" class=\"step-path path-bg hidden\" \/>\n <path id=\"progress-path\" d=\"M60 85 Q 100 135 140 85\" class=\"step-path path-active hidden\" \/>\n <circle id=\"cut-hint\" cx=\"60\" cy=\"85\" r=\"8\" fill=\"#ef4444\" class=\"hidden hint-pulse\" \/>\n\n \n <g id=\"bleeding-container\"><\/g>\n\n \n <g id=\"suture-container\" class=\"hidden\"><\/g>\n <\/svg>\n <\/div>\n\n <div id=\"vignette\" class=\"absolute inset-0 pointer-events-none transition-all duration-300 shadow-[inset_0_0_120px_rgba(220,38,38,0)]\"><\/div>\n <\/div>\n\n \n <div class=\"w-full p-6 pb-12 bg-slate-900\/90 border-t border-slate-800\">\n <button id=\"stabilize-btn\" class=\"stab-btn w-full py-5 rounded-2xl text-white font-black text-xl uppercase tracking-widest disabled:opacity-10 transition-all active:scale-90\">\n STABILIZUJ\n <\/button>\n <div class=\"flex justify-between mt-4\">\n <span class=\"text-[9px] text-slate-500 font-bold uppercase\">Oddzia\u0142 Kardiologii<\/span>\n <span class=\"text-[9px] text-blue-500 font-bold uppercase animate-pulse\" id=\"instruction-hint\">Gotowy do zabiegu<\/span>\n <\/div>\n <\/div>\n\n \n <div id=\"reward-modal\" class=\"modal\">\n <div class=\"w-full max-w-xs text-center\">\n <div class=\"w-20 h-20 bg-green-500 rounded-full flex items-center justify-center mx-auto mb-6 shadow-xl\">\n <svg class=\"w-12 h-12 text-white\" fill=\"none\" stroke=\"currentColor\" viewBox=\"0 0 24 24\">\n <path stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"4\" d=\"M5 13l4 4L19 7\" \/>\n <\/svg>\n <\/div>\n <h2 class=\"text-3xl font-black mb-1 text-white uppercase italic\">KARDIOLOG ROKU!<\/h2>\n <p class=\"text-slate-400 text-xs mb-6\">4\/4 etapy uko\u0144czone bez powik\u0142a\u0144.<\/p>\n \n <div class=\"bg-white p-4 rounded-3xl inline-block mb-8 shadow-2xl\">\n \n <img decoding=\"async\" src=\"https:\/\/api.qrserver.com\/v1\/create-qr-code\/?size=180x180&data=https:\/\/drive.google.com\/file\/d\/1XqBLFdoUmYesZC15N4NkOAy_PtXC1ImD\/view?usp=sharing\" alt=\"QR Code\">\n <\/div>\n \n <button onclick=\"location.reload()\" class=\"w-full bg-blue-600 text-white py-4 rounded-xl font-black uppercase text-xs tracking-widest\">\n KOLEJNY DY\u017bUR\n <\/button>\n <\/div>\n <\/div>\n\n <script>\n const state = {\n gameStarted: false,\n phase: 1, \/\/ 1: Prep, 2: Cut, 3: Clamp, 4: Suture\n progress: 0,\n bpm: 72,\n isCritical: false,\n interactionStarted: false,\n bleedsLeft: 5,\n suturesDone: 0\n };\n\n const els = {\n preloader: document.getElementById('preloader'),\n startBtn: document.getElementById('start-game-btn'),\n tool: document.getElementById('instrument'),\n toolVisual: document.getElementById('tool-visual'),\n overlay: document.getElementById('instruction-overlay'),\n instText: document.getElementById('inst-text'),\n instIcon: document.getElementById('inst-icon'),\n heart: document.getElementById('heart-svg'),\n prepGroup: document.getElementById('prep-group'),\n prepZone: document.getElementById('prep-zone'),\n targetPath: document.getElementById('target-path'),\n progressPath: document.getElementById('progress-path'),\n cutHint: document.getElementById('cut-hint'),\n bleedBox: document.getElementById('bleeding-container'),\n sutureBox: document.getElementById('suture-container'),\n bpmVal: document.getElementById('bpm-val'),\n statusDot: document.getElementById('status-dot'),\n phaseLabel: document.getElementById('phase-label'),\n mainProgress: document.getElementById('main-progress'),\n vignette: document.getElementById('vignette'),\n warning: document.getElementById('warning-msg'),\n stabBtn: document.getElementById('stabilize-btn'),\n modal: document.getElementById('reward-modal')\n };\n\n const pathLen = els.targetPath.getTotalLength();\n els.progressPath.style.strokeDasharray = pathLen;\n els.progressPath.style.strokeDashoffset = pathLen;\n\n \/\/ --- Interaction Controller ---\n const handleInteraction = (e) => {\n if (!state.gameStarted) return;\n const touch = e.touches ? e.touches[0] : e;\n els.tool.style.display = 'block';\n els.tool.style.left = touch.clientX + 'px';\n els.tool.style.top = touch.clientY + 'px';\n\n if (!state.interactionStarted) {\n state.interactionStarted = true;\n els.overlay.style.opacity = '0';\n setTimeout(() => els.overlay.classList.add('hidden'), 400);\n }\n\n if (state.phase === 1) processPrep(touch.clientX, touch.clientY);\n if (state.phase === 2) processCut(touch.clientX, touch.clientY);\n if (state.phase === 3) processClamp(touch.clientX, touch.clientY);\n if (state.phase === 4) processSuture(touch.clientX, touch.clientY);\n };\n\n document.addEventListener('touchstart', handleInteraction, { passive: false });\n document.addEventListener('touchmove', handleInteraction, { passive: false });\n document.addEventListener('touchend', () => els.tool.style.display = 'none');\n\n \/\/ --- Vitals System (Starts only after preloader) ---\n function startVitalsSystem() {\n setInterval(() => {\n if (state.phase === 5 || !state.gameStarted) return;\n\n if (!state.isCritical && Math.random() > 0.96) {\n state.isCritical = true;\n els.heart.classList.add('critical-beat');\n els.warning.style.opacity = '1';\n els.vignette.style.boxShadow = 'inset 0 0 120px rgba(220,38,38,0.7)';\n els.statusDot.classList.replace('bg-green-500', 'bg-red-500');\n }\n\n if (state.isCritical) {\n state.bpm = Math.min(220, state.bpm + 10);\n if (state.bpm > 190 && state.progress > 0) {\n state.progress = Math.max(0, state.progress - 0.01);\n updateUI();\n }\n } else {\n state.bpm = Math.max(60, state.bpm + (Math.random() * 4 - 2));\n els.warning.style.opacity = '0';\n els.vignette.style.boxShadow = 'inset 0 0 120px rgba(220,38,38,0)';\n els.statusDot.classList.replace('bg-red-500', 'bg-green-500');\n }\n\n els.bpmVal.innerText = Math.round(state.bpm);\n els.bpmVal.className = `text-xl font-black font-mono ${state.bpm > 160 ? 'text-red-500 scale-110' : 'text-green-400'}`;\n els.stabBtn.disabled = !state.isCritical;\n }, 150);\n }\n\n els.stabBtn.onclick = () => {\n state.isCritical = false;\n state.bpm = 75;\n els.heart.classList.remove('critical-beat');\n navigator.vibrate?.(40);\n };\n\n \/\/ --- Start Button Trigger ---\n els.startBtn.onclick = () => {\n state.gameStarted = true;\n els.preloader.classList.add('fade-out');\n els.overlay.classList.remove('hidden');\n startVitalsSystem();\n navigator.vibrate?.(100);\n };\n\n \/\/ --- Phase 1: Prep ---\n let prepAcc = 0;\n function processPrep(x, y) {\n const rect = els.prepZone.getBoundingClientRect();\n const d = Math.hypot(x - (rect.left + rect.width\/2), y - (rect.top + rect.height\/2));\n if (d < 70) {\n prepAcc += 2.5;\n state.progress = Math.min(1, prepAcc \/ 200);\n els.prepZone.style.fill = `rgba(34, 197, 94, ${state.progress})`;\n updateUI();\n if (state.progress >= 1) startPhase2();\n }\n }\n\n \/\/ --- Phase 2: Cut ---\n function startPhase2() {\n state.phase = 2; state.progress = 0; state.interactionStarted = false;\n els.prepGroup.classList.add('hidden');\n els.targetPath.classList.remove('hidden');\n els.progressPath.classList.remove('hidden');\n els.cutHint.classList.remove('hidden');\n els.phaseLabel.innerText = \"Faza 2\/4: Naci\u0119cie\";\n showPhaseInstruction(\"Wykonaj naci\u0119cie\", `<svg viewBox=\"0 0 24 24\" fill=\"white\" width=\"32\" height=\"32\"><path d=\"M17.58,3.08L14,6.66L15.42,8.08L17,6.5L18,7.5L16.5,9L17.92,10.42L21.5,6.83C22.1,6.24 22.1,5.29 21.5,4.7L19.3,2.5C18.71,1.9 17.76,1.9 17.17,2.5L17.58,3.08M13.29,7.38L3,17.67V21H6.33L16.62,10.71L13.29,7.38Z\"\/><\/svg>`);\n els.toolVisual.innerHTML = `<svg width=\"48\" height=\"48\" viewBox=\"0 0 24 24\" fill=\"#cbd5e1\" style=\"transform: rotate(-45deg)\"><path d=\"M17.58,3.08L14,6.66L15.42,8.08L17,6.5L18,7.5L16.5,9L17.92,10.42L21.5,6.83C22.1,6.24 22.1,5.29 21.5,4.7L19.3,2.5C18.71,1.9 17.76,1.9 17.17,2.5L17.58,3.08M13.29,7.38L3,17.67V21H6.33L16.62,10.71L13.29,7.38Z\"\/><\/svg>`;\n }\n\n function processCut(x, y) {\n if (state.isCritical) return;\n const pt = els.heart.createSVGPoint(); pt.x = x; pt.y = y;\n const loc = pt.matrixTransform(els.heart.getScreenCTM().inverse());\n const xs = 60, xe = 140;\n if (loc.x >= xs - 5 && loc.x <= xe + 5) {\n const norm = (loc.x - xs) \/ (xe - xs);\n if (norm > state.progress && norm < state.progress + 0.15) {\n if (loc.y > 70 && loc.y < 150) {\n state.progress = norm;\n els.cutHint.setAttribute('cx', loc.x);\n els.cutHint.setAttribute('cy', loc.y);\n updateUI();\n if (state.progress >= 0.98) startPhase3();\n }\n }\n }\n }\n\n \/\/ --- Phase 3: Hemostasis (Clamp) ---\n function startPhase3() {\n state.phase = 3; state.progress = 0; state.interactionStarted = false;\n els.cutHint.classList.add('hidden');\n els.phaseLabel.innerText = \"Faza 3\/4: Hemostaza\";\n showPhaseInstruction(\"Zatamuj krwawienie\", `<svg viewBox=\"0 0 24 24\" fill=\"white\" width=\"32\" height=\"32\"><path d=\"M18.67,13.33L15.33,16.67L13.29,14.63L11.87,16.05L15.33,19.5L20.08,14.75L18.67,13.33M6.33,21H3V17.67L13.29,7.38L16.62,10.71L6.33,21M17.58,3.08L14,6.66L15.42,8.08L17,6.5L18,7.5L16.5,9L17.92,10.42L21.5,6.83L17.58,3.08Z\"\/><\/svg>`);\n els.toolVisual.innerHTML = `<svg width=\"48\" height=\"48\" viewBox=\"0 0 24 24\" fill=\"white\"><path d=\"M7 2v2h10V2H7zm0 18v2h10v-2H7zM5 7v10h2V7H5zm12 0v10h2V7h-2z\"\/><\/svg>`;\n \n for(let i=0; i<5; i++) {\n const bleed = document.createElementNS(\"http:\/\/www.w3.org\/2000\/svg\", \"circle\");\n bleed.setAttribute(\"class\", \"bleed-spot\");\n const point = els.targetPath.getPointAtLength(pathLen * (0.1 + i * 0.2));\n bleed.setAttribute(\"cx\", point.x);\n bleed.setAttribute(\"cy\", point.y);\n bleed.setAttribute(\"r\", \"10\");\n els.bleedBox.appendChild(bleed);\n }\n }\n\n function removeBleed(el) {\n el.remove();\n state.bleedsLeft--;\n state.progress = (5 - state.bleedsLeft) \/ 5;\n updateUI();\n navigator.vibrate?.(20);\n if (state.bleedsLeft <= 0) startPhase4();\n }\n\n function processClamp(x, y) {\n const spots = document.querySelectorAll('.bleed-spot');\n spots.forEach(spot => {\n const r = spot.getBoundingClientRect();\n const d = Math.hypot(x - (r.left + r.width\/2), y - (r.top + r.height\/2));\n if (d < 35) removeBleed(spot);\n });\n }\n\n \/\/ --- Phase 4: Suture ---\n function startPhase4() {\n state.phase = 4; state.progress = 0; state.interactionStarted = false;\n els.phaseLabel.innerText = \"Faza 4\/4: Szew\";\n showPhaseInstruction(\"Za\u0142\u00f3\u017c szwy\", `<svg viewBox=\"0 0 24 24\" fill=\"white\" width=\"32\" height=\"32\"><path d=\"M12,2A10,10 0 0,0 2,12A10,10 0 0,0 12,22A10,10 0 0,0 22,12A10,10 0 0,0 12,2M12,4A8,8 0 0,1 20,12A8,8 0 0,1 12,20A8,8 0 0,1 4,12A8,8 0 0,1 12,4Z\"\/><\/svg>`);\n els.toolVisual.innerHTML = `<svg width=\"48\" height=\"48\" viewBox=\"0 0 24 24\" fill=\"white\" style=\"transform: rotate(45deg)\"><path d=\"M12 2L4.5 20.29L5.21 21L12 18L18.79 21L19.5 20.29L12 2Z\"\/><\/svg>`;\n els.sutureBox.classList.remove('hidden');\n\n for(let i=0; i<8; i++) {\n const dot = document.createElementNS(\"http:\/\/www.w3.org\/2000\/svg\", \"circle\");\n const p = els.targetPath.getPointAtLength(pathLen * (i\/7));\n dot.setAttribute(\"cx\", p.x);\n dot.setAttribute(\"cy\", p.y);\n dot.setAttribute(\"r\", \"4\");\n dot.setAttribute(\"class\", \"suture-dot\");\n dot.dataset.id = i;\n els.sutureBox.appendChild(dot);\n }\n }\n\n function processSuture(x, y) {\n const dots = document.querySelectorAll('.suture-dot');\n dots.forEach(dot => {\n const r = dot.getBoundingClientRect();\n const d = Math.hypot(x - (r.left + r.width\/2), y - (r.top + r.height\/2));\n const id = parseInt(dot.dataset.id);\n if (d < 30 && id === state.suturesDone) {\n dot.style.fill = \"#4ade80\";\n state.suturesDone++;\n state.progress = state.suturesDone \/ 8;\n updateUI();\n navigator.vibrate?.(15);\n if (state.suturesDone >= 8) finishGame();\n }\n });\n }\n\n \/\/ --- Utils ---\n function updateUI() {\n els.mainProgress.style.width = (state.progress * 100) + '%';\n if (state.phase === 2) {\n const offset = pathLen - (state.progress * pathLen);\n els.progressPath.style.strokeDashoffset = offset;\n }\n }\n\n function showPhaseInstruction(text, iconHtml) {\n els.instText.innerText = text;\n els.instIcon.innerHTML = iconHtml;\n els.overlay.classList.remove('hidden');\n els.overlay.style.opacity = '1';\n }\n\n function finishGame() {\n state.phase = 5;\n els.phaseLabel.innerText = \"OPERACJA ZAKO\u0143CZONA\";\n els.phaseLabel.style.color = \"#22c55e\";\n setTimeout(() => {\n els.modal.classList.add('active');\n navigator.vibrate?.([50, 50, 50, 400]);\n }, 600);\n }\n <\/script>\n<\/body>\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Kardiolog Pro – Prezent dla Lewego Wszystkiego najlepszego Lewy! Wyka\u017c si\u0119 a dostaniesz prezent xd Rozpocznij Operacj\u0119 Wymagana precyzja kardiologiczna Monitor 72 BPM Faza 1\/4: Odka\u017canie \u26a0 KRYTYCZNE T\u0118TNO! STABILIZUJ! \u26a0 Zdezynfekuj obszar Dotknij, aby zacz\u0105\u0107 STABILIZUJ Oddzia\u0142 Kardiologii Gotowy do zabiegu KARDIOLOG ROKU! 4\/4 etapy uko\u0144czone bez powik\u0142a\u0144. KOLEJNY DY\u017bUR<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_canvas","meta":{"footnotes":""},"class_list":["post-10","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/prezentlewego.szczepanskipawel.pl\/index.php?rest_route=\/wp\/v2\/pages\/10","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/prezentlewego.szczepanskipawel.pl\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/prezentlewego.szczepanskipawel.pl\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/prezentlewego.szczepanskipawel.pl\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/prezentlewego.szczepanskipawel.pl\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=10"}],"version-history":[{"count":5,"href":"https:\/\/prezentlewego.szczepanskipawel.pl\/index.php?rest_route=\/wp\/v2\/pages\/10\/revisions"}],"predecessor-version":[{"id":18,"href":"https:\/\/prezentlewego.szczepanskipawel.pl\/index.php?rest_route=\/wp\/v2\/pages\/10\/revisions\/18"}],"wp:attachment":[{"href":"https:\/\/prezentlewego.szczepanskipawel.pl\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=10"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}