@import "https://fonts.googleapis.com/css2?family=Orbitron:wght@400;500;600;700;800;900&display=swap";@font-face{font-family:MV Waheed;src:url(./MV_Waheed.gP3_reDB.otf)format("opentype");font-weight:400;font-style:normal;font-display:swap}*{box-sizing:border-box;margin:0;padding:0}body{background:#000;margin:0;padding:0;font-family:Orbitron,Arial,sans-serif;position:relative;overflow:hidden}body:before{content:"";z-index:-1;background-image:url(../images/background-new.png);background-position:50%;background-repeat:no-repeat;background-size:cover;width:100%;height:100%;position:fixed;top:0;left:0}html{font-family:MV Waheed,Arial,sans-serif}#game-wrapper{box-sizing:border-box;grid-template-rows:auto 1fr;grid-template-columns:minmax(280px,320px) 1fr minmax(250px,300px);align-items:start;gap:15px;width:100vw;height:100vh;padding:15px;display:grid;position:relative;overflow:hidden}#game-title{text-align:center;color:#5b9bd5;text-shadow:0 0 20px #5b9bd5cc,0 0 40px #5b9bd566;letter-spacing:3px;grid-column:1/-1;padding:10px 0;font-family:Orbitron,Arial,sans-serif;font-size:48px;font-weight:700}#health-container{z-index:100;position:fixed;top:30px;right:30px}#health-bar{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#000000b3;border:2px solid #5b9bd599;border-radius:6px;gap:4px;padding:6px 8px;display:flex;position:relative}#health-bar:after{content:"";background:#5b9bd5cc;border-radius:0 2px 2px 0;width:4px;height:14px;position:absolute;top:50%;right:-6px;transform:translateY(-50%)}.health-segment{background:linear-gradient(#5b9bd5,#3a7db8);border-radius:3px;width:28px;height:18px;transition:all .3s;box-shadow:0 0 10px #5b9bd599}.health-segment.lost{box-shadow:none;background:#5050504d}#game-container{flex-direction:column;grid-area:2/2;justify-content:center;align-self:start;align-items:center;margin-top:40px;display:flex;position:relative}#gameCanvas{-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background-color:#00081499;border:3px solid #5b9bd580;border-radius:8px;max-width:100%;max-height:calc(100vh - 200px);display:block;box-shadow:0 0 30px #5b9bd54d,inset 0 0 20px #00000080}#hidden-input{color:#fff;text-align:center;z-index:100;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);direction:rtl;background:#000814d9;border:3px solid #5b9bd599;border-radius:10px;outline:none;width:450px;padding:16px 28px;font-family:MV Waheed,Arial,sans-serif;font-size:26px;position:absolute;bottom:-80px;left:50%;transform:translate(-50%);box-shadow:0 0 25px #5b9bd566,inset 0 2px 8px #00000080}#hidden-input:focus{border-color:#5b9bd5e6;box-shadow:0 0 35px #5b9bd599,inset 0 2px 8px #00000080}#hidden-input::placeholder{color:#ffffff4d;font-family:MV Waheed,Arial,sans-serif}.thaanaKeyboardInput{direction:rtl;font-family:MV Waheed,Arial,sans-serif}#stats-panel{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:linear-gradient(135deg,#0a1428d9 0%,#14233cd9 100%);border:3px solid #5b9bd566;border-radius:12px;flex-direction:column;grid-area:2/3;align-self:start;gap:25px;min-width:0;max-height:calc(100vh - 200px);margin-top:40px;padding:25px 15px;display:flex;overflow:hidden;box-shadow:0 0 30px #000000b3,inset 0 0 40px #0000004d}.stat-item{flex-direction:column;gap:8px;display:flex}.stat-label{color:#7ba8d1;letter-spacing:1px;white-space:nowrap;font-family:Orbitron,Arial,sans-serif;font-size:14px;font-weight:700}.stat-value{color:#5b9bd5;text-shadow:0 0 15px #5b9bd599,0 0 30px #5b9bd54d;letter-spacing:1px;word-break:break-all;font-family:Orbitron,Courier New,monospace;font-size:36px;font-weight:700}.live-scoreboard{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:linear-gradient(135deg,#0a1428d9 0%,#14233cd9 100%);border:3px solid #5b9bd566;border-radius:12px;flex-direction:column;grid-area:2/1;align-self:start;width:100%;min-width:0;max-height:calc(100vh - 200px);margin-top:40px;padding:15px;display:flex;position:relative;overflow-y:auto;box-shadow:0 0 30px #000000b3,inset 0 0 40px #0000004d}.live-scoreboard-header{text-align:center;color:#5b9bd5;text-shadow:0 0 15px #5b9bd5b3,0 0 30px #5b9bd54d;letter-spacing:2px;border-bottom:2px solid #5b9bd54d;margin-bottom:20px;padding-bottom:15px;font-family:Orbitron,Arial,sans-serif;font-size:24px;font-weight:700}.user-status{margin-bottom:15px}.user-status.hidden{display:none}.user-info{background:#5b9bd526;border:2px solid #5b9bd566;border-radius:8px;flex-direction:column;align-items:center;gap:10px;padding:12px;display:flex}.username-display{color:#7ba8d1;font-family:Orbitron,Arial,sans-serif;font-size:14px;font-weight:700}.logout-btn{color:#d57b7b;cursor:pointer;text-transform:uppercase;background:#d57b7b33;border:2px solid #d57b7b66;border-radius:6px;width:100%;padding:8px 16px;font-family:Orbitron,Arial,sans-serif;font-size:12px;font-weight:700;transition:all .3s}.logout-btn:hover{background:#d57b7b4d;border-color:#d57b7b;transform:translateY(-2px);box-shadow:0 4px 10px #d57b7b4d}.logout-btn:active{transform:translateY(0)}.login-prompt{text-align:center;background:#5b9bd526;border:2px solid #5b9bd54d;border-radius:10px;margin-bottom:20px;padding:15px;animation:2s ease-in-out infinite pulseBlue}.login-prompt.hidden{display:none}.login-text{color:#7ba8d1;text-shadow:0 0 10px #5b9bd580;margin:0 0 8px;font-family:Orbitron,Arial,sans-serif;font-size:15px;font-weight:700}.login-subtext{color:#fff9;margin:0;font-family:Orbitron,Arial,sans-serif;font-size:12px;font-style:italic}@keyframes pulseBlue{0%,to{border-color:#5b9bd54d;box-shadow:0 0 10px #5b9bd533}50%{border-color:#5b9bd580;box-shadow:0 0 20px #5b9bd566}}.live-scoreboard-list{flex-direction:column;flex-shrink:0;gap:10px;min-height:250px;margin-bottom:15px;display:flex}.live-scoreboard::-webkit-scrollbar{width:8px}.live-scoreboard::-webkit-scrollbar-track{background:#0000004d;border-radius:10px}.live-scoreboard::-webkit-scrollbar-thumb{background:#5b9bd580;border-radius:10px}.live-scoreboard::-webkit-scrollbar-thumb:hover{background:#5b9bd5b3}.score-item{background:#0006;border:1px solid #5b9bd533;border-radius:8px;grid-template-columns:40px 1fr auto;align-items:center;gap:12px;padding:12px;font-size:14px;transition:all .2s;display:grid}.score-item:hover{background:#5b9bd526;border-color:#5b9bd566;transform:translate(5px)}.score-item.current-user{background:#5b9bd540;border:2px solid #5b9bd580}.score-item .rank{text-align:center;color:#7ba8d1;font-family:Orbitron,Arial,sans-serif;font-size:18px;font-weight:700}.score-item .username{color:#ffffffe6;text-overflow:ellipsis;white-space:nowrap;font-family:Orbitron,Arial,sans-serif;font-weight:500;overflow:hidden}.score-item .score{color:#5b9bd5;font-family:Orbitron,monospace;font-size:16px;font-weight:700}.loading-scores,.no-scores-live,.error-live{text-align:center;color:#ffffff80;padding:30px 15px;font-family:Orbitron,Arial,sans-serif;font-size:13px}.error-live{color:#d57b7b}.login-register-btn{color:#7bd1a8;cursor:pointer;text-transform:uppercase;letter-spacing:1px;background:linear-gradient(135deg,#5bd59b40 0%,#5bd59b59 100%);border:2px solid #5bd59b80;border-radius:8px;width:100%;margin-top:10px;padding:14px;font-family:Orbitron,Arial,sans-serif;font-size:13px;font-weight:700;transition:all .3s}.login-register-btn:hover{color:#5bd19b;background:linear-gradient(135deg,#5bd59b59 0%,#5bd59b73 100%);border-color:#5bd19b;transform:translateY(-2px);box-shadow:0 4px 15px #5bd59b4d}.login-register-btn:active{transform:translateY(0)}.login-register-btn.hidden{display:none}.view-leaderboard-btn{color:#7ba8d1;cursor:pointer;text-transform:uppercase;letter-spacing:1px;background:linear-gradient(135deg,#5b9bd540 0%,#5b9bd559 100%);border:2px solid #5b9bd580;border-radius:8px;width:100%;margin-top:10px;padding:14px;font-family:Orbitron,Arial,sans-serif;font-size:13px;font-weight:700;transition:all .3s}.view-leaderboard-btn:hover{color:#5b9bd5;background:linear-gradient(135deg,#5b9bd559 0%,#5b9bd573 100%);border-color:#5b9bd5;transform:translateY(-2px);box-shadow:0 4px 15px #5b9bd54d}.view-leaderboard-btn:active{transform:translateY(0)}.modal{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:1000;opacity:1;background:#000000e6;justify-content:center;align-items:center;width:100%;height:100%;transition:opacity .3s;display:flex;position:fixed;top:0;left:0}.modal.hidden{opacity:0;pointer-events:none}.modal-content{background:linear-gradient(135deg,#0a1428f2 0%,#14233cf2 100%);border:3px solid #5b9bd580;border-radius:20px;width:90%;max-width:520px;padding:45px;animation:.3s ease-out modalSlideIn;position:relative;box-shadow:0 0 40px #5b9bd566,0 0 80px #000c}@keyframes modalSlideIn{0%{opacity:0;transform:translateY(-50px)}to{opacity:1;transform:translateY(0)}}.modal-content h2{color:#5b9bd5;text-align:center;text-shadow:0 0 20px #5b9bd5b3,0 0 40px #5b9bd54d;letter-spacing:1px;margin-bottom:12px;font-family:Orbitron,Arial,sans-serif;font-size:36px;font-weight:700}.modal-content .subtitle{color:#7ba8d1;text-align:center;opacity:.95;margin-bottom:35px;font-family:Orbitron,Arial,sans-serif;font-size:17px}.auth-tabs{justify-content:center;gap:10px;margin-bottom:25px;display:flex}.auth-tab{color:#fff9;cursor:pointer;text-transform:uppercase;letter-spacing:.5px;background:#0006;border:2px solid #5b9bd54d;border-radius:10px;flex:1;padding:12px 24px;font-family:Orbitron,Arial,sans-serif;font-size:14px;font-weight:700;transition:all .3s}.auth-tab:hover{color:#fffc;background:#5b9bd51a;border-color:#5b9bd580}.auth-tab.active{color:#5b9bd5;background:linear-gradient(135deg,#5b9bd54d 0%,#5b9bd533 100%);border-color:#5b9bd5;box-shadow:0 0 20px #5b9bd54d}.auth-form{flex-direction:column;gap:15px;display:flex}#username-input,#password-input{color:#fff;text-align:center;background:#00000080;border:2px solid #5b9bd599;border-radius:12px;outline:none;padding:16px 24px;font-family:Orbitron,Arial,sans-serif;font-size:18px;transition:all .3s;box-shadow:inset 0 2px 8px #0006}#username-input:focus,#password-input:focus{border-color:#5b9bd5;transform:scale(1.02);box-shadow:0 0 20px #5b9bd566,inset 0 2px 8px #0006}#username-input::placeholder,#password-input::placeholder{color:#fff6;font-family:Orbitron,Arial,sans-serif}.btn-primary,.btn-secondary{cursor:pointer;text-transform:uppercase;letter-spacing:.5px;border:none;border-radius:12px;padding:16px 32px;font-family:Orbitron,Arial,sans-serif;font-size:16px;font-weight:700;transition:all .3s}.btn-primary{color:#fff;background:linear-gradient(135deg,#5b9bd5 0%,#3a7db8 100%);box-shadow:0 4px 15px #5b9bd566,inset 0 -2px 4px #0003}.btn-primary:hover{transform:translateY(-3px);box-shadow:0 8px 30px #5b9bd599,inset 0 -2px 4px #0003}.btn-primary:active{transform:translateY(-1px)}.btn-primary:disabled{opacity:.5;cursor:not-allowed;transform:none}.btn-secondary{color:#7ba8d1;background:#5b9bd526;border:2px solid #5b9bd599;box-shadow:inset 0 2px 4px #0003}.btn-secondary:hover{background:#5b9bd540;border-color:#5b9bd5;transform:translateY(-2px);box-shadow:0 4px 15px #5b9bd54d,inset 0 2px 4px #0003}.btn-secondary:active{transform:translateY(0)}.auth-status{text-align:center;border-radius:8px;margin-top:10px;padding:12px;font-size:15px}.auth-status.success{color:#7ba8d1;background:#5b9bd533;border:1px solid #5b9bd580}.auth-status.error{color:#d57b7b;background:#d57b7b33;border:1px solid #d57b7b80}.scoreboard-content{max-width:700px;max-height:80vh;overflow-y:auto}.modal-header{justify-content:space-between;align-items:center;margin-bottom:20px;display:flex}.close-btn{color:#fff;cursor:pointer;background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;width:40px;height:40px;padding:0;font-size:36px;line-height:1;transition:all .3s;display:flex}.close-btn:hover{color:#d57b7b;background:#d57b7b33}.scoreboard-tabs{gap:10px;margin-bottom:20px;display:flex}.tab-btn{color:#ffffffb3;cursor:pointer;background:#0000004d;border:2px solid #5b9bd54d;border-radius:8px;flex:1;padding:12px 20px;font-family:Orbitron,Arial,sans-serif;font-size:15px;transition:all .3s}.tab-btn:hover{background:#5b9bd51a;border-color:#5b9bd580}.tab-btn.active{color:#7ba8d1;background:#5b9bd540;border-color:#5b9bd5;font-weight:700}.scoreboard-loading{text-align:center;color:#7ba8d1;padding:40px;font-family:Orbitron,Arial,sans-serif}.spinner{border:4px solid #5b9bd533;border-top-color:#5b9bd5;border-radius:50%;width:40px;height:40px;margin:0 auto 15px;animation:1s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.scoreboard-list{min-height:200px}.scores-table{width:100%}.scores-header,.score-row{grid-template-columns:60px 1fr 100px 60px 60px 60px 60px;align-items:center;gap:10px;padding:12px;display:grid}.scores-header{color:#7ba8d1;background:#5b9bd526;border-bottom:2px solid #5b9bd54d;border-radius:8px 8px 0 0;font-family:Orbitron,Arial,sans-serif;font-size:13px;font-weight:700}.score-row{color:#ffffffe6;background:#0003;border-bottom:1px solid #ffffff0d;transition:all .2s}.score-row:hover{background:#5b9bd51a}.score-row.highlight{background:#5b9bd533;border:2px solid #5b9bd566;border-radius:6px}.col-rank{text-align:center;color:#7ba8d1;font-family:Orbitron,Arial,sans-serif;font-weight:700}.col-player{text-overflow:ellipsis;white-space:nowrap;font-family:Orbitron,Arial,sans-serif;overflow:hidden}.col-score{color:#5b9bd5;text-align:right;font-family:Orbitron,monospace;font-weight:700}.col-wave,.col-wpm,.col-acc,.col-games{text-align:center;opacity:.9;font-family:Orbitron,Arial,sans-serif;font-size:13px}.no-scores,.error{text-align:center;color:#ffffff80;padding:60px 20px;font-family:Orbitron,Arial,sans-serif;font-size:17px}.error{color:#d57b7b}.confirm-modal-content{text-align:center;max-width:400px;padding:35px}.confirm-modal-content h2{margin-bottom:15px;font-size:26px}.confirm-modal-content p{color:#fffc;margin-bottom:30px;font-family:Orbitron,Arial,sans-serif;font-size:16px;line-height:1.6}.confirm-buttons{justify-content:center;gap:15px;display:flex}.confirm-buttons .btn-primary,.confirm-buttons .btn-secondary{min-width:110px;padding:14px 28px;font-size:15px}.user-stats-panel{background:linear-gradient(135deg,#5b9bd51a 0%,#5b9bd50d 100%);border:2px solid #5b9bd54d;border-radius:12px;margin-bottom:20px;padding:20px}.user-stats-panel h3{color:#5b9bd5;text-align:center;text-shadow:0 0 10px #5b9bd580;margin-bottom:20px;font-family:Orbitron,Arial,sans-serif;font-size:20px}.stats-grid{grid-template-columns:repeat(2,1fr);gap:15px;display:grid}.stat-box{text-align:center;background:#0000004d;border:2px solid #5b9bd54d;border-radius:8px;padding:15px;transition:all .3s}.stat-box:hover{border-color:#5b9bd599;transform:translateY(-2px);box-shadow:0 4px 15px #5b9bd533}.stat-box .stat-label{color:#7ba8d1;text-transform:uppercase;letter-spacing:1px;margin-bottom:8px;font-family:Orbitron,Arial,sans-serif;font-size:12px}.stat-box .stat-value{color:#5b9bd5;text-shadow:0 0 10px #5b9bd580;font-family:Orbitron,Courier New,monospace;font-size:28px;font-weight:700}