.tapdoku-game{display:flex;flex-direction:column;align-items:center;gap:15px;padding:15px 20px 20px;background:#f5f5f5;width:100%;max-width:800px;min-height:100vh;position:relative;box-sizing:border-box}.game-header{display:flex;justify-content:flex-start;align-items:center;width:100%;max-width:650px;padding:0 10px;box-sizing:border-box}.back-button{font-family:system-ui,-apple-system,sans-serif;font-size:14px;font-weight:600;padding:8px 16px;background:#fff;border:2px solid #ddd;border-radius:6px;color:#666;cursor:pointer;transition:all .2s;-webkit-tap-highlight-color:transparent}.back-button:hover{background:#667eea;border-color:#667eea;color:#fff}.back-button:active{transform:scale(.98)}.game-ui{display:flex;justify-content:space-between;align-items:center;width:100%;max-width:650px;padding:0 10px;box-sizing:border-box;gap:10px}.ui-text{font-family:system-ui,-apple-system,sans-serif;font-size:14px;font-weight:600;color:#666}.ui-progress{display:flex;align-items:center;gap:6px}.progress-bar{width:50px;height:6px;background:#e0e0e0;border-radius:3px;overflow:hidden}.progress-fill{height:100%;background:#4338ca;border-radius:3px;transition:width .3s ease}.grid-container{background:transparent;position:relative;box-sizing:border-box}.subgrid{background:#fff;border:2px solid #333;border-radius:10px;overflow:hidden;perspective:1000px}.cell{display:flex;align-items:center;justify-content:center;font-family:system-ui,-apple-system,sans-serif;color:#000;border:1px dashed rgba(0,0,0,.2);cursor:pointer;-webkit-user-select:none;user-select:none;-webkit-tap-highlight-color:transparent;transition:background-color .1s;box-sizing:border-box;position:relative;aspect-ratio:1;transform-style:preserve-3d}.cell-hidden{background-color:#fafafa}.cell-blocked{background-color:#f0f0f0}.cell-revealed{background-color:#fff}.cell-flagged{background-color:#ffd4d4}.cell-exploded{background-color:#ffb4b4}.cell-hinted{background-color:#90ee90!important;animation:pulse 1s ease-in-out infinite}.cell-selected{outline:3px solid #3b82f6!important;outline-offset:-3px;z-index:10}@keyframes pulse{0%,to{box-shadow:0 0 #4caf50b3}50%{box-shadow:0 0 0 10px #4caf5000}}@keyframes cardFlipReveal{0%{transform:rotateY(0) scale(1);box-shadow:none}45%{transform:rotateY(90deg) scale(1.03) translateZ(8px);box-shadow:0 8px 16px #00000026}50%{transform:rotateY(90deg) scale(1.03) translateZ(8px);box-shadow:0 8px 16px #00000026}to{transform:rotateY(0) scale(1);box-shadow:none}}@keyframes numberAppear{0%{opacity:0;transform:scale(.7)}to{opacity:1;transform:scale(1)}}@keyframes flagPlace{0%{transform:scale(.5) rotate(-45deg)}50%{transform:scale(1.2) rotate(10deg)}to{transform:scale(1) rotate(0)}}.cell-revealed{animation:cardFlipReveal .35s cubic-bezier(.4,0,.2,1)}.cell-revealed span{animation:numberAppear .15s ease-out .15s both}.cell-highlighted{background-color:#fffacd!important}.cell-flagged{animation:flagPlace .3s ease-out}.cell-exploded{animation:cardFlipReveal .3s cubic-bezier(.4,0,.2,1)}@keyframes gridShake{0%,to{transform:translate(0)}10%{transform:translate(-6px) rotate(-.5deg)}20%{transform:translate(6px) rotate(.5deg)}30%{transform:translate(-5px) rotate(-.3deg)}40%{transform:translate(5px) rotate(.3deg)}50%{transform:translate(-3px)}60%{transform:translate(3px)}70%{transform:translate(-2px)}80%{transform:translate(2px)}90%{transform:translate(-1px)}}.grid-container.shaking{animation:gridShake .4s ease-out}@keyframes numberComplete{0%{background-color:#fff;transform:scale(1)}30%{background-color:#90ee90;transform:scale(1.08)}to{background-color:#fff;transform:scale(1)}}.cell-celebrating{animation:numberComplete .6s ease-out!important;z-index:5}.confetti-particle{position:absolute;width:8px;height:8px;border-radius:2px;pointer-events:none;z-index:100;animation:confettiFall 1.5s ease-out forwards}@keyframes confettiFall{0%{transform:translate(-50%,-50%) scale(0) rotate(0);opacity:1}20%{transform:translate(-50%,-50%) scale(1.2) rotate(180deg);opacity:1}to{transform:translate(calc(-50% + var(--dx)),calc(-50% + var(--dy))) scale(.5) rotate(720deg);opacity:0}}.cell:hover{opacity:.9}.cell:active{opacity:.8}.message-area{min-height:40px;display:flex;align-items:center;justify-content:center;padding:8px;box-sizing:border-box}.message{font-family:system-ui,-apple-system,sans-serif;font-size:16px;font-weight:600;color:#333;background:#fff;padding:10px 20px;border-radius:8px;border:2px solid #4CAF50;box-shadow:0 2px 4px #0000001a;animation:slideIn .3s ease-out}@keyframes slideIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.game-controls{display:flex;justify-content:center;gap:10px;padding:8px}.help-button{font-family:system-ui,-apple-system,sans-serif;font-size:16px;font-weight:600;padding:12px 24px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;border-radius:8px;cursor:pointer;transition:all .2s;box-shadow:0 4px 6px #0000001a;position:relative;overflow:hidden}.help-button:hover{transform:translateY(-2px);box-shadow:0 6px 8px #00000026}.help-button:active{transform:translateY(0);box-shadow:0 2px 4px #0000001a}.help-button.disabled{background:linear-gradient(135deg,#9ca3af,#6b7280);cursor:not-allowed;opacity:.7}.help-button.disabled:hover{transform:none;box-shadow:0 4px 6px #0000001a}.cooldown-progress{position:absolute;top:0;left:0;height:100%;background:#fff3;transition:width .1s linear;border-radius:8px 0 0 8px}.button-text{position:relative;z-index:1}.hint-message{font-family:system-ui,-apple-system,sans-serif;font-size:15px;color:#333;background:linear-gradient(135deg,#90ee90,#76d67d);padding:12px 20px;border-radius:8px;border:2px solid #4CAF50;box-shadow:0 4px 8px #00000026;animation:slideIn .3s ease-out;text-align:center;max-width:600px}.hint-reason{font-size:13px;color:#2e5d2e;font-weight:400;display:block;margin-top:6px}.generating-puzzle{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px;padding:60px 20px;background:#f5f5f5;min-height:400px}.generating-spinner{width:50px;height:50px;border:4px solid rgba(102,126,234,.2);border-top-color:#667eea;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.generating-text{font-family:system-ui,-apple-system,sans-serif;font-size:18px;font-weight:600;color:#666}