.difficulty-btn{cursor:pointer;transition:all .3s ease;border:2px solid transparent}.difficulty-btn:hover{transform:translateY(-2px);box-shadow:0 4px 12px #00000026;border-color:#667eea}.difficulty-btn.selected{border-color:#667eea;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);color:#fff;transform:scale(1.05)}.difficulty-btn.selected .badge{background:#fff3!important;color:#fff!important}.difficulty-btn.selected .h6{color:#fff}#start-game-btn{background:linear-gradient(135deg,#28a745 0%,#20c997 100%);border:none;transition:all .3s ease}#start-game-btn:hover{background:linear-gradient(135deg,#218838 0%,#1ba085 100%);transform:translateY(-2px);box-shadow:0 6px 20px #28a74566}#game-settings-modal .modal-header{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);color:#fff;border-bottom:none}#game-settings-modal .modal-header .modal-title{font-weight:700}.hitofude-grid-container{display:flex;justify-content:center;margin:15px 0}.hitofude-grid{display:grid;gap:3px;width:320px;height:320px;background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);border:4px solid #5a67d8;border-radius:12px;padding:10px;box-shadow:0 4px 15px #0000004d;margin:0 auto;position:relative}.grid-cell{background:#f8f9fa;border:var(--cell-border-width,1px) solid #dee2e6;border-radius:8px;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .3s ease;position:relative;overflow:hidden;font-size:var(--cell-font-size,1.2rem);font-weight:700;color:#6c757d;user-select:none;touch-action:none}.grid-cell.block{background:linear-gradient(135deg,#fff 0%,#f8f9fa 100%);border:2px solid #667eea;box-shadow:0 2px 8px #0000001a;cursor:pointer}.grid-cell.block:hover{background:linear-gradient(135deg,#f8f9fa 0%,#e9ecef 100%);transform:scale(1.05);box-shadow:0 4px 12px #667eea4d}.grid-cell.start{background:linear-gradient(135deg,#28a745 0%,#20c997 100%);border:var(--cell-border-width,2px) solid #1e7e34;color:#fff;font-size:calc(var(--cell-font-size,1.2rem) * 1.17);box-shadow:0 4px 12px #28a74566;animation:startPulse 2s ease-in-out infinite}@keyframes startPulse{0%{transform:scale(1);box-shadow:0 4px 12px #28a74566}50%{transform:scale(1.05);box-shadow:0 6px 18px #28a74599}100%{transform:scale(1);box-shadow:0 4px 12px #28a74566}}.grid-cell.goal{background:linear-gradient(135deg,#ffc107 0%,#fd7e14 100%);border:var(--cell-border-width,2px) solid #e0a800;color:#fff;font-size:calc(var(--cell-font-size,1.2rem) * 1.17);box-shadow:0 4px 12px #ffc10766;animation:goalPulse 2s ease-in-out infinite}@keyframes goalPulse{0%{transform:scale(1);box-shadow:0 4px 12px #ffc10766}50%{transform:scale(1.05);box-shadow:0 6px 18px #ffc10799}100%{transform:scale(1);box-shadow:0 4px 12px #ffc10766}}.grid-cell.visited{background:linear-gradient(135deg,#6f42c1 0%,#495057 100%);border:2px solid #5a32a3;color:#fff;transition:background .2s ease,border-color .2s ease}.hitofude-grid.drawing .grid-cell{animation:none!important;transition:none!important}.hitofude-grid.drawing .grid-cell.visited{animation:none!important;transition:none!important}@keyframes visitedGlow{0%{transform:scale(1);box-shadow:0 0 0 0 #6f42c1cc}50%{transform:scale(1.1);box-shadow:0 0 0 10px #6f42c166}100%{transform:scale(1);box-shadow:0 0 0 0 #6f42c100}}.grid-cell.path{position:relative}.direction-indicator{position:absolute;background:#ffffffe6;box-shadow:0 0 4px #fff9;border-radius:2px;z-index:5}.direction-indicator.horizontal{height:3px;width:60%;top:50%;left:50%;transform:translate(-50%,-50%)}.direction-indicator.vertical{width:3px;height:60%;top:50%;left:50%;transform:translate(-50%,-50%)}.direction-indicator.from.horizontal.right{left:20%}.direction-indicator.from.horizontal.left{left:80%}.direction-indicator.from.vertical.down{top:20%}.direction-indicator.from.vertical.up{top:80%}.direction-indicator.to.horizontal.right{left:80%}.direction-indicator.to.horizontal.left{left:20%}.direction-indicator.to.vertical.down{top:80%}.direction-indicator.to.vertical.up{top:20%}.grid-cell.current{background:linear-gradient(135deg,#dc3545 0%,#c82333 100%);border:3px solid #bd2130;color:#fff;animation:currentPulse 1s ease-in-out infinite}@keyframes currentPulse{0%{transform:scale(1);box-shadow:0 0 0 0 #dc3545cc}50%{transform:scale(1.05);box-shadow:0 0 0 8px #dc35454d}100%{transform:scale(1);box-shadow:0 0 0 0 #dc354500}}.grid-cell.start.visited{background:linear-gradient(135deg,#155724 0%,#1e7e34 100%);border:3px solid #155724}.grid-cell.goal.visited{background:linear-gradient(135deg,#b8860b 0%,#daa520 100%);border:3px solid #b8860b;animation:goalClear 1s ease-in-out infinite}@keyframes goalClear{0%{transform:scale(1);box-shadow:0 0 0 0 #daa520cc}50%{transform:scale(1.1);box-shadow:0 0 0 12px #daa5204d}100%{transform:scale(1);box-shadow:0 0 0 0 #daa52000}}.grid-cell:not(.block){background:transparent;border:none;cursor:default;pointer-events:none}.grid-cell.block{-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.status-text{font-size:1.1rem;font-weight:500;color:#495057;text-align:center;margin:15px 0;padding:10px;background:#6c757d1a;border-radius:8px;border:1px solid #6c757d33}.hitofude-stats{color:#667eea}.stat-number.hitofude-stats{color:#667eea}.hitofude-grid.clear-effect{animation:clearPulse 2s ease-in-out infinite}@keyframes clearPulse{0%{transform:scale(1);box-shadow:0 4px 15px #0000004d}50%{transform:scale(1.02);box-shadow:0 6px 25px #28a74599 0 0 40px #28a74566}100%{transform:scale(1);box-shadow:0 4px 15px #0000004d}}.hitofude-grid.paused{opacity:.9;filter:brightness(0.9)}.hitofude-grid.paused .grid-cell{pointer-events:none}.path-line{position:absolute;background:linear-gradient(90deg,#667eea,#764ba2);height:3px;border-radius:2px;pointer-events:none;z-index:10}.grid-cell.backtrack-highlight{animation:backtrackHighlight .5s ease-out}@keyframes backtrackHighlight{0%{background:linear-gradient(135deg,#ffc107 0%,#fd7e14 100%);transform:scale(1.1)}100%{transform:scale(1)}}.btn-difficulty{background:linear-gradient(135deg,#667eea 0%,#764ba2 100%);border:none;color:#fff;transition:all .3s ease}.btn-difficulty:hover{background:linear-gradient(135deg,#5a67d8 0%,#6c5ce7 100%);transform:translateY(-2px);box-shadow:0 4px 12px #667eea4d}.hitofude-grid[style*="grid-template-columns: repeat(7"]{width:350px;height:350px;gap:1px;padding:8px}@media (max-width: 768px){.hitofude-grid{width:min(320px,90vw);height:min(320px,90vw);padding:8px;gap:2px}.hitofude-grid[style*="grid-template-columns: repeat(7"]{width:min(320px,90vw);height:min(320px,90vw);gap:1px;padding:6px}.grid-cell{font-size:var(--cell-font-size,1.1rem);border-radius:6px}.grid-cell.start,.grid-cell.goal{font-size:calc(var(--cell-font-size,1.1rem) * 1.17)}.status-text{font-size:1rem;margin:12px 0;padding:8px}.grid-cell.block{min-height:45px;min-width:45px}.difficulty-btn{margin-bottom:10px}.difficulty-btn .h5{font-size:1.1rem}.difficulty-btn .h6{font-size:.9rem}.difficulty-btn .badge{font-size:.7rem}}@media (max-width: 480px){.hitofude-grid{width:min(280px,85vw);height:min(280px,85vw);padding:6px;gap:var(--grid-gap,1px);border-width:3px}.hitofude-grid[style*="grid-template-columns: repeat(7"]{width:min(300px,90vw);height:min(300px,90vw);gap:1px;padding:5px}.grid-cell{font-size:var(--cell-font-size,1rem);border-radius:4px;border-width:var(--cell-border-width,1px)}.grid-cell.start,.grid-cell.goal{font-size:calc(var(--cell-font-size,1rem) * 1.17);border-width:var(--cell-border-width,2px)}.status-text{font-size:.9rem;margin:10px 0;padding:6px}.hitofude-grid-container{margin:10px 0}.grid-cell.block{min-height:40px;min-width:40px}.grid-cell.path::after{width:3px;height:3px}}@media (min-resolution: 2dppx){.hitofude-grid{border-width:2px}.grid-cell{border-width:1px}.grid-cell.start,.grid-cell.goal,.grid-cell.current{border-width:2px}}@media (hover: none) and (pointer: coarse){.grid-cell.block:hover{background:linear-gradient(135deg,#fff 0%,#f8f9fa 100%);transform:none;box-shadow:0 2px 8px #0000001a}.grid-cell.block:active{background:linear-gradient(135deg,#e9ecef 0%,#dee2e6 100%);transform:scale(0.95)}}@media (prefers-reduced-motion: reduce){.grid-cell,.hitofude-grid,.status-text{animation:none!important;transition:none!important}.grid-cell.start,.grid-cell.goal,.grid-cell.current{animation:none!important}}@media (prefers-color-scheme: dark){.grid-cell{background:#343a40;border-color:#495057;color:#f8f9fa}.grid-cell.block{background:linear-gradient(135deg,#495057 0%,#343a40 100%);border-color:#667eea}.status-text{background:#f8f9fa1a;border-color:#f8f9fa33;color:#f8f9fa}}