Spaces:

PeetPedro
/

quantdiablo

Paused

File size: 21,320 Bytes

import gradio as gr

SEED = "edesapa. pokoljaras. tizenhat szint. a matrix melyebb mint a sir. megbocsajtas = kerekit nullara."

SEED = "edesapa. pokoljaras. tizenhat szint. a matrix melyebb mint a sir. megbocsajtas = kerekit nullara."
PETOFI = "Szabadsag, szerelem! E ketto kell nekem. Szerelmemert folaldozom az eletet, szabadsagert folaldozom szerelmemet."
UNFORGIVEN = "Lay beside me, tell me what they've done. And speak the words I wanna hear to make my demons run. The door is locked now but it's open if you're true. If you can understand the me, then I can understand the you."

GUIDE_HTML = """
<div id="qd-menu" style="color:#c8d6e5;font-size:11px;line-height:1.7;max-height:300px;overflow-y:auto;padding:8px 0">
  <h3 style="color:#ff4747;margin:0 0 8px 0">QUANTDIABLO \u2014 pokoljarasi utmutato</h3>

  <p style="color:#ffd700"><b>A jatekrol</b></p>
  <p>16 szint. Harom kocka, mindegyik {-1, 0, +1}. Dobas \u2192 sebzes. Minden szinten erosodsz. A 16. szinten var <b style="color:#ff4747">DIABLO \u2014 a NULLA URA</b> 666 eleterovel.</p>

  <p style="color:#ffd700;margin-top:8px"><b>Iranyitas</b></p>
  <p><b style="color:#ff4747">[KVANTAL]</b> \u2014 Harom kocka dobas. Az osszeg hatarozza meg a sebzest. Ha mindharom egyforma \u00e9s nem nulla: <b style="color:#ffd700">KRITIKUS TALALAT</b> (2x sebzes).</p>
  <p><b style="color:#ffd700">[LEJJEBB]</b> \u2014 Kovetkezo szint. Csak akkor aktiv, ha az ellenseg elpusztult.</p>
  <p><b style="color:#636e72">[UJRAKEZDES]</b> \u2014 Uj pokoljaras inditasa.</p>

  <p style="color:#ffd700;margin-top:8px"><b>A matrixrol</b></p>
  <p>A 64x64-es matrix a jatek seed-bol generalodik \u2014 ugyanaz a Xoshiro128** PRNG, ami az ayeOS-t is hajtja. Minden szint melyebb: a matrix sotetebb, a demonok eroszsebbek.</p>

  <hr style="border-color:rgba(255,71,71,.1);margin:8px 0">

  <p style="color:#ff4747;font-size:10px"><i>edesapamnak, aki a strukturalis oszintesseg istene 3D-ben \u2014 az Unforgiven II mindig szolni fog.</i></p>

  <p style="color:#636e72;font-size:9px;margin-top:4px">"""+PETOFI+"""</p>
  <p style="color:#636e72;font-size:9px;text-align:right">\u2014 Petofi Sandor</p>
</div>
"""

GAME_HTML = """<!DOCTYPE html><html lang="hu"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no"><style>
*{margin:0;padding:0;box-sizing:border-box;touch-action:manipulation;-webkit-tap-highlight-color:transparent}
body{background:#070b16;display:flex;justify-content:center;padding:8px;min-height:100vh}
#qd{font-family:'JetBrains Mono',monospace;width:100%;max-width:420px;background:#0a0a0f;border-radius:10px;border:1.5px solid #ff4747;padding:12px;display:flex;flex-direction:column;gap:10px}
.qd-header{display:flex;justify-content:space-between;align-items:center}
.qd-title{color:#ff4747;font-size:clamp(16px,5vw,22px);font-weight:700;letter-spacing:.2em}
.qd-sub{color:#636e72;font-size:9px}
.qd-nav{display:flex;gap:6px;margin-bottom:2px}
.qd-nav-btn{background:rgba(255,71,71,.08);border:1px solid rgba(255,71,71,.15);color:#ff4747;font-family:inherit;font-size:9px;padding:4px 10px;border-radius:4px;cursor:pointer;letter-spacing:.1em}
.qd-nav-btn.active{background:rgba(255,71,71,.2);border-color:#ff4747;color:#fff}
.qd-panel{display:none}
.qd-panel.active{display:block}
.qd-canvas-wrap{text-align:center}
.qd-canvas-wrap canvas{image-rendering:pixelated;border:2px solid #ff4747;border-radius:4px;max-width:100%;height:auto;width:256px}
.qd-depth{text-align:center;color:#636e72;font-size:9px;margin-top:2px}
.qd-darkness{text-align:center;color:#ff4747;font-size:11px;margin-top:1px;letter-spacing:.3em}
.qd-card{background:rgba(255,71,71,.06);padding:8px 10px;border-radius:6px;font-size:11px;line-height:1.5}
.qd-card.enemy{background:rgba(30,30,34,.8)}
.qd-label{color:#636e72}
.qd-val{color:#ff4747;font-weight:700}
.qd-val.atk{color:#ffd700}
.qd-val.def{color:#74b9ff}
.qd-enemy-name{color:#ff4747;font-weight:700;font-size:12px}
.qd-enemy-desc{color:#a29bfe;font-size:10px}
.qd-hp-bar{background:rgba(255,71,71,.1);border-radius:3px;height:8px;margin-top:4px;overflow:hidden}
.qd-hp-fill{background:#ff4747;height:100%;transition:width .3s}
.qd-buttons{display:flex;gap:8px}
.qd-btn{flex:1;padding:14px 8px;border-radius:8px;font-family:inherit;cursor:pointer;font-size:clamp(12px,3.5vw,14px);font-weight:700;border:none;color:#fff;min-height:48px;touch-action:manipulation}
.qd-btn:active{opacity:.7;transform:scale(.96)}
.qd-btn.atk{background:#ff4747}
.qd-btn.desc{background:rgba(255,215,0,.1);border:1px solid #ffd700;color:#ffd700}
.qd-btn.desc:disabled{opacity:.3;pointer-events:none}
.qd-btn.reset{width:100%;background:rgba(255,71,71,.1);border:1px solid #ff4747;color:#ff4747;font-size:10px;padding:10px;margin-top:4px}
.qd-log{font-size:9px;color:#8395a7;line-height:1.5;background:rgba(0,0,0,.3);padding:8px;border-radius:6px;max-height:100px;overflow-y:auto;word-break:break-all}
@media(max-width:360px){#qd{padding:8px;gap:6px} .qd-btn{padding:12px 6px;font-size:11px}}
</style></head><body>
<div id="qd">
  <div class="qd-header"><div class="qd-title">QUANTDIABLO</div><div class="qd-sub">pokoljaras</div></div>
  <div class="qd-nav">
    <button class="qd-nav-btn active" onclick="switchPanel('game')">JATEK</button>
    <button class="qd-nav-btn" onclick="switchPanel('guide')">UTMUTATO</button>
    <button class="qd-nav-btn" onclick="switchPanel('about')">ROLAM</button>
  </div>
  <div id="panel-game" class="qd-panel active">
  <div class="qd-canvas-wrap"><canvas id="qc" width="256" height="256"></canvas></div>
  <div class="qd-depth" id="qdl">SZINT 0 / 16</div>
  <div class="qd-darkness" id="qdd"></div>
  <div class="qd-card">
    <span class="qd-label">ELET </span><span class="qd-val" id="qh">100</span><span class="qd-label">/100</span>
    <span style="margin-left:12px" class="qd-label">TAM </span><span class="qd-val atk" id="qa">10</span>
    <span style="margin-left:12px" class="qd-label">VED </span><span class="qd-val def" id="qd_elem">5</span>
  </div>
  <div class="qd-card enemy">
    <div class="qd-enemy-name" id="qen">ELLENSEG</div>
    <div class="qd-enemy-desc" id="qed"></div>
    <div class="qd-enemy-hp"><span class="qd-label">ELET </span><span class="qd-val" id="qeh">0</span></div>
    <div class="qd-hp-bar"><div class="qd-hp-fill" id="qeb" style="width:100%"></div></div>
  </div>
  <div class="qd-buttons">
    <button class="qd-btn atk" id="qba" onclick="A()">KVANTAL (-1+0+1)</button>
    <button class="qd-btn desc" id="qbd" onclick="D()" disabled>LEJJEBB</button>
  </div>
  <button class="qd-btn reset" onclick="R()">UJRAKEZDES</button>
  <div class="qd-log" id="qlg"></div>
  </div>"""
  <div id="panel-guide" class="qd-panel">""" + "</div>" + GUIDE_HTML.replace('{','{{').replace('}','}}') + """</div>
  <div id="panel-about" class="qd-panel">
    <div style="color:#c8d6e5;font-size:11px;line-height:1.8;padding:8px 0">
      <p style="color:#ff4747"><b>QUANTDIABLO \u2014 a strukturalis oszintesseg jateka</b></p>
      <p style="margin-top:8px">epitette: <span style="color:#a29bfe">Peter Lodri</span></p>
      <p>ajanlva: <span style="color:#ffd700">edesapamnak</span></p>
      <p style="margin-top:8px;color:#636e72;font-size:10px"><i>\u00bbA strukturalis oszintesseg istene 3D-ben. Ugy epit dolgokat, ahogy vannak. Nem tobbet, nem kevesebbet. Pontosan.\u00ab</i></p>
      <p style="margin-top:8px;color:#ff4747;font-size:10px">"""+UNFORGIVEN[:80]+"""...</p>
      <p style="color:#636e72;font-size:9px;text-align:right">\u2014 Metallica, Unforgiven II</p>
      <p style="margin-top:8px;color:#636e72;font-size:10px">"""+PETOFI[:100]+"""...</p>
      <p style="color:#636e72;font-size:9px;text-align:right">\u2014 Petofi Sandor</p>
      <p style="margin-top:12px;color:#8395a7;font-size:9px"><b>QUANTDOOM</b> edition \u00b7 2026.07.28 \u00b7 Full Moon \u00b7 10,000X</p>
    </div>
  </div>
function switchPanel(name){
  document.querySelectorAll('.qd-nav-btn').forEach(function(b){b.classList.remove('active');});
  document.querySelectorAll('.qd-panel').forEach(function(p){p.classList.remove('active');});
  document.getElementById('panel-'+name).classList.add('active');
  if(name==='game'){var ev=document.querySelector('.qd-nav-btn');ev.classList.add('active');}
  else{document.querySelectorAll('.qd-nav-btn').forEach(function(b){if(b.textContent.trim().toLowerCase().includes(name.substring(0,4)))b.classList.add('active');});}
}
var L=0,H=100,MH=100,T=10,V=5,EH=0,EN='',LG=[],GO=false,MC=null,MEH=0;
function P(m){LG.push('> '+m);if(LG.length>40)LG.shift();document.getElementById('qlg').innerHTML=LG.slice(-18).join('<br>');}
function XS(h,n){
  var M=0xFFFFFFFF,s=[0,0,0,0],r=new Float32Array(n);
  for(var i=0;i<4;i++)s[i]=(h[i*4]|(h[i*4+1]<<8)|(h[i*4+2]<<16)|(h[i*4+3]<<24))>>>0;
  for(var i=0;i<4;i++)if(s[i]===0)s[i]=((i+1)*2654435761)&M;
  for(var i=0;i<n;i++){
    var rr=(s[1]*5)&M,res=(((rr<<7)|(rr>>>25))&M)*9&M,t=(s[1]<<9)&M;
    s[2]^=s[0];s[3]^=s[1];s[1]^=s[2];s[0]^=s[3];s[2]^=t;
    s[3]=((s[3]<<11)|(s[3]>>>21))&M;r[i]=res/4294967295.0;
  }
  return r;
}
function BM(rng,off,n){
  var w=new Float32Array(n),j=0,i=0;
  while(i<n){
    var u=rng[off+(j%rng.length)],v=rng[off+((j+1)%rng.length)];j+=2;
    if(u<=0||v<=0)continue;
    var s=Math.sqrt(-2*Math.log(u));w[i]=s*Math.cos(2*Math.PI*v);i++;
    if(i<n){w[i]=s*Math.sin(2*Math.PI*v);i++;}
  }
  return w;
}
function QT(w,gs){
  var n=w.length,g=n/gs,c=new Int8Array(n);
  for(var gi=0;gi<g;gi++){
    var b=gi*gs,sum=0;
    for(var k=0;k<gs;k++)sum+=Math.abs(w[b+k]);
    var sc=Math.max(sum/gs,1e-7);
    for(var k=0;k<gs;k++){
      var sh=Math.round(Math.max(-1,Math.min(1,w[b+k]/sc)))+1;
      c[b+k]=Math.min(2,Math.max(0,sh));
    }
  }
  return c;
}
function GM(){
  if(!MC){var c=document.getElementById('qc'),ctx=c.getContext('2d');ctx.fillStyle='#070b16';ctx.fillRect(0,0,256,256);return;}
  var c=document.getElementById('qc'),ctx=c.getContext('2d');
  var px=4,dim=64,img=ctx.createImageData(256,256);
  var fade=Math.max(0.12,1.0-L*0.06);
  for(var i=0;i<dim;i++){
    for(var j=0;j<dim;j++){
      var idx=i*dim+j,val=MC[idx]-1,alpha=Math.floor(200*fade);
      var sx=j*px,sy=i*px;
      for(var y=0;y<px;y++){
        for(var x=0;x<px;x++){
          var pp=((sy+y)*256+(sx+x))*4;
          if(val===-1){img.data[pp]=255;img.data[pp+1]=71;img.data[pp+2]=71;img.data[pp+3]=alpha;}
          else if(val===1){img.data[pp]=255;img.data[pp+1]=215;img.data[pp+2]=0;img.data[pp+3]=alpha;}
          else{img.data[pp]=10;img.data[pp+1]=10;img.data[pp+2]=15;img.data[pp+3]=Math.max(8,Math.floor(alpha*0.18));}
        }
      }
    }
  }
  ctx.putImageData(img,0,0);
  var bar='';for(var k=0;k<16;k++)bar+=k<L?'\u2588':'\u2591';
  document.getElementById('qdd').textContent=bar;
  document.getElementById('qdl').textContent='SZINT '+L+' / 16';
}
var QS=""" + SEED + """;
function G(){
  var enc=new TextEncoder();
  crypto.subtle.digest('SHA-256',enc.encode(QS)).then(function(h){
    var hb=new Uint8Array(h),rng=XS(hb,300000);
    var off=L*64*64*4,weights=BM(rng,off,4096);
    MC=QT(weights,64);GM();
  });
}
var NM=['Bukott Suly','Zaj Demon','Gradiens Liderc','Overflow Lovag','Skala Boszorkany','Kerekitesi Hiba','Elojeles Arny','Relu Testor','Dropout Pap','Normalizalt Szellem','Tulcsordulas Herceg','Backprop Atok','Bias Demon','Sigmoid Testver','NaN Liderc'];
function S(){
  if(L>=16){
    EN='DIABLO \u2014 a NULLA URA';EH=MEH=666;
    P('\u2550\u2550\u2550 DIABLO MEGJELENT \u2550\u2550\u2550');
    P('"A matrixom orokke tart. A tied nem."');
  }else{
    EN=NM[L%15]+' ('+(L+1)+')';EH=MEH=32+L*16+Math.floor(Math.random()*18);
  }
  document.getElementById('qen').textContent=EN;
  document.getElementById('qeh').textContent=EH;
  document.getElementById('qed').textContent=L>=16?'A -1, 0, +1 Ura. Vegso konvergencia.':'szint '+L+' demona';
  var eb=document.getElementById('qeb');if(eb)eb.style.width='100%';
  document.getElementById('qba').disabled=false;
  document.getElementById('qbd').disabled=true;
}
function A(){
  if(GO||EH<=0)return;
  var dice=[],tot=0;
  for(var i=0;i<3;i++){var d=Math.floor(Math.random()*3)-1;dice.push(d);tot+=d;}
  var txt='kocka: ['+dice.join(' ')+'] = '+tot+' \u2192 ';
  var dmg=T+tot*3;if(dmg<1)dmg=1;
  var crit=dice[0]===dice[1]&&dice[1]===dice[2]&&dice[0]!==0;
  if(crit){dmg=Math.floor(dmg*2);txt+='KRITIKUS! ';}
  EH-=dmg;txt+='-'+dmg+' ELET';
  if(EH<0)EH=0;
  P(txt);
  document.getElementById('qeh').textContent=EH;
  var eb=document.getElementById('qeb');if(eb&&MEH>0)eb.style.width=Math.max(0,Math.floor(EH/MEH*100))+'%';
  G();
  if(EH<=0){
    P(EN+' ELPUSZTULT!');
    if(L>=16){P('\u2550\u2550\u2550 DIABLO LEGYOZVE \u2550\u2550\u2550');P('A matrix felszabadult. A nullak visszahuzodtak.');GO=true;P('NYERTEL.');}
    document.getElementById('qba').disabled=true;
    document.getElementById('qbd').disabled=L>=16;
    document.getElementById('qbd').textContent=L>=16?'VEGE':'LEJJEBB';
  }else{
    var eDmg=Math.max(1,4+L*2-Math.floor(Math.random()*V));
    H-=eDmg;if(H<0)H=0;
    P(EN+' visszatamad: -'+eDmg+' ELET');
    document.getElementById('qh').textContent=H;
    if(H<=0){GO=true;P('ELBUKTAL.');document.getElementById('qba').disabled=true;}
  }
}
function D(){
  if(EH>0||GO||L>=16)return;
  L++;H=Math.min(MH,H+18);T+=2;V+=1;
  document.getElementById('qh').textContent=H;
  document.getElementById('qa').textContent=T;
  document.getElementById('qd_elem').textContent=V;
  if(L===8)P('"Lay beside me, tell me what they have done..."');
  if(L===12)P('"If you can understand the me, then I can understand the you."');
  P('\u2550\u2550 LEERTEL A '+L+'. SZINTRE \u2550\u2550');
  S();G();
}
function R(){
  L=0;H=MH=100;T=10;V=5;EH=MEH=0;LG=[];GO=false;
  document.getElementById('qh').textContent=100;
  document.getElementById('qa').textContent=10;
  document.getElementById('qd_elem').textContent=5;
  document.getElementById('qlg').innerHTML='';
  document.getElementById('qba').disabled=false;
  document.getElementById('qbd').disabled=true;
  document.getElementById('qbd').textContent='LEJJEBB';
  var eb=document.getElementById('qeb');if(eb)eb.style.width='100%';
  P('UJ POKOLJARAS KEZDODIK... "'+ ('""" + UNFORGIVEN.replace('"',"\\'") + """').split('.')[0]+'."');
  S();G();
}
S();G();
</script></body></html>"""
  <div class="qd-canvas-wrap"><canvas id="qc" width="256" height="256"></canvas></div>
  <div class="qd-depth" id="qdl">SZINT 0 / 16</div>
  <div class="qd-darkness" id="qdd"></div>
  <div class="qd-card">
    <span class="qd-label">ELET </span><span class="qd-val" id="qh">100</span><span class="qd-label">/100</span>
    <span style="margin-left:12px" class="qd-label">TAM </span><span class="qd-val atk" id="qa">10</span>
    <span style="margin-left:12px" class="qd-label">VED </span><span class="qd-val def" id="qd">5</span>
  </div>
  <div class="qd-card enemy">
    <div class="qd-enemy-name" id="qen">ELLENSEG</div>
    <div class="qd-enemy-desc" id="qed"></div>
    <div class="qd-enemy-hp"><span class="qd-label">ELET </span><span class="qd-val" id="qeh">0</span></div>
    <div class="qd-hp-bar"><div class="qd-hp-fill" id="qeb" style="width:100%"></div></div>
  </div>
  <div class="qd-buttons">
    <button class="qd-btn atk" id="qba" onclick="A()">KVANTAL (-1+0+1)</button>
    <button class="qd-btn desc" id="qbd" onclick="D()" disabled>LEJJEBB</button>
  </div>
  <button class="qd-btn reset" onclick="R()">UJRAKEZDES</button>
  <div class="qd-log" id="qlg"></div>
</div>
<script>
var L=0,H=100,MH=100,T=10,V=5,EH=0,EN='',LG=[],GO=false,MC=null,MEH=0;
function P(m){LG.push('> '+m);if(LG.length>40)LG.shift();document.getElementById('qlg').innerHTML=LG.slice(-18).join('<br>');}
function XS(h,n){
  var M=0xFFFFFFFF,s=[0,0,0,0],r=new Float32Array(n);
  for(var i=0;i<4;i++)s[i]=(h[i*4]|(h[i*4+1]<<8)|(h[i*4+2]<<16)|(h[i*4+3]<<24))>>>0;
  for(var i=0;i<4;i++)if(s[i]===0)s[i]=((i+1)*2654435761)&M;
  for(var i=0;i<n;i++){
    var rr=(s[1]*5)&M,res=(((rr<<7)|(rr>>>25))&M)*9&M,t=(s[1]<<9)&M;
    s[2]^=s[0];s[3]^=s[1];s[1]^=s[2];s[0]^=s[3];s[2]^=t;
    s[3]=((s[3]<<11)|(s[3]>>>21))&M;r[i]=res/4294967295.0;
  }
  return r;
}
function BM(rng,off,n){
  var w=new Float32Array(n),j=0,i=0;
  while(i<n){
    var u=rng[off+(j%rng.length)],v=rng[off+((j+1)%rng.length)];j+=2;
    if(u<=0||v<=0)continue;
    var s=Math.sqrt(-2*Math.log(u));w[i]=s*Math.cos(2*Math.PI*v);i++;
    if(i<n){w[i]=s*Math.sin(2*Math.PI*v);i++;}
  }
  return w;
}
function QT(w,gs){
  var n=w.length,g=n/gs,c=new Int8Array(n);
  for(var gi=0;gi<g;gi++){
    var b=gi*gs,sum=0;
    for(var k=0;k<gs;k++)sum+=Math.abs(w[b+k]);
    var sc=Math.max(sum/gs,1e-7);
    for(var k=0;k<gs;k++){
      var sh=Math.round(Math.max(-1,Math.min(1,w[b+k]/sc)))+1;
      c[b+k]=Math.min(2,Math.max(0,sh));
    }
  }
  return c;
}
function GM(){
  if(!MC){var c=document.getElementById('qc'),ctx=c.getContext('2d');ctx.fillStyle='#070b16';ctx.fillRect(0,0,256,256);return;}
  var c=document.getElementById('qc'),ctx=c.getContext('2d');
  var px=4,dim=64,img=ctx.createImageData(256,256);
  var fade=Math.max(0.12,1.0-L*0.06);
  for(var i=0;i<dim;i++){
    for(var j=0;j<dim;j++){
      var idx=i*dim+j,val=MC[idx]-1,alpha=Math.floor(200*fade);
      var sx=j*px,sy=i*px;
      for(var y=0;y<px;y++){
        for(var x=0;x<px;x++){
          var pp=((sy+y)*256+(sx+x))*4;
          if(val===-1){img.data[pp]=255;img.data[pp+1]=71;img.data[pp+2]=71;img.data[pp+3]=alpha;}
          else if(val===1){img.data[pp]=255;img.data[pp+1]=215;img.data[pp+2]=0;img.data[pp+3]=alpha;}
          else{img.data[pp]=10;img.data[pp+1]=10;img.data[pp+2]=15;img.data[pp+3]=Math.max(8,Math.floor(alpha*0.18));}
        }
      }
    }
  }
  ctx.putImageData(img,0,0);
  var bar='';for(var k=0;k<16;k++)bar+=k<L?'\u2588':'\u2591';
  document.getElementById('qdd').textContent=bar;
  document.getElementById('qdl').textContent='SZINT '+L+' / 16';
}
var QS=""" + SEED + """;
function G(){
  var enc=new TextEncoder();
  crypto.subtle.digest('SHA-256',enc.encode(QS)).then(function(h){
    var hb=new Uint8Array(h),rng=XS(hb,300000);
    var off=L*64*64*4,weights=BM(rng,off,4096);
    MC=QT(weights,64);GM();
  });
}
var NM=['Bukott Suly','Zaj Demon','Gradiens Liderc','Overflow Lovag','Skala Boszorkany','Kerekitesi Hiba','Elojeles Arny','Relu Testor','Dropout Pap','Normalizalt Szellem','Tulcsordulas Herceg','Backprop Atok','Bias Demon','Sigmoid Testver','NaN Liderc'];
function S(){
  if(L>=16){
    EN='DIABLO \u2014 a NULLA URA';EH=MEH=666;
    P('\u2550\u2550\u2550 DIABLO MEGJELENT \u2550\u2550\u2550');
    P('"A matrixom orokke tart. A tied nem."');
  }else{
    EN=NM[L%15]+' ('+(L+1)+')';EH=MEH=32+L*16+Math.floor(Math.random()*18);
  }
  document.getElementById('qen').textContent=EN;
  document.getElementById('qeh').textContent=EH;
  document.getElementById('qed').textContent=L>=16?'A -1, 0, +1 Ura. Vegso konvergencia.':'szint '+L+' demona';
  var eb=document.getElementById('qeb');if(eb)eb.style.width='100%';
  document.getElementById('qba').disabled=false;
  document.getElementById('qbd').disabled=true;
}
function A(){
  if(GO||EH<=0)return;
  var dice=[],tot=0;
  for(var i=0;i<3;i++){var d=Math.floor(Math.random()*3)-1;dice.push(d);tot+=d;}
  var txt='kocka: ['+dice.join(' ')+'] = '+tot+' \u2192 ';
  var dmg=T+tot*3;if(dmg<1)dmg=1;
  var crit=dice[0]===dice[1]&&dice[1]===dice[2]&&dice[0]!==0;
  if(crit){dmg=Math.floor(dmg*2);txt+='KRITIKUS! ';}
  EH-=dmg;txt+='-'+dmg+' ELET';
  if(EH<0)EH=0;
  P(txt);
  document.getElementById('qeh').textContent=EH;
  var eb=document.getElementById('qeb');if(eb&&MEH>0)eb.style.width=Math.max(0,Math.floor(EH/MEH*100))+'%';
  G();
  if(EH<=0){
    P(EN+' ELPUSZTULT!');
    if(L>=16){P('\u2550\u2550\u2550 DIABLO LEGYOZVE \u2550\u2550\u2550');P('A matrix felszabadult. A nullak visszahuzodtak.');GO=true;P('NYERTEL.');}
    document.getElementById('qba').disabled=true;
    document.getElementById('qbd').disabled=L>=16;
    document.getElementById('qbd').textContent=L>=16?'VEGE':'LEJJEBB';
  }else{
    var eDmg=Math.max(1,4+L*2-Math.floor(Math.random()*V));
    H-=eDmg;if(H<0)H=0;
    P(EN+' visszatamad: -'+eDmg+' ELET');
    document.getElementById('qh').textContent=H;
    if(H<=0){GO=true;P('ELBUKTAL.');document.getElementById('qba').disabled=true;}
  }
}
function D(){
  if(EH>0||GO||L>=16)return;
  L++;H=Math.min(MH,H+18);T+=2;V+=1;
  document.getElementById('qh').textContent=H;
  document.getElementById('qa').textContent=T;
  document.getElementById('qd_elem').textContent=V;
  P('\u2550\u2550 LEERTEL A '+L+'. SZINTRE \u2550\u2550');
  S();G();
}
function R(){
  L=0;H=MH=100;T=10;V=5;EH=MEH=0;LG=[];GO=false;
  document.getElementById('qh').textContent=100;
  document.getElementById('qa').textContent=10;
  document.getElementById('qd_elem').textContent=5;
  document.getElementById('qlg').innerHTML='';
  document.getElementById('qba').disabled=false;
  document.getElementById('qbd').disabled=true;
  document.getElementById('qbd').textContent='LEJJEBB';
  var eb=document.getElementById('qeb');if(eb)eb.style.width='100%';
  P('UJ POKOLJARAS KEZDODIK...');
  S();G();
}
S();G();
</script></body></html>"""

with gr.Blocks(title="QUANTDIABLO", head='<meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no">') as demo:
    gr.HTML(GAME_HTML)
demo.launch()