@keyframes float-1{0%{transform:translate(0) rotate(0)}33%{transform:translate(30px,-50px) rotate(10deg)}66%{transform:translate(-20px,20px) rotate(-5deg)}to{transform:translate(0) rotate(0)}}@keyframes float-2{0%{transform:translate(0) rotate(0) scale(1)}50%{transform:translate(-40px,-40px) rotate(-20deg) scale(.9)}to{transform:translate(0) rotate(0) scale(1)}}@keyframes float-3{0%{transform:translate(0) rotate(0)}50%{transform:translate(50px,30px) rotate(15deg)}to{transform:translate(0) rotate(0)}}.app-background{background:radial-gradient(circle at 50% 30%,#252f44 0%,#111827 100%);min-height:100vh;color:#fff;margin:0;display:flex;flex-direction:column;position:relative;overflow:hidden;transition:background .3s,color .3s}.bg-particles{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:0;overflow:hidden}.particle{position:absolute;color:#ffffff0d;font-weight:700;-webkit-user-select:none;user-select:none;font-family:monospace}.grid-container{display:grid;margin:0 auto;position:relative;z-index:1}.cell-perspective{perspective:1000px}.grid-cell{background:rgba(30,41,59,.7);border:2px solid rgba(70,85,110,.5);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);border-radius:8px;aspect-ratio:1;display:flex;align-items:center;justify-content:center;font-weight:700;color:#f0f5fa;-webkit-user-select:none;user-select:none;backface-visibility:hidden;-webkit-backface-visibility:hidden;will-change:transform,background-color,border-color,box-shadow;transition:border-color .1s,background-color .1s,color .1s}.grid-cell.active{background:rgb(59,130,246);color:#fff;border-color:#3b82f6;box-shadow:0 0 15px #3b82f666}.grid-cell.partial{background:rgb(70,85,110);color:#dce1eb;border-color:#46556e}.grid-cell.absent{background:rgba(15,23,42,.6);color:#8c96aa;border-color:transparent}.grid-cell.empty{background:transparent;border:2px solid rgba(70,85,110,.5);color:#b4bed24d}.grid-cell.current{background:rgba(255,255,255,.05);border:2px solid rgba(180,190,210,.8);box-shadow:0 0 8px #ffffff1a}.keyboard-container{background:rgba(30,41,59,.9);border:1px solid rgba(70,85,110,.4);-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);border-radius:12px;padding:8px;width:100%;max-width:800px;margin:0 auto;position:relative;z-index:10}@media (min-width: 640px){.keyboard-container{padding:16px}}@media (max-height: 800px){.keyboard-container{padding:4px 8px}}.keyboard-row{display:flex;gap:4px;justify-content:center;margin-bottom:6px}@media (min-width: 640px){.keyboard-row{gap:6px}}@media (max-height: 800px){.keyboard-row{gap:4px;margin-bottom:4px}}.keyboard-row:last-child{margin-bottom:0}.key{background:rgb(58,70,92);border:1px solid rgba(80,95,120,.3);border-radius:6px;padding:0;color:#dce1eb;font-size:13px;font-weight:600;text-align:center;cursor:pointer;transition:all .1s;box-shadow:0 2px #0000004d;height:48px;display:flex;align-items:center;justify-content:center;flex:1;max-width:50px}@media (min-width: 640px){.key{font-size:14px;padding:12px 16px;height:auto;max-width:none;min-width:40px}}@media (min-width: 640px) and (max-height: 800px){.key{padding:0;height:36px;font-size:13px;min-width:36px}}.key:hover{background:rgb(68,80,102);transform:translateY(1px);box-shadow:0 1px #0000004d}.key:active{transform:translateY(2px);box-shadow:none}.key.active{background:rgb(59,130,246);color:#fff;border-color:#3b82f6;box-shadow:0 0 10px #3b82f666}.key.special{background:rgb(58,70,92);color:#f0f5fa;font-weight:700;flex:1.5;max-width:70px;font-size:11px}@media (min-width: 640px){.key.special{min-width:60px;max-width:none;font-size:13px}}@media (min-width: 640px) and (max-height: 800px){.key.special{font-size:11px;min-width:50px}}.key.correct{background:rgb(59,130,246);color:#fff;border-color:#3b82f6}.key.partial{background:rgb(130,145,165);color:#dce1eb}.key.incorrect{background:rgb(45,52,65);color:#8c96aa;opacity:.8;border-color:transparent;box-shadow:none}.theme-light.app-background{background:#ffffff;color:#1a1a1b}.theme-light .particle{color:#0000000d}.theme-light header{background:rgba(255,255,255,.9);border-bottom:1px solid #e5e7eb}.theme-light header .text-gray-400{color:#6b7280}.theme-light header .text-gray-400:hover{color:#111827}.theme-light .grid-cell{background:transparent;border-color:#d3d6da;color:#1a1a1b;box-shadow:none}.theme-light .grid-cell.empty{border-color:#d3d6da;background:transparent;color:#1a1a1b}.theme-light .grid-cell.current{border-color:#878a8c;background:transparent;box-shadow:none}.theme-light .grid-cell.absent{background:#787c7e;color:#fff;border-color:#787c7e}.theme-light .grid-cell.active,.theme-light .grid-cell.partial{color:#fff;box-shadow:none}.theme-light .keyboard-container{background:rgba(243,244,246,.9);border-color:#e5e7eb}.theme-light .key{background:#d3d6da;color:#1a1a1b;border-color:transparent;box-shadow:0 2px #00000026}.theme-light .key:hover{background:#c0c4c9}.theme-light .key.incorrect{background:#787c7e;color:#fff}.theme-light .key.special{background:#d3d6da;color:#1a1a1b}.theme-light .key.active,.theme-light .key.partial{color:#fff}.theme-light .modal-content{background:#ffffff;border:1px solid #e5e7eb;color:#1a1a1b;box-shadow:0 10px 15px -3px #0000001a}.theme-light .modal-close-button{color:#1a1a1b}.theme-light .modal-close-button:hover{color:#6b7280}.theme-light .text-white{color:#1a1a1b!important}.theme-light .text-gray-300{color:#4b5563!important}.theme-light .text-gray-400{color:#6b7280!important}.theme-light .text-gray-500{color:#9ca3af!important}.theme-light .bg-gray-800{background-color:#f3f4f6!important;border:1px solid #e5e7eb}.theme-light .bg-gray-900{background-color:#fff!important;border-color:#d1d5db}.theme-light .bg-\[rgba\(26\,35\,52\,0\.8\)\]{background-color:#f9fafb!important}.theme-light .bg-gray-700{background-color:#e5e7eb!important;color:#1a1a1b!important}.theme-light .bg-gray-700:hover{background-color:#d1d5db!important}.theme-light .stats-definition-content{color:#374151}@keyframes popHighlight{0%{transform:scale(.8);opacity:0;border-color:#b4bed280;box-shadow:0 0 #fff0}40%{transform:scale(1.1);opacity:1;border-color:#ffffffe6;box-shadow:0 0 15px #ffffff4d}to{transform:scale(1);border-color:#b4bed2cc;box-shadow:0 0 #fff0}}.animate-pop{animation:popHighlight .15s ease-out forwards}@keyframes flipIn{0%{transform:rotateX(0)}45%{transform:rotateX(-90deg)}55%{transform:rotateX(-90deg)}to{transform:rotateX(0)}}.animate-flip{animation:flipIn .6s ease-in-out;animation-fill-mode:backwards}@keyframes shake{10%,90%{transform:translate3d(-1px,0,0)}20%,80%{transform:translate3d(2px,0,0)}30%,50%,70%{transform:translate3d(-4px,0,0)}40%,60%{transform:translate3d(4px,0,0)}}.animate-shake{animation:shake .5s cubic-bezier(.36,.07,.19,.97) both}@keyframes wave{0%,to{transform:translateY(0);filter:brightness(1)}25%{transform:translateY(-15px);filter:brightness(1.3)}50%{transform:translateY(0);filter:brightness(1)}}.animate-wave{animation:wave .6s ease-in-out}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:rgb(50,62,84);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:rgb(70,85,110)}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:50;display:flex;align-items:center;justify-content:center;background-color:#0f172abf;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);padding:1rem;animation:fadeIn .2s ease-out}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.modal-content{background-color:#1e293b;border:1px solid rgba(70,85,110,.5);border-radius:16px;box-shadow:0 25px 50px -12px #00000080,0 0 0 1px #ffffff0d;padding:1.5rem;width:100%;position:relative;max-height:90vh;overflow-y:auto;animation:scaleIn .2s cubic-bezier(.16,1,.3,1)}@keyframes scaleIn{0%{transform:scale(.95);opacity:0}to{transform:scale(1);opacity:1}}.modal-close-button{position:absolute;top:.75rem;right:1rem;color:#8c96aa;font-size:1.5rem;line-height:2rem;z-index:10;background:transparent;border:none;cursor:pointer;transition:color .2s}.modal-close-button:hover{color:#fff}.btn-base{font-weight:700;padding:12px 16px;border-radius:8px;transition:all .2s;display:flex;align-items:center;justify-content:center;gap:.5rem;cursor:pointer;border:none;background:rgb(59,130,246);color:#fff;box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f}.btn-base:hover{background:rgb(37,99,235);transform:translateY(-1px);box-shadow:0 10px 15px -3px #0000001a,0 4px 6px -2px #0000000d}.btn-base:active{transform:translateY(0);box-shadow:0 2px 4px #0000001a}