Sorteo Pro \u00b7 M\u00e1quina de N\u00fameros<\/title>\r\n<script src=\"https:\/\/cdn.tailwindcss.com\"><\/script>\r\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Bebas+Neue&family=Space+Grotesk:wght@300;400;500;600;700&display=swap\" rel=\"stylesheet\">\r\n<link href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.4.0\/css\/all.min.css\" rel=\"stylesheet\">\r\n<style>\r\n:root{\r\n--bg:#0a0a12;\r\n--bg-2:#15151f;\r\n--fg:#ffffff;\r\n--muted:#b0b0c0;\r\n--accent:#fbbf24;\r\n--accent-2:#f97316;\r\n--accent-3:#ef4444;\r\n--success:#10b981;\r\n--card:#1c1c28;\r\n--border:#33334a;\r\n}\r\n*{box-sizing:border-box}\r\nbody{\r\nfont-family:'Space Grotesk',sans-serif;\r\nbackground-color:var(--bg);\r\nbackground-image:\r\nradial-gradient(circle at 15% 20%, rgba(251,191,36,.15), transparent 45%),\r\nradial-gradient(circle at 85% 75%, rgba(239,68,68,.10), transparent 45%);\r\ncolor:var(--fg);\r\nmin-height:100vh;\r\noverflow-x:hidden;\r\npadding: 20px 0;\r\n}\r\n.display-font{font-family:'Bebas Neue',sans-serif;letter-spacing:.02em}\r\n\r\n.bg-grid{\r\nposition:fixed;inset:0;z-index:-1;\r\nbackground-image:\r\nlinear-gradient(rgba(255,255,255,.03) 1px,transparent 1px),\r\nlinear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px);\r\nbackground-size:60px 60px;\r\nmask-image:radial-gradient(circle at center,black 30%,transparent 80%);\r\npointer-events:none;\r\n}\r\n\r\n.particles{position:fixed;inset:0;z-index:-1;pointer-events:none;overflow:hidden}\r\n.particle{\r\nposition:absolute;border-radius:50%;\r\nbackground:radial-gradient(circle,var(--accent),transparent);\r\npointer-events:none;\r\n}\r\n@keyframes floatUp{\r\n0%{transform:translateY(100vh) translateX(0) scale(0);opacity:0}\r\n10%{opacity:.5}\r\n90%{opacity:.5}\r\n100%{transform:translateY(-10vh) translateX(50px) scale(1);opacity:0}\r\n}\r\n\r\n.card{\r\nbackground:var(--card);\r\nborder:1px solid var(--border);\r\nborder-radius:24px;\r\nbox-shadow: 0 10px 30px rgba(0,0,0,0.5);\r\n}\r\n\r\n.reel-window{\r\nposition:relative;\r\nheight:280px;\r\noverflow:hidden;\r\nborder-radius:20px;\r\nbackground:linear-gradient(180deg,\r\nrgba(0,0,0,.8) 0%,\r\nrgba(20,20,30,.6) 50%,\r\nrgba(0,0,0,.8) 100%);\r\nborder:2px solid rgba(251,191,36,.3);\r\nbox-shadow:\r\ninset 0 4px 20px rgba(0,0,0,.8),\r\ninset 0 -4px 20px rgba(0,0,0,.8),\r\n0 0 60px rgba(251,191,36,.1);\r\n}\r\n.reel-window::before,.reel-window::after{\r\ncontent:'';position:absolute;left:0;right:0;height:80px;z-index:3;pointer-events:none;\r\n}\r\n.reel-window::before{\r\ntop:0;\r\nbackground:linear-gradient(180deg,rgba(10,10,18,1),transparent);\r\n}\r\n.reel-window::after{\r\nbottom:0;\r\nbackground:linear-gradient(0deg,rgba(10,10,18,1),transparent);\r\n}\r\n.reel-track{ will-change:transform; }\r\n.reel-number{\r\nheight:280px;\r\ndisplay:flex;align-items:center;justify-content:center;\r\nfont-family:'Bebas Neue',sans-serif;\r\nfont-size:11rem;\r\nline-height:1;\r\ncolor:var(--accent);\r\ntext-shadow:\r\n0 0 30px rgba(251,191,36,.6),\r\n0 0 60px rgba(251,191,36,.3),\r\n0 0 90px rgba(251,191,36,.15);\r\n}\r\n.reel-line{\r\nposition:absolute;left:0;right:0;height:2px;\r\nbackground:linear-gradient(90deg,transparent,var(--accent),transparent);\r\nbox-shadow:0 0 20px var(--accent);\r\nz-index:4;\r\ntop:50%;\r\ntransform:translateY(-50%);\r\n}\r\n\r\n.empty-display{\r\ndisplay:flex;flex-direction:column;align-items:center;justify-content:center;\r\nheight:100%;color:var(--muted);\r\n}\r\n\r\n.btn-sortear{\r\nbackground:linear-gradient(135deg,var(--accent) 0%,var(--accent-2) 100%);\r\ncolor:#1a1a2e;\r\nfont-weight:700;\r\nfont-size:1.5rem;\r\npadding:1.25rem 2rem;\r\nborder-radius:16px;\r\nwidth:100%;\r\nbox-shadow:\r\n0 6px 0 #b45309,\r\n0 12px 30px rgba(251,191,36,.4);\r\ntransition:all .15s ease;\r\ncursor:pointer;\r\nborder:none;\r\nfont-family:'Space Grotesk',sans-serif;\r\nletter-spacing:.05em;\r\ntext-transform:uppercase;\r\n}\r\n.btn-sortear:hover:not(:disabled){\r\ntransform:translateY(-2px);\r\nbox-shadow:0 8px 0 #b45309,0 16px 40px rgba(251,191,36,.5);\r\n}\r\n.btn-sortear:active:not(:disabled){\r\ntransform:translateY(4px);\r\nbox-shadow:0 2px 0 #b45309,0 4px 12px rgba(251,191,36,.3);\r\n}\r\n.btn-sortear:disabled{ opacity:.5;cursor:not-allowed; }\r\n.btn-sortear.sorteando{\r\nbackground:linear-gradient(135deg,var(--accent-3),#b91c1c);\r\nbox-shadow:0 6px 0 #7f1d1d,0 12px 30px rgba(239,68,68,.4);\r\n}\r\n\r\n.toggle{\r\nposition:relative;width:56px;height:30px;\r\nbackground:rgba(255,255,255,.2);\r\nborder-radius:999px;cursor:pointer;\r\ntransition:all .3s;\r\nborder:1px solid var(--border);\r\nflex-shrink:0;\r\n}\r\n.toggle.active{\r\nbackground:linear-gradient(135deg,var(--accent),var(--accent-2));\r\nborder-color:transparent;\r\n}\r\n.toggle-knob{\r\nposition:absolute;top:3px;left:3px;\r\nwidth:22px;height:22px;\r\nbackground:#fff;border-radius:50%;\r\ntransition:all .3s cubic-bezier(.34,1.56,.64,1);\r\nbox-shadow:0 2px 6px rgba(0,0,0,.3);\r\n}\r\n.toggle.active .toggle-knob{ left:30px; }\r\n\r\n.number-input{\r\nbackground:#ffffff;\r\nborder:1px solid #cbd5e1;\r\nborder-radius:12px;\r\npadding:.75rem 1rem;\r\nfont-family:'Space Grotesk',sans-serif;\r\nfont-weight:600;\r\ncolor:#1a1a2e;\r\nfont-size:1.25rem;\r\nwidth:100%;\r\ntransition:all .2s;\r\ntext-align:center;\r\n}\r\n.number-input:focus{\r\noutline:none;\r\nborder-color:var(--accent);\r\nbackground:#ffffff;\r\nbox-shadow:0 0 0 3px rgba(251,191,36,.3);\r\n}\r\n\r\n.lottery-ball{\r\nwidth:64px;height:64px;\r\nborder-radius:50%;\r\ndisplay:inline-flex;align-items:center;justify-content:center;\r\nfont-family:'Bebas Neue',sans-serif;\r\nfont-size:1.75rem;\r\nbackground:radial-gradient(circle at 30% 30%,#fde68a,var(--accent) 50%,var(--accent-2));\r\ncolor:#1a1a2e;\r\nfont-weight:700;\r\nbox-shadow:\r\ninset -6px -6px 12px rgba(0,0,0,.25),\r\ninset 4px 4px 8px rgba(255,255,255,.4),\r\n0 4px 16px rgba(251,191,36,.35);\r\nanimation:ballAppear .6s cubic-bezier(.34,1.56,.64,1);\r\nflex-shrink:0;\r\n}\r\n@keyframes ballAppear{\r\n0%{transform:scale(0) rotate(-180deg);opacity:0}\r\n60%{transform:scale(1.15) rotate(10deg);opacity:1}\r\n100%{transform:scale(1) rotate(0);opacity:1}\r\n}\r\n\r\n.btn-secondary{\r\nbackground:rgba(255,255,255,.08);\r\nborder:1px solid var(--border);\r\ncolor:#ffffff;\r\npadding:.6rem 1rem;\r\nborder-radius:10px;\r\nfont-weight:500;\r\ntransition:all .2s;\r\ncursor:pointer;\r\nfont-family:'Space Grotesk',sans-serif;\r\n}\r\n.btn-secondary:hover{\r\nbackground:rgba(255,255,255,.15);\r\nborder-color:rgba(255,255,255,.3);\r\n}\r\n.btn-danger:hover{\r\nbackground:rgba(239,68,68,.2);\r\nborder-color:rgba(239,68,68,.5);\r\ncolor:#fca5a5;\r\n}\r\n\r\n#confettiCanvas{\r\nposition:fixed;inset:0;\r\npointer-events:none;z-index:100;\r\n}\r\n\r\n.progress-bar{\r\nheight:6px;background:rgba(255,255,255,.1);\r\nborder-radius:999px;overflow:hidden;\r\n}\r\n.progress-fill{\r\nheight:100%;\r\nbackground:linear-gradient(90deg,var(--accent),var(--accent-2));\r\nborder-radius:999px;\r\ntransition:width .4s ease;\r\nbox-shadow:0 0 12px rgba(251,191,36,.5);\r\n}\r\n\r\n.history-item{\r\ndisplay:flex;align-items:center;gap:.75rem;\r\npadding:.75rem 1rem;\r\nbackground:rgba(255,255,255,.03);\r\nborder:1px solid var(--border);\r\nborder-radius:12px;\r\ntransition:all .2s;\r\n}\r\n.history-item:hover{\r\nbackground:rgba(255,255,255,.08);\r\ntransform:translateX(4px);\r\n}\r\n.history-number{\r\nfont-family:'Bebas Neue',sans-serif;\r\nfont-size:1.5rem;\r\ncolor:var(--accent);\r\nmin-width:50px;\r\n}\r\n\r\n.toast{\r\nposition:fixed;bottom:2rem;left:50%;\r\ntransform:translateX(-50%) translateY(120%);\r\nbackground:#1c1c28;\r\nborder:1px solid var(--border);\r\npadding:1rem 1.5rem;\r\nborder-radius:12px;\r\nz-index:200;\r\ntransition:transform .4s cubic-bezier(.34,1.56,.64,1);\r\nbox-shadow:0 10px 40px rgba(0,0,0,.5);\r\ndisplay:flex;align-items:center;gap:.75rem;\r\nmax-width:90vw;\r\ncolor:#fff;\r\n}\r\n.toast.show{transform:translateX(-50%) translateY(0)}\r\n.toast.error{border-color:rgba(239,68,68,.7); color:#fca5a5;}\r\n.toast.success{border-color:rgba(16,185,129,.7); color:#6ee7b7;}\r\n\r\ninput[type=range]{\r\n-webkit-appearance:none;appearance:none;\r\nwidth:100%;height:6px;\r\nbackground:rgba(255,255,255,.15);\r\nborder-radius:999px;outline:none;\r\n}\r\ninput[type=range]::-webkit-slider-thumb{\r\n-webkit-appearance:none;appearance:none;\r\nwidth:20px;height:20px;\r\nbackground:linear-gradient(135deg,var(--accent),var(--accent-2));\r\nborder-radius:50%;cursor:pointer;\r\nbox-shadow:0 2px 8px rgba(251,191,36,.5);\r\nborder:2px solid #1a1a2e;\r\n}\r\ninput[type=range]::-moz-range-thumb{\r\nwidth:20px;height:20px;\r\nbackground:linear-gradient(135deg,var(--accent),var(--accent-2));\r\nborder-radius:50%;cursor:pointer;\r\nborder:2px solid #1a1a2e;\r\n}\r\n\r\n@media(max-width:768px){\r\n.reel-number{font-size:7rem}\r\n.reel-window{height:220px}\r\n.reel-number{height:220px}\r\n}\r\n\r\n::-webkit-scrollbar{width:8px;height:8px}\r\n::-webkit-scrollbar-track{background:transparent}\r\n::-webkit-scrollbar-thumb{background:rgba(255,255,255,.2);border-radius:4px}\r\n::-webkit-scrollbar-thumb:hover{background:rgba(255,255,255,.4)}\r\n<\/style>\r\n<\/head>\r\n<body>\r\n\r\n<div class=\"bg-grid\"><\/div>\r\n<div class=\"particles\" id=\"particles\"><\/div>\r\n<canvas id=\"confettiCanvas\"><\/canvas>\r\n\r\n<header class=\"max-w-7xl mx-auto px-4 sm:px-6 pt-6 pb-4\">\r\n<div class=\"flex items-center justify-between flex-wrap gap-4\">\r\n\r\n<div class=\"flex items-center gap-3\">\r\n<div class=\"w-12 h-12 rounded-xl flex items-center justify-center\" style=\"background:linear-gradient(135deg,var(--accent),var(--accent-2));box-shadow:0 8px 24px rgba(251,191,36,.4)\">\r\n<i class=\"fa-solid fa-dice text-2xl\" style=\"color:#1a1a2e\"><\/i>\r\n<\/div>\r\n\r\n<div>\r\n<h1 class=\"display-font text-3xl sm:text-4xl leading-tight mb-0 p-0 text-black\"><strong>SORTEO de N\u00daMEROS<\/strong><\/h1>\r\n<p class=\"text-sm font-semibold text-blue-400 hover:text-blue-300 transition-colors -mt-1\">\r\n<a href=\"https:\/\/unsl.edu.ar\" target=\"_blank\">FISAR Sim<\/a>\r\n<span class=\"text-xs text-gray-400\"> FICA \/ UNSL<\/span>\r\n<\/p>\r\n<\/div>\r\n<\/div>\r\n\r\n<div class=\"flex items-center gap-3 flex-wrap\">\r\n\r\n<div class=\"card px-4 py-2 flex items-center gap-3 cursor-pointer\" id=\"maleVoiceCard\">\r\n<i class=\"fa-solid fa-mars text-xl\" style=\"color:var(--accent)\"><\/i>\r\n<span class=\"text-sm font-medium hidden sm:inline text-white\">Voz Hombre<\/span>\r\n<div class=\"toggle\" id=\"maleVoiceToggle\" role=\"switch\" aria-checked=\"false\">\r\n<div class=\"toggle-knob\"><\/div>\r\n<\/div>\r\n<\/div>\r\n\r\n<div class=\"card px-4 py-2 flex items-center gap-3 cursor-pointer\" id=\"femaleVoiceCard\">\r\n<i class=\"fa-solid fa-venus text-xl\" style=\"color:var(--accent)\"><\/i>\r\n<span class=\"text-sm font-medium hidden sm:inline text-white\">Voz Mujer<\/span>\r\n<div class=\"toggle active\" id=\"femaleVoiceToggle\" role=\"switch\" aria-checked=\"true\">\r\n<div class=\"toggle-knob\"><\/div>\r\n<\/div>\r\n<\/div>\r\n\r\n<div class=\"card px-4 py-2 flex items-center gap-3 cursor-pointer\" id=\"sfxCard\">\r\n<i class=\"fa-solid fa-volume-high\" style=\"color:var(--accent)\"><\/i>\r\n<span class=\"text-sm font-medium hidden sm:inline text-white\">Efectos<\/span>\r\n<div class=\"toggle active\" id=\"sfxToggle\" role=\"switch\" aria-checked=\"true\">\r\n<div class=\"toggle-knob\"><\/div>\r\n<\/div>\r\n<\/div>\r\n\r\n<\/div>\r\n\r\n<\/div>\r\n<\/header>\r\n\r\n<main class=\"max-w-7xl mx-auto px-4 sm:px-6 pb-12\">\r\n<div class=\"grid lg:grid-cols-5 gap-6\">\r\n\r\n<aside class=\"lg:col-span-2 space-y-6\">\r\n\r\n<section class=\"card p-6\">\r\n<h2 class=\"display-font text-2xl mb-5 flex items-center gap-2 text-white\">\r\n<i class=\"fa-solid fa-sliders text-lg\" style=\"color:var(--accent)\"><\/i>\r\nCONFIGURACI\u00d3N\r\n<\/h2>\r\n\r\n<div class=\"flex items-center justify-between p-4 rounded-xl mb-4\" style=\"background:rgba(0,0,0,0.2);border:1px solid var(--border)\">\r\n<div>\r\n<p class=\"font-semibold text-base text-white\">Permitir repetici\u00f3n<\/p>\r\n<p class=\"text-xs text-gray-400 mt-1\">\u00bfLos n\u00fameros pueden salir m\u00e1s de una vez?<\/p>\r\n<\/div>\r\n<div class=\"toggle\" id=\"repeatToggle\" role=\"switch\" aria-checked=\"false\">\r\n<div class=\"toggle-knob\"><\/div>\r\n<\/div>\r\n<\/div>\r\n\r\n<div class=\"mb-4\">\r\n<label class=\"text-sm font-medium text-gray-300 mb-2 block\">Rango de n\u00fameros<\/label>\r\n<div class=\"grid grid-cols-2 gap-3\">\r\n<div>\r\n<p class=\"text-xs text-gray-400 mb-1\">Desde<\/p>\r\n<input type=\"number\" id=\"minInput\" class=\"number-input\" value=\"1\" min=\"-9999\" max=\"9999\">\r\n<\/div>\r\n<div>\r\n<p class=\"text-xs text-gray-400 mb-1\">Hasta<\/p>\r\n<input type=\"number\" id=\"maxInput\" class=\"number-input\" value=\"100\" min=\"-9999\" max=\"9999\">\r\n<\/div>\r\n<\/div>\r\n<\/div>\r\n\r\n<div class=\"mb-4\">\r\n<label class=\"text-sm font-medium text-gray-300 mb-2 block\">Cantidad a sortear<\/label>\r\n<input type=\"number\" id=\"qtyInput\" class=\"number-input\" value=\"1\" min=\"1\">\r\n<\/div>\r\n\r\n<div class=\"mb-2\">\r\n<label class=\"text-sm font-medium text-gray-300 mb-2 block\">\r\nVelocidad de voz\r\n<span class=\"text-gray-500 font-normal\">(<span id=\"rateDisplay\">1.0<\/span>x)<\/span>\r\n<\/label>\r\n<input type=\"range\" id=\"rateRange\" min=\"0.5\" max=\"1.5\" step=\"0.1\" value=\"1.0\">\r\n<\/div>\r\n\r\n<div class=\"mt-5 p-3 rounded-lg flex items-start gap-3\" style=\"background:rgba(251,191,36,.1);border:1px solid rgba(251,191,36,.3)\">\r\n<i class=\"fa-solid fa-circle-info mt-0.5\" style=\"color:var(--accent)\"><\/i>\r\n<div class=\"text-sm text-white\">\r\n<p><span class=\"text-gray-400\">Disponibles:<\/span> <span id=\"availableCount\" class=\"font-bold\" style=\"color:var(--accent)\">100<\/span><\/p>\r\n<p class=\"text-xs text-gray-300 mt-1\" id=\"rangeInfo\">Del 1 al 100<\/p>\r\n<\/div>\r\n<\/div>\r\n<\/section>\r\n\r\n<button class=\"btn-sortear\" id=\"sortearBtn\">\r\n<i class=\"fa-solid fa-dice mr-2\"><\/i>\r\nSORTEAR\r\n<\/button>\r\n\r\n<div class=\"grid grid-cols-2 gap-3\">\r\n<button class=\"btn-secondary btn-danger\" id=\"clearBtn\">\r\n<i class=\"fa-solid fa-trash mr-2\"><\/i> Limpiar\r\n<\/button>\r\n<button class=\"btn-secondary\" id=\"copyBtn\">\r\n<i class=\"fa-solid fa-copy mr-2\"><\/i> Copiar\r\n<\/button>\r\n<\/div>\r\n\r\n<section class=\"card p-5\">\r\n<h3 class=\"display-font text-xl mb-3 flex items-center gap-2 text-white\">\r\n<i class=\"fa-solid fa-chart-simple\" style=\"color:var(--accent)\"><\/i>\r\nESTAD\u00cdSTICAS\r\n<\/h3>\r\n<div class=\"grid grid-cols-3 gap-3 text-center\">\r\n<div>\r\n<p class=\"display-font text-3xl\" style=\"color:var(--accent)\" id=\"statTotal\">0<\/p>\r\n<p class=\"text-xs text-gray-400 mt-1\">Sorteados<\/p>\r\n<\/div>\r\n<div>\r\n<p class=\"display-font text-3xl\" style=\"color:var(--accent-2)\" id=\"statRemaining\">100<\/p>\r\n<p class=\"text-xs text-gray-400 mt-1\">Restantes<\/p>\r\n<\/div>\r\n<div>\r\n<p class=\"display-font text-3xl\" style=\"color:var(--success)\" id=\"statLast\">\u2014<\/p>\r\n<p class=\"text-xs text-gray-400 mt-1\">\u00daltimo<\/p>\r\n<\/div>\r\n<\/div>\r\n<\/section>\r\n<\/aside>\r\n\r\n<section class=\"lg:col-span-3 space-y-6\">\r\n\r\n<div class=\"card p-6\">\r\n<div class=\"flex items-center justify-between mb-4\">\r\n<h2 class=\"display-font text-2xl flex items-center gap-2 text-white\">\r\n<i class=\"fa-solid fa-bullseye\" style=\"color:var(--accent)\"><\/i>\r\nN\u00daMERO ACTUAL\r\n<\/h2>\r\n<div class=\"flex items-center gap-3 text-sm\">\r\n<span class=\"text-gray-400\">Progreso<\/span>\r\n<span class=\"font-semibold text-white\"><span id=\"currentNum\">0<\/span>\/<span id=\"totalNum\">1<\/span><\/span>\r\n<\/div>\r\n<\/div>\r\n\r\n<div class=\"reel-window mb-4\">\r\n<div class=\"reel-line\"><\/div>\r\n<div class=\"reel-track\" id=\"reelTrack\">\r\n<div class=\"empty-display\" id=\"emptyDisplay\">\r\n<i class=\"fa-solid fa-dice text-6xl mb-3 opacity-30\"><\/i>\r\n<p class=\"text-lg text-white\">Presiona <span style=\"color:var(--accent);font-weight:600\">SORTEAR<\/span> para comenzar<\/p>\r\n<\/div>\r\n<\/div>\r\n<\/div>\r\n\r\n<div class=\"progress-bar mb-4\">\r\n<div class=\"progress-fill\" id=\"progressFill\" style=\"width:0%\"><\/div>\r\n<\/div>\r\n\r\n<div>\r\n<p class=\"text-xs text-gray-400 mb-2 uppercase tracking-wider\">N\u00fameros sorteados<\/p>\r\n<div class=\"flex flex-wrap gap-2 min-h-[70px]\" id=\"ballsContainer\">\r\n<p class=\"text-sm text-gray-500 italic self-center\">A\u00fan no hay n\u00fameros sorteados<\/p>\r\n<\/div>\r\n<\/div>\r\n<\/div>\r\n\r\n<div class=\"card p-6\">\r\n<div class=\"flex items-center justify-between mb-4\">\r\n<h2 class=\"display-font text-2xl flex items-center gap-2 text-white\">\r\n<i class=\"fa-solid fa-clock-rotate-left\" style=\"color:var(--accent)\"><\/i>\r\nHISTORIAL\r\n<\/h2>\r\n<span class=\"text-sm text-gray-400\" id=\"historyCount\">0 n\u00fameros<\/span>\r\n<\/div>\r\n<div class=\"space-y-2 max-h-[300px] overflow-y-auto pr-2\" id=\"historyContainer\">\r\n<p class=\"text-sm text-gray-500 italic text-center py-8\">El historial aparecer\u00e1 aqu\u00ed despu\u00e9s del primer sorteo<\/p>\r\n<\/div>\r\n<\/div>\r\n<\/section>\r\n<\/div>\r\n<\/main>\r\n\r\n<div class=\"toast\" id=\"toast\">\r\n<i class=\"fa-solid fa-circle-info\" id=\"toastIcon\"><\/i>\r\n<span id=\"toastMsg\">Mensaje<\/span>\r\n<\/div>\r\n\r\n<script>\r\nconst state = {\r\nmin:1, max:100, qty:1, repeat:false,\r\nvoiceMode:'mujer', \/\/ 'hombre', 'mujer', 'none'\r\nsfxOn:true, rate:1.0,\r\nsorteando:false, currentIdx:0,\r\nhistory:[], drawnSet:new Set(), remaining:[],\r\n};\r\n\r\nconst $ = id => document.getElementById(id);\r\nconst repeatToggle = $('repeatToggle');\r\nconst maleVoiceToggle = $('maleVoiceToggle');\r\nconst femaleVoiceToggle = $('femaleVoiceToggle');\r\nconst maleVoiceCard = $('maleVoiceCard');\r\nconst femaleVoiceCard = $('femaleVoiceCard');\r\nconst sfxToggle = $('sfxToggle');\r\nconst minInput = $('minInput');\r\nconst maxInput = $('maxInput');\r\nconst qtyInput = $('qtyInput');\r\nconst rateRange = $('rateRange');\r\nconst rateDisplay = $('rateDisplay');\r\nconst sortearBtn = $('sortearBtn');\r\nconst clearBtn = $('clearBtn');\r\nconst copyBtn = $('copyBtn');\r\nconst reelTrack = $('reelTrack');\r\nconst emptyDisplay = $('emptyDisplay');\r\nconst ballsContainer = $('ballsContainer');\r\nconst historyContainer = $('historyContainer');\r\nconst historyCount = $('historyCount');\r\nconst availableCount = $('availableCount');\r\nconst rangeInfo = $('rangeInfo');\r\nconst statTotal = $('statTotal');\r\nconst statRemaining = $('statRemaining');\r\nconst statLast = $('statLast');\r\nconst currentNum = $('currentNum');\r\nconst totalNum = $('totalNum');\r\nconst progressFill = $('progressFill');\r\nconst toast = $('toast');\r\nconst toastMsg = $('toastMsg');\r\nconst toastIcon = $('toastIcon');\r\n\r\nlet audioCtx = null;\r\nfunction ensureAudio(){\r\nif(!audioCtx){\r\ntry{ audioCtx = new (window.AudioContext || window.webkitAudioContext)(); }catch(e){}\r\n}\r\nif(audioCtx && audioCtx.state === 'suspended') audioCtx.resume();\r\n}\r\n\r\nfunction tickSound(freq=800, duration=0.04, vol=0.06){\r\nif(!audioCtx || !state.sfxOn) return;\r\nconst osc = audioCtx.createOscillator();\r\nconst gain = audioCtx.createGain();\r\nosc.connect(gain); gain.connect(audioCtx.destination);\r\nosc.frequency.value = freq; osc.type = 'square';\r\ngain.gain.setValueAtTime(vol, audioCtx.currentTime);\r\ngain.gain.exponentialRampToValueAtTime(0.001, audioCtx.currentTime + duration);\r\nosc.start(); osc.stop(audioCtx.currentTime + duration);\r\n}\r\n\r\nfunction winSound(){\r\nif(!audioCtx || !state.sfxOn) return;\r\nconst notes = [523, 659, 784, 1047];\r\nnotes.forEach((f, i) => {\r\nsetTimeout(() => {\r\nconst osc = audioCtx.createOscillator();\r\nconst gain = audioCtx.createGain();\r\nosc.connect(gain); gain.connect(audioCtx.destination);\r\nosc.frequency.value = f; osc.type = 'triangle';\r\ngain.gain.setValueAtTime(0.15, audioCtx.currentTime);\r\ngain.gain.exponentialRampToValueAtTime(0.001, audioCtx.currentTime + 0.3);\r\nosc.start(); osc.stop(audioCtx.currentTime + 0.3);\r\n}, i * 90);\r\n});\r\n}\r\n\r\nlet voices = [];\r\nfunction loadVoices(){ voices = speechSynthesis.getVoices(); }\r\nif('speechSynthesis' in window){\r\nloadVoices();\r\nspeechSynthesis.onvoiceschanged = loadVoices;\r\n}\r\n\r\nfunction hablar(texto){\r\nif(state.voiceMode === 'none' || !('speechSynthesis' in window)) return;\r\nspeechSynthesis.cancel();\r\nconst u = new SpeechSynthesisUtterance(texto);\r\nu.rate = state.rate;\r\nu.pitch = 1.0; \/\/ \u2705 Tono natural, sin distorsiones\r\n\r\nlet latVoices = voices.filter(v => ['es-AR', 'es-MX', 'es-CO', 'es-CL', 'es-US'].includes(v.lang));\r\nif(latVoices.length === 0){\r\nlatVoices = voices.filter(v => v.lang && v.lang.toLowerCase().startsWith('es'));\r\n}\r\nif(latVoices.length === 0) latVoices = voices;\r\n\r\nlet preferredVoice = null;\r\n\r\n\/\/ Nombres reales de voces masculinas en sistemas Windows\/Mac\/Google\r\nconst maleNames = ['male', 'jorge', 'pablo', 'diego', 'javier', 'miguel', 'luis', 'enrique', 'carlos', 'juan', 'raul', 'microsoft raul', 'google espa\u00f1ol masculino'];\r\nconst femaleNames = ['female', 'helena', 'valentina', 'dalia', 'paulina', 'monica', 'sabina', 'elena', 'catalina', 'esperanza', 'conchita', 'elvira', 'carmen', 'lucia', 'google espa\u00f1ol', 'microsoft elena', 'microsoft sabina'];\r\n\r\nif(state.voiceMode === 'hombre'){\r\npreferredVoice = latVoices.find(v => maleNames.some(n => v.name.toLowerCase().includes(n)));\r\n\/\/ Si no hay voz de hombre instalada, usar\u00e1 la primera disponible sin deformarla\r\nif(!preferredVoice) preferredVoice = latVoices[0];\r\n} else if(state.voiceMode === 'mujer'){\r\npreferredVoice = latVoices.find(v => femaleNames.some(n => v.name.toLowerCase().includes(n)));\r\nif(!preferredVoice) preferredVoice = latVoices[0];\r\n}\r\n\r\nif(preferredVoice){\r\nu.voice = preferredVoice;\r\nu.lang = preferredVoice.lang;\r\n} else {\r\nu.lang = 'es-AR';\r\n}\r\n\r\nspeechSynthesis.speak(u);\r\n}\r\n\r\nfunction toggleRepeat(){\r\nstate.repeat = !state.repeat;\r\nrepeatToggle.classList.toggle('active', state.repeat);\r\nrepeatToggle.setAttribute('aria-checked', state.repeat);\r\nupdateAvailable();\r\n}\r\n\r\nfunction setVoiceMode(mode){\r\nstate.voiceMode = mode;\r\nmaleVoiceToggle.classList.toggle('active', mode === 'hombre');\r\nfemaleVoiceToggle.classList.toggle('active', mode === 'mujer');\r\n\r\nif(mode === 'none'){\r\nspeechSynthesis.cancel();\r\n} else {\r\nensureAudio();\r\nhablar(mode === 'hombre' ? 'Voz de hombre activada' : 'Voz de mujer activada');\r\n}\r\n}\r\n\r\nmaleVoiceCard.addEventListener('click', () => { ensureAudio(); setVoiceMode(state.voiceMode === 'hombre' ? 'none' : 'hombre'); });\r\nfemaleVoiceCard.addEventListener('click', () => { ensureAudio(); setVoiceMode(state.voiceMode === 'mujer' ? 'none' : 'mujer'); });\r\n\r\nfunction toggleSfx(){\r\nstate.sfxOn = !state.sfxOn;\r\nsfxToggle.classList.toggle('active', state.sfxOn);\r\nsfxToggle.setAttribute('aria-checked', state.sfxOn);\r\nensureAudio();\r\nif(state.sfxOn){ tickSound(800, 0.1, 0.1); }\r\n}\r\nsfxToggle.addEventListener('click', () => { ensureAudio(); toggleSfx(); });\r\nrepeatToggle.addEventListener('click', toggleRepeat);\r\n\r\nminInput.addEventListener('input', () => { state.min = parseInt(minInput.value) || 0; updateAvailable(); });\r\nmaxInput.addEventListener('input', () => { state.max = parseInt(maxInput.value) || 0; updateAvailable(); });\r\n\r\nqtyInput.addEventListener('input', () => {\r\nlet val = parseInt(qtyInput.value);\r\nif (isNaN(val) || val < 1) val = 1;\r\nstate.qty = val;\r\ntotalNum.textContent = state.qty;\r\nupdateAvailable();\r\n});\r\n\r\nrateRange.addEventListener('input', () => {\r\nstate.rate = parseFloat(rateRange.value);\r\nrateDisplay.textContent = state.rate.toFixed(1);\r\n});\r\n\r\nfunction updateAvailable(){\r\nconst lo = Math.min(state.min, state.max);\r\nconst hi = Math.max(state.min, state.max);\r\nconst total = hi - lo + 1;\r\nrangeInfo.textContent = `Del ${lo} al ${hi}`;\r\nif(state.repeat){\r\navailableCount.textContent = '\u221e'; statRemaining.textContent = '\u221e';\r\n} else {\r\nconst drawn = state.history.length;\r\nconst remaining = Math.max(0, total - drawn);\r\navailableCount.textContent = remaining; statRemaining.textContent = remaining;\r\nif(state.qty > remaining && remaining > 0){ showToast(`Solo quedan ${remaining} n\u00fameros disponibles. Ajusta la cantidad.`, 'error'); }\r\n}\r\n}\r\n\r\nfunction obtenerRango(){ const lo = Math.min(state.min, state.max); const hi = Math.max(state.min, state.max); return {lo, hi, total: hi - lo + 1}; }\r\n\r\nfunction generarNumero(){\r\nconst {lo, hi, total} = obtenerRango();\r\nif(state.repeat){ return Math.floor(Math.random() * total) + lo; }\r\nif(state.remaining.length === 0) return null;\r\nconst idx = Math.floor(Math.random() * state.remaining.length);\r\nreturn state.remaining.splice(idx, 1)[0];\r\n}\r\n\r\nfunction iniciarRemaining(){\r\nconst {lo, hi} = obtenerRango();\r\nstate.remaining = [];\r\nfor(let i = lo; i <= hi; i++) state.remaining.push(i);\r\nstate.drawnSet = new Set();\r\n}\r\n\r\nasync function realizarSorteo(){\r\nif(state.sorteando) return;\r\nensureAudio();\r\nconst {lo, hi, total} = obtenerRango();\r\nif(total <= 0){ showToast('El rango de n\u00fameros no es v\u00e1lido', 'error'); return; }\r\nif(lo === hi && state.qty > 1 && !state.repeat){ showToast('Con un solo n\u00famero disponible no puedes sortear m\u00faltiples sin repetici\u00f3n', 'error'); return; }\r\n\r\nif(state.currentIdx === 0){\r\nif(!state.repeat){ iniciarRemaining(); }\r\nstate.history = []; state.drawnSet = new Set();\r\nballsContainer.innerHTML = '';\r\nhistoryContainer.innerHTML = '<p class=\"text-sm text-gray-500 italic text-center py-8\">Sorteando...<\/p>';\r\nhistoryCount.textContent = '0 n\u00fameros';\r\n}\r\n\r\nif(!state.repeat){\r\nconst needed = state.qty - state.currentIdx;\r\nif(state.remaining.length < needed){ showToast(`Solo quedan ${state.remaining.length} n\u00fameros disponibles. Reinicia el sorteo.`, 'error'); return; }\r\n}\r\n\r\nstate.sorteando = true;\r\nsortearBtn.disabled = true;\r\nsortearBtn.classList.add('sorteando');\r\nsortearBtn.innerHTML = '<i class=\"fa-solid fa-spinner fa-spin mr-2\"><\/i> SORTEANDO...';\r\nemptyDisplay.style.display = 'none';\r\n\r\nfor(let i = 0; i < state.qty; i++){\r\nif(!state.repeat && state.remaining.length === 0){ showToast('No quedan m\u00e1s n\u00fameros disponibles', 'error'); break; }\r\nstate.currentIdx = state.history.length + 1;\r\ncurrentNum.textContent = state.currentIdx;\r\nconst numero = generarNumero();\r\nif(numero === null) break;\r\nawait animarReel(numero);\r\nstate.history.push(numero);\r\nstate.drawnSet.add(numero);\r\nagregarBola(numero);\r\nagregarHistorial(numero);\r\nwinSound();\r\nhablar(numero.toString());\r\nstatTotal.textContent = state.history.length;\r\nstatLast.textContent = numero;\r\nconst progress = (state.history.length \/ state.qty) * 100;\r\nprogressFill.style.width = progress + '%';\r\nif(i === state.qty - 1){ lanzarConfetti(); } else { await wait(400); }\r\n}\r\n\r\nstate.sorteando = false;\r\nsortearBtn.disabled = false;\r\nsortearBtn.classList.remove('sorteando');\r\nsortearBtn.innerHTML = '<i class=\"fa-solid fa-dice mr-2\"><\/i> SORTEAR OTRO';\r\nupdateAvailable();\r\nshowToast(`Sorteo completado: ${state.history.length} n\u00famero(s)`, 'success');\r\n}\r\n\r\nfunction animarReel(numeroFinal){\r\nreturn new Promise(resolve => {\r\nconst {lo, hi} = obtenerRango();\r\nconst alturaItem = window.innerWidth < 768 ? 220 : 280;\r\nconst secuencia = [];\r\nconst numItems = 35;\r\nfor(let i = 0; i < numItems; i++){ secuencia.push(Math.floor(Math.random() * (hi - lo + 1)) + lo); }\r\nsecuencia.push(numeroFinal);\r\nreelTrack.innerHTML = secuencia.map(n => `<div class=\"reel-number\">${n}<\/div>`).join('');\r\nreelTrack.style.transition = 'none';\r\nreelTrack.style.transform = 'translateY(0)';\r\nvoid reelTrack.offsetHeight;\r\nconst totalItems = secuencia.length;\r\nconst offset = (totalItems - 1) * alturaItem;\r\nreelTrack.style.transition = 'transform 3s cubic-bezier(0.15, 0.85, 0.25, 1)';\r\nreelTrack.style.transform = `translateY(-${offset}px)`;\r\n\r\nlet tickCount = 0;\r\nconst tickInterval = setInterval(() => {\r\ntickCount++;\r\nconst freq = 600 + Math.random() * 400;\r\nconst vol = Math.max(0.02, 0.08 - tickCount * 0.003);\r\ntickSound(freq, 0.03, vol);\r\nif(tickCount > 25){ clearInterval(tickInterval); }\r\n}, 90);\r\n\r\nsetTimeout(() => { clearInterval(tickInterval); resolve(); }, 3100);\r\n});\r\n}\r\n\r\nfunction wait(ms){ return new Promise(r => setTimeout(r, ms)); }\r\n\r\nfunction agregarBola(numero){\r\nconst placeholder = ballsContainer.querySelector('p.italic');\r\nif(placeholder) placeholder.remove();\r\nconst bola = document.createElement('div');\r\nbola.className = 'lottery-ball';\r\nbola.textContent = numero;\r\nballsContainer.appendChild(bola);\r\nballsContainer.scrollLeft = ballsContainer.scrollWidth;\r\n}\r\n\r\nfunction agregarHistorial(numero){\r\nconst placeholder = historyContainer.querySelector('p.italic');\r\nif(placeholder) placeholder.remove();\r\nconst item = document.createElement('div');\r\nitem.className = 'history-item';\r\nconst hora = new Date().toLocaleTimeString('es-ES', {hour:'2-digit', minute:'2-digit', second:'2-digit'});\r\nitem.innerHTML = `<div class=\"history-number\">${numero}<\/div><div class=\"flex-1\"><p class=\"text-sm font-medium text-white\">N\u00famero ${numero}<\/p><p class=\"text-xs text-gray-400\">Sorteo #${state.history.length} \u00b7 ${hora}<\/p><\/div><i class=\"fa-solid fa-check-circle\" style=\"color:var(--success)\"><\/i>`;\r\nhistoryContainer.prepend(item);\r\nhistoryCount.textContent = `${state.history.length} n\u00famero${state.history.length !== 1 ? 's' : ''}`;\r\n}\r\n\r\nconst confettiCanvas = $('confettiCanvas');\r\nconst cctx = confettiCanvas.getContext('2d');\r\nlet confettiParticles = [];\r\n\r\nfunction resizeConfetti(){ confettiCanvas.width = window.innerWidth; confettiCanvas.height = window.innerHeight; }\r\nresizeConfetti();\r\nwindow.addEventListener('resize', resizeConfetti);\r\n\r\nfunction lanzarConfetti(){\r\nconst colors = ['#fbbf24', '#f97316', '#ef4444', '#10b981', '#ffffff', '#fde68a'];\r\nconst cx = window.innerWidth \/ 2; const cy = window.innerHeight \/ 2;\r\nfor(let i = 0; i < 150; i++){\r\nconfettiParticles.push({\r\nx: cx + (Math.random() - 0.5) * 100, y: cy,\r\nvx: (Math.random() - 0.5) * 18, vy: Math.random() * -18 - 5,\r\ngravity: 0.5, size: Math.random() * 8 + 4,\r\ncolor: colors[Math.floor(Math.random() * colors.length)],\r\nrotation: Math.random() * 360, rotationSpeed: (Math.random() - 0.5) * 12,\r\nlife: 1, shape: Math.random() > 0.5 ? 'rect' : 'circle'\r\n});\r\n}\r\n}\r\n\r\nfunction animarConfetti(){\r\ncctx.clearRect(0, 0, confettiCanvas.width, confettiCanvas.height);\r\nconfettiParticles = confettiParticles.filter(p => p.life > 0 && p.y < confettiCanvas.height + 50);\r\nconfettiParticles.forEach(p => {\r\np.x += p.vx; p.y += p.vy; p.vy += p.gravity; p.vx *= 0.99;\r\np.rotation += p.rotationSpeed; p.life -= 0.008;\r\ncctx.save();\r\ncctx.translate(p.x, p.y); cctx.rotate(p.rotation * Math.PI \/ 180);\r\ncctx.fillStyle = p.color; cctx.globalAlpha = Math.max(0, p.life);\r\nif(p.shape === 'rect'){ cctx.fillRect(-p.size\/2, -p.size\/2, p.size, p.size * 0.6); }\r\nelse { cctx.beginPath(); cctx.arc(0, 0, p.size\/2, 0, Math.PI * 2); cctx.fill(); }\r\ncctx.restore();\r\n});\r\nrequestAnimationFrame(animarConfetti);\r\n}\r\nanimarConfetti();\r\n\r\nlet toastTimeout;\r\nfunction showToast(msg, type = 'info'){\r\ntoastMsg.textContent = msg;\r\ntoast.className = 'toast show ' + (type === 'error' ? 'error' : type === 'success' ? 'success' : '');\r\nconst icons = { info: 'fa-circle-info', error: 'fa-circle-exclamation', success: 'fa-circle-check' };\r\ntoastIcon.className = 'fa-solid ' + (icons[type] || icons.info);\r\nclearTimeout(toastTimeout);\r\ntoastTimeout = setTimeout(() => { toast.classList.remove('show'); }, 3000);\r\n}\r\n\r\nsortearBtn.addEventListener('click', () => {\r\nensureAudio();\r\nif(state.currentIdx >= state.qty || state.currentIdx === 0){ state.currentIdx = 0; progressFill.style.width = '0%'; }\r\nrealizarSorteo();\r\n});\r\n\r\nclearBtn.addEventListener('click', () => {\r\nif(state.sorteando) return;\r\nstate.history = []; state.drawnSet = new Set(); state.currentIdx = 0;\r\nprogressFill.style.width = '0%'; currentNum.textContent = '0';\r\nstatTotal.textContent = '0'; statLast.textContent = '\u2014';\r\nballsContainer.innerHTML = '<p class=\"text-sm text-gray-500 italic self-center\">A\u00fan no hay n\u00fameros sorteados<\/p>';\r\nhistoryContainer.innerHTML = '<p class=\"text-sm text-gray-500 italic text-center py-8\">El historial aparecer\u00e1 aqu\u00ed despu\u00e9s del primer sorteo<\/p>';\r\nhistoryCount.textContent = '0 n\u00fameros';\r\nreelTrack.innerHTML = ''; reelTrack.appendChild(emptyDisplay);\r\nemptyDisplay.style.display = 'flex';\r\nsortearBtn.innerHTML = '<i class=\"fa-solid fa-dice mr-2\"><\/i> SORTEAR';\r\nupdateAvailable();\r\nshowToast('Sorteo reiniciado', 'success');\r\n});\r\n\r\ncopyBtn.addEventListener('click', () => {\r\nif(state.history.length === 0){ showToast('No hay n\u00fameros para copiar', 'error'); return; }\r\nconst texto = state.history.join(', ');\r\nnavigator.clipboard.writeText(texto).then(() => { showToast(`${state.history.length} n\u00fameros copiados`, 'success'); })\r\n.catch(() => {\r\nconst ta = document.createElement('textarea'); ta.value = texto;\r\ndocument.body.appendChild(ta); ta.select();\r\ntry{ document.execCommand('copy'); showToast(`${state.history.length} n\u00fameros copiados`, 'success'); }\r\ncatch(e){ showToast('No se pudo copiar', 'error'); }\r\ndocument.body.removeChild(ta);\r\n});\r\n});\r\n\r\nfunction crearParticulas(){\r\nconst container = $('particles');\r\nfor(let i = 0; i < 25; i++){\r\nconst p = document.createElement('div'); p.className = 'particle';\r\nconst size = Math.random() * 5 + 2;\r\np.style.width = size + 'px'; p.style.height = size + 'px';\r\np.style.left = Math.random() * 100 + '%';\r\np.style.animation = `floatUp ${Math.random() * 15 + 20}s linear infinite`;\r\np.style.animationDelay = Math.random() * 20 + 's';\r\ncontainer.appendChild(p);\r\n}\r\n}\r\ncrearParticulas();\r\nupdateAvailable();\r\nsetTimeout(() => { showToast('Configura tu sorteo y presiona SORTEAR', 'info'); }, 600);\r\n<\/script>\r\n\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Sorteo Pro \u00b7 M\u00e1quina de N\u00fameros SORTEO de N\u00daMEROS FISAR Sim FICA \/ UNSL Voz Hombre Voz Mujer Efectos CONFIGURACI\u00d3N Permitir repetici\u00f3n \u00bfLos n\u00fameros pueden…<\/p>\n","protected":false},"author":7,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"footnotes":""},"class_list":["post-8633","page","type-page","status-publish","hentry"],"yoast_head":"\n<title>sorteo - F\u00edsica 2<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/fisica2.fica.unsl.edu.ar\/index.php\/sorteo\/\" \/>\n<meta property=\"og:locale\" content=\"es_ES\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"sorteo - F\u00edsica 2\" \/>\n<meta property=\"og:description\" content=\"Sorteo Pro \u00b7 M\u00e1quina de N\u00fameros SORTEO de N\u00daMEROS FISAR Sim FICA \/ UNSL Voz Hombre Voz Mujer Efectos CONFIGURACI\u00d3N Permitir repetici\u00f3n \u00bfLos n\u00fameros pueden…\" \/>\n<meta property=\"og:url\" content=\"https:\/\/fisica2.fica.unsl.edu.ar\/index.php\/sorteo\/\" \/>\n<meta property=\"og:site_name\" content=\"F\u00edsica 2\" \/>\n<meta property=\"article:modified_time\" content=\"2026-08-17T01:09:09+00:00\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Tiempo de lectura\" \/>\n\t<meta name=\"twitter:data1\" content=\"1 minuto\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/fisica2.fica.unsl.edu.ar\\\/index.php\\\/sorteo\\\/\",\"url\":\"https:\\\/\\\/fisica2.fica.unsl.edu.ar\\\/index.php\\\/sorteo\\\/\",\"name\":\"sorteo - F\u00edsica 2\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/fisica2.fica.unsl.edu.ar\\\/#website\"},\"datePublished\":\"2026-08-16T21:49:42+00:00\",\"dateModified\":\"2026-08-17T01:09:09+00:00\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/fisica2.fica.unsl.edu.ar\\\/index.php\\\/sorteo\\\/#breadcrumb\"},\"inLanguage\":\"es-AR\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/fisica2.fica.unsl.edu.ar\\\/index.php\\\/sorteo\\\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/fisica2.fica.unsl.edu.ar\\\/index.php\\\/sorteo\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Inicio\",\"item\":\"https:\\\/\\\/fisica2.fica.unsl.edu.ar\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"sorteo\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/fisica2.fica.unsl.edu.ar\\\/#website\",\"url\":\"https:\\\/\\\/fisica2.fica.unsl.edu.ar\\\/\",\"name\":\"F\u00edsica 2\",\"description\":\"FICA - UNSL\",\"publisher\":{\"@id\":\"https:\\\/\\\/fisica2.fica.unsl.edu.ar\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/fisica2.fica.unsl.edu.ar\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"es-AR\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/fisica2.fica.unsl.edu.ar\\\/#organization\",\"name\":\"SAC- Secretar\u00eda General FICA\",\"url\":\"https:\\\/\\\/fisica2.fica.unsl.edu.ar\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"es-AR\",\"@id\":\"https:\\\/\\\/fisica2.fica.unsl.edu.ar\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/fisica2.fica.unsl.edu.ar\\\/wp-content\\\/uploads\\\/2021\\\/11\\\/SG-Logo.png\",\"contentUrl\":\"https:\\\/\\\/fisica2.fica.unsl.edu.ar\\\/wp-content\\\/uploads\\\/2021\\\/11\\\/SG-Logo.png\",\"width\":4483,\"height\":1231,\"caption\":\"SAC- Secretar\u00eda General FICA\"},\"image\":{\"@id\":\"https:\\\/\\\/fisica2.fica.unsl.edu.ar\\\/#\\\/schema\\\/logo\\\/image\\\/\"}}]}<\/script>\n","yoast_head_json":{"title":"sorteo - F\u00edsica 2","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/fisica2.fica.unsl.edu.ar\/index.php\/sorteo\/","og_locale":"es_ES","og_type":"article","og_title":"sorteo - F\u00edsica 2","og_description":"Sorteo Pro \u00b7 M\u00e1quina de N\u00fameros SORTEO de N\u00daMEROS FISAR Sim FICA \/ UNSL Voz Hombre Voz Mujer Efectos CONFIGURACI\u00d3N Permitir repetici\u00f3n \u00bfLos n\u00fameros pueden…","og_url":"https:\/\/fisica2.fica.unsl.edu.ar\/index.php\/sorteo\/","og_site_name":"F\u00edsica 2","article_modified_time":"2026-08-17T01:09:09+00:00","twitter_card":"summary_large_image","twitter_misc":{"Tiempo de lectura":"1 minuto"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/fisica2.fica.unsl.edu.ar\/index.php\/sorteo\/","url":"https:\/\/fisica2.fica.unsl.edu.ar\/index.php\/sorteo\/","name":"sorteo - F\u00edsica 2","isPartOf":{"@id":"https:\/\/fisica2.fica.unsl.edu.ar\/#website"},"datePublished":"2026-08-16T21:49:42+00:00","dateModified":"2026-08-17T01:09:09+00:00","breadcrumb":{"@id":"https:\/\/fisica2.fica.unsl.edu.ar\/index.php\/sorteo\/#breadcrumb"},"inLanguage":"es-AR","potentialAction":[{"@type":"ReadAction","target":["https:\/\/fisica2.fica.unsl.edu.ar\/index.php\/sorteo\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/fisica2.fica.unsl.edu.ar\/index.php\/sorteo\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Inicio","item":"https:\/\/fisica2.fica.unsl.edu.ar\/"},{"@type":"ListItem","position":2,"name":"sorteo"}]},{"@type":"WebSite","@id":"https:\/\/fisica2.fica.unsl.edu.ar\/#website","url":"https:\/\/fisica2.fica.unsl.edu.ar\/","name":"F\u00edsica 2","description":"FICA - UNSL","publisher":{"@id":"https:\/\/fisica2.fica.unsl.edu.ar\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/fisica2.fica.unsl.edu.ar\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"es-AR"},{"@type":"Organization","@id":"https:\/\/fisica2.fica.unsl.edu.ar\/#organization","name":"SAC- Secretar\u00eda General FICA","url":"https:\/\/fisica2.fica.unsl.edu.ar\/","logo":{"@type":"ImageObject","inLanguage":"es-AR","@id":"https:\/\/fisica2.fica.unsl.edu.ar\/#\/schema\/logo\/image\/","url":"https:\/\/fisica2.fica.unsl.edu.ar\/wp-content\/uploads\/2021\/11\/SG-Logo.png","contentUrl":"https:\/\/fisica2.fica.unsl.edu.ar\/wp-content\/uploads\/2021\/11\/SG-Logo.png","width":4483,"height":1231,"caption":"SAC- Secretar\u00eda General FICA"},"image":{"@id":"https:\/\/fisica2.fica.unsl.edu.ar\/#\/schema\/logo\/image\/"}}]}},"_links":{"self":[{"href":"https:\/\/fisica2.fica.unsl.edu.ar\/index.php\/wp-json\/wp\/v2\/pages\/8633","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/fisica2.fica.unsl.edu.ar\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/fisica2.fica.unsl.edu.ar\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/fisica2.fica.unsl.edu.ar\/index.php\/wp-json\/wp\/v2\/users\/7"}],"replies":[{"embeddable":true,"href":"https:\/\/fisica2.fica.unsl.edu.ar\/index.php\/wp-json\/wp\/v2\/comments?post=8633"}],"version-history":[{"count":52,"href":"https:\/\/fisica2.fica.unsl.edu.ar\/index.php\/wp-json\/wp\/v2\/pages\/8633\/revisions"}],"predecessor-version":[{"id":8713,"href":"https:\/\/fisica2.fica.unsl.edu.ar\/index.php\/wp-json\/wp\/v2\/pages\/8633\/revisions\/8713"}],"wp:attachment":[{"href":"https:\/\/fisica2.fica.unsl.edu.ar\/index.php\/wp-json\/wp\/v2\/media?parent=8633"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

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

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

\n\t\t\t

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

\n\t\t\t\t

\n\t\t\t\t\t\r\n\r\n\r\n\r\n\r\nSorteo Pro \u00b7 M\u00e1quina de N\u00fameros<\/title>\r\n<script src=\"https:\/\/cdn.tailwindcss.com\"><\/script>\r\n<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Bebas+Neue&family=Space+Grotesk:wght@300;400;500;600;700&display=swap\" rel=\"stylesheet\">\r\n<link href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.4.0\/css\/all.min.css\" rel=\"stylesheet\">\r\n<style>\r\n:root{\r\n--bg:#0a0a12;\r\n--bg-2:#15151f;\r\n--fg:#ffffff;\r\n--muted:#b0b0c0;\r\n--accent:#fbbf24;\r\n--accent-2:#f97316;\r\n--accent-3:#ef4444;\r\n--success:#10b981;\r\n--card:#1c1c28;\r\n--border:#33334a;\r\n}\r\n*{box-sizing:border-box}\r\nbody{\r\nfont-family:'Space Grotesk',sans-serif;\r\nbackground-color:var(--bg);\r\nbackground-image:\r\nradial-gradient(circle at 15% 20%, rgba(251,191,36,.15), transparent 45%),\r\nradial-gradient(circle at 85% 75%, rgba(239,68,68,.10), transparent 45%);\r\ncolor:var(--fg);\r\nmin-height:100vh;\r\noverflow-x:hidden;\r\npadding: 20px 0;\r\n}\r\n.display-font{font-family:'Bebas Neue',sans-serif;letter-spacing:.02em}\r\n\r\n.bg-grid{\r\nposition:fixed;inset:0;z-index:-1;\r\nbackground-image:\r\nlinear-gradient(rgba(255,255,255,.03) 1px,transparent 1px),\r\nlinear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px);\r\nbackground-size:60px 60px;\r\nmask-image:radial-gradient(circle at center,black 30%,transparent 80%);\r\npointer-events:none;\r\n}\r\n\r\n.particles{position:fixed;inset:0;z-index:-1;pointer-events:none;overflow:hidden}\r\n.particle{\r\nposition:absolute;border-radius:50%;\r\nbackground:radial-gradient(circle,var(--accent),transparent);\r\npointer-events:none;\r\n}\r\n@keyframes floatUp{\r\n0%{transform:translateY(100vh) translateX(0) scale(0);opacity:0}\r\n10%{opacity:.5}\r\n90%{opacity:.5}\r\n100%{transform:translateY(-10vh) translateX(50px) scale(1);opacity:0}\r\n}\r\n\r\n.card{\r\nbackground:var(--card);\r\nborder:1px solid var(--border);\r\nborder-radius:24px;\r\nbox-shadow: 0 10px 30px rgba(0,0,0,0.5);\r\n}\r\n\r\n.reel-window{\r\nposition:relative;\r\nheight:280px;\r\noverflow:hidden;\r\nborder-radius:20px;\r\nbackground:linear-gradient(180deg,\r\nrgba(0,0,0,.8) 0%,\r\nrgba(20,20,30,.6) 50%,\r\nrgba(0,0,0,.8) 100%);\r\nborder:2px solid rgba(251,191,36,.3);\r\nbox-shadow:\r\ninset 0 4px 20px rgba(0,0,0,.8),\r\ninset 0 -4px 20px rgba(0,0,0,.8),\r\n0 0 60px rgba(251,191,36,.1);\r\n}\r\n.reel-window::before,.reel-window::after{\r\ncontent:'';position:absolute;left:0;right:0;height:80px;z-index:3;pointer-events:none;\r\n}\r\n.reel-window::before{\r\ntop:0;\r\nbackground:linear-gradient(180deg,rgba(10,10,18,1),transparent);\r\n}\r\n.reel-window::after{\r\nbottom:0;\r\nbackground:linear-gradient(0deg,rgba(10,10,18,1),transparent);\r\n}\r\n.reel-track{ will-change:transform; }\r\n.reel-number{\r\nheight:280px;\r\ndisplay:flex;align-items:center;justify-content:center;\r\nfont-family:'Bebas Neue',sans-serif;\r\nfont-size:11rem;\r\nline-height:1;\r\ncolor:var(--accent);\r\ntext-shadow:\r\n0 0 30px rgba(251,191,36,.6),\r\n0 0 60px rgba(251,191,36,.3),\r\n0 0 90px rgba(251,191,36,.15);\r\n}\r\n.reel-line{\r\nposition:absolute;left:0;right:0;height:2px;\r\nbackground:linear-gradient(90deg,transparent,var(--accent),transparent);\r\nbox-shadow:0 0 20px var(--accent);\r\nz-index:4;\r\ntop:50%;\r\ntransform:translateY(-50%);\r\n}\r\n\r\n.empty-display{\r\ndisplay:flex;flex-direction:column;align-items:center;justify-content:center;\r\nheight:100%;color:var(--muted);\r\n}\r\n\r\n.btn-sortear{\r\nbackground:linear-gradient(135deg,var(--accent) 0%,var(--accent-2) 100%);\r\ncolor:#1a1a2e;\r\nfont-weight:700;\r\nfont-size:1.5rem;\r\npadding:1.25rem 2rem;\r\nborder-radius:16px;\r\nwidth:100%;\r\nbox-shadow:\r\n0 6px 0 #b45309,\r\n0 12px 30px rgba(251,191,36,.4);\r\ntransition:all .15s ease;\r\ncursor:pointer;\r\nborder:none;\r\nfont-family:'Space Grotesk',sans-serif;\r\nletter-spacing:.05em;\r\ntext-transform:uppercase;\r\n}\r\n.btn-sortear:hover:not(:disabled){\r\ntransform:translateY(-2px);\r\nbox-shadow:0 8px 0 #b45309,0 16px 40px rgba(251,191,36,.5);\r\n}\r\n.btn-sortear:active:not(:disabled){\r\ntransform:translateY(4px);\r\nbox-shadow:0 2px 0 #b45309,0 4px 12px rgba(251,191,36,.3);\r\n}\r\n.btn-sortear:disabled{ opacity:.5;cursor:not-allowed; }\r\n.btn-sortear.sorteando{\r\nbackground:linear-gradient(135deg,var(--accent-3),#b91c1c);\r\nbox-shadow:0 6px 0 #7f1d1d,0 12px 30px rgba(239,68,68,.4);\r\n}\r\n\r\n.toggle{\r\nposition:relative;width:56px;height:30px;\r\nbackground:rgba(255,255,255,.2);\r\nborder-radius:999px;cursor:pointer;\r\ntransition:all .3s;\r\nborder:1px solid var(--border);\r\nflex-shrink:0;\r\n}\r\n.toggle.active{\r\nbackground:linear-gradient(135deg,var(--accent),var(--accent-2));\r\nborder-color:transparent;\r\n}\r\n.toggle-knob{\r\nposition:absolute;top:3px;left:3px;\r\nwidth:22px;height:22px;\r\nbackground:#fff;border-radius:50%;\r\ntransition:all .3s cubic-bezier(.34,1.56,.64,1);\r\nbox-shadow:0 2px 6px rgba(0,0,0,.3);\r\n}\r\n.toggle.active .toggle-knob{ left:30px; }\r\n\r\n.number-input{\r\nbackground:#ffffff;\r\nborder:1px solid #cbd5e1;\r\nborder-radius:12px;\r\npadding:.75rem 1rem;\r\nfont-family:'Space Grotesk',sans-serif;\r\nfont-weight:600;\r\ncolor:#1a1a2e;\r\nfont-size:1.25rem;\r\nwidth:100%;\r\ntransition:all .2s;\r\ntext-align:center;\r\n}\r\n.number-input:focus{\r\noutline:none;\r\nborder-color:var(--accent);\r\nbackground:#ffffff;\r\nbox-shadow:0 0 0 3px rgba(251,191,36,.3);\r\n}\r\n\r\n.lottery-ball{\r\nwidth:64px;height:64px;\r\nborder-radius:50%;\r\ndisplay:inline-flex;align-items:center;justify-content:center;\r\nfont-family:'Bebas Neue',sans-serif;\r\nfont-size:1.75rem;\r\nbackground:radial-gradient(circle at 30% 30%,#fde68a,var(--accent) 50%,var(--accent-2));\r\ncolor:#1a1a2e;\r\nfont-weight:700;\r\nbox-shadow:\r\ninset -6px -6px 12px rgba(0,0,0,.25),\r\ninset 4px 4px 8px rgba(255,255,255,.4),\r\n0 4px 16px rgba(251,191,36,.35);\r\nanimation:ballAppear .6s cubic-bezier(.34,1.56,.64,1);\r\nflex-shrink:0;\r\n}\r\n@keyframes ballAppear{\r\n0%{transform:scale(0) rotate(-180deg);opacity:0}\r\n60%{transform:scale(1.15) rotate(10deg);opacity:1}\r\n100%{transform:scale(1) rotate(0);opacity:1}\r\n}\r\n\r\n.btn-secondary{\r\nbackground:rgba(255,255,255,.08);\r\nborder:1px solid var(--border);\r\ncolor:#ffffff;\r\npadding:.6rem 1rem;\r\nborder-radius:10px;\r\nfont-weight:500;\r\ntransition:all .2s;\r\ncursor:pointer;\r\nfont-family:'Space Grotesk',sans-serif;\r\n}\r\n.btn-secondary:hover{\r\nbackground:rgba(255,255,255,.15);\r\nborder-color:rgba(255,255,255,.3);\r\n}\r\n.btn-danger:hover{\r\nbackground:rgba(239,68,68,.2);\r\nborder-color:rgba(239,68,68,.5);\r\ncolor:#fca5a5;\r\n}\r\n\r\n#confettiCanvas{\r\nposition:fixed;inset:0;\r\npointer-events:none;z-index:100;\r\n}\r\n\r\n.progress-bar{\r\nheight:6px;background:rgba(255,255,255,.1);\r\nborder-radius:999px;overflow:hidden;\r\n}\r\n.progress-fill{\r\nheight:100%;\r\nbackground:linear-gradient(90deg,var(--accent),var(--accent-2));\r\nborder-radius:999px;\r\ntransition:width .4s ease;\r\nbox-shadow:0 0 12px rgba(251,191,36,.5);\r\n}\r\n\r\n.history-item{\r\ndisplay:flex;align-items:center;gap:.75rem;\r\npadding:.75rem 1rem;\r\nbackground:rgba(255,255,255,.03);\r\nborder:1px solid var(--border);\r\nborder-radius:12px;\r\ntransition:all .2s;\r\n}\r\n.history-item:hover{\r\nbackground:rgba(255,255,255,.08);\r\ntransform:translateX(4px);\r\n}\r\n.history-number{\r\nfont-family:'Bebas Neue',sans-serif;\r\nfont-size:1.5rem;\r\ncolor:var(--accent);\r\nmin-width:50px;\r\n}\r\n\r\n.toast{\r\nposition:fixed;bottom:2rem;left:50%;\r\ntransform:translateX(-50%) translateY(120%);\r\nbackground:#1c1c28;\r\nborder:1px solid var(--border);\r\npadding:1rem 1.5rem;\r\nborder-radius:12px;\r\nz-index:200;\r\ntransition:transform .4s cubic-bezier(.34,1.56,.64,1);\r\nbox-shadow:0 10px 40px rgba(0,0,0,.5);\r\ndisplay:flex;align-items:center;gap:.75rem;\r\nmax-width:90vw;\r\ncolor:#fff;\r\n}\r\n.toast.show{transform:translateX(-50%) translateY(0)}\r\n.toast.error{border-color:rgba(239,68,68,.7); color:#fca5a5;}\r\n.toast.success{border-color:rgba(16,185,129,.7); color:#6ee7b7;}\r\n\r\ninput[type=range]{\r\n-webkit-appearance:none;appearance:none;\r\nwidth:100%;height:6px;\r\nbackground:rgba(255,255,255,.15);\r\nborder-radius:999px;outline:none;\r\n}\r\ninput[type=range]::-webkit-slider-thumb{\r\n-webkit-appearance:none;appearance:none;\r\nwidth:20px;height:20px;\r\nbackground:linear-gradient(135deg,var(--accent),var(--accent-2));\r\nborder-radius:50%;cursor:pointer;\r\nbox-shadow:0 2px 8px rgba(251,191,36,.5);\r\nborder:2px solid #1a1a2e;\r\n}\r\ninput[type=range]::-moz-range-thumb{\r\nwidth:20px;height:20px;\r\nbackground:linear-gradient(135deg,var(--accent),var(--accent-2));\r\nborder-radius:50%;cursor:pointer;\r\nborder:2px solid #1a1a2e;\r\n}\r\n\r\n@media(max-width:768px){\r\n.reel-number{font-size:7rem}\r\n.reel-window{height:220px}\r\n.reel-number{height:220px}\r\n}\r\n\r\n::-webkit-scrollbar{width:8px;height:8px}\r\n::-webkit-scrollbar-track{background:transparent}\r\n::-webkit-scrollbar-thumb{background:rgba(255,255,255,.2);border-radius:4px}\r\n::-webkit-scrollbar-thumb:hover{background:rgba(255,255,255,.4)}\r\n<\/style>\r\n<\/head>\r\n<body>\r\n\r\n<div class=\"bg-grid\"><\/div>\r\n<div class=\"particles\" id=\"particles\"><\/div>\r\n<canvas id=\"confettiCanvas\"><\/canvas>\r\n\r\n<header class=\"max-w-7xl mx-auto px-4 sm:px-6 pt-6 pb-4\">\r\n<div class=\"flex items-center justify-between flex-wrap gap-4\">\r\n\r\n<div class=\"flex items-center gap-3\">\r\n<div class=\"w-12 h-12 rounded-xl flex items-center justify-center\" style=\"background:linear-gradient(135deg,var(--accent),var(--accent-2));box-shadow:0 8px 24px rgba(251,191,36,.4)\">\r\n<i class=\"fa-solid fa-dice text-2xl\" style=\"color:#1a1a2e\"><\/i>\r\n<\/div>\r\n\r\n<div>\r\n<h1 class=\"display-font text-3xl sm:text-4xl leading-tight mb-0 p-0 text-black\"><strong>SORTEO de N\u00daMEROS<\/strong><\/h1>\r\n<p class=\"text-sm font-semibold text-blue-400 hover:text-blue-300 transition-colors -mt-1\">\r\n<a href=\"https:\/\/unsl.edu.ar\" target=\"_blank\">FISAR Sim<\/a>\r\n<span class=\"text-xs text-gray-400\"> FICA \/ UNSL<\/span>\r\n<\/p>\r\n<\/div>\r\n<\/div>\r\n\r\n<div class=\"flex items-center gap-3 flex-wrap\">\r\n\r\n<div class=\"card px-4 py-2 flex items-center gap-3 cursor-pointer\" id=\"maleVoiceCard\">\r\n<i class=\"fa-solid fa-mars text-xl\" style=\"color:var(--accent)\"><\/i>\r\n<span class=\"text-sm font-medium hidden sm:inline text-white\">Voz Hombre<\/span>\r\n<div class=\"toggle\" id=\"maleVoiceToggle\" role=\"switch\" aria-checked=\"false\">\r\n<div class=\"toggle-knob\"><\/div>\r\n<\/div>\r\n<\/div>\r\n\r\n<div class=\"card px-4 py-2 flex items-center gap-3 cursor-pointer\" id=\"femaleVoiceCard\">\r\n<i class=\"fa-solid fa-venus text-xl\" style=\"color:var(--accent)\"><\/i>\r\n<span class=\"text-sm font-medium hidden sm:inline text-white\">Voz Mujer<\/span>\r\n<div class=\"toggle active\" id=\"femaleVoiceToggle\" role=\"switch\" aria-checked=\"true\">\r\n<div class=\"toggle-knob\"><\/div>\r\n<\/div>\r\n<\/div>\r\n\r\n<div class=\"card px-4 py-2 flex items-center gap-3 cursor-pointer\" id=\"sfxCard\">\r\n<i class=\"fa-solid fa-volume-high\" style=\"color:var(--accent)\"><\/i>\r\n<span class=\"text-sm font-medium hidden sm:inline text-white\">Efectos<\/span>\r\n<div class=\"toggle active\" id=\"sfxToggle\" role=\"switch\" aria-checked=\"true\">\r\n<div class=\"toggle-knob\"><\/div>\r\n<\/div>\r\n<\/div>\r\n\r\n<\/div>\r\n\r\n<\/div>\r\n<\/header>\r\n\r\n<main class=\"max-w-7xl mx-auto px-4 sm:px-6 pb-12\">\r\n<div class=\"grid lg:grid-cols-5 gap-6\">\r\n\r\n<aside class=\"lg:col-span-2 space-y-6\">\r\n\r\n<section class=\"card p-6\">\r\n<h2 class=\"display-font text-2xl mb-5 flex items-center gap-2 text-white\">\r\n<i class=\"fa-solid fa-sliders text-lg\" style=\"color:var(--accent)\"><\/i>\r\nCONFIGURACI\u00d3N\r\n<\/h2>\r\n\r\n<div class=\"flex items-center justify-between p-4 rounded-xl mb-4\" style=\"background:rgba(0,0,0,0.2);border:1px solid var(--border)\">\r\n<div>\r\n<p class=\"font-semibold text-base text-white\">Permitir repetici\u00f3n<\/p>\r\n<p class=\"text-xs text-gray-400 mt-1\">\u00bfLos n\u00fameros pueden salir m\u00e1s de una vez?<\/p>\r\n<\/div>\r\n<div class=\"toggle\" id=\"repeatToggle\" role=\"switch\" aria-checked=\"false\">\r\n<div class=\"toggle-knob\"><\/div>\r\n<\/div>\r\n<\/div>\r\n\r\n<div class=\"mb-4\">\r\n<label class=\"text-sm font-medium text-gray-300 mb-2 block\">Rango de n\u00fameros<\/label>\r\n<div class=\"grid grid-cols-2 gap-3\">\r\n<div>\r\n<p class=\"text-xs text-gray-400 mb-1\">Desde<\/p>\r\n<input type=\"number\" id=\"minInput\" class=\"number-input\" value=\"1\" min=\"-9999\" max=\"9999\">\r\n<\/div>\r\n<div>\r\n<p class=\"text-xs text-gray-400 mb-1\">Hasta<\/p>\r\n<input type=\"number\" id=\"maxInput\" class=\"number-input\" value=\"100\" min=\"-9999\" max=\"9999\">\r\n<\/div>\r\n<\/div>\r\n<\/div>\r\n\r\n<div class=\"mb-4\">\r\n<label class=\"text-sm font-medium text-gray-300 mb-2 block\">Cantidad a sortear<\/label>\r\n<input type=\"number\" id=\"qtyInput\" class=\"number-input\" value=\"1\" min=\"1\">\r\n<\/div>\r\n\r\n<div class=\"mb-2\">\r\n<label class=\"text-sm font-medium text-gray-300 mb-2 block\">\r\nVelocidad de voz\r\n<span class=\"text-gray-500 font-normal\">(<span id=\"rateDisplay\">1.0<\/span>x)<\/span>\r\n<\/label>\r\n<input type=\"range\" id=\"rateRange\" min=\"0.5\" max=\"1.5\" step=\"0.1\" value=\"1.0\">\r\n<\/div>\r\n\r\n<div class=\"mt-5 p-3 rounded-lg flex items-start gap-3\" style=\"background:rgba(251,191,36,.1);border:1px solid rgba(251,191,36,.3)\">\r\n<i class=\"fa-solid fa-circle-info mt-0.5\" style=\"color:var(--accent)\"><\/i>\r\n<div class=\"text-sm text-white\">\r\n<p><span class=\"text-gray-400\">Disponibles:<\/span> <span id=\"availableCount\" class=\"font-bold\" style=\"color:var(--accent)\">100<\/span><\/p>\r\n<p class=\"text-xs text-gray-300 mt-1\" id=\"rangeInfo\">Del 1 al 100<\/p>\r\n<\/div>\r\n<\/div>\r\n<\/section>\r\n\r\n<button class=\"btn-sortear\" id=\"sortearBtn\">\r\n<i class=\"fa-solid fa-dice mr-2\"><\/i>\r\nSORTEAR\r\n<\/button>\r\n\r\n<div class=\"grid grid-cols-2 gap-3\">\r\n<button class=\"btn-secondary btn-danger\" id=\"clearBtn\">\r\n<i class=\"fa-solid fa-trash mr-2\"><\/i> Limpiar\r\n<\/button>\r\n<button class=\"btn-secondary\" id=\"copyBtn\">\r\n<i class=\"fa-solid fa-copy mr-2\"><\/i> Copiar\r\n<\/button>\r\n<\/div>\r\n\r\n<section class=\"card p-5\">\r\n<h3 class=\"display-font text-xl mb-3 flex items-center gap-2 text-white\">\r\n<i class=\"fa-solid fa-chart-simple\" style=\"color:var(--accent)\"><\/i>\r\nESTAD\u00cdSTICAS\r\n<\/h3>\r\n<div class=\"grid grid-cols-3 gap-3 text-center\">\r\n<div>\r\n<p class=\"display-font text-3xl\" style=\"color:var(--accent)\" id=\"statTotal\">0<\/p>\r\n<p class=\"text-xs text-gray-400 mt-1\">Sorteados<\/p>\r\n<\/div>\r\n<div>\r\n<p class=\"display-font text-3xl\" style=\"color:var(--accent-2)\" id=\"statRemaining\">100<\/p>\r\n<p class=\"text-xs text-gray-400 mt-1\">Restantes<\/p>\r\n<\/div>\r\n<div>\r\n<p class=\"display-font text-3xl\" style=\"color:var(--success)\" id=\"statLast\">\u2014<\/p>\r\n<p class=\"text-xs text-gray-400 mt-1\">\u00daltimo<\/p>\r\n<\/div>\r\n<\/div>\r\n<\/section>\r\n<\/aside>\r\n\r\n<section class=\"lg:col-span-3 space-y-6\">\r\n\r\n<div class=\"card p-6\">\r\n<div class=\"flex items-center justify-between mb-4\">\r\n<h2 class=\"display-font text-2xl flex items-center gap-2 text-white\">\r\n<i class=\"fa-solid fa-bullseye\" style=\"color:var(--accent)\"><\/i>\r\nN\u00daMERO ACTUAL\r\n<\/h2>\r\n<div class=\"flex items-center gap-3 text-sm\">\r\n<span class=\"text-gray-400\">Progreso<\/span>\r\n<span class=\"font-semibold text-white\"><span id=\"currentNum\">0<\/span>\/<span id=\"totalNum\">1<\/span><\/span>\r\n<\/div>\r\n<\/div>\r\n\r\n<div class=\"reel-window mb-4\">\r\n<div class=\"reel-line\"><\/div>\r\n<div class=\"reel-track\" id=\"reelTrack\">\r\n<div class=\"empty-display\" id=\"emptyDisplay\">\r\n<i class=\"fa-solid fa-dice text-6xl mb-3 opacity-30\"><\/i>\r\n<p class=\"text-lg text-white\">Presiona <span style=\"color:var(--accent);font-weight:600\">SORTEAR<\/span> para comenzar<\/p>\r\n<\/div>\r\n<\/div>\r\n<\/div>\r\n\r\n<div class=\"progress-bar mb-4\">\r\n<div class=\"progress-fill\" id=\"progressFill\" style=\"width:0%\"><\/div>\r\n<\/div>\r\n\r\n<div>\r\n<p class=\"text-xs text-gray-400 mb-2 uppercase tracking-wider\">N\u00fameros sorteados<\/p>\r\n<div class=\"flex flex-wrap gap-2 min-h-[70px]\" id=\"ballsContainer\">\r\n<p class=\"text-sm text-gray-500 italic self-center\">A\u00fan no hay n\u00fameros sorteados<\/p>\r\n<\/div>\r\n<\/div>\r\n<\/div>\r\n\r\n<div class=\"card p-6\">\r\n<div class=\"flex items-center justify-between mb-4\">\r\n<h2 class=\"display-font text-2xl flex items-center gap-2 text-white\">\r\n<i class=\"fa-solid fa-clock-rotate-left\" style=\"color:var(--accent)\"><\/i>\r\nHISTORIAL\r\n<\/h2>\r\n<span class=\"text-sm text-gray-400\" id=\"historyCount\">0 n\u00fameros<\/span>\r\n<\/div>\r\n<div class=\"space-y-2 max-h-[300px] overflow-y-auto pr-2\" id=\"historyContainer\">\r\n<p class=\"text-sm text-gray-500 italic text-center py-8\">El historial aparecer\u00e1 aqu\u00ed despu\u00e9s del primer sorteo<\/p>\r\n<\/div>\r\n<\/div>\r\n<\/section>\r\n<\/div>\r\n<\/main>\r\n\r\n<div class=\"toast\" id=\"toast\">\r\n<i class=\"fa-solid fa-circle-info\" id=\"toastIcon\"><\/i>\r\n<span id=\"toastMsg\">Mensaje<\/span>\r\n<\/div>\r\n\r\n<script>\r\nconst state = {\r\nmin:1, max:100, qty:1, repeat:false,\r\nvoiceMode:'mujer', \/\/ 'hombre', 'mujer', 'none'\r\nsfxOn:true, rate:1.0,\r\nsorteando:false, currentIdx:0,\r\nhistory:[], drawnSet:new Set(), remaining:[],\r\n};\r\n\r\nconst $ = id => document.getElementById(id);\r\nconst repeatToggle = $('repeatToggle');\r\nconst maleVoiceToggle = $('maleVoiceToggle');\r\nconst femaleVoiceToggle = $('femaleVoiceToggle');\r\nconst maleVoiceCard = $('maleVoiceCard');\r\nconst femaleVoiceCard = $('femaleVoiceCard');\r\nconst sfxToggle = $('sfxToggle');\r\nconst minInput = $('minInput');\r\nconst maxInput = $('maxInput');\r\nconst qtyInput = $('qtyInput');\r\nconst rateRange = $('rateRange');\r\nconst rateDisplay = $('rateDisplay');\r\nconst sortearBtn = $('sortearBtn');\r\nconst clearBtn = $('clearBtn');\r\nconst copyBtn = $('copyBtn');\r\nconst reelTrack = $('reelTrack');\r\nconst emptyDisplay = $('emptyDisplay');\r\nconst ballsContainer = $('ballsContainer');\r\nconst historyContainer = $('historyContainer');\r\nconst historyCount = $('historyCount');\r\nconst availableCount = $('availableCount');\r\nconst rangeInfo = $('rangeInfo');\r\nconst statTotal = $('statTotal');\r\nconst statRemaining = $('statRemaining');\r\nconst statLast = $('statLast');\r\nconst currentNum = $('currentNum');\r\nconst totalNum = $('totalNum');\r\nconst progressFill = $('progressFill');\r\nconst toast = $('toast');\r\nconst toastMsg = $('toastMsg');\r\nconst toastIcon = $('toastIcon');\r\n\r\nlet audioCtx = null;\r\nfunction ensureAudio(){\r\nif(!audioCtx){\r\ntry{ audioCtx = new (window.AudioContext || window.webkitAudioContext)(); }catch(e){}\r\n}\r\nif(audioCtx && audioCtx.state === 'suspended') audioCtx.resume();\r\n}\r\n\r\nfunction tickSound(freq=800, duration=0.04, vol=0.06){\r\nif(!audioCtx || !state.sfxOn) return;\r\nconst osc = audioCtx.createOscillator();\r\nconst gain = audioCtx.createGain();\r\nosc.connect(gain); gain.connect(audioCtx.destination);\r\nosc.frequency.value = freq; osc.type = 'square';\r\ngain.gain.setValueAtTime(vol, audioCtx.currentTime);\r\ngain.gain.exponentialRampToValueAtTime(0.001, audioCtx.currentTime + duration);\r\nosc.start(); osc.stop(audioCtx.currentTime + duration);\r\n}\r\n\r\nfunction winSound(){\r\nif(!audioCtx || !state.sfxOn) return;\r\nconst notes = [523, 659, 784, 1047];\r\nnotes.forEach((f, i) => {\r\nsetTimeout(() => {\r\nconst osc = audioCtx.createOscillator();\r\nconst gain = audioCtx.createGain();\r\nosc.connect(gain); gain.connect(audioCtx.destination);\r\nosc.frequency.value = f; osc.type = 'triangle';\r\ngain.gain.setValueAtTime(0.15, audioCtx.currentTime);\r\ngain.gain.exponentialRampToValueAtTime(0.001, audioCtx.currentTime + 0.3);\r\nosc.start(); osc.stop(audioCtx.currentTime + 0.3);\r\n}, i * 90);\r\n});\r\n}\r\n\r\nlet voices = [];\r\nfunction loadVoices(){ voices = speechSynthesis.getVoices(); }\r\nif('speechSynthesis' in window){\r\nloadVoices();\r\nspeechSynthesis.onvoiceschanged = loadVoices;\r\n}\r\n\r\nfunction hablar(texto){\r\nif(state.voiceMode === 'none' || !('speechSynthesis' in window)) return;\r\nspeechSynthesis.cancel();\r\nconst u = new SpeechSynthesisUtterance(texto);\r\nu.rate = state.rate;\r\nu.pitch = 1.0; \/\/ \u2705 Tono natural, sin distorsiones\r\n\r\nlet latVoices = voices.filter(v => ['es-AR', 'es-MX', 'es-CO', 'es-CL', 'es-US'].includes(v.lang));\r\nif(latVoices.length === 0){\r\nlatVoices = voices.filter(v => v.lang && v.lang.toLowerCase().startsWith('es'));\r\n}\r\nif(latVoices.length === 0) latVoices = voices;\r\n\r\nlet preferredVoice = null;\r\n\r\n\/\/ Nombres reales de voces masculinas en sistemas Windows\/Mac\/Google\r\nconst maleNames = ['male', 'jorge', 'pablo', 'diego', 'javier', 'miguel', 'luis', 'enrique', 'carlos', 'juan', 'raul', 'microsoft raul', 'google espa\u00f1ol masculino'];\r\nconst femaleNames = ['female', 'helena', 'valentina', 'dalia', 'paulina', 'monica', 'sabina', 'elena', 'catalina', 'esperanza', 'conchita', 'elvira', 'carmen', 'lucia', 'google espa\u00f1ol', 'microsoft elena', 'microsoft sabina'];\r\n\r\nif(state.voiceMode === 'hombre'){\r\npreferredVoice = latVoices.find(v => maleNames.some(n => v.name.toLowerCase().includes(n)));\r\n\/\/ Si no hay voz de hombre instalada, usar\u00e1 la primera disponible sin deformarla\r\nif(!preferredVoice) preferredVoice = latVoices[0];\r\n} else if(state.voiceMode === 'mujer'){\r\npreferredVoice = latVoices.find(v => femaleNames.some(n => v.name.toLowerCase().includes(n)));\r\nif(!preferredVoice) preferredVoice = latVoices[0];\r\n}\r\n\r\nif(preferredVoice){\r\nu.voice = preferredVoice;\r\nu.lang = preferredVoice.lang;\r\n} else {\r\nu.lang = 'es-AR';\r\n}\r\n\r\nspeechSynthesis.speak(u);\r\n}\r\n\r\nfunction toggleRepeat(){\r\nstate.repeat = !state.repeat;\r\nrepeatToggle.classList.toggle('active', state.repeat);\r\nrepeatToggle.setAttribute('aria-checked', state.repeat);\r\nupdateAvailable();\r\n}\r\n\r\nfunction setVoiceMode(mode){\r\nstate.voiceMode = mode;\r\nmaleVoiceToggle.classList.toggle('active', mode === 'hombre');\r\nfemaleVoiceToggle.classList.toggle('active', mode === 'mujer');\r\n\r\nif(mode === 'none'){\r\nspeechSynthesis.cancel();\r\n} else {\r\nensureAudio();\r\nhablar(mode === 'hombre' ? 'Voz de hombre activada' : 'Voz de mujer activada');\r\n}\r\n}\r\n\r\nmaleVoiceCard.addEventListener('click', () => { ensureAudio(); setVoiceMode(state.voiceMode === 'hombre' ? 'none' : 'hombre'); });\r\nfemaleVoiceCard.addEventListener('click', () => { ensureAudio(); setVoiceMode(state.voiceMode === 'mujer' ? 'none' : 'mujer'); });\r\n\r\nfunction toggleSfx(){\r\nstate.sfxOn = !state.sfxOn;\r\nsfxToggle.classList.toggle('active', state.sfxOn);\r\nsfxToggle.setAttribute('aria-checked', state.sfxOn);\r\nensureAudio();\r\nif(state.sfxOn){ tickSound(800, 0.1, 0.1); }\r\n}\r\nsfxToggle.addEventListener('click', () => { ensureAudio(); toggleSfx(); });\r\nrepeatToggle.addEventListener('click', toggleRepeat);\r\n\r\nminInput.addEventListener('input', () => { state.min = parseInt(minInput.value) || 0; updateAvailable(); });\r\nmaxInput.addEventListener('input', () => { state.max = parseInt(maxInput.value) || 0; updateAvailable(); });\r\n\r\nqtyInput.addEventListener('input', () => {\r\nlet val = parseInt(qtyInput.value);\r\nif (isNaN(val) || val < 1) val = 1;\r\nstate.qty = val;\r\ntotalNum.textContent = state.qty;\r\nupdateAvailable();\r\n});\r\n\r\nrateRange.addEventListener('input', () => {\r\nstate.rate = parseFloat(rateRange.value);\r\nrateDisplay.textContent = state.rate.toFixed(1);\r\n});\r\n\r\nfunction updateAvailable(){\r\nconst lo = Math.min(state.min, state.max);\r\nconst hi = Math.max(state.min, state.max);\r\nconst total = hi - lo + 1;\r\nrangeInfo.textContent = `Del ${lo} al ${hi}`;\r\nif(state.repeat){\r\navailableCount.textContent = '\u221e'; statRemaining.textContent = '\u221e';\r\n} else {\r\nconst drawn = state.history.length;\r\nconst remaining = Math.max(0, total - drawn);\r\navailableCount.textContent = remaining; statRemaining.textContent = remaining;\r\nif(state.qty > remaining && remaining > 0){ showToast(`Solo quedan ${remaining} n\u00fameros disponibles. Ajusta la cantidad.`, 'error'); }\r\n}\r\n}\r\n\r\nfunction obtenerRango(){ const lo = Math.min(state.min, state.max); const hi = Math.max(state.min, state.max); return {lo, hi, total: hi - lo + 1}; }\r\n\r\nfunction generarNumero(){\r\nconst {lo, hi, total} = obtenerRango();\r\nif(state.repeat){ return Math.floor(Math.random() * total) + lo; }\r\nif(state.remaining.length === 0) return null;\r\nconst idx = Math.floor(Math.random() * state.remaining.length);\r\nreturn state.remaining.splice(idx, 1)[0];\r\n}\r\n\r\nfunction iniciarRemaining(){\r\nconst {lo, hi} = obtenerRango();\r\nstate.remaining = [];\r\nfor(let i = lo; i <= hi; i++) state.remaining.push(i);\r\nstate.drawnSet = new Set();\r\n}\r\n\r\nasync function realizarSorteo(){\r\nif(state.sorteando) return;\r\nensureAudio();\r\nconst {lo, hi, total} = obtenerRango();\r\nif(total <= 0){ showToast('El rango de n\u00fameros no es v\u00e1lido', 'error'); return; }\r\nif(lo === hi && state.qty > 1 && !state.repeat){ showToast('Con un solo n\u00famero disponible no puedes sortear m\u00faltiples sin repetici\u00f3n', 'error'); return; }\r\n\r\nif(state.currentIdx === 0){\r\nif(!state.repeat){ iniciarRemaining(); }\r\nstate.history = []; state.drawnSet = new Set();\r\nballsContainer.innerHTML = '';\r\nhistoryContainer.innerHTML = '<p class=\"text-sm text-gray-500 italic text-center py-8\">Sorteando...<\/p>';\r\nhistoryCount.textContent = '0 n\u00fameros';\r\n}\r\n\r\nif(!state.repeat){\r\nconst needed = state.qty - state.currentIdx;\r\nif(state.remaining.length < needed){ showToast(`Solo quedan ${state.remaining.length} n\u00fameros disponibles. Reinicia el sorteo.`, 'error'); return; }\r\n}\r\n\r\nstate.sorteando = true;\r\nsortearBtn.disabled = true;\r\nsortearBtn.classList.add('sorteando');\r\nsortearBtn.innerHTML = '<i class=\"fa-solid fa-spinner fa-spin mr-2\"><\/i> SORTEANDO...';\r\nemptyDisplay.style.display = 'none';\r\n\r\nfor(let i = 0; i < state.qty; i++){\r\nif(!state.repeat && state.remaining.length === 0){ showToast('No quedan m\u00e1s n\u00fameros disponibles', 'error'); break; }\r\nstate.currentIdx = state.history.length + 1;\r\ncurrentNum.textContent = state.currentIdx;\r\nconst numero = generarNumero();\r\nif(numero === null) break;\r\nawait animarReel(numero);\r\nstate.history.push(numero);\r\nstate.drawnSet.add(numero);\r\nagregarBola(numero);\r\nagregarHistorial(numero);\r\nwinSound();\r\nhablar(numero.toString());\r\nstatTotal.textContent = state.history.length;\r\nstatLast.textContent = numero;\r\nconst progress = (state.history.length \/ state.qty) * 100;\r\nprogressFill.style.width = progress + '%';\r\nif(i === state.qty - 1){ lanzarConfetti(); } else { await wait(400); }\r\n}\r\n\r\nstate.sorteando = false;\r\nsortearBtn.disabled = false;\r\nsortearBtn.classList.remove('sorteando');\r\nsortearBtn.innerHTML = '<i class=\"fa-solid fa-dice mr-2\"><\/i> SORTEAR OTRO';\r\nupdateAvailable();\r\nshowToast(`Sorteo completado: ${state.history.length} n\u00famero(s)`, 'success');\r\n}\r\n\r\nfunction animarReel(numeroFinal){\r\nreturn new Promise(resolve => {\r\nconst {lo, hi} = obtenerRango();\r\nconst alturaItem = window.innerWidth < 768 ? 220 : 280;\r\nconst secuencia = [];\r\nconst numItems = 35;\r\nfor(let i = 0; i < numItems; i++){ secuencia.push(Math.floor(Math.random() * (hi - lo + 1)) + lo); }\r\nsecuencia.push(numeroFinal);\r\nreelTrack.innerHTML = secuencia.map(n => `<div class=\"reel-number\">${n}<\/div>`).join('');\r\nreelTrack.style.transition = 'none';\r\nreelTrack.style.transform = 'translateY(0)';\r\nvoid reelTrack.offsetHeight;\r\nconst totalItems = secuencia.length;\r\nconst offset = (totalItems - 1) * alturaItem;\r\nreelTrack.style.transition = 'transform 3s cubic-bezier(0.15, 0.85, 0.25, 1)';\r\nreelTrack.style.transform = `translateY(-${offset}px)`;\r\n\r\nlet tickCount = 0;\r\nconst tickInterval = setInterval(() => {\r\ntickCount++;\r\nconst freq = 600 + Math.random() * 400;\r\nconst vol = Math.max(0.02, 0.08 - tickCount * 0.003);\r\ntickSound(freq, 0.03, vol);\r\nif(tickCount > 25){ clearInterval(tickInterval); }\r\n}, 90);\r\n\r\nsetTimeout(() => { clearInterval(tickInterval); resolve(); }, 3100);\r\n});\r\n}\r\n\r\nfunction wait(ms){ return new Promise(r => setTimeout(r, ms)); }\r\n\r\nfunction agregarBola(numero){\r\nconst placeholder = ballsContainer.querySelector('p.italic');\r\nif(placeholder) placeholder.remove();\r\nconst bola = document.createElement('div');\r\nbola.className = 'lottery-ball';\r\nbola.textContent = numero;\r\nballsContainer.appendChild(bola);\r\nballsContainer.scrollLeft = ballsContainer.scrollWidth;\r\n}\r\n\r\nfunction agregarHistorial(numero){\r\nconst placeholder = historyContainer.querySelector('p.italic');\r\nif(placeholder) placeholder.remove();\r\nconst item = document.createElement('div');\r\nitem.className = 'history-item';\r\nconst hora = new Date().toLocaleTimeString('es-ES', {hour:'2-digit', minute:'2-digit', second:'2-digit'});\r\nitem.innerHTML = `<div class=\"history-number\">${numero}<\/div><div class=\"flex-1\"><p class=\"text-sm font-medium text-white\">N\u00famero ${numero}<\/p><p class=\"text-xs text-gray-400\">Sorteo #${state.history.length} \u00b7 ${hora}<\/p><\/div><i class=\"fa-solid fa-check-circle\" style=\"color:var(--success)\"><\/i>`;\r\nhistoryContainer.prepend(item);\r\nhistoryCount.textContent = `${state.history.length} n\u00famero${state.history.length !== 1 ? 's' : ''}`;\r\n}\r\n\r\nconst confettiCanvas = $('confettiCanvas');\r\nconst cctx = confettiCanvas.getContext('2d');\r\nlet confettiParticles = [];\r\n\r\nfunction resizeConfetti(){ confettiCanvas.width = window.innerWidth; confettiCanvas.height = window.innerHeight; }\r\nresizeConfetti();\r\nwindow.addEventListener('resize', resizeConfetti);\r\n\r\nfunction lanzarConfetti(){\r\nconst colors = ['#fbbf24', '#f97316', '#ef4444', '#10b981', '#ffffff', '#fde68a'];\r\nconst cx = window.innerWidth \/ 2; const cy = window.innerHeight \/ 2;\r\nfor(let i = 0; i < 150; i++){\r\nconfettiParticles.push({\r\nx: cx + (Math.random() - 0.5) * 100, y: cy,\r\nvx: (Math.random() - 0.5) * 18, vy: Math.random() * -18 - 5,\r\ngravity: 0.5, size: Math.random() * 8 + 4,\r\ncolor: colors[Math.floor(Math.random() * colors.length)],\r\nrotation: Math.random() * 360, rotationSpeed: (Math.random() - 0.5) * 12,\r\nlife: 1, shape: Math.random() > 0.5 ? 'rect' : 'circle'\r\n});\r\n}\r\n}\r\n\r\nfunction animarConfetti(){\r\ncctx.clearRect(0, 0, confettiCanvas.width, confettiCanvas.height);\r\nconfettiParticles = confettiParticles.filter(p => p.life > 0 && p.y < confettiCanvas.height + 50);\r\nconfettiParticles.forEach(p => {\r\np.x += p.vx; p.y += p.vy; p.vy += p.gravity; p.vx *= 0.99;\r\np.rotation += p.rotationSpeed; p.life -= 0.008;\r\ncctx.save();\r\ncctx.translate(p.x, p.y); cctx.rotate(p.rotation * Math.PI \/ 180);\r\ncctx.fillStyle = p.color; cctx.globalAlpha = Math.max(0, p.life);\r\nif(p.shape === 'rect'){ cctx.fillRect(-p.size\/2, -p.size\/2, p.size, p.size * 0.6); }\r\nelse { cctx.beginPath(); cctx.arc(0, 0, p.size\/2, 0, Math.PI * 2); cctx.fill(); }\r\ncctx.restore();\r\n});\r\nrequestAnimationFrame(animarConfetti);\r\n}\r\nanimarConfetti();\r\n\r\nlet toastTimeout;\r\nfunction showToast(msg, type = 'info'){\r\ntoastMsg.textContent = msg;\r\ntoast.className = 'toast show ' + (type === 'error' ? 'error' : type === 'success' ? 'success' : '');\r\nconst icons = { info: 'fa-circle-info', error: 'fa-circle-exclamation', success: 'fa-circle-check' };\r\ntoastIcon.className = 'fa-solid ' + (icons[type] || icons.info);\r\nclearTimeout(toastTimeout);\r\ntoastTimeout = setTimeout(() => { toast.classList.remove('show'); }, 3000);\r\n}\r\n\r\nsortearBtn.addEventListener('click', () => {\r\nensureAudio();\r\nif(state.currentIdx >= state.qty || state.currentIdx === 0){ state.currentIdx = 0; progressFill.style.width = '0%'; }\r\nrealizarSorteo();\r\n});\r\n\r\nclearBtn.addEventListener('click', () => {\r\nif(state.sorteando) return;\r\nstate.history = []; state.drawnSet = new Set(); state.currentIdx = 0;\r\nprogressFill.style.width = '0%'; currentNum.textContent = '0';\r\nstatTotal.textContent = '0'; statLast.textContent = '\u2014';\r\nballsContainer.innerHTML = '<p class=\"text-sm text-gray-500 italic self-center\">A\u00fan no hay n\u00fameros sorteados<\/p>';\r\nhistoryContainer.innerHTML = '<p class=\"text-sm text-gray-500 italic text-center py-8\">El historial aparecer\u00e1 aqu\u00ed despu\u00e9s del primer sorteo<\/p>';\r\nhistoryCount.textContent = '0 n\u00fameros';\r\nreelTrack.innerHTML = ''; reelTrack.appendChild(emptyDisplay);\r\nemptyDisplay.style.display = 'flex';\r\nsortearBtn.innerHTML = '<i class=\"fa-solid fa-dice mr-2\"><\/i> SORTEAR';\r\nupdateAvailable();\r\nshowToast('Sorteo reiniciado', 'success');\r\n});\r\n\r\ncopyBtn.addEventListener('click', () => {\r\nif(state.history.length === 0){ showToast('No hay n\u00fameros para copiar', 'error'); return; }\r\nconst texto = state.history.join(', ');\r\nnavigator.clipboard.writeText(texto).then(() => { showToast(`${state.history.length} n\u00fameros copiados`, 'success'); })\r\n.catch(() => {\r\nconst ta = document.createElement('textarea'); ta.value = texto;\r\ndocument.body.appendChild(ta); ta.select();\r\ntry{ document.execCommand('copy'); showToast(`${state.history.length} n\u00fameros copiados`, 'success'); }\r\ncatch(e){ showToast('No se pudo copiar', 'error'); }\r\ndocument.body.removeChild(ta);\r\n});\r\n});\r\n\r\nfunction crearParticulas(){\r\nconst container = $('particles');\r\nfor(let i = 0; i < 25; i++){\r\nconst p = document.createElement('div'); p.className = 'particle';\r\nconst size = Math.random() * 5 + 2;\r\np.style.width = size + 'px'; p.style.height = size + 'px';\r\np.style.left = Math.random() * 100 + '%';\r\np.style.animation = `floatUp ${Math.random() * 15 + 20}s linear infinite`;\r\np.style.animationDelay = Math.random() * 20 + 's';\r\ncontainer.appendChild(p);\r\n}\r\n}\r\ncrearParticulas();\r\nupdateAvailable();\r\nsetTimeout(() => { showToast('Configura tu sorteo y presiona SORTEAR', 'info'); }, 600);\r\n<\/script>\r\n\r\n<\/body>\r\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Sorteo Pro \u00b7 M\u00e1quina de N\u00fameros SORTEO de N\u00daMEROS FISAR Sim FICA \/ UNSL Voz Hombre Voz Mujer Efectos CONFIGURACI\u00d3N Permitir repetici\u00f3n \u00bfLos n\u00fameros pueden…<\/p>\n","protected":false},"author":7,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_monsterinsights_skip_tracking":false,"_monsterinsights_sitenote_active":false,"_monsterinsights_sitenote_note":"","_monsterinsights_sitenote_category":0,"footnotes":""},"class_list":["post-8633","page","type-page","status-publish","hentry"],"yoast_head":"\n<title>sorteo - F\u00edsica 2<\/title>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/fisica2.fica.unsl.edu.ar\/index.php\/sorteo\/\" \/>\n<meta property=\"og:locale\" content=\"es_ES\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"sorteo - F\u00edsica 2\" \/>\n<meta property=\"og:description\" content=\"Sorteo Pro \u00b7 M\u00e1quina de N\u00fameros SORTEO de N\u00daMEROS FISAR Sim FICA \/ UNSL Voz Hombre Voz Mujer Efectos CONFIGURACI\u00d3N Permitir repetici\u00f3n \u00bfLos n\u00fameros pueden…\" \/>\n<meta property=\"og:url\" content=\"https:\/\/fisica2.fica.unsl.edu.ar\/index.php\/sorteo\/\" \/>\n<meta property=\"og:site_name\" content=\"F\u00edsica 2\" \/>\n<meta property=\"article:modified_time\" content=\"2026-08-17T01:09:09+00:00\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Tiempo de lectura\" \/>\n\t<meta name=\"twitter:data1\" content=\"1 minuto\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/fisica2.fica.unsl.edu.ar\\\/index.php\\\/sorteo\\\/\",\"url\":\"https:\\\/\\\/fisica2.fica.unsl.edu.ar\\\/index.php\\\/sorteo\\\/\",\"name\":\"sorteo - F\u00edsica 2\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/fisica2.fica.unsl.edu.ar\\\/#website\"},\"datePublished\":\"2026-08-16T21:49:42+00:00\",\"dateModified\":\"2026-08-17T01:09:09+00:00\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/fisica2.fica.unsl.edu.ar\\\/index.php\\\/sorteo\\\/#breadcrumb\"},\"inLanguage\":\"es-AR\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/fisica2.fica.unsl.edu.ar\\\/index.php\\\/sorteo\\\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/fisica2.fica.unsl.edu.ar\\\/index.php\\\/sorteo\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Inicio\",\"item\":\"https:\\\/\\\/fisica2.fica.unsl.edu.ar\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"sorteo\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/fisica2.fica.unsl.edu.ar\\\/#website\",\"url\":\"https:\\\/\\\/fisica2.fica.unsl.edu.ar\\\/\",\"name\":\"F\u00edsica 2\",\"description\":\"FICA - UNSL\",\"publisher\":{\"@id\":\"https:\\\/\\\/fisica2.fica.unsl.edu.ar\\\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/fisica2.fica.unsl.edu.ar\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"es-AR\"},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/fisica2.fica.unsl.edu.ar\\\/#organization\",\"name\":\"SAC- Secretar\u00eda General FICA\",\"url\":\"https:\\\/\\\/fisica2.fica.unsl.edu.ar\\\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"es-AR\",\"@id\":\"https:\\\/\\\/fisica2.fica.unsl.edu.ar\\\/#\\\/schema\\\/logo\\\/image\\\/\",\"url\":\"https:\\\/\\\/fisica2.fica.unsl.edu.ar\\\/wp-content\\\/uploads\\\/2021\\\/11\\\/SG-Logo.png\",\"contentUrl\":\"https:\\\/\\\/fisica2.fica.unsl.edu.ar\\\/wp-content\\\/uploads\\\/2021\\\/11\\\/SG-Logo.png\",\"width\":4483,\"height\":1231,\"caption\":\"SAC- Secretar\u00eda General FICA\"},\"image\":{\"@id\":\"https:\\\/\\\/fisica2.fica.unsl.edu.ar\\\/#\\\/schema\\\/logo\\\/image\\\/\"}}]}<\/script>\n","yoast_head_json":{"title":"sorteo - F\u00edsica 2","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/fisica2.fica.unsl.edu.ar\/index.php\/sorteo\/","og_locale":"es_ES","og_type":"article","og_title":"sorteo - F\u00edsica 2","og_description":"Sorteo Pro \u00b7 M\u00e1quina de N\u00fameros SORTEO de N\u00daMEROS FISAR Sim FICA \/ UNSL Voz Hombre Voz Mujer Efectos CONFIGURACI\u00d3N Permitir repetici\u00f3n \u00bfLos n\u00fameros pueden…","og_url":"https:\/\/fisica2.fica.unsl.edu.ar\/index.php\/sorteo\/","og_site_name":"F\u00edsica 2","article_modified_time":"2026-08-17T01:09:09+00:00","twitter_card":"summary_large_image","twitter_misc":{"Tiempo de lectura":"1 minuto"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/fisica2.fica.unsl.edu.ar\/index.php\/sorteo\/","url":"https:\/\/fisica2.fica.unsl.edu.ar\/index.php\/sorteo\/","name":"sorteo - F\u00edsica 2","isPartOf":{"@id":"https:\/\/fisica2.fica.unsl.edu.ar\/#website"},"datePublished":"2026-08-16T21:49:42+00:00","dateModified":"2026-08-17T01:09:09+00:00","breadcrumb":{"@id":"https:\/\/fisica2.fica.unsl.edu.ar\/index.php\/sorteo\/#breadcrumb"},"inLanguage":"es-AR","potentialAction":[{"@type":"ReadAction","target":["https:\/\/fisica2.fica.unsl.edu.ar\/index.php\/sorteo\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/fisica2.fica.unsl.edu.ar\/index.php\/sorteo\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Inicio","item":"https:\/\/fisica2.fica.unsl.edu.ar\/"},{"@type":"ListItem","position":2,"name":"sorteo"}]},{"@type":"WebSite","@id":"https:\/\/fisica2.fica.unsl.edu.ar\/#website","url":"https:\/\/fisica2.fica.unsl.edu.ar\/","name":"F\u00edsica 2","description":"FICA - UNSL","publisher":{"@id":"https:\/\/fisica2.fica.unsl.edu.ar\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/fisica2.fica.unsl.edu.ar\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"es-AR"},{"@type":"Organization","@id":"https:\/\/fisica2.fica.unsl.edu.ar\/#organization","name":"SAC- Secretar\u00eda General FICA","url":"https:\/\/fisica2.fica.unsl.edu.ar\/","logo":{"@type":"ImageObject","inLanguage":"es-AR","@id":"https:\/\/fisica2.fica.unsl.edu.ar\/#\/schema\/logo\/image\/","url":"https:\/\/fisica2.fica.unsl.edu.ar\/wp-content\/uploads\/2021\/11\/SG-Logo.png","contentUrl":"https:\/\/fisica2.fica.unsl.edu.ar\/wp-content\/uploads\/2021\/11\/SG-Logo.png","width":4483,"height":1231,"caption":"SAC- Secretar\u00eda General FICA"},"image":{"@id":"https:\/\/fisica2.fica.unsl.edu.ar\/#\/schema\/logo\/image\/"}}]}},"_links":{"self":[{"href":"https:\/\/fisica2.fica.unsl.edu.ar\/index.php\/wp-json\/wp\/v2\/pages\/8633","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/fisica2.fica.unsl.edu.ar\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/fisica2.fica.unsl.edu.ar\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/fisica2.fica.unsl.edu.ar\/index.php\/wp-json\/wp\/v2\/users\/7"}],"replies":[{"embeddable":true,"href":"https:\/\/fisica2.fica.unsl.edu.ar\/index.php\/wp-json\/wp\/v2\/comments?post=8633"}],"version-history":[{"count":52,"href":"https:\/\/fisica2.fica.unsl.edu.ar\/index.php\/wp-json\/wp\/v2\/pages\/8633\/revisions"}],"predecessor-version":[{"id":8713,"href":"https:\/\/fisica2.fica.unsl.edu.ar\/index.php\/wp-json\/wp\/v2\/pages\/8633\/revisions\/8713"}],"wp:attachment":[{"href":"https:\/\/fisica2.fica.unsl.edu.ar\/index.php\/wp-json\/wp\/v2\/media?parent=8633"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}