*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}#root{width:100%;min-height:100vh}.jigsaw-puzzle{min-height:100vh;display:flex;justify-content:center;align-items:center;padding:20px;background:linear-gradient(135deg,#667eea,#764ba2)}.game-setup{background:#fff;padding:40px;border-radius:15px;box-shadow:0 10px 30px #0000004d;max-width:600px;width:100%}.game-setup h2{text-align:center;color:#333;margin-bottom:30px;font-size:28px}.setup-section{margin-bottom:30px}.setup-section label{display:block;font-weight:600;color:#555;margin-bottom:10px;font-size:16px}.difficulty-buttons{display:flex;gap:10px;flex-wrap:wrap}.difficulty-buttons button{flex:1;min-width:120px;padding:12px 20px;border:2px solid #ddd;background:#fff;border-radius:8px;cursor:pointer;font-size:14px;transition:all .3s}.difficulty-buttons button:hover{border-color:#667eea;background:#f0f4ff}.difficulty-buttons button.active{background:#667eea;color:#fff;border-color:#667eea}.image-selection{display:grid;grid-template-columns:repeat(3,1fr);gap:15px}.image-option{cursor:pointer;border:3px solid transparent;border-radius:8px;overflow:hidden;transition:all .3s;aspect-ratio:1}.image-option:hover{border-color:#667eea;transform:scale(1.05)}.image-option.selected{border-color:#667eea;box-shadow:0 0 15px #667eea80}.image-option img{width:100%;height:100%;object-fit:cover;display:block}.file-input{width:100%;padding:10px;border:2px dashed #ddd;border-radius:8px;cursor:pointer;font-size:14px}.custom-preview{margin-top:15px;border:3px solid #667eea;border-radius:8px;overflow:hidden;max-width:200px}.custom-preview img{width:100%;display:block}.start-button{width:100%;padding:15px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;border-radius:8px;font-size:18px;font-weight:600;cursor:pointer;transition:transform .2s}.start-button:hover{transform:translateY(-2px);box-shadow:0 5px 15px #667eea66}.game-container{background:#fff;padding:30px;border-radius:15px;box-shadow:0 10px 30px #0000004d;max-width:1400px;width:100%;position:relative}.game-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;flex-wrap:wrap;gap:10px}.game-header h2{color:#333;font-size:24px;margin:0}.timer{font-size:20px;font-weight:600;color:#667eea;padding:8px 16px;background:#f0f4ff;border-radius:8px}.solved-banner{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:10px 24px;background:linear-gradient(135deg,#4caf50,#2e7d32);color:#fff;padding:18px 24px;border-radius:12px;margin-bottom:20px;text-align:center;box-shadow:0 6px 20px #2e7d3259;animation:dropIn .5s ease-out}@keyframes dropIn{0%{transform:translateY(-20px);opacity:0}to{transform:translateY(0);opacity:1}}.solved-banner h2{color:#fff;font-size:26px;margin:0}.solved-banner p{color:#ffffffe6;font-size:16px;margin:0}.solve-time{font-size:28px;font-weight:700;color:#fff;margin:0}.play-again-btn{padding:12px 28px;background:#fff;color:#2e7d32;border:none;border-radius:8px;font-size:16px;font-weight:700;cursor:pointer;transition:transform .2s}.play-again-btn:hover{transform:translateY(-2px);box-shadow:0 5px 15px #00000040}.puzzle-layout{display:grid;grid-template-columns:260px auto 320px;gap:30px;margin-bottom:20px;align-items:start;justify-content:center}.reference-section,.grid-section,.tray-section{display:flex;flex-direction:column}.reference-section h3,.grid-section h3,.tray-section h3{color:#333;font-size:18px;margin-bottom:10px;text-align:center}.reference-image{border:3px solid #ddd;border-radius:8px;overflow:hidden;aspect-ratio:1;width:100%}.reference-image img{width:100%;height:100%;object-fit:cover;display:block}.puzzle-grid{display:grid;gap:0;background:#333;border:3px solid #333;border-radius:8px;width:var(--puzzle-size, 480px);height:var(--puzzle-size, 480px);margin:0 auto}.grid-slot{background:#f0f0f0;display:flex;align-items:center;justify-content:center;position:relative;transition:background .3s,box-shadow .3s;box-shadow:inset 0 0 0 1px #ffffff26;overflow:hidden;min-width:0;min-height:0}.grid-slot:hover{background:#e8f0ff}.grid-slot.correct{background:#e8f5e9}.puzzle-grid.solved{gap:0;background:transparent;border-color:transparent}.puzzle-grid.solved .grid-slot{box-shadow:none}.puzzle-piece{display:block;width:100%;height:100%;object-fit:fill;cursor:move;-webkit-user-select:none;user-select:none;transition:opacity .2s}.puzzle-piece:hover{opacity:.85}.puzzle-grid.solved .puzzle-piece{cursor:default}.pieces-tray{display:flex;flex-wrap:wrap;gap:10px;padding:15px;background:#f8f9fa;border:2px solid #ddd;border-radius:8px;min-height:300px;max-height:600px;overflow-y:auto;align-content:start;justify-content:center}.tray-piece{width:calc(var(--puzzle-size, 420px) / var(--grid-cols, 2));height:calc(var(--puzzle-size, 420px) / var(--grid-cols, 2));border:1px solid #ddd;border-radius:4px;overflow:hidden;cursor:move;transition:all .2s;background:#fff;flex:0 0 auto}.tray-piece img{object-fit:fill}.tray-piece:hover{border-color:#667eea;transform:scale(1.05);box-shadow:0 2px 8px #667eea4d}.tray-piece img{width:100%;height:100%;object-fit:cover;display:block}.controls{display:flex;gap:10px;justify-content:center}.controls button{padding:12px 24px;border:none;border-radius:8px;font-size:16px;font-weight:600;cursor:pointer;transition:all .3s;background:#667eea;color:#fff}.controls button:hover{transform:translateY(-2px);box-shadow:0 5px 15px #667eea66}@media(max-width:1200px){.puzzle-layout{grid-template-columns:1fr;gap:20px}.reference-section{order:1}.grid-section{order:2}.tray-section{order:3}.reference-image{max-width:300px;margin:0 auto}}@media(max-width:768px){.jigsaw-puzzle{padding:10px}.game-setup,.game-container{padding:20px}.image-selection{grid-template-columns:repeat(2,1fr)}.difficulty-buttons{flex-direction:column}.solved-banner{padding:16px}.solved-banner h2{font-size:22px}.solve-time{font-size:24px}}