:root{--color-primary-50:#f5f6ff;--color-primary-100:#eef1ff;--color-primary-300:#818cf8;--color-primary-400:#6366f1;--color-primary-500:#4f46e5;--color-primary-600:#8b5cf6;--color-primary-700:#5a28c7;--color-primary-800:#5b21b6;--color-success-500:#10b981;--color-danger-500:#ef4444;--color-bg-main:#121826;--color-bg-card:#111827;--color-bg-surface:#1f2937;--color-text-primary:#f9fafb;--color-text-secondary:#d1d5db;--color-text-muted:#9ca3af;--color-border:#374151;--color-stats-bg:#064e3b;--color-stats-border:#065f46;--color-stats-text:#34d399;--font-family-base:"Segoe UI",Tahoma,Geneva,Verdana,sans-serif;--line-height-base:1.6;--spacing-0:0;--spacing-1:.25rem;--spacing-2:.5rem;--spacing-4:1rem;--spacing-8:2rem}*{margin:var(--spacing-0);padding:var(--spacing-0);box-sizing:border-box}body{font-family:var(--font-family-base);background-color:var(--color-bg-main);color:var(--color-text-primary);line-height:var(--line-height-base)}.placeholder{text-align:center;background-color:#1f2937;border-radius:.75rem;padding:3rem}.placeholder-icon{background-color:#2d3748;border-radius:.5rem;justify-content:center;align-items:center;width:120px;height:120px;margin:1.5rem auto;font-size:2.5rem;display:flex}.game-header{margin-bottom:var(--spacing-8);justify-content:space-between;align-items:center;display:flex}.back-button{color:var(--color-text-primary);cursor:pointer;background-color:var(--color-bg-surface);padding:var(--spacing-2)var(--spacing-4);border:none;border-radius:9999px;font-size:.875rem;transition:background-color .2s}.back-button:hover{background-color:var(--color-border)}.game-clock{color:silver;padding:0 1.5rem;font-size:1.5rem;font-weight:700}.move-counter{background-color:var(--color-bg-surface);color:var(--color-text-secondary);padding:var(--spacing-2)var(--spacing-4);border-radius:9999px;font-size:.875rem}#solver-container{flex-direction:column;align-items:center;display:flex}.puzzle-card{cursor:pointer;background-color:var(--color-bg-surface);border:1px solid var(--color-border);border-radius:.75rem;width:auto;transition:transform .3s,box-shadow .3s;overflow:hidden}.puzzle-card:hover{transform:scale(1.03);box-shadow:0 10px 25px #0003}#puzzle-thumbnail{object-fit:cover;max-width:100%;max-height:100%}.puzzle-details{padding:var(--spacing-4)}.puzzle-meta{color:var(--color-text-muted);justify-content:space-between;font-size:.875rem;display:flex}.credits{color:var(--color-text-muted);font-weight:500;text-decoration:none}.credits:hover{color:var(--color-text-primary);cursor:pointer;text-decoration:underline}.checkmark{color:var(--color-text-primary);display:inline-flex}.puzzles-grid{grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:1.5rem;display:grid}.loading-spinner{border:5px solid var(--color-text-secondary);border-top-color:var(--color-primary-500);border-radius:50%;width:50px;height:50px;animation:1s linear infinite spin;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}@keyframes spin{0%{transform:translate(-50%,-50%)rotate(0)}to{transform:translate(-50%,-50%)rotate(360deg)}}canvas{touch-action:none;width:100%;max-width:640px;height:100%;max-height:480px;display:block}.game-container{flex-direction:column;align-items:center;display:flex}.puzzle-board{background-color:var(--color-bg-surface);margin-bottom:var(--spacing-4);border-radius:.1rem;padding:.15rem;position:relative;overflow:hidden}.game-actions{justify-content:center;align-items:center;gap:var(--spacing-4);flex-wrap:wrap;display:flex}.step-description{color:#fff;pointer-events:none;background:#000000b3;border-radius:.5rem;padding:.5rem 1rem;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.step1:before{content:"";clip-path:polygon(0% 0%,100% 0%,100% 100%,0% 100%,0% 0%,.15rem .15rem,.15rem 25.25%,50% 25.25%,50% .15rem,.15rem .15rem);pointer-events:none;background-color:#1d1d1dc3;width:100%;height:100%;position:absolute;top:0;left:0}#hand-pointer{pointer-events:none;z-index:1;width:25%;animation:1.5s ease-in-out infinite step1-movePointer;position:absolute;top:10%;left:4%}.focus-box{pointer-events:none;background:#ffffff0d;position:absolute;box-shadow:0 0 3px 2px #000,0 0 3px 2px #fff}.box1{width:calc(25% - .15rem);height:calc(25% - .15rem);animation:1.5s ease-in-out infinite step1-movePointer;top:.15rem;left:.15rem}.box2{width:calc(25% - .15rem);height:calc(25% - .15rem);top:.15rem;left:calc(25% + .15rem)}@keyframes step1-movePointer{0%{transform:translate(0)}to{transform:translate(100%)}}.step2 .small-box1{width:21%;height:95%;animation:3s ease-in-out infinite step2-smallmovePointer;top:2.5%;left:2.5%}.step2 .big-box1{width:69.5%;height:95%;animation:3s ease-in-out infinite step2-movePointer;top:2.5%;left:27.5%}.step2 .small-box2{width:21%;height:95%;animation:3s ease-in-out infinite step2-smallmovePointer;top:2.5%;left:102%}@keyframes step2-movePointer{0%{transform:translate(0%)}25%{transform:translate(0%)}50%{transform:translate(-35%)}to{transform:translate(-35%)}}@keyframes step2-smallmovePointer{0%{transform:translate(0%)}25%{transform:translate(0%)}50%{transform:translate(-120%)}to{transform:translate(-120%)}}@keyframes glow-pulse{0%,to{opacity:.5;transform:scale(.9);box-shadow:0 0 #efefef1a}50%{opacity:1;transform:scale(1.15);box-shadow:0 0 10px #efefefe6}}.flicker-button{animation:1.2s ease-in-out infinite glow-pulse}.step3 .small-box1{width:95%;height:21%;animation:3s ease-in-out infinite step3-smallmovePointer;top:2.5%;left:2.5%}.step3 .big-box1{width:95%;height:69.5%;animation:3s ease-in-out infinite step3-movePointer;top:27.5%;left:2.5%}.step3 .small-box2{width:95%;height:21%;animation:3s ease-in-out infinite step3-smallmovePointer;top:102%;left:2.5%}@keyframes step3-movePointer{0%{transform:translate(0%)}25%{transform:translate(0%)}50%{transform:translateY(-35%)}to{transform:translateY(-35%)}}@keyframes step3-smallmovePointer{0%{transform:translate(0%)}25%{transform:translate(0%)}50%{transform:translateY(-120%)}to{transform:translateY(-120%)}}.toast-container{top:var(--spacing-4);right:var(--spacing-4);margin-left:var(--spacing-4);flex-direction:column;gap:10px;display:flex;position:fixed}.error-toast{background-color:var(--color-danger-500);padding:var(--spacing-4);border-radius:var(--spacing-2);animation:.3s ease-out fadeIn;position:relative}.fade-out{animation:.3s ease-out fadeOut}.error-close-btn{top:var(--spacing-2);right:var(--spacing-2);color:var(--color-text-primary);cursor:pointer;padding:var(--spacing-1);background:0 0;border:none;font-size:1.25rem;position:absolute}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes fadeOut{0%{opacity:1}to{opacity:0}}.modal{background-color:var(--color-bg-surface);border:1px solid var(--color-border);border-radius:16px;width:90%;max-width:480px;animation:.3s ease-out slideIn;position:fixed;top:30vh;left:50%;overflow:hidden;transform:translate(-50%);box-shadow:0 20px 25px -5px #0000004d,0 10px 10px -5px #0003}.modal-header{background-color:var(--color-stats-bg);color:#fff;padding:1.5rem;position:relative}.modal-title{letter-spacing:-.025em;margin-right:24px;font-size:1.5rem;font-weight:700}.close-button{cursor:pointer;color:#fff;background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;width:28px;height:28px;font-size:1.5rem;line-height:1;transition:background-color .2s;display:flex;position:absolute;top:1.25rem;right:1.25rem}.close-button:hover{background-color:#fff3}.modal-content{padding:1.5rem}.stats-grid{grid-template-columns:1fr 1fr;gap:1.5rem;margin-bottom:1.5rem;display:grid}.stat-card{background-color:var(--color-bg-card);border:1px solid var(--color-border);border-radius:12px;padding:1rem;transition:transform .2s,box-shadow .2s;box-shadow:0 1px 3px #0003}.stat-card:hover{border-color:var(--color-primary-300);transform:translateY(-2px);box-shadow:0 4px 6px #0000004d}.stat-title{color:var(--color-text-muted);margin-bottom:.5rem;font-size:.875rem;font-weight:500}.stat-value{color:var(--color-text-primary);align-items:center;font-size:1.5rem;font-weight:700;display:flex}.new-value{background-color:var(--color-success-500);color:#fff;border-radius:9999px;align-items:center;margin-left:.5rem;padding:.25rem .5rem;font-size:.75rem;font-weight:600;display:inline-flex}.rank{color:var(--color-primary-300);margin-top:.25rem;font-size:.875rem;font-weight:600}.divider{background-color:var(--color-border);height:1px;margin:1.5rem 0}.new-stats{grid-template-columns:1fr 1fr;gap:1rem;margin-bottom:1.5rem;display:grid}.new-stat{background-color:var(--color-stats-bg);border:1px solid var(--color-stats-border);border-radius:8px;padding:.75rem}.new-stat-title{color:var(--color-stats-text);margin-bottom:.25rem;font-size:.75rem;font-weight:600}.new-stat-value{color:var(--color-text-primary);font-size:1.25rem;font-weight:700}.badge{background:var(--color-primary-300);color:#fff;border-radius:50%;justify-content:center;align-items:center;width:22px;height:22px;font-size:.75rem;font-weight:600;display:inline-flex}@keyframes slideIn{0%{opacity:0;transform:translate(-50%)translateY(20px)}to{opacity:1;transform:translate(-50%)translateY(0)}}.modal{transition:transform .3s,box-shadow .3s}.modal:hover{transform:translate(-50%)translateY(-3px);box-shadow:0 25px 50px -12px #0006}.icon{width:18px;height:18px}.stat-card:hover .stat-value{text-shadow:0 0 8px #6366f14d}header{text-align:center;margin-bottom:3rem}header h1{color:#a78bfa;margin-bottom:var(--spacing-2);letter-spacing:1px;font-size:2.5rem;font-weight:800}header p{color:#9ca3af;font-size:var(--spacing-4)}.container{max-width:1200px;padding:var(--spacing-8);margin:0 auto}.button-group{gap:1rem;display:flex}.button{cursor:pointer;border:none;border-radius:8px;flex:1;justify-content:center;align-items:center;gap:.5rem;padding:.75rem 1rem;font-size:.875rem;font-weight:600;transition:all .2s;display:flex}.primary-button{background-color:var(--color-primary-400);color:#fff}.primary-button:hover{background-color:var(--color-primary-500);border-color:var(--color-text-muted)}.secondary-button{background-color:var(--color-bg-card);border:1px solid var(--color-border);color:var(--color-text-primary)}.secondary-button:hover{border-color:var(--color-text-muted);background-color:#1e293b}.action-button{background-color:var(--color-bg-surface);color:#fff;border-radius:var(--spacing-2);cursor:pointer;border:none;padding:.75rem 1.5rem;font-weight:500;transition:background-color .2s}.action-button:hover{background-color:var(--color-border)}.action-button.inactive{color:#e5e7eb;opacity:.7;background-color:#6b7280}.action-button.inactive:hover{background-color:#6b7280}.action-button.primary{background-color:#7c3aed}.action-button.primary:hover{background-color:var(--color-primary-600)}.action-button.primary.inactive{background-color:var(--color-primary-700);color:#ddd6fe}.action-button.primary.inactive:hover{background-color:var(--color-primary-700)}.hidden{display:none}@media (width<=768px){.puzzles-grid{padding:var(--spacing-2);grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}.game-header{gap:var(--spacing-4);flex-direction:column;align-items:flex-start}.move-counter{margin-top:-3.5rem;margin-right:var(--spacing-4);align-self:flex-end}.container{padding:var(--spacing-8)var(--spacing-0)}.back-button{margin-left:var(--spacing-2)}}
/*# sourceMappingURL=index.12f17eb0.css.map */