.game-container {width: 400px;background-color: #000000c4;padding: 5px 15px;position: fixed;left: 0;top: 0;z-index: 9999;margin: 0 auto;display: block;right: 0;height: 100dvh;display: flex;align-items: center;flex-direction: column;overflow: hidden;justify-content: center;}.desktop-only {display: block;}.disabled-slide {filter: grayscale(100%) blur(2px);pointer-events: none;}.blur {position: fixed;top: 0;left: 0;width: 100%;height: 100%;backdrop-filter: blur(10px);background-color: rgba(0, 0, 0, 0.4);z-index: 999;pointer-events: none;}header {text-align: center;width: 100%;}h1 {font-family: 'Press Start 2P', cursive;font-size: 24px;color: #4cc9f0;text-shadow: 0 0 10px rgba(76, 201, 240, 0.5);margin-bottom: 15px;}.score-container {display: flex;justify-content: center;font-family: 'Press Start 2P', cursive;font-size: 12px;gap: 20px;align-items: center;}.score-container strong {color: yellow;}.score-container span {background-color: rgba(0, 0, 0, 0.3);}.button-close-modal-card {top: 10px;right: 10px;background: #000;border: 2px solid #00acc1;color: #00acc1;font-family: 'Press Start 2P';padding: 5px 0px;cursor: pointer;width: 30px;height: 30px;position: absolute;}.instructions {text-align: center;padding: 0px 10px;}.instructions h2 {font-size: 22px;margin-top: 20px;margin-bottom: 20px;color: #03a9f4;line-height: 25px;}.instructions p {font-size: 14px;margin-bottom: 30px;}.close-game {position: absolute;right: 20px;top: 20px;}.game-area {display: none;flex-direction: column;align-items: center;gap: 30px;}.description-card {width: 400px;padding: 10px;box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);text-align: center;margin-top: 20px;border-top: 1px dashed #fff;border-bottom: 1px dashed #fff;height: 115px;display: flex;align-items: center;justify-content: center;}.description-card h3 {font-size: 18px;margin-bottom: 5px;color: #f1faee;font-family: "Arial";}.description-card p {font-size: 12px;line-height: 1.5;padding: 0;margin: 0;}@keyframes wobble {0% {transform: translateX(0);}15% {transform: translateX(-5px) rotate(-2deg);}30% {transform: translateX(5px) rotate(2deg);}45% {transform: translateX(-5px) rotate(-2deg);}60% {transform: translateX(5px) rotate(2deg);}75% {transform: translateX(-5px) rotate(-1deg);}100% {transform: translateX(0);}}.wobble {animation: wobble 0.6s ease;}.swiper-container {width: 400px;height: 315px;}.swiper-pagination-bullet {background-color: #fff;}.swiper-slide {width: 165px;height: 252px;background-color: #f1faee;border-radius: 8px;box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);display: flex;flex-direction: column;justify-content: center;align-items: center;color: #1d3557;transition: transform 0.3s ease;cursor: pointer;position: relative;overflow: hidden;}.swiper-slide::before {content: '';position: absolute;bottom: 0;left: 0;width: 100%;height: 30px;background-color: #e63946;}.swiper-slide.selected {transform: translateY(-10px);box-shadow: 0 15px 30px rgba(0, 0, 0, 0.4);border: 3px solid #4cc9f0;}.status-code {font-size: 48px;font-weight: bold;margin-top: 20px;font-family: 'Press Start 2P';}.status-name {font-size: 15px;margin-top: 10px;text-align: center;padding: 0 10px;font-family: "Arial";}.status-1xx::before {background-color: #8338ec;}.status-2xx::before {background-color: #06d6a0;}.status-3xx::before {background-color: #ffbe0b;}.status-4xx::before {background-color: #e63946;}.status-5xx::before {background-color: #fb5607;}.action-buttons {display: flex;gap: 20px;margin-top: 20px;}#start-game {background-color: #f72585;font-size: 20px;padding: 15px 40px;margin-top: 20px;}#start-game:hover {background-color: #b5179e;}#skip-question {background-color: #fff;color: #000;}#skip-question:hover {background-color: #333;color: #fff;}.feedback-overlay {position: fixed;top: 0;left: 0;width: 100%;height: 100%;background-color: rgba(0, 0, 0, 0.8);display: flex;justify-content: center;align-items: center;z-index: 1000;opacity: 0;visibility: hidden;transition: all 0.3s ease;}.feedback-overlay.active {opacity: 1;visibility: visible;}.feedback-content {background-color: #1a1a2e;padding: 30px;border-radius: 15px;text-align: center;max-width: 500px;width: 90%;box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5);transform: scale(0.8);transition: transform 0.3s ease;}.feedback-overlay.active .feedback-content {transform: scale(1);}.feedback-content h2 {font-size: 32px;margin-bottom: 20px;}.feedback-content h2.correct {color: #06d6a0;}.feedback-content h2.wrong {color: #e63946;}.feedback-content p {font-size: 18px;margin-bottom: 30px;line-height: 1.6;}.game-over {position: absolute;top: 0;left: 0;width: 100%;height: 100%;background-color: rgba(0, 0, 0, 0.9);display: flex;flex-direction: column;justify-content: center;align-items: center;z-index: 900;opacity: 0;visibility: hidden;transition: all 0.5s ease;border-radius: 15px;}.game-over.active {opacity: 1;visibility: visible;}.game-over h2 {font-family: 'Press Start 2P', cursive;font-size: 25px;color: #f72585;margin-bottom: 30px;text-shadow: 0 0 10px rgba(247, 37, 133, 0.5);}.game-over h2.game-finished-title {color: #4CAF50;text-shadow: 0 0 10px #4CAF50;}.game-over p {font-size: 16px;margin-bottom: 0px;}.lives-container {display: flex;gap: 4px;align-items: center;}.heart {width: 24px;height: 24px;image-rendering: pixelated;}#play-again {margin-top: 30px;background-color: #4cc9f0;font-size: 12px;color: #000;}.audio-controls {position: absolute;top: 20px;right: 20px;}.audio-controls button {width: 40px;height: 40px;border-radius: 50%;padding: 0;display: flex;justify-content: center;align-items: center;font-size: 20px;background-color: rgba(255, 255, 255, 0.2);}.swiper-button-next, .swiper-button-prev {color: #fff;}@media (max-width: 768px) {.swiper-container {width: 100%;}.game-over h2 {margin-bottom: 10px;font-size: 21px;}.desktop-only {display: none;}.feedback-content p {font-size: 13px;}.feedback-content h2 {font-size: 24px;}.description-card {width: 300px;}.game-container {width: 100%;}.instructions h2 {font-size: 16px;}.swiper-container {height: 250px;}.swiper-slide {width: 160px;height: 200px;}.status-code {font-size: 36px;}.action-buttons {gap: 10px;}button {padding: 10px;font-size: 11px;}}@media (max-width: 480px) {.game-container {padding: 15px;}h1 {font-size: 16px;}.score-container {font-size: 14px;}.swiper-container {height: 220px;}.swiper-slide {width: 140px;height: 180px;}.status-code {font-size: 25px;}}@keyframes pulse {0% {transform: scale(1);}50% {transform: scale(1.05);}100% {transform: scale(1);}}.pulse {animation: pulse 0.5s ease-in-out;}