*{margin:0;padding:0}html,body{overflow:hidden}.webgl{position:fixed;top:0;left:0;outline:none;touch-action:none}.title-menu{position:fixed;top:0;left:0;width:100%;height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;z-index:1000;transition:opacity .5s ease;-webkit-user-select:none;user-select:none;font-family:Impact,Arial Black,sans-serif;overflow:hidden}.title-menu.hidden{opacity:0;pointer-events:none}.title-menu:after{content:"";position:absolute;top:50%;left:50%;width:200vmax;height:200vmax;transform:translate(-50%,-50%);z-index:-1;animation:sunburst-spin 60s linear infinite}@keyframes sunburst-spin{0%{transform:translate(-50%,-50%) rotate(0)}to{transform:translate(-50%,-50%) rotate(360deg)}}.title-menu:before{content:"";position:absolute;inset:0;background:radial-gradient(circle,transparent 40%,rgba(0,0,0,.5) 100%);pointer-events:none;z-index:0}.logo-container{margin-bottom:50px;z-index:10;display:flex;flex-direction:column;align-items:center}.title-text{font-size:5rem;color:#e9ae5a;text-transform:uppercase;font-weight:900;font-style:italic;letter-spacing:2px;transform:rotate(-3deg) skew(-5deg);text-shadow:5px 5px 0px #000,-2px -2px 0px #9ac3c8;-webkit-text-stroke:3px black;margin:0;text-align:center;line-height:.9}.subtitle-text{font-family:Outfit,sans-serif;font-size:1rem;font-weight:700;color:#fff;text-align:center;margin-top:20px;max-width:700px;text-transform:uppercase;letter-spacing:1px;text-shadow:2px 2px 6px #000;-webkit-text-stroke:.5px black;transform:rotate(-2deg) skew(-2deg)}@keyframes comic-pop{0%,to{transform:rotate(-3deg) skew(-5deg) scale(1)}50%{transform:rotate(-1deg) skew(-2deg) scale(1.05)}}.face-capture-modal,.modal-overlay{position:fixed;top:0;left:0;width:100%;height:100%;z-index:2000;display:flex;justify-content:center;align-items:center;background:#000c;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);transition:opacity .3s}.face-capture-modal.hidden,.modal-overlay.hidden{display:none!important}.comic-modal-content{background:#fff;padding:30px;border:5px solid black;box-shadow:15px 15px #000;display:flex;flex-direction:column;align-items:center;gap:20px;transform:rotate(-1deg);animation:modal-enter .5s cubic-bezier(.175,.885,.32,1.275);max-width:90%}@keyframes modal-enter{0%{transform:translateY(-100px) rotate(-5deg);opacity:0}to{transform:translateY(0) rotate(-1deg);opacity:1}}.comic-title{font-family:Impact,sans-serif;font-size:2.5rem;margin:0;color:#000;text-transform:uppercase;text-shadow:2px 2px 0px #9ac3c8;letter-spacing:1px}.comic-video-wrapper{position:relative;border:4px solid black;padding:0;background:#000;box-shadow:5px 5px #00000080}.comic-video{display:block;width:100%;max-width:400px;height:auto}.comic-video-overlay{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:160px;height:200px;border:4px dashed #00ff00;border-radius:50%;pointer-events:none;box-shadow:0 0 20px #0f0 inset}.comic-modal-buttons{display:flex;gap:15px;background:#0000000d;padding:10px;border:2px dashed black;width:100%;justify-content:center}.cancel-btn{background:#f55!important}.cancel-btn:hover{background:red!important;color:#fff}.hud-face{position:fixed;top:20px;right:20px;width:80px;height:100px;background-color:#333;background-size:cover;background-position:center;border:4px solid black;border-radius:50%;z-index:1001;box-shadow:5px 5px #000;transform:rotate(5deg);transition:transform .2s}.hud-face.hidden{display:none}.hud-face:hover{transform:rotate(0) scale(1.1)}.mode-switch-container{display:flex;flex-direction:column;align-items:center;gap:10px;margin-bottom:40px;background:#9ac3c8;padding:15px 30px;border:4px solid black;box-shadow:8px 8px #00000080;transform:rotate(2deg)}.switch-row{display:flex;align-items:center;gap:20px}.mode-description{font-family:Outfit,sans-serif;font-size:.8rem;font-weight:700;color:#000;text-transform:uppercase;text-align:center;letter-spacing:1px;background:#e9ae5a;padding:3px 10px;border:2px solid black;transform:rotate(-1deg);min-width:150px}.switch-label{font-family:Impact,sans-serif;color:#000;font-size:1.5rem;text-transform:uppercase;letter-spacing:1px;text-shadow:none}#mode-switch{display:none}.switch-slider{position:relative;width:70px;height:34px;background:#333;border-radius:4px;cursor:pointer;transition:background .3s;border:3px solid black}.switch-slider:after{content:"";position:absolute;top:2px;left:2px;width:24px;height:24px;background:#fff;border:2px solid black;border-radius:2px;transition:transform .2s cubic-bezier(.175,.885,.32,1.275)}#mode-switch:checked+.switch-slider{background:#e9ae5a}#mode-switch:checked+.switch-slider:after{transform:translate(36px)}.main-buttons{display:flex;gap:40px;margin-bottom:40px;z-index:10}.secondary-buttons{display:flex;gap:20px;z-index:10}.menu-btn{font-family:Impact,sans-serif;border:4px solid black;border-radius:0;cursor:pointer;color:#000;background:#fff;box-shadow:10px 10px #000;transform:skew(-5deg);transition:all .1s;text-transform:uppercase;font-weight:100;letter-spacing:2px;position:relative;overflow:visible}.menu-btn:hover{transform:skew(-5deg) translate(-2px,-2px);box-shadow:14px 14px #000;background:#e9ae5a}.menu-btn:active{transform:skew(-5deg) translate(4px,4px);box-shadow:6px 6px #000}.big-btn{padding:25px 50px;font-size:2.5rem;min-width:250px}.story-mode-btn:hover,.endless-mode-btn:hover{background:#9ac3c8}.secondary-btn{padding:15px 30px;font-size:1.2rem;background:#eee;box-shadow:6px 6px #000}.secondary-btn:hover{box-shadow:8px 8px #000}@media(max-width:768px){.title-text{font-size:4rem;-webkit-text-stroke:2px black;text-shadow:3px 3px 0px #000}.main-buttons{flex-direction:column;gap:20px}.secondary-buttons{flex-direction:column;gap:15px}.big-btn{font-size:1.8rem;padding:20px 40px;box-shadow:8px 8px #000}.mode-switch-container{padding:10px 20px;gap:10px}.switch-label{font-size:1rem}}.credits-corner-btn{position:absolute;bottom:30px;right:30px;z-index:100}.credits-body{text-align:center;display:flex;flex-direction:column;gap:20px;margin:20px 0}.credit-section{font-family:Outfit,sans-serif;font-size:1.2rem;font-weight:700;color:#000;text-transform:uppercase}.credit-role{font-size:.9rem;color:#555;font-style:italic;font-weight:600}.main-credit{font-size:1.6rem;color:#e9ae5a;text-shadow:2px 2px 0px black;-webkit-text-stroke:1px black;transform:rotate(-1deg)}.main-credit a{color:#e9ae5a!important;padding-bottom:10px;line-height:35px}.main-credit a:hover{color:#9ac3c8!important}.main-credit .credit-role{color:#000;text-shadow:none;-webkit-text-stroke:0}.score-container{display:flex;flex-direction:column;align-items:center;gap:5px;margin:10px 0}.score-label{font-family:Outfit,sans-serif;font-size:1.2rem;font-weight:700;color:#000;text-transform:uppercase}.score-value{font-family:Impact,sans-serif;font-size:4rem;color:#e9ae5a;text-shadow:3px 3px 0px black;-webkit-text-stroke:1px black;transform:rotate(-2deg)}.input-container{display:flex;flex-direction:column;align-items:center;gap:10px;width:100%}.comic-input{font-family:Outfit,sans-serif;font-size:1.2rem;padding:10px;border:3px solid black;width:80%;text-align:center;text-transform:uppercase;font-weight:700;box-shadow:4px 4px #0003}.highscore-list{list-style:none;width:100%;max-height:50vh;overflow-y:auto;display:flex;flex-direction:column;gap:5px;padding:5px}.highscore-item{display:flex;justify-content:space-between;align-items:center;padding:5px 8px;background:#f0f0f0;border:2px solid black;box-shadow:2px 2px #0000001a;font-family:Outfit,sans-serif;font-weight:700;text-transform:uppercase;font-size:.9rem}.highscore-item:nth-child(1){background:#e9ae5a;transform:scale(1)}.highscore-item:nth-child(2){background:#d6d6d6}.highscore-item:nth-child(3){background:#cd7f32}.highscore-item .rank{font-family:Impact,sans-serif;font-size:1rem;width:30px}.highscore-item .name{flex-grow:1;text-align:left;padding-left:5px}.highscore-item .score{font-family:Impact,sans-serif;color:#e9ae5a;-webkit-text-stroke:1px black;font-size:1.2rem}.highscore-item:nth-child(1) .score,.highscore-item:nth-child(2) .score,.highscore-item:nth-child(3) .score{text-shadow:1px 1px 0px black}.loading,.empty{text-align:center;font-family:Outfit,sans-serif;font-style:italic;color:#555;padding:20px}#dialog-text{min-height:75px}@media(max-height:700px){.highscore-list{max-height:40vh}.comic-modal-content{padding:15px;gap:10px}.comic-title{font-size:1.8rem}#dialog-text{min-height:150px}}
