:root{--primary-color: #667eea;--secondary-color: #4facfe;--background-color: #f8fafc;--text-color: #2d3748;--text-muted-color: #64748b;--border-color: #e9ecef;--danger-color: #ef4444;--gradient-primary: linear-gradient(135deg, #667eea 0%, #764ba2 100%);--gradient-secondary: linear-gradient(135deg, #f093fb 0%, #f5576c 100%);--gradient-background: linear-gradient(135deg, #667eea 0%, #764ba2 50%, #f093fb 100%);--header-bg-color: #f8f9fa;--hover-bg-color: #f5f5f5;--chip-bg-color: #e9ecef;--chip-hover-bg-color: #dee2e6;--chip-hover-border-color: #e9ecef;--active-filters-bg-color: #f8f9fa}*{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth}body{font-size:16px;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;color:#2d3748;background-color:#f8fafc;display:flex;align-items:center;min-height:100vh;position:relative;overflow-x:hidden}h1,h2,h3,h4,h5,h6{font-weight:700;color:#1e293b;text-align:center}h1{font-size:2.5em;font-weight:800}h2{font-size:1.5em;font-weight:700}button{padding:16px 32px;border:none;border-radius:12px;font-size:16px;cursor:pointer;transition:background-color .4s,transform .25s;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif}input{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif}p{margin:16px 0;line-height:1.6}ul,ol{list-style-position:inside}a{color:#667eea;text-decoration:none;transition:all .25s cubic-bezier(.4,0,.2,1)}a:hover{color:#5568d3;text-decoration:underline}::selection{background:#667eea;color:#fff}::-moz-selection{background:#667eea;color:#fff}*:focus-visible{outline:3px solid #667eea;outline-offset:2px}@keyframes flip{0%{transform:rotateY(0) scale(1)}50%{transform:rotateY(90deg) scale(1.1)}to{transform:rotateY(0) scale(1)}}@keyframes bounceIn{0%{opacity:0;transform:scale(.3) translateY(-50px)}50%{opacity:1;transform:scale(1.05)}70%{transform:scale(.9)}to{transform:scale(1) translateY(0)}}@keyframes pulse{0%,to{transform:scale(1);box-shadow:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -1px rgba(0,0,0,.06)}50%{transform:scale(1.05);box-shadow:0 0 20px rgba(102,126,234,.4)}}@keyframes shake{0%,to{transform:translate(0)}10%,30%,50%,70%,90%{transform:translate(-5px)}20%,40%,60%,80%{transform:translate(5px)}}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}@keyframes glowPulse{0%,to{box-shadow:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -1px rgba(0,0,0,.06)}50%{box-shadow:0 0 20px rgba(102,126,234,.4)}}@keyframes slideInFromTop{0%{opacity:0;transform:translateY(-30px)}to{opacity:1;transform:translateY(0)}}@keyframes slideInFromBottom{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes scaleIn{0%{opacity:0;transform:scale(.5)}to{opacity:1;transform:scale(1)}}@keyframes rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes highlight-hint{0%,to{background-color:inherit;transform:scale(1)}50%{background-color:#fbbf24;transform:scale(1.1)}}@keyframes shimmer{0%{background-position:-1000px 0}to{background-position:1000px 0}}@keyframes celebrate{0%,to{transform:scale(1) rotate(0)}25%{transform:scale(1.2) rotate(-5deg)}75%{transform:scale(1.2) rotate(5deg)}}@keyframes gradientShift{0%{background-position:0% 50%}50%{background-position:100% 50%}to{background-position:0% 50%}}@keyframes pop{0%{transform:scale(0);opacity:0}50%{transform:scale(1.1)}to{transform:scale(1);opacity:1}}@keyframes wiggle{0%,to{transform:rotate(0)}25%{transform:rotate(-3deg)}75%{transform:rotate(3deg)}}@keyframes breathe{0%,to{transform:scale(1)}50%{transform:scale(1.03)}}@keyframes slideAndFade{0%{opacity:0;transform:translate(-20px)}to{opacity:1;transform:translate(0)}}@keyframes rainbow{0%{filter:hue-rotate(0deg)}to{filter:hue-rotate(360deg)}}@keyframes confettiFall{0%{transform:translateY(0) translate(0) rotate(0);opacity:1}to{transform:translateY(100vh) translate(var(--drift, 0)) rotate(720deg);opacity:0}}@keyframes fireworkExplode{0%{transform:translate(0) scale(1);opacity:1}to{transform:translate(var(--vx),var(--vy)) scale(0);opacity:0}}.confetti-piece{position:fixed;width:10px;height:10px;border-radius:50%;pointer-events:none;z-index:9999;animation:confettiFall linear forwards}.firework-particle{position:fixed;width:6px;height:6px;border-radius:50%;pointer-events:none;z-index:9999;animation:fireworkExplode 1s ease-out forwards}.animate-bounce-in{animation:bounceIn .6s cubic-bezier(.68,-.55,.265,1.55) both}.animate-pulse{animation:pulse 1s cubic-bezier(.4,0,.2,1) infinite}.animate-shake{animation:shake .4s cubic-bezier(.4,0,.2,1)}.animate-float{animation:float 3s ease-in-out infinite}.animate-fade-in{animation:fadeIn .4s cubic-bezier(.4,0,.2,1) both}.animate-slide-in-top{animation:slideInFromTop .4s cubic-bezier(.4,0,.2,1) both}.animate-slide-in-bottom{animation:slideInFromBottom .4s cubic-bezier(.4,0,.2,1) both}.animate-scale-in{animation:scaleIn .4s cubic-bezier(.68,-.55,.265,1.55) both}.animate-flip{animation:flip .6s cubic-bezier(.4,0,.2,1) both}.animate-pop{animation:pop .4s cubic-bezier(.68,-.55,.265,1.55) both}.animate-celebrate{animation:celebrate .6s cubic-bezier(.68,-.55,.265,1.55) both}body{margin:0;padding:0;min-height:100vh;background:linear-gradient(-45deg,#667eea,#764ba2,#f093fb,#4facfe);background-size:400% 400%;animation:gradientShift 15s ease infinite;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;overflow-x:hidden}body:before{content:"";position:fixed;top:0;left:0;width:100%;height:100%;background-image:radial-gradient(circle at 20% 50%,rgba(255,255,255,.1) 0%,transparent 50%),radial-gradient(circle at 80% 80%,rgba(255,255,255,.1) 0%,transparent 50%),radial-gradient(circle at 40% 20%,rgba(255,255,255,.05) 0%,transparent 50%);animation:float 20s ease-in-out infinite;pointer-events:none;z-index:0}.outerWrapper{max-width:1000px;margin:0 auto;width:100%;box-sizing:border-box;display:flex;flex-direction:column;justify-content:center;align-items:center;position:relative;z-index:1;text-align:center;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;padding:32px 24px;animation:fadeIn .6s cubic-bezier(.4,0,.2,1)}.outerWrapper:before{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:90%;max-width:900px;height:95%;background:rgba(255,255,255,.1);backdrop-filter:blur(10px);border-radius:24px;z-index:-1;box-shadow:0 25px 50px -12px rgba(0,0,0,.25)}.gameMeta{display:flex;flex-direction:row;justify-content:center;align-items:center;width:100%;flex-wrap:wrap;gap:32px;animation:slideInFromTop .6s cubic-bezier(.4,0,.2,1) .2s both}.leftMeta{display:flex;flex-direction:column;justify-content:center;align-items:center;width:100%;text-align:center;background:rgba(255,255,255,.95);padding:32px;border-radius:16px;box-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -2px rgba(0,0,0,.05);transition:all .4s cubic-bezier(.4,0,.2,1)}.leftMeta:hover{transform:translateY(-4px);box-shadow:0 20px 25px -5px rgba(0,0,0,.1),0 10px 10px -5px rgba(0,0,0,.04)}.wrapper{margin:48px auto;display:flex;flex-direction:column;justify-content:center;align-items:center;width:100%;animation:slideInFromBottom .6s cubic-bezier(.4,0,.2,1) .4s both}.outerWrapper>*{animation-fill-mode:both}.outerWrapper>*:nth-child(1){animation-delay:.1s}.outerWrapper>*:nth-child(2){animation-delay:.2s}.outerWrapper>*:nth-child(3){animation-delay:.3s}.outerWrapper>*:nth-child(4){animation-delay:.4s}.outerWrapper>*:nth-child(5){animation-delay:.5s}@media screen and (max-width: 768px){body:before{animation:float 15s ease-in-out infinite}.outerWrapper{padding:24px}.outerWrapper:before{width:95%;height:98%}.gameMeta{flex-direction:column;align-items:center}.leftMeta{width:100%;text-align:center;padding:24px}}@media screen and (max-width: 480px){body{background-size:600% 600%}.outerWrapper,.leftMeta{padding:16px}h1{font-size:1.8em}}#gameHeader{font-size:2.5em;font-weight:800;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:32px;animation:slideInFromTop .6s cubic-bezier(.68,-.55,.265,1.55);text-shadow:0 2px 10px rgba(102,126,234,.3);letter-spacing:-1px;position:relative}#gameHeader:after{content:"✨";position:absolute;right:-40px;top:50%;transform:translateY(-50%);font-size:.6em;animation:wiggle 2s ease-in-out infinite}.wordLengthInputContainer{margin-bottom:24px}.wordLengthInputContainer p{font-size:16px;font-weight:500;color:#2d3748;margin-bottom:12px}.wordLengthInputContainer #wordLengthInput{width:80px;padding:16px 24px;text-align:center;font-size:1.5em;font-weight:700;margin:12px;border:3px solid transparent;border-radius:12px;background:linear-gradient(#fff,#fff) padding-box,linear-gradient(135deg,#667eea,#764ba2) border-box;box-shadow:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -1px rgba(0,0,0,.06);transition:all .4s cubic-bezier(.4,0,.2,1);color:#2d3748;-moz-appearance:textfield;-webkit-appearance:textfield;appearance:textfield}.wordLengthInputContainer #wordLengthInput:focus{outline:none;transform:scale(1.05);box-shadow:0 0 20px rgba(102,126,234,.4);animation:pulse 1s cubic-bezier(.4,0,.2,1) infinite}.wordLengthInputContainer #wordLengthInput:hover{transform:translateY(-2px);box-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -2px rgba(0,0,0,.05)}.wordLengthInputContainer #wordLengthInput::-webkit-outer-spin-button,.wordLengthInputContainer #wordLengthInput::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}#startGame{background:linear-gradient(135deg,#667eea,#764ba2);border:none;border-radius:12px;padding:16px 32px;margin-top:24px;font-size:1.5em;font-weight:700;color:#fff;box-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -2px rgba(0,0,0,.05);transition:all .4s cubic-bezier(.4,0,.2,1);cursor:pointer;position:relative;overflow:hidden}#startGame:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.3),transparent);transition:left .6s cubic-bezier(.4,0,.2,1)}#startGame:hover{transform:translateY(-3px) scale(1.02);box-shadow:0 20px 25px -5px rgba(0,0,0,.1),0 10px 10px -5px rgba(0,0,0,.04),0 0 20px rgba(102,126,234,.4)}#startGame:hover:before{left:100%}#startGame:active{transform:translateY(-1px) scale(.98)}.actionButtons{display:flex;align-items:center;justify-content:center;gap:24px;flex-wrap:wrap;margin-bottom:24px}.actionButtons .btn-primary{background:linear-gradient(135deg,#667eea,#764ba2);border:none;border-radius:12px;padding:16px 32px;font-size:16px;font-weight:600;color:#fff;box-shadow:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -1px rgba(0,0,0,.06);transition:all .4s cubic-bezier(.4,0,.2,1);cursor:pointer;position:relative;overflow:hidden}.actionButtons .btn-primary:before{content:"";position:absolute;top:50%;left:50%;width:0;height:0;border-radius:50%;background:rgba(255,255,255,.3);transform:translate(-50%,-50%);transition:width .4s,height .4s}.actionButtons .btn-primary:hover{transform:translateY(-2px);box-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -2px rgba(0,0,0,.05)}.actionButtons .btn-primary:hover:before{width:300px;height:300px}.actionButtons .btn-primary:active{transform:translateY(0)}.timerDifficultyInfo{display:flex;align-items:center;justify-content:space-around;margin:32px 0 0;width:100%;max-width:600px;gap:24px}.timerDifficultyInfo #timerDisplay,.timerDifficultyInfo #difficulty{text-align:center;font-size:1.3em;font-weight:700;padding:12px 24px;border-radius:12px;background:rgba(255,255,255,.9);box-shadow:0 1px 2px rgba(0,0,0,.05);display:none;animation:pop .4s cubic-bezier(.68,-.55,.265,1.55)}.timerDifficultyInfo #timerDisplay{color:#667eea;border:2px solid #667eea}.timerDifficultyInfo #difficulty{color:#f093fb;border:2px solid #f093fb}.wordRow{border:none;background:rgba(255,255,255,.95);padding:16px;margin:12px 0;text-align:center;border-radius:12px;box-shadow:0 1px 2px rgba(0,0,0,.05);transition:all .4s cubic-bezier(.4,0,.2,1);animation:slideInFromBottom .4s cubic-bezier(.4,0,.2,1) both}.wordRow:hover{box-shadow:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -1px rgba(0,0,0,.06);transform:translateY(-2px)}.wordLetterBox{border:2px solid #1a202c;padding:8px;margin:12px;background-color:#fff;width:3em;height:3em;text-align:center;font-size:1.2em;line-height:1.8em;text-transform:uppercase;touch-action:manipulation;-webkit-appearance:none;appearance:none;display:inline-flex;justify-content:center;align-items:center;font-weight:700;border:3px solid #e2e8f0;transition:all .4s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden}.wordLetterBox:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.5),transparent);transition:left .6s}.wordLetterBox:focus{border-color:#667eea;box-shadow:0 0 0 3px rgba(102,126,234,.2);transform:scale(1.05)}.wordLetterBox.contains{background:#fbbf24;color:#fff;border-color:#fbbf24;box-shadow:0 4px 12px rgba(251,191,36,.4);animation:flip .6s cubic-bezier(.4,0,.2,1) both}.wordLetterBox.contains:before{left:100%}.wordLetterBox.notContains{background:#ef4444;color:#fff;border-color:#ef4444;box-shadow:0 4px 12px rgba(239,68,68,.4);animation:flip .6s cubic-bezier(.4,0,.2,1) both}.wordLetterBox.notContains:before{left:100%}.wordLetterBox.correct{background:#10b981;color:#fff;border-color:#10b981;box-shadow:0 4px 12px rgba(16,185,129,.4);animation:flip .6s cubic-bezier(.4,0,.2,1) both,celebrate .6s cubic-bezier(.68,-.55,.265,1.55) .3s both}.wordLetterBox.correct:before{left:100%}.wordLetterBox.hint-provided{animation:highlight-hint 1s cubic-bezier(.4,0,.2,1)}#alphabetContainer{border:2px solid #e2e8f0;background-color:#fff;margin:32px auto;width:100%;max-width:650px;background:rgba(255,255,255,.95);border-radius:16px;box-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -2px rgba(0,0,0,.05);padding:32px;display:none;flex-direction:column;align-items:center}#alphabetContainer.visible{display:flex;animation:scaleIn .6s cubic-bezier(.68,-.55,.265,1.55)}#alphabetContainer .alphabet-label{font-weight:700;font-size:1.1rem;margin-bottom:24px;color:#2d3748;text-align:center;text-transform:uppercase;letter-spacing:1px}#alphabetContainer .alphabet-grid{display:grid;grid-template-columns:repeat(7,1fr);grid-template-rows:repeat(4,1fr);gap:12px;width:100%;max-width:550px;margin:0 auto}#alphabetContainer .alphabet-grid .letter-spacer{visibility:hidden}#alphabetContainer .alphabet-grid span{border:3px solid #e2e8f0;border-radius:8px;padding:16px;text-align:center;text-transform:uppercase;font-weight:700;font-size:1rem;transition:all .4s cubic-bezier(.4,0,.2,1);display:flex;align-items:center;justify-content:center;cursor:default;aspect-ratio:1/1;min-width:40px;min-height:40px;box-shadow:0 1px 2px rgba(0,0,0,.05);position:relative;overflow:hidden}#alphabetContainer .alphabet-grid span:before{content:"";position:absolute;top:-50%;left:-50%;width:200%;height:200%;background:linear-gradient(45deg,transparent,rgba(255,255,255,.3),transparent);transform:rotate(45deg);transition:all .6s}#alphabetContainer .alphabet-grid span.notGuessed{background:linear-gradient(135deg,#f7fafc,#fff);color:#2d3748;border-color:#e2e8f0}#alphabetContainer .alphabet-grid span.notGuessed:hover:before{left:100%}#alphabetContainer .alphabet-grid span.correct{background:#10b981;color:#fff;border-color:#10b981;box-shadow:0 4px 12px rgba(16,185,129,.4);animation:pop .4s cubic-bezier(.68,-.55,.265,1.55)}#alphabetContainer .alphabet-grid span.notContains{background:#ef4444;color:#fff;border-color:#ef4444;box-shadow:0 4px 12px rgba(239,68,68,.4);animation:pop .4s cubic-bezier(.68,-.55,.265,1.55)}#alphabetContainer .alphabet-grid span.contains{background:#fbbf24;color:#fff;border-color:#fbbf24;box-shadow:0 4px 12px rgba(251,191,36,.4);animation:pop .4s cubic-bezier(.68,-.55,.265,1.55)}#resetGame{display:none;width:180px;align-self:center;background:linear-gradient(135deg,#ee0979,#ff6a00);padding:16px 32px;border:none;border-radius:12px;color:#fff;font-size:16px;font-weight:700;cursor:pointer;box-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -2px rgba(0,0,0,.05);transition:all .4s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden}#resetGame:before{content:"";position:absolute;top:50%;left:50%;width:0;height:0;border-radius:50%;background:rgba(255,255,255,.3);transform:translate(-50%,-50%);transition:width .4s,height .4s}#resetGame:hover{transform:translateY(-3px) scale(1.05);box-shadow:0 20px 25px -5px rgba(0,0,0,.1),0 10px 10px -5px rgba(0,0,0,.04)}#resetGame:hover:before{width:300px;height:300px}#resetGame:active{transform:translateY(-1px) scale(.98)}.wrapper .wordRow:nth-child(1){animation-delay:.1s}.wrapper .wordRow:nth-child(2){animation-delay:.2s}.wrapper .wordRow:nth-child(3){animation-delay:.3s}.wrapper .wordRow:nth-child(4){animation-delay:.4s}.wrapper .wordRow:nth-child(5){animation-delay:.5s}.wrapper .wordRow:nth-child(6){animation-delay:.6s}.wrapper .wordRow:nth-child(7){animation-delay:.7s}.wrapper .wordRow:nth-child(8){animation-delay:.8s}.wrapper .wordRow:nth-child(9){animation-delay:.9s}.wrapper .wordRow:nth-child(10){animation-delay:1s}@media screen and (max-width: 768px){#gameHeader{font-size:2em}#gameHeader:after{font-size:.5em;right:-30px}#alphabetContainer{padding:24px}#alphabetContainer .alphabet-grid{gap:8px}#alphabetContainer .alphabet-grid span{padding:12px;font-size:.9em;min-width:36px;min-height:36px}.wordLetterBox{width:2.5em;height:2.5em;margin:4px}}@media screen and (max-width: 480px){#gameHeader{font-size:1.8em}#gameHeader:after{display:none}#wordLengthInput,#startGame{font-size:1.2em}#alphabetContainer{padding:16px}#alphabetContainer .alphabet-label{font-size:.9em;margin-bottom:16px}#alphabetContainer .alphabet-grid{gap:4px}#alphabetContainer .alphabet-grid span{padding:8px;font-size:.8em;min-width:32px;min-height:32px}.wordLetterBox{width:2.5em;height:2.5em;margin:4px;padding:4px}.timerDifficultyInfo{flex-direction:column;gap:12px}.timerDifficultyInfo #timerDisplay,.timerDifficultyInfo #difficulty{font-size:1.1em}}.modal{position:fixed;z-index:1;left:0;top:0;width:100%;height:100%;overflow:auto;background-color:rgba(26,32,44,.85);display:flex;align-items:center;display:none;backdrop-filter:blur(8px);animation:fadeIn .4s cubic-bezier(.4,0,.2,1)}.modal.show{display:flex}.modal-content{background-color:#fff;margin:auto;padding:32px;border:2px solid #888;width:90%;max-width:500px;text-align:center;position:relative;display:flex;flex-direction:column;justify-content:center;align-items:center;max-width:650px;background:rgba(255,255,255,.98);backdrop-filter:blur(20px);border-radius:16px;box-shadow:0 25px 50px -12px rgba(0,0,0,.25);animation:scaleIn .6s cubic-bezier(.68,-.55,.265,1.55);border:2px solid rgba(255,255,255,.5)}.how-to-play-btn{padding:16px 32px;border:none;font-size:16px;cursor:pointer;transition:background-color .4s,transform .25s;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;margin:16px auto;display:block;border-radius:12px;box-shadow:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -1px rgba(0,0,0,.06);transition:all .4s cubic-bezier(.4,0,.2,1)}.how-to-play-btn:hover:not(:disabled){transform:translateY(-2px)}.how-to-play-btn:active:not(:disabled){transform:translateY(0)}.how-to-play-btn:hover{transform:translateY(-2px);box-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -2px rgba(0,0,0,.05)}.how-to-play-content{text-align:left;width:90%;max-width:750px}.how-to-play-content h2{font-weight:700;color:#1e293b;margin-bottom:24px;width:100%;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;font-weight:800;text-align:center}.rules-container{max-height:60vh;overflow-y:auto;padding-right:16px;width:100%}.rules-container::-webkit-scrollbar{width:10px}.rules-container::-webkit-scrollbar-track{background:#f7fafc;border-radius:8px}.rules-container::-webkit-scrollbar-thumb{background:linear-gradient(135deg,#667eea,#764ba2);border-radius:8px}.rules-container::-webkit-scrollbar-thumb:hover{opacity:.8}.rules-container ol,.rules-container ul{margin-left:24px}.rules-container ol li,.rules-container ul li{margin-bottom:16px;line-height:1.6;font-size:16px;animation:slideAndFade .4s cubic-bezier(.4,0,.2,1) both}.rules-container ol li:nth-child(1),.rules-container ul li:nth-child(1){animation-delay:.05s}.rules-container ol li:nth-child(2),.rules-container ul li:nth-child(2){animation-delay:.1s}.rules-container ol li:nth-child(3),.rules-container ul li:nth-child(3){animation-delay:.15s}.rules-container ol li:nth-child(4),.rules-container ul li:nth-child(4){animation-delay:.2s}.rules-container ol li:nth-child(5),.rules-container ul li:nth-child(5){animation-delay:.25s}.rules-container ol li:nth-child(6),.rules-container ul li:nth-child(6){animation-delay:.3s}.rules-container ol li:nth-child(7),.rules-container ul li:nth-child(7){animation-delay:.35s}.rules-container ol li:nth-child(8),.rules-container ul li:nth-child(8){animation-delay:.4s}.rules-container ol li:nth-child(9),.rules-container ul li:nth-child(9){animation-delay:.45s}.rules-container ol li:nth-child(10),.rules-container ul li:nth-child(10){animation-delay:.5s}.rules-container ul{margin-top:12px}.stats-content{text-align:left;width:90%;max-width:650px}.stats-content h2{font-weight:700;color:#1e293b;margin-bottom:24px;text-align:center;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;font-weight:800}.stats-container{max-height:70vh;overflow-y:auto;padding:16px}.stats-container .no-stats{text-align:center;color:#64748b;font-style:italic;padding:32px;font-size:1.1em}.stats-container .stats-list{list-style:none;padding:0;margin:0}.stats-container .stat-item{background:linear-gradient(135deg,rgba(255,255,255,.9),rgba(248,250,252,.9));border-radius:12px;padding:24px;margin-bottom:16px;box-shadow:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -1px rgba(0,0,0,.06);transition:all .4s cubic-bezier(.4,0,.2,1);animation:slideInFromBottom .4s cubic-bezier(.4,0,.2,1) both;border:2px solid transparent}.stats-container .stat-item:nth-child(1){animation-delay:.05s}.stats-container .stat-item:nth-child(2){animation-delay:.1s}.stats-container .stat-item:nth-child(3){animation-delay:.15s}.stats-container .stat-item:nth-child(4){animation-delay:.2s}.stats-container .stat-item:nth-child(5){animation-delay:.25s}.stats-container .stat-item:nth-child(6){animation-delay:.3s}.stats-container .stat-item:nth-child(7){animation-delay:.35s}.stats-container .stat-item:nth-child(8){animation-delay:.4s}.stats-container .stat-item:nth-child(9){animation-delay:.45s}.stats-container .stat-item:nth-child(10){animation-delay:.5s}.stats-container .stat-item:nth-child(11){animation-delay:.55s}.stats-container .stat-item:nth-child(12){animation-delay:.6s}.stats-container .stat-item:nth-child(13){animation-delay:.65s}.stats-container .stat-item:nth-child(14){animation-delay:.7s}.stats-container .stat-item:nth-child(15){animation-delay:.75s}.stats-container .stat-item:nth-child(16){animation-delay:.8s}.stats-container .stat-item:nth-child(17){animation-delay:.85s}.stats-container .stat-item:nth-child(18){animation-delay:.9s}.stats-container .stat-item:nth-child(19){animation-delay:.95s}.stats-container .stat-item:nth-child(20){animation-delay:1s}.stats-container .stat-item:hover{transform:translateY(-4px) scale(1.02);box-shadow:0 20px 25px -5px rgba(0,0,0,.1),0 10px 10px -5px rgba(0,0,0,.04);border-color:#667eea}.stats-container .stat-item .stat-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.stats-container .stat-item .stat-header .stat-rank{font-weight:700;background:linear-gradient(135deg,#667eea,#764ba2);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;font-size:1.2em}.stats-container .stat-item .stat-header .stat-time{font-weight:700;color:#2d3748;font-size:1.1em}.stats-container .stat-item .stat-details{display:flex;justify-content:space-between;color:#64748b;font-size:.95em}.stats-container::-webkit-scrollbar{width:10px}.stats-container::-webkit-scrollbar-track{background:#f7fafc;border-radius:8px}.stats-container::-webkit-scrollbar-thumb{background:linear-gradient(135deg,#667eea,#764ba2);border-radius:8px}.stats-container::-webkit-scrollbar-thumb:hover{opacity:.8}.stats-container .green-highlight{background:#10b981;color:#fff;padding:4px 12px;border-radius:8px;font-weight:600}.stats-container .orange-highlight{background:#fbbf24;color:#fff;padding:4px 12px;border-radius:8px;font-weight:600}.stats-container .grey-highlight{background:#ef4444;color:#fff;padding:4px 12px;border-radius:8px;font-weight:600}.close{color:#64748b;float:right;font-size:32px;font-weight:700;position:absolute;top:16px;right:24px;line-height:1;width:40px;height:40px;display:flex;align-items:center;justify-content:center;border-radius:50%;transition:all .25s cubic-bezier(.4,0,.2,1);background:rgba(0,0,0,.05)}.close:hover,.close:focus{color:#ef4444;background:rgba(239,68,68,.1);transform:rotate(90deg) scale(1.1);text-decoration:none;cursor:pointer}.alert-buttons{display:flex;justify-content:center;gap:24px;margin-top:24px;flex-wrap:wrap}#alertTryAgainButton{padding:16px 32px;border:none;border-radius:12px;color:#fff;font-size:16px;font-weight:700;cursor:pointer;transition:all .4s cubic-bezier(.4,0,.2,1);background:linear-gradient(135deg,#667eea,#764ba2);box-shadow:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -1px rgba(0,0,0,.06);position:relative;overflow:hidden}#alertTryAgainButton:before{content:"";position:absolute;top:50%;left:50%;width:0;height:0;border-radius:50%;background:rgba(255,255,255,.3);transform:translate(-50%,-50%);transition:width .4s,height .4s}#alertTryAgainButton:hover{transform:translateY(-2px);box-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -2px rgba(0,0,0,.05)}#alertTryAgainButton:hover:before{width:300px;height:300px}#alertResetButton{padding:16px 32px;border:none;border-radius:12px;color:#fff;font-size:16px;font-weight:700;cursor:pointer;transition:all .4s cubic-bezier(.4,0,.2,1);background:linear-gradient(135deg,#11998e,#38ef7d);box-shadow:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -1px rgba(0,0,0,.06);position:relative;overflow:hidden}#alertResetButton:before{content:"";position:absolute;top:50%;left:50%;width:0;height:0;border-radius:50%;background:rgba(255,255,255,.3);transform:translate(-50%,-50%);transition:width .4s,height .4s}#alertResetButton:hover{transform:translateY(-2px);box-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -2px rgba(0,0,0,.05)}#alertResetButton:hover:before{width:300px;height:300px}.invalid-word-alert,.success-alert,.failure-alert{text-align:center;padding:32px;border-radius:16px;margin-bottom:24px;animation:bounceIn .6s cubic-bezier(.68,-.55,.265,1.55)}.invalid-word-alert .alert-icon,.success-alert .alert-icon,.failure-alert .alert-icon{font-size:3rem;display:block;margin-bottom:16px;animation:wiggle 1s ease-in-out infinite}.invalid-word-alert h3,.success-alert h3,.failure-alert h3{margin:16px 0;font-size:1.5em;font-weight:800}.invalid-word-alert p,.success-alert p,.failure-alert p{margin:12px 0;font-size:16px;line-height:1.6}.invalid-word-alert p strong,.success-alert p strong,.failure-alert p strong{font-weight:700}.invalid-word-alert{background:linear-gradient(135deg,#fff5f5,#ffe5e5);border:3px solid #ef4444;box-shadow:0 0 20px rgba(239,68,68,.3)}.invalid-word-alert h3{color:#ef4444}.invalid-word-alert .alert-icon{filter:drop-shadow(0 4px 8px rgba(239,68,68,.3))}.success-alert{background:linear-gradient(135deg,#f0fdf4,#dcfce7);border:3px solid #10b981;box-shadow:0 0 20px rgba(16,185,129,.3);animation:bounceIn .6s cubic-bezier(.68,-.55,.265,1.55),rainbow 3s linear infinite}.success-alert h3{color:#10b981}.success-alert .alert-icon{filter:drop-shadow(0 4px 8px rgba(16,185,129,.3));animation:celebrate .6s cubic-bezier(.68,-.55,.265,1.55) infinite}.failure-alert{background:linear-gradient(135deg,#fffbeb,#fef3c7);border:3px solid #f59e0b;box-shadow:0 0 20px rgba(245,158,11,.3)}.failure-alert h3{color:#d97706}.failure-alert .alert-icon{filter:drop-shadow(0 4px 8px rgba(245,158,11,.3))}@media screen and (max-width: 480px){.modal-content{width:95%;padding:32px 16px}.how-to-play-btn{width:90%;font-size:16px;padding:16px}.rules-container{max-height:70vh}.close{font-size:28px;width:36px;height:36px;right:16px}.invalid-word-alert,.success-alert,.failure-alert{padding:24px}.invalid-word-alert .alert-icon,.success-alert .alert-icon,.failure-alert .alert-icon{font-size:2.5rem}.invalid-word-alert h3,.success-alert h3,.failure-alert h3{font-size:1.2em}.invalid-word-alert p,.success-alert p,.failure-alert p{font-size:.9em}.alert-buttons{gap:16px}.alert-buttons button{padding:12px 24px;font-size:.9em}}#statsList{text-align:center;font-size:16px;margin:20px auto;padding:10px;background-color:#add8e6;border:1px solid blue;display:block;max-height:600px;overflow-y:auto;scrollbar-width:thin;width:100%;max-width:600px;border-radius:5px}.stats-table{width:100%;background:var(--background-color);border-radius:8px;overflow:hidden;box-shadow:0 2px 8px rgba(0,0,0,.1)}.stats-header{display:grid;grid-template-columns:.5fr 1fr 1fr 1fr;background:var(--header-bg-color);position:sticky;top:0;z-index:1}.header-cell{display:flex;align-items:center;height:48px;padding:0 12px;font-weight:600;cursor:pointer;user-select:none;transition:background-color .3s ease}.header-cell:hover{background-color:var(--hover-bg-color)}.header-cell .header-content{flex:1}.stats-body{transition:opacity .3s ease}.stat-row{display:grid;grid-template-columns:.5fr 1fr 1fr 1fr;height:40px;border-bottom:1px solid var(--border-color);animation:fadeIn .5s ease forwards;transition:background-color .3s ease}.stat-row:hover{background-color:var(--hover-bg-color)}.stat-row:last-child{border-bottom:none}.stat-cell{display:flex;align-items:center;justify-content:center;padding:0 12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@media (max-width: 768px){.stats-header,.stat-row{grid-template-columns:.3fr 1fr .8fr .8fr}.header-cell,.stat-cell{padding:0 8px}}.hint-button{position:relative;padding:16px 32px;border:none;border-radius:12px;font-size:16px;font-weight:700;cursor:pointer;transition:all .4s cubic-bezier(.4,0,.2,1);overflow:hidden;min-width:160px;box-shadow:0 4px 6px -1px rgba(0,0,0,.1),0 2px 4px -1px rgba(0,0,0,.06)}.hint-button:before{content:"";position:absolute;top:50%;left:50%;width:0;height:0;border-radius:50%;background:rgba(255,255,255,.3);transform:translate(-50%,-50%);transition:width .4s,height .4s}.hint-button:hover:not(:disabled){transform:translateY(-3px) scale(1.03);box-shadow:0 10px 15px -3px rgba(0,0,0,.1),0 4px 6px -2px rgba(0,0,0,.05)}.hint-button:hover:not(:disabled):before{width:300px;height:300px}.hint-button:active:not(:disabled){transform:translateY(-1px) scale(.98)}.hint-button:disabled{opacity:.6;cursor:not-allowed;transform:none}.hint-button.cooldown{background:linear-gradient(135deg,#64748b,#e2e8f0);animation:breathe 2s ease-in-out infinite}.letter-hint{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.letter-hint:hover:not(:disabled){box-shadow:0 20px 25px -5px rgba(0,0,0,.1),0 10px 10px -5px rgba(0,0,0,.04),0 0 20px rgba(102,126,234,.4)}.letter-hint:disabled{background:linear-gradient(135deg,#c0caf6,#a6b0e8)}.position-hint{background:linear-gradient(135deg,#f093fb,#f5576c);color:#fff}.position-hint:hover:not(:disabled){box-shadow:0 20px 25px -5px rgba(0,0,0,.1),0 10px 10px -5px rgba(0,0,0,.04),0 0 20px rgba(79,172,254,.4)}.position-hint:disabled{background:linear-gradient(135deg,#b4dcff,#66cbff)}.inactive-hint{opacity:.5;cursor:not-allowed;pointer-events:none}.cooldown-progress{position:absolute;bottom:0;left:0;height:5px;background:linear-gradient(135deg,#11998e,#38ef7d);width:0%;transition:width .05s linear;box-shadow:0 0 10px rgba(16,185,129,.5);border-radius:0 0 12px 12px}.hint-provided{animation:highlight-hint 1s ease-in-out}.includesHintButtons{animation:slideInFromBottom .4s cubic-bezier(.4,0,.2,1) .3s both}.includesHintButtons .hint-button:nth-child(1){animation:pop .4s cubic-bezier(.68,-.55,.265,1.55) .1s both}.includesHintButtons .hint-button:nth-child(2){animation:pop .4s cubic-bezier(.68,-.55,.265,1.55) .2s both}.includesHintButtons .hint-button:nth-child(3){animation:pop .4s cubic-bezier(.68,-.55,.265,1.55) .3s both}.includesHintButtons .hint-button:nth-child(4){animation:pop .4s cubic-bezier(.68,-.55,.265,1.55) .4s both}.includesHintButtons .hint-button:nth-child(5){animation:pop .4s cubic-bezier(.68,-.55,.265,1.55) .5s both}.sort-indicator{position:relative;width:16px;height:16px;margin-left:8px;transition:transform .3s ease}.sort-indicator:before,.sort-indicator:after{content:"";position:absolute;left:50%;width:8px;height:2px;background-color:var(--text-color);border-radius:1px;transition:all .3s ease}.sort-indicator--default:before,.sort-indicator--default:after{width:2px;height:2px;border-radius:50%;background-color:var(--text-muted-color)}.sort-indicator--default:before{top:3px;transform:translate(-50%)}.sort-indicator--default:after{top:7px;transform:translate(-50%)}.sort-indicator--default:before{content:"";top:11px;transform:translate(-50%)}.sort-indicator--asc:before{top:8px;transform:translate(-50%) rotate(-45deg);transform-origin:center}.sort-indicator--asc:after{top:8px;transform:translate(-50%) rotate(45deg);transform-origin:center}.sort-indicator--desc:before{top:8px;transform:translate(-50%) rotate(45deg);transform-origin:center}.sort-indicator--desc:after{top:8px;transform:translate(-50%) rotate(-45deg);transform-origin:center}.header-cell:hover .sort-indicator--default:before,.header-cell:hover .sort-indicator--default:after{background-color:var(--text-color)}.header-cell[data-active=true] .sort-indicator:before,.header-cell[data-active=true] .sort-indicator:after{background-color:var(--primary-color)}.filter-panel{background:var(--background-color);border-radius:12px;padding:16px;margin-bottom:16px;box-shadow:0 2px 5px rgba(26,32,44,.1);border:1px solid var(--border-color);position:relative}.filter-panel:before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--primary-color),var(--secondary-color));border-radius:12px 12px 0 0;opacity:0;transition:opacity .4s}.filter-panel.has-active-filters:before{opacity:1}.filter-section+.filter-section{margin-top:16px;padding-top:16px;border-top:1px solid var(--border-color)}.filter-section h3{margin:0 0 12px;font-size:.9em;color:var(--text-muted-color)}.filter-chips{display:flex;flex-wrap:wrap;gap:12px}.filter-chip{height:32px;padding:0 16px;border-radius:16px;background:var(--chip-bg-color);border:1px solid var(--border-color);cursor:pointer;user-select:none;transition:all .4s ease;display:flex;align-items:center;font-size:.9em;font-weight:500;position:relative;overflow:hidden}.filter-chip:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.3),transparent);transition:left .6s ease}.filter-chip:hover{background:var(--chip-hover-bg-color);border-color:var(--chip-hover-border-color);transform:translateY(-1px);box-shadow:0 2px 8px rgba(0,0,0,.1)}.filter-chip:hover:before{left:100%}.filter-chip:active{transform:translateY(0)}.filter-chip.active{background:var(--primary-color);border-color:var(--primary-color);color:#fff;box-shadow:0 2px 8px rgba(74,144,226,.3)}.filter-chip.active:hover{background:var(--primary-color);border-color:var(--primary-color)}.filter-chip.removing{animation:chipRemove .3s ease forwards}.filter-chip.adding{animation:chipAdd .3s ease}.active-filters{display:flex;flex-wrap:wrap;gap:12px;margin-top:16px;min-height:32px;padding:8px;border-radius:12px;background:var(--active-filters-bg-color);border:1px dashed var(--border-color);position:relative}.active-filters:before{content:"Active Filters:";position:absolute;top:-8px;left:12px;background:var(--background-color);color:var(--text-muted-color);font-size:.9em;font-weight:500;padding:0 8px;font-style:italic}.active-filters:empty:before{content:"No active filters";font-style:italic}.active-filter{display:flex;align-items:center;height:24px;padding:0 12px;border-radius:12px;background:var(--primary-color);color:#fff;font-size:.9em}.active-filter .remove-filter{margin-left:8px;width:16px;height:16px;border-radius:50%;background:rgba(255,255,255,.2);cursor:pointer;display:flex;align-items:center;justify-content:center}.active-filter .remove-filter:hover{background:rgba(255,255,255,.3)}.active-filter .remove-filter:before,.active-filter .remove-filter:after{content:"";position:absolute;width:8px;height:2px;background:#fff;border-radius:1px}.active-filter .remove-filter:before{transform:rotate(45deg)}.active-filter .remove-filter:after{transform:rotate(-45deg)}.clear-filters{margin-top:16px;padding:12px 16px;border-radius:12px;background:var(--danger-color);color:#fff;border:none;cursor:pointer;transition:opacity transform ease;font-size:.9em;font-weight:500;position:relative;overflow:hidden}.clear-filters:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.3),transparent);transition:left .6s ease}.clear-filters:hover:not(:disabled){opacity:.9;transform:translateY(-1px);box-shadow:0 4px 12px rgba(220,53,69,.3)}.clear-filters:hover:not(:disabled):before{left:100%}.clear-filters:active:not(:disabled){transform:translateY(0)}.clear-filters:disabled{opacity:.5;cursor:not-allowed;background:var(--color-grey)}.clear-filters:after{content:"🗑️";margin-left:8px;opacity:.8}@keyframes chipIn{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}@keyframes chipAdd{0%{opacity:0;transform:scale(.8)}50%{opacity:.7;transform:scale(1.1)}to{opacity:1;transform:scale(1)}}@keyframes chipRemove{0%{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(.9)}to{opacity:0;transform:scale(.7)}}@keyframes activeFilterIn{0%{opacity:0;transform:translateY(-10px) scale(.9)}to{opacity:1;transform:translateY(0) scale(1)}}.filter-chip{animation:chipIn .4s ease forwards}@media (max-width: 768px){.filter-panel{padding:12px}.filter-chips{gap:8px}.filter-chip{height:28px;padding:0 12px;font-size:.9em}}