+<style>
+  html,body{height:100%;margin:0}
+  body{display:flex;align-items:center;justify-content:center;background:#f8fafc;font-family:system-ui,-apple-system,Segoe UI,sans-serif;color:#0f172a}
+  #wrap{width:100%;max-width:340px;padding:1rem;text-align:center}
+  h2{margin:.1rem 0;font-size:.78rem;letter-spacing:.14em;text-transform:uppercase;color:#64748b}
+  #sub{font-size:.78rem;color:#C8765A;font-weight:700;margin-bottom:.6rem}
+  #grid{display:grid;grid-template-rows:repeat(6,1fr);gap:5px;width:228px;margin:0 auto .6rem}
+  .row{display:grid;grid-template-columns:repeat(5,1fr);gap:5px}
+  .tile{aspect-ratio:1;display:flex;align-items:center;justify-content:center;font-size:1.4rem;font-weight:700;text-transform:uppercase;border:2px solid #e2e8f0;border-radius:6px}
+  .tile.f{color:#fff;border:0}
+  .g{background:#6aaa64}.y{background:#c9b458}.b{background:#94a3b8}
+  #msg{min-height:1.2em;font-size:.9rem;font-weight:600;margin-bottom:.5rem;color:#334155}
+  #kb{display:flex;flex-direction:column;gap:5px}
+  .kr{display:flex;justify-content:center;gap:4px}
+  .key{flex:1;max-width:30px;height:44px;border:0;border-radius:5px;background:#e2e8f0;font-weight:700;font-size:.85rem;cursor:pointer;color:#0f172a;text-transform:uppercase}
+  .key.wide{max-width:48px;font-size:.62rem}
+  .key.g{background:#6aaa64;color:#fff}.key.y{background:#c9b458;color:#fff}.key.b{background:#94a3b8;color:#fff}
+</style>
+<div id="wrap">
+  <h2>Word Dash</h2>
+  <div id="sub">New word every day</div>
+  <div id="grid"></div>
+  <div id="msg">Guess the 5-letter word</div>
+  <div id="kb"></div>
+</div>
+<script>
+  var WORDS=["apple","beach","crane","dance","eagle","flame","grape","honey","ivory","jelly","koala","lemon","mango","noble","ocean","pearl","quilt","river","stone","tiger","ultra","vivid","whale","yacht","zebra","bread","cloud","dream","earth","fairy","ghost","heart","lucky","music","party","piano","plant","robot","smile","sugar"];
+  var day=Math.floor(Date.now()/86400000);
+  var target=WORDS[day%WORDS.length];
+  var rows=6,cols=5,cur="",row=0,done=false;
+  var grid=document.getElementById('grid');
+  for(var r=0;r<rows;r++){
+    var rowEl=document.createElement('div');rowEl.className='row';
+    for(var c=0;c<cols;c++){var t=document.createElement('div');t.className='tile';t.id='t'+r+'-'+c;rowEl.appendChild(t);}
+    grid.appendChild(rowEl);
+  }
+  var KB=[["q","w","e","r","t","y","u","i","o","p"],["a","s","d","f","g","h","j","k","l"],["enter","z","x","c","v","b","n","m","del"]];
+  var kb=document.getElementById('kb');
+  KB.forEach(function(line){
+    var kr=document.createElement('div');kr.className='kr';
+    line.forEach(function(k){
+      var b=document.createElement('button');
+      b.className='key'+((k==='enter'||k==='del')?' wide':'');
+      b.textContent=k;b.setAttribute('data-k',k);
+      b.onclick=function(){press(k);};
+      kr.appendChild(b);
+    });
+    kb.appendChild(kr);
+  });
+  function setMsg(s){document.getElementById('msg').textContent=s;}
+  function draw(){for(var c=0;c<cols;c++){document.getElementById('t'+row+'-'+c).textContent=cur[c]?cur[c]:'';}}
+  function press(k){
+    if(done)return;
+    if(k==='del'){cur=cur.slice(0,-1);draw();return;}
+    if(k==='enter'){submit();return;}
+    if(cur.length<cols){cur+=k;draw();}
+  }
+  function colorKey(letter,cls){
+    var key=document.querySelector('[data-k="'+letter+'"]');
+    if(!key)return;
+    if(key.classList.contains('g'))return;
+    if(cls==='y'&&key.classList.contains('y'))return;
+    if(cls==='b'&&(key.classList.contains('y')))return;
+    key.className='key '+cls;
+  }
+  function submit(){
+    if(cur.length<cols){setMsg('Not enough letters');return;}
+    var left={};
+    for(var i=0;i<cols;i++){left[target[i]]=(left[target[i]]||0)+1;}
+    var res=[];
+    for(var i=0;i<cols;i++){res.push('b');}
+    for(var i=0;i<cols;i++){if(cur[i]===target[i]){res[i]='g';left[cur[i]]--;}}
+    for(var i=0;i<cols;i++){if(res[i]!=='g'&&left[cur[i]]>0){res[i]='y';left[cur[i]]--;}}
+    for(var i=0;i<cols;i++){
+      var t=document.getElementById('t'+row+'-'+i);
+      t.textContent=cur[i];t.className='tile f '+res[i];
+      colorKey(cur[i],res[i]);
+    }
+    if(cur===target){done=true;setMsg('Got it in '+(row+1)+'! Come back tomorrow 🎉');return;}
+    row++;cur="";
+    if(row>=rows){done=true;setMsg('Out of guesses — it was ' + target.toUpperCase());}
+  }
+</script>