*{box-sizing:border-box}html,body,#root{width:100%;min-height:100%;margin:0;padding:0}body{color:#d9d9d9;font-family:Orbitron,sans-serif}.bg-image{z-index:0;background-position:50%;background-repeat:no-repeat;background-size:cover;position:fixed;inset:0}.bg-image:after{content:"";background-color:#0000004d;position:absolute;inset:0}#stars canvas{z-index:1;position:fixed;inset:0}main{position:relative}.page-layout{z-index:2;grid-template-rows:minmax(0,1fr) auto auto;row-gap:0;min-height:100dvh;padding:clamp(6px,1.2vh,14px) clamp(8px,1.6vw,20px);display:grid;position:relative}.game-layout{grid-row:3;grid-template-columns:minmax(100px,12vw) minmax(360px,min(60vw,78.146dvh)) minmax(100px,12vw);justify-content:center;align-self:end;align-items:end;gap:clamp(20px,3vw,48px);width:100%;max-width:1800px;min-height:0;margin:0 auto;display:grid}.center-panel{aspect-ratio:724/760;background-position:bottom;background-repeat:no-repeat;background-size:100% 100%;align-self:end;width:100%;max-width:none;position:relative}.page-layout>header{z-index:2;text-align:center;grid-row:2;width:100%;max-width:1200px;margin:0 auto;position:relative}.page-layout>header h1{color:#f0f;letter-spacing:.3em;margin:0;font-size:clamp(2.5rem,5vw,5rem);font-weight:700;line-height:1}.page-layout>header p{margin:4px 0 0;font-size:.9rem}.side-panel{box-sizing:border-box;outline-offset:-7px;background-color:#0f0a2899;border:5px solid #00f5ff;border-radius:8px;outline:3px solid #f0f;flex-direction:column;align-self:center;width:100%;height:clamp(260px,62vh,500px);padding:16px;display:flex;position:relative;overflow:hidden;box-shadow:0 0 8px #00f5ff,0 0 20px #00f5ff40,inset 0 0 12px #ff00cc59}.coins-container{grid-template-columns:1fr 1fr;align-content:space-evenly;justify-items:center;gap:clamp(2px,.3vw,5px);height:100%;padding:clamp(2px,.3vw,4px);display:grid}.coin-wrapper{flex-direction:column;justify-content:center;align-items:center;gap:clamp(2px,.4vw,6px);display:flex}.coin-right-col{margin-top:clamp(2px,.3vw,5px)}.coin-img{object-fit:contain;filter:drop-shadow(0 0 6px #ffd700b3);width:clamp(34px,2.8vw,56px);height:clamp(34px,2.8vw,56px);transition:filter .4s,opacity .4s}.coin-img.coin-lost{filter:grayscale()brightness(.35);opacity:.4}.monster-container{justify-content:center;align-items:flex-end;padding:clamp(4px,.6vw,10px) 0 0;display:flex}.monster-img{object-fit:contain;filter:drop-shadow(0 0 12px #ff00cc80);width:clamp(92px,68%,210px);max-width:100%;max-height:clamp(120px,24vh,210px)}.right-panel .status{text-align:center;flex-direction:column;flex:1;justify-content:center;align-items:center;display:flex}.right-panel .status h2{letter-spacing:.1em;margin:0;font-size:clamp(1rem,.8vw + .6rem,1.35rem)}.right-panel .status p{letter-spacing:.1em;margin:.35rem 0 0;font-size:clamp(.8rem,.6vw + .6rem,1.1rem)}.screen-content{z-index:1;flex-direction:column;align-items:center;gap:clamp(8px,1.2vh,16px);display:flex;position:absolute;inset:45% 20% 15%;overflow:hidden}.screen-content .keyboard-container{gap:clamp(2px,.4vw,6px);margin-bottom:clamp(4px,1vh,12px)}.screen-content .keyboard-container button{width:clamp(18px,2.2vw,28px);height:clamp(18px,2.2vw,28px);font-size:clamp(.5rem,.7vw,.85rem)}.screen-content .new-game{width:clamp(100px,15vw,190px);height:clamp(24px,3vh,34px);padding:4px 8px;font-size:clamp(.5rem,.8vw,.9rem)}.letters-container{justify-content:center;gap:clamp(2px,.4vw,5px);margin-bottom:clamp(4px,1vh,12px);display:flex}.letter{color:#f9f4da;background-color:#323232;border-bottom:1px solid #f9f4da;justify-content:center;align-items:center;width:clamp(24px,3vw,40px);height:clamp(24px,3vw,40px);font-size:clamp(.75rem,1.2vw,1.25rem);display:flex}.letter.missed{color:#ec5d49}.keyboard-container{flex-wrap:wrap;justify-content:center;max-width:450px;margin-bottom:20px;display:flex}.keyboard-container button{cursor:pointer;background-color:#fcba29;border:1px solid #d7d7d7;border-radius:3px;width:35px;height:35px;font-family:inherit}.keyboard-container button:disabled{cursor:not-allowed;opacity:.5}.keyboard-container button.isCorrect{background-color:#10a95b}.keyboard-container button.isWrong{background-color:#ec5d49}.new-game{letter-spacing:.1em;cursor:pointer;background-color:#11b5e5;border:1px solid #d7d7d7;border-radius:4px;width:225px;height:40px;margin-inline:auto;padding:6px 12px;font-family:inherit;font-size:1.2rem;font-weight:500;display:block}@media (width<=900px){.page-layout{grid-template-rows:auto auto;min-height:auto;padding:16px 10px}.page-layout>header h1{font-size:clamp(36px,10vw,56px)}.page-layout>header,.game-layout{grid-row:auto}.game-layout{grid-template-columns:minmax(280px,1fr);place-items:start center;gap:12px;min-height:auto}.center-panel{order:1;width:min(95vw,560px)}.left-panel{order:2;width:min(92vw,420px)}.right-panel{order:3;width:min(92vw,420px)}.side-panel{min-height:clamp(200px,32vh,320px)}.coins-container{align-content:start;height:auto}.monster-container{align-items:flex-end}.monster-img{width:clamp(120px,50vw,220px);max-height:clamp(140px,28vw,220px)}}.credits{opacity:.4;color:#d9d9d9;z-index:3;flex-direction:column;align-items:flex-end;gap:3px;font-size:.55rem;display:flex;position:absolute;top:10px;right:14px}.credits a,.credits span{color:inherit;text-decoration:none}.credits a:hover{opacity:.8;text-decoration:underline}