*{box-sizing:border-box;-webkit-user-select:none;user-select:none;margin:0;padding:0}body{color:#fff;touch-action:none;background:linear-gradient(135deg,#1e0040,#001033);justify-content:center;align-items:center;width:100vw;height:100vh;font-family:Arial,sans-serif;display:flex;overflow:hidden}#app{background:url("data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"100%\" height=\"100%\" opacity=\"0.1\"><circle cx=\"50\" cy=\"50\" r=\"40\" fill=\"%23fff\"/></svg>") 50%/cover;flex-direction:column;width:100%;max-width:500px;height:100%;max-height:900px;display:flex;position:relative;overflow:hidden;box-shadow:0 0 20px #00000080}#hud{z-index:10;justify-content:space-between;align-items:center;height:15%;padding:20px;display:flex}.objective{background:#0006;border:2px solid #fc0;border-radius:20px;align-items:center;gap:10px;padding:10px 20px;font-size:24px;font-weight:700;display:flex;box-shadow:0 4px 10px #00000080}.objective-icon{border-radius:5px;width:30px;height:30px;display:inline-block;box-shadow:inset 0 2px 5px #ffffff80,0 2px 4px #00000080}.moves-container{text-shadow:1px 1px 2px #00000080;background:linear-gradient(#d4af37,#aa7815);border:4px solid #fff;border-radius:50%;flex-direction:column;justify-content:center;align-items:center;width:80px;height:80px;display:flex;box-shadow:0 4px 10px #00000080,inset 0 2px 10px #ffffff80}.moves-label{letter-spacing:1px;font-size:10px;font-weight:700}#moves-count{font-size:32px;font-weight:900;line-height:1}#danger-zone{background:#00000080;border-top:2px solid #555;border-bottom:2px solid #555;flex-direction:column;align-items:center;width:100%;height:80px;display:flex;position:relative;overflow:hidden;box-shadow:inset 0 0 10px #000c}#danger-rocks{z-index:2;text-shadow:0 5px 10px #000;font-size:40px;transition:transform .5s;position:absolute;top:-20px}#danger-character{z-index:1;filter:drop-shadow(0 4px 5px #000c);font-size:50px;transition:transform .5s,filter .5s;position:absolute;bottom:5px}.character-saved{animation:1s infinite alternate jumpJoy}.character-crushed{filter:grayscale();transform:scaleY(.2)translateY(50px)!important}@keyframes jumpJoy{0%{transform:translateY(0)}to{transform:translateY(-20px)}}#board-container{flex:1;justify-content:center;align-items:flex-start;min-height:0;padding:5px;display:flex;overflow:hidden}#game-board{background:#0000004d;border-radius:12px;flex-wrap:wrap;padding:8px;display:flex;position:relative;box-shadow:inset 0 0 20px #00000080,0 5px 15px #0006}.cell-bg{background:#ffffff1a;border-radius:8px;position:absolute}.block{cursor:pointer;z-index:2;border-radius:10px;transition:transform .2s cubic-bezier(.2,.8,.2,1);position:absolute;box-shadow:inset 0 4px 6px #fff9,0 3px 6px #0006,inset 0 -4px 6px #0003}.block:active{z-index:3;transform:scale(.9)}.red{background:linear-gradient(135deg,#ff4d4d,#c00)}.blue{background:linear-gradient(135deg,#4d94ff,#04c)}.green{background:linear-gradient(135deg,#4dff4d,#0c0)}.yellow{background:linear-gradient(135deg,#ffff4d,#cc0)}.purple{background:linear-gradient(135deg,#d24dff,#80c)}.hidden{pointer-events:none;display:none!important}#end-card{z-index:100;background:#000000d9;flex-direction:column;justify-content:center;align-items:center;animation:.5s ease-out forwards fadeIn;display:flex;position:absolute;inset:0}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}#end-card-title{color:#fc0;text-shadow:0 4px 10px #000c;text-align:center;margin-bottom:30px;font-size:48px;font-weight:900}#cta-button{color:#fff;cursor:pointer;text-shadow:1px 1px 2px #00000080;background:linear-gradient(#4dff4d,#0a0);border:4px solid #fff;border-radius:30px;padding:15px 40px;font-size:28px;font-weight:900;animation:1.5s infinite pulse;box-shadow:0 8px 20px #0009,inset 0 4px 10px #ffffff80}@keyframes pulse{0%{transform:scale(1)}50%{transform:scale(1.05)}to{transform:scale(1)}}#tutorial-overlay{z-index:50;pointer-events:none;position:absolute;inset:0}#tutorial-hand{filter:drop-shadow(0 4px 6px #00000080);background:url("data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"white\" stroke=\"black\" stroke-width=\"1\"><path d=\"M12 2A2 2 0 0 1 14 4V10.5C14 10.78 14.22 11 14.5 11H15.5C15.78 11 16 11.22 16 11.5V12.5C16 12.78 16.22 13 16.5 13H17.5C17.78 13 18 13.22 18 13.5V17.5C18 19.98 16.5 22 14.5 22H9.5C7.5 22 6 19.98 6 17.5V8A2 2 0 0 1 8 6C9.1 6 10 6.9 10 8V10.5C10 10.78 10.22 11 10.5 11H11.5C11.78 11 12 10.78 12 10.5V4A2 2 0 0 1 12 2Z\"/></svg>") 50%/contain no-repeat;width:50px;height:50px;position:absolute}
