@import"https://fonts.googleapis.com/css2?family=Rajdhani:wght@500;700&display=swap";body{margin:0;overflow-y:auto;overflow-x:hidden;background-color:#030303;color:#ecf0f1;font-family:Arial,sans-serif;display:flex;flex-direction:column;align-items:center;min-height:100vh;text-align:center;-webkit-tap-highlight-color:transparent;padding-top:20px;padding-bottom:20px;box-sizing:border-box}#gameAreaWrapper{display:flex;align-items:flex-start;gap:15px;position:relative;width:auto;max-width:1065px;margin:80px auto auto}#gameContainer{position:relative;display:flex;justify-content:center;align-items:center}canvas#gameCanvas{display:block;border:2px solid #4a4a6a;box-shadow:0 0 15px #4a4a6a80,0 0 25px #f39c1233;border-radius:8px;background-color:#08080d}#statsPanel{width:230px;padding:15px;background-color:#0a0a14eb;border:2px solid #303045;border-radius:8px;color:#ecf0f1;font-family:Consolas,Courier New,monospace;display:flex;flex-direction:column;gap:8px;box-shadow:0 0 12px #0009,inset 0 0 8px #32324699;align-self:stretch;min-height:380px}.stat-group{display:flex;flex-direction:column;gap:10px}.stat-item{display:flex;min-height:30px;justify-content:space-between;align-items:center;padding:6px 0;border-bottom:1px dashed rgba(74,74,106,.4)}.stat-item:last-child{border-bottom:none}.pause-button-container{justify-content:center;margin-top:auto;padding-top:10px;border-top:1px dashed rgba(74,74,106,.4)}.history-button-container{justify-content:center;border-bottom:none;padding:5px 0}#viewHistoryButton{background-color:#556270;color:#fff;border:1px solid #6a7c8e;padding:8px 15px;border-radius:5px;cursor:pointer;font-size:.9em;font-family:Arial,sans-serif;transition:background-color .2s}#viewHistoryButton:hover{background-color:#6a7c8e}.stat-label{font-size:.85em;color:#aeb6bf;text-transform:uppercase;letter-spacing:2px}.audio-btn{pointer-events:auto;width:36px;height:36px;border-radius:50%;font-size:1.1rem;padding:0;display:flex;align-items:center;justify-content:center;background:#0009;border:2px solid #fff;margin-left:15px;cursor:pointer;-webkit-tap-highlight-color:transparent;touch-action:manipulation;user-select:none;-webkit-user-select:none;position:relative;z-index:1000;transition:transform .1s,background .2s}.audio-btn:hover{background:#fff3;transform:scale(1.1)}.audio-btn:active{transform:scale(.95)}.stat-value{font-size:1.6em;color:#f39c12;font-weight:700;text-shadow:0 0 7px rgba(243,156,18,.8)}.lives-critical{color:#e74c3c!important;text-shadow:0 0 7px rgba(231,76,60,.9)!important;animation:pulseRed 1s infinite alternate}@keyframes pulseRed{0%{opacity:.7;transform:scale(1)}to{opacity:1;transform:scale(1.05)}}.high-score-item .stat-value{color:#2ecc71;text-shadow:0 0 7px rgba(46,204,113,.8);font-size:1.2em}.stat-divider{border:0;height:2px;background-image:linear-gradient(to right,#4a4a6a1a,#646482d9,#4a4a6a1a);margin:8px 0}.dynamic-feedback .stat-value{min-width:60px;text-align:right;opacity:0;transition:opacity .3s ease-out}.dynamic-feedback .stat-value.visible{opacity:1}.score-positive{color:#2ecc71!important;text-shadow:0 0 7px rgba(46,204,113,.9)!important}.score-negative{color:#e74c3c!important;text-shadow:0 0 7px rgba(231,76,60,.9)!important}#panelStatusMessageContainer{margin-top:10px;padding:8px;background-color:#00000040;border-radius:4px;min-height:40px;display:flex;align-items:center;justify-content:center;text-align:center;border:1px solid rgba(74,74,106,.3)}#panelStatusMessageDisplay{font-size:.95em;font-weight:700;opacity:0;transition:opacity .3s ease-in-out;line-height:1.3;max-width:100%;word-wrap:break-word}#statusEffectLayer{display:none}#gameOverScreen,#pauseScreen{position:absolute;background-color:#0a0000f2;padding:25px 35px;border-radius:12px;border:2px solid #ff4444;color:#e0e0e0;box-shadow:0 0 25px #f009,0 0 10px #00000080;text-align:center;z-index:100;display:none;flex-direction:column;align-items:center;max-width:400px;width:auto;min-width:300px}#pauseScreen{background-color:#0a141ef2;border:1px solid #4a6a8a;font-size:28px;text-shadow:0 0 8px #000;max-width:350px}#gameOverScreen h2{margin-top:0;color:#f55;font-size:2.8em;text-shadow:0 0 10px #e74c3c,0 0 18px #c0392b;margin-bottom:20px;line-height:1.1}#gameOverScreen p{font-size:1.1em;margin:10px 0;color:#ccc}#gameOverScreen p span{color:#f39c12;font-weight:700}#gameOverScreen button{padding:12px 28px;font-size:18px;cursor:pointer;background-color:#d9534f;color:#fff;border:none;border-bottom:3px solid #b52b27;border-radius:6px;margin-top:15px;transition:background-color .15s ease,transform .1s ease;text-transform:uppercase;letter-spacing:.5px;font-weight:700}#gameOverScreen button:hover{background-color:#c9302c;border-bottom-color:#9c231f;transform:translateY(-2px)}#gameOverScreen button:active{transform:translateY(1px);border-bottom-width:1px}#resumeButton{padding:12px 25px;font-size:20px;cursor:pointer;background-color:#5cb85c;color:#fff;border:none;border-bottom:3px solid #449d44;border-radius:5px;margin-top:25px;transition:background-color .15s ease,transform .1s ease;font-weight:700}#resumeButton:hover{background-color:#4cae4c;border-bottom-color:#398439;transform:translateY(-2px)}#resumeButton:active{transform:translateY(1px);border-bottom-width:1px}#historyModal{position:fixed;left:0;top:0;width:100%;height:100%;background-color:#000000bf;display:flex;justify-content:center;align-items:center;z-index:250;opacity:0;pointer-events:none;transition:opacity .3s ease-in-out}#historyModal.modal-visible{opacity:1;pointer-events:auto}.modal-content{background-color:#1a1a2e;padding:25px;border-radius:10px;border:1px solid #4a4a6a;width:90%;max-width:450px;max-height:70vh;overflow-y:auto;position:relative;box-shadow:0 5px 25px #00000080;color:#ecf0f1;text-align:left}.modal-content h2{text-align:center;color:#f39c12;margin-top:0;border-bottom:1px solid #5a5a7a;padding-bottom:10px}.modal-close-button{position:absolute;top:10px;right:15px;font-size:28px;font-weight:700;color:#aaa;cursor:pointer;transition:color .2s}.modal-close-button:hover{color:#fff}#modalHistoryList{list-style-type:none;padding-left:0;margin:0;font-size:.9em}#modalHistoryList li{padding:8px 5px;border-bottom:1px dashed #3a3a5a;display:flex;justify-content:space-between}#modalHistoryList li:last-child{border-bottom:none}#pauseButton{background-color:#64647899;color:#ecf0f1;border:1px solid #6a7c8e;border-radius:5px;padding:8px 15px;font-size:18px;cursor:pointer;font-weight:700;transition:background-color .2s,box-shadow .2s;box-shadow:0 2px 5px #0000004d}#pauseButton:hover{background-color:#78788ccc;box-shadow:0 0 8px #87cefa80}.game-navbar{position:fixed;top:0;left:0;width:100%;z-index:9999;background:#0a0a14e6;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);padding:12px 30px;border-bottom:2px solid rgba(243,156,18,.3);display:flex;align-items:center;gap:25px;box-shadow:0 4px 15px #00000080;transition:all .3s ease}.nav-home{color:#e67e22;text-decoration:none;font-family:Rajdhani,sans-serif;font-weight:700;font-size:1.1rem;text-transform:uppercase;letter-spacing:1px;padding:6px 15px;border:1px solid transparent;border-radius:4px;transition:all .3s ease}.nav-home:hover{color:#fff;background:#e67e2233;border-color:#e67e2280;text-shadow:0 0 8px rgba(230,126,34,.8);transform:translate(-3px)}.nav-title{color:#ecf0f1;font-family:Rajdhani,sans-serif;font-weight:700;font-size:1.4rem;letter-spacing:2px;text-shadow:0 0 10px rgba(0,0,0,.5);position:relative;padding-left:15px;border-left:2px solid rgba(255,255,255,.2)}#introScreen{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#030303;display:flex;flex-direction:column;justify-content:center;align-items:center;z-index:200;opacity:1;transition:opacity .8s ease-out;cursor:pointer;background:radial-gradient(circle at center,#1a1a2e,#000)}#introScreen.hidden{opacity:0;pointer-events:none}#introContent{text-align:center}#introTitle{font-family:Rajdhani,sans-serif;font-size:5em;font-weight:700;text-transform:uppercase;letter-spacing:4px;margin-bottom:30px;opacity:0;transform:scale(.9);animation:fadeInScaleUp 1.2s cubic-bezier(.175,.885,.32,1.275) .3s forwards;background:linear-gradient(to right,#d35400,#f39c12,#ffeaa7,#f39c12,#d35400,#d35400);background-size:200% auto;color:#f39c12;background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;animation:textShine 4s linear infinite,fadeInScaleUp 1.2s ease-out .3s forwards;text-shadow:0 0 30px rgba(243,156,18,.3)}@keyframes textShine{to{background-position:200% center}}#introPrompt{font-family:Rajdhani,sans-serif;font-size:1.4em;color:#bbb;opacity:0;animation:fadeIn 1s ease-out 1.2s forwards,pulsePrompt 2s infinite ease-in-out 1.2s;letter-spacing:1.5px;margin-bottom:40px}@keyframes pulsePrompt{0%{opacity:.6;transform:scale(1)}50%{opacity:1;transform:scale(1.05);text-shadow:0 0 10px rgba(255,255,255,.3)}to{opacity:.6;transform:scale(1)}}.how-to-play-link{display:inline-block;padding:15px 40px;font-family:Rajdhani,sans-serif;font-size:1.3rem;font-weight:700;text-transform:uppercase;text-decoration:none;color:#fff;background:linear-gradient(135deg,#d35400,#e67e22);border:1px solid rgba(255,255,255,.2);border-radius:8px;box-shadow:0 5px 15px #d3540066;transition:all .3s cubic-bezier(.25,.8,.25,1);opacity:0;animation:fadeIn 1s ease-out 1.5s forwards;letter-spacing:1px;position:relative;overflow:hidden;z-index:10}.how-to-play-link:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);transition:left .5s}.how-to-play-link:hover{transform:translateY(-3px) scale(1.05);box-shadow:0 8px 25px #d3540099;background:linear-gradient(135deg,#e67e22,#f39c12);border-color:#fff6}.how-to-play-link:hover:before{left:100%}.how-to-play-link:active{transform:translateY(0) scale(.98)}@keyframes fadeInScaleUp{to{opacity:1;transform:scale(1)}}@keyframes fadeIn{to{opacity:1}}#instructionsScreen{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#000000e6;display:none;justify-content:center;align-items:center;z-index:190}#instructionsContent{background-color:#10101a;padding:30px;border-radius:10px;border:1px solid #4a4a6a;width:80%;max-width:700px;max-height:80vh;overflow-y:auto;color:#ecf0f1}#closeInstructionsButton{display:block;margin:20px auto 0;padding:10px 20px;background-color:#556270;color:#fff;border-radius:5px;cursor:pointer}#closeInstructionsButton:hover{background-color:#6a7c8e}@media (max-width: 1100px){#gameAreaWrapper{flex-direction:column;align-items:center;gap:20px;margin-top:0;margin-bottom:0}#statsPanel{width:90%;max-width:450px;margin-top:15px;align-self:center;min-height:auto}}@media (max-width: 480px){#statsPanel{width:95%;padding:10px;gap:5px}.stat-label{font-size:.8em}.stat-value{font-size:1.4em}.high-score-item .stat-value{font-size:1.1em}#gameOverScreen h2{font-size:2em}#gameOverScreen p{font-size:1em}#gameOverScreen button,#resumeButton{font-size:16px;padding:10px 15px}#panelStatusMessageDisplay{font-size:.9em}#introTitle{font-size:3em}}#toggleBorderAnimationButton{background-color:#64647899;color:#ecf0f1;border-style:solid;border-color:#6a7c8e;border-width:1px;padding:8px 12px;text-align:center;font-size:14px;margin-left:10px;cursor:pointer;border-radius:5px;transition:border-width .2s ease-out,border-color .2s ease-out,background-color .2s,box-shadow .2s;min-width:120px;font-weight:700;box-shadow:0 2px 5px #0000004d}#toggleBorderAnimationButton.animations-on{border-width:2px;border-color:#87ceeb}#toggleBorderAnimationButton:hover{background-color:#78788ccc;box-shadow:0 0 8px #87cefa80}#orientation-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#000;z-index:10000;display:none;flex-direction:column;justify-content:center;align-items:center;color:#fff;text-align:center}#orientation-overlay .phone-icon{font-size:60px;margin-bottom:20px;animation:rotate-phone 2s infinite ease-in-out}@keyframes rotate-phone{0%,10%{transform:rotate(0)}40%,60%{transform:rotate(90deg)}90%,to{transform:rotate(0)}}#mobile-start-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:#000000f2;z-index:9995;display:none;justify-content:center;align-items:center}#mobile-start-overlay .start-content{text-align:center;color:#fff;padding:20px}#mobile-start-overlay h1{font-family:Rajdhani,sans-serif;color:#f39c12;font-size:2.5rem;margin-bottom:30px;text-transform:uppercase}#mobile-play-btn{background:linear-gradient(135deg,#d35400,#e67e22);border:none;padding:15px 40px;font-size:1.5rem;color:#fff;font-weight:700;border-radius:50px;cursor:pointer;box-shadow:0 0 20px #e67e2280;animation:pulseBtn 1.5s infinite}@keyframes pulseBtn{0%{transform:scale(1);box-shadow:0 0 20px #e67e2280}50%{transform:scale(1.05);box-shadow:0 0 40px #e67e22cc}to{transform:scale(1);box-shadow:0 0 20px #e67e2280}}.fullscreen-note{margin-top:15px;color:#888;font-size:.9rem}@media only screen and (max-width: 915px) and (orientation: landscape){.game-navbar{display:none!important}body{padding:0;margin:0;background:#050505;overflow:hidden}#gameAreaWrapper{width:100vw;height:100vh;max-width:none;margin:0;padding:0 0 0 3px;justify-content:space-between;align-items:stretch;flex-direction:row}#gameContainer{flex-grow:1;height:100%;width:auto;display:flex;align-items:center;justify-content:center;background:#000}canvas#gameCanvas{border:none;border-radius:0;box-shadow:none}#statsPanel{width:220px;min-width:220px;height:100vh;max-height:100vh;margin:0;border-radius:0;border-right:none;border-top:none;border-bottom:none;overflow:visible;padding:0;box-sizing:border-box;background:#0a0a14f2;z-index:50;display:flex;flex-direction:column;transition:margin-right .3s ease-in-out;position:relative}.stats-content-wrapper{flex:1;overflow-y:auto;padding:10px 45px 10px 15px;width:100%;box-sizing:border-box}.stat-value{font-size:1.2em}.stat-label{font-size:.75em}.history-button-container{margin-bottom:20px}#statsPanel.collapsed{margin-right:-220px}.stats-panel-mobile-toggle{position:absolute;left:-30px;top:50%;transform:translateY(-50%);width:30px;height:60px;background:#0a0a14f2;border:1px solid #4a4a6a;border-right:none;border-radius:8px 0 0 8px;color:#f39c12;display:flex;justify-content:center;align-items:center;cursor:pointer;font-size:20px;font-weight:700;box-shadow:-2px 0 5px #00000080;z-index:51}.stats-panel-mobile-toggle.blink{animation:arrow-blink 1.5s infinite}@keyframes arrow-blink{0%,to{opacity:1;color:#f39c12}50%{opacity:.7;color:#fff}}.stats-panel-mobile-toggle:hover{background:#1a1a2e;color:#fff}}@media only screen and (max-width: 915px) and (orientation: portrait){#orientation-overlay{display:flex!important}#gameAreaWrapper,#gameContainer,#statsPanel,.game-navbar,#introScreen,#instructionsScreen{display:none!important}}
