:root{--font-stack: Inter, system-ui, Avenir, Helvetica, Arial, sans-serif;--color-dark: #181818;--color-light: whitesmoke;--color-accent: #0d0d35;--color-school: #3e536c;--color-menu-border: #5f748d;--color-quiz: #6e5fa6;--color-quiz-border: #4f3f92}*{margin:0;padding:0;box-sizing:border-box}html,body{width:100%;height:100vh;overflow:hidden;font-family:var(--font-stack);background:#253544 url(/game/menu/bg_menu/bg_menu_2x.webp) center/cover no-repeat;display:flex;align-items:center;justify-content:center}.top-badge{position:absolute;top:0;z-index:1000;display:flex;align-items:center;justify-content:center;width:min-content;padding:20px;color:#fff;font-weight:700;white-space:nowrap;font-size:clamp(14px,5vw,32px)}.school-name{left:0;border-radius:0 0 26px;background-color:var(--color-school)}.quiz-button{right:0;cursor:pointer;border-radius:0 0 0 26px;background-color:var(--color-quiz);border:solid var(--color-quiz-border);border-width:0 0 4px 4px}.game-menu{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;padding:0 87px}.game-menu-title{color:#fff;font-family:Noto Sans,sans-serif;font-size:clamp(28px,5vw,50px);font-weight:800;line-height:1.2;letter-spacing:2px;text-align:center;margin-bottom:clamp(30px,5vh,60px);margin-top:100px}.game-menu-landscape{display:flex;width:100%;justify-content:center;align-items:center}.game-menu-portrait{display:none;width:100%}.game-menu a{width:100%;margin:1%;display:block;border-radius:30px;transition:box-shadow .3s ease,transform .3s ease}.game-menu img{width:100%;border-radius:30px;border:6px solid var(--color-menu-border);display:block;transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease}.game-menu a:hover img{border-color:var(--color-light);box-shadow:0 0 8px 2px #fff6,0 0 15px 3px #fff3;transform:scale(1.05)}.game-menu-item.disabled img{filter:grayscale(100%);opacity:.2;pointer-events:none}.game-canvas-group,.game-canvas-1,.game-canvas-2,.game-canvas-3{display:none;opacity:0}.game-canvas-group{width:100%;height:100%}.game-canvas-1,.game-canvas-2{width:1080px;height:1920px}.game-canvas-3{width:1920px;height:1080px}@media (max-width: 1080px){.game-menu-landscape{display:none}.game-menu{padding:2vh 5vw 4vh 5vw;max-height:100vh;overflow:hidden}.game-menu-title{margin-bottom:clamp(2vh,3vh,40px)}.game-menu-portrait{display:flex;flex-direction:column;gap:2vh;padding:0 20px 3vh}.game-menu a{margin:0}.game-menu img{max-width:min(75vw,calc((100vh - 20vh) / 3 * 1.4));margin:0 auto}}@media (max-width: 600px){.top-badge{padding:15px 20px;font-size:clamp(16px,4vw,24px)}.game-menu{padding:0 4vw;justify-content:center}.game-menu-title{margin-top:calc(15px + 4vw + 2vh);margin-bottom:2vh}.game-menu-portrait{gap:1vh;padding-bottom:calc(15px + 4vw + 4vh)}.game-menu a{border-radius:20px}.game-menu img{max-width:min(85vw,calc((100vh - 180px) / 3 * 1.4));border-radius:20px;border-width:4px}.school-name{width:100%;left:0;border-radius:0;justify-content:center}.quiz-button{position:fixed;top:auto;bottom:2vh;right:auto;left:50%;transform:translate(-50%);width:calc(100% - 8vw);max-width:400px;border-radius:15px;border-width:4px;justify-content:center}}@media (max-width: 400px){.top-badge{font-size:clamp(14px,3.5vw,20px);padding:12px 15px}.game-menu{padding:0 3vw}.game-menu-title{margin-top:calc(15px + 3vw + 1.5vh);margin-bottom:1.5vh}.game-menu-portrait{padding-bottom:calc(15px + 3vw + 3.5vh)}.game-menu a{border-radius:15px}.game-menu img{max-width:min(90vw,calc((100vh - 200px) / 3 * 1.4));border-radius:15px;border-width:3px}.quiz-button{width:calc(100% - 6vw);border-radius:12px}}@media (max-height: 600px) and (orientation: landscape){.game-menu{padding:1vh 3vw}.game-menu-title{font-size:clamp(20px,3vw,30px);margin-top:60px;margin-bottom:1vh}.top-badge{font-size:clamp(12px,2.5vw,18px);padding:10px 15px}.game-menu-landscape{display:flex}.game-menu-portrait{display:none}.game-menu-landscape a{margin:0 1%}.game-menu img{border-radius:15px;border-width:3px;max-height:50vh}}