:root{--blue: #91cdf2;--lavender: #d0d0ff;--orange: #ffd3ad;--pink: #ffbad1;--red: #ff2b2b;--yellow: #faedb9;--black: #000;--black-2: #0c0c0c;--dark-gray: #222;--medium-gray-4: #ccc;--medium-gray-3: #555;--medium-gray-2: #e6e6e6;--medium-gray: #eee;--light-gray: #f1f1f1;--white: #fff;--bg-color: var(--white);--text-color: var(--black);--square-snake-color: var(--dark-gray);--square-food-color: var(--red);--button-bg-color: var(--black);--button-text-color: var(--white);--button-hover-bg: var(--black);--button-hover-text: var(--white);--button-active-bg: var(--blue);--button-active-text: var(--white);--board-bg-light: var(--light-gray);--board-bg-white: var(--white);--menu-bg: var(--white);--accent-color: var(--blue);--block-color: var(--black);--button-border-color: var(--black);--space-xs: .36em;--space-sm: .6em;--space-md: 1.8em;--square-edge-length: min(96vw, 66vh);--square-edge-length-full: min(96vw, 86vh);--content-middle-row-height-max: max(100%, 66vh);--content-middle-row-no-gamepad-max: max(100%, 86vh);--constraint-width: 96vw}:root.dark-theme{--bg-color: var(--dark-gray);--text-color: var(--lavender);--square-snake-color: var(--lavender);--square-food-color: #ff6b6b;--button-bg-color: var(--lavender);--button-text-color: var(--dark-gray);--button-hover-bg: #ddd;--button-hover-text: var(--dark-gray);--button-active-bg: var(--lavender);--button-active-text: var(--dark-gray);--board-bg-light: #3a3837;--board-bg-white: var(--dark-gray);--menu-bg: var(--dark-gray);--accent-color: var(--lavender);--block-color: #ddd;--button-border-color: #ddd}body{margin:0;overflow:hidden}#root{height:100vh;display:flex;flex-direction:column}.main-content-container{flex:1;display:flex;justify-content:space-around}.gamepad-controls-container{position:relative;display:none}.gamepad-controls-container.gamepad-responsive,.gamepad-controls-container.gamepad-on{display:block;height:20vh}@media (min-width: 768px){.gamepad-controls-container.gamepad-responsive{display:none}}.main-content-container-inner{position:relative;width:100vw;display:flex;flex-direction:column;justify-content:center;align-items:center;z-index:1;background:var(--bg-color)}.content-top-row{flex-shrink:0;display:flex;justify-content:space-between;align-items:center;width:96vw;height:6vh;margin:.5vh 0}.content-middle-row{display:flex;flex-direction:column;justify-content:space-around;position:relative;width:96vw;height:66vh}.gamepad-off .content-middle-row{height:86vh}@media (min-width: 768px){.gamepad-responsive .content-middle-row{height:86vh}}.content-bottom-row{display:grid;justify-content:space-around;align-items:center;box-sizing:border-box;position:relative;width:96vw;height:6vh;margin:.5vh 0}.bg-board{position:absolute;top:50%;left:0;right:0;transform:translateY(-50%);display:grid;max-height:var(--content-middle-row-height-max);margin:0 auto;max-width:96vw}.gamepad-off .bg-board{max-height:var(--content-middle-row-no-gamepad-max)}@media (min-width: 768px){.gamepad-responsive .bg-board{max-height:var(--content-middle-row-no-gamepad-max)}}.bg-board>div{aspect-ratio:1 / 1}.bg-square-dark{background:repeating-linear-gradient(-45deg,var(--board-bg-light),var(--board-bg-light) 2px,var(--board-bg-white) 2px,var(--board-bg-white) 4px)}.board{position:absolute;top:50%;left:0;right:0;transform:translateY(-50%);display:grid;gap:1px;max-height:var(--content-middle-row-height-max);margin:0 auto}.gamepad-off .board{max-height:var(--content-middle-row-no-gamepad-max)}@media (min-width: 768px){.gamepad-responsive .board{max-height:var(--content-middle-row-no-gamepad-max)}}.menu.main-content-container{position:absolute;width:100vw;height:80vh;background:var(--menu-bg);display:flex;z-index:2}.menu.main-content-container.gamepad-off{height:100vh}@media (min-width: 768px){.menu.main-content-container.gamepad-responsive,.menu.main-content-container.gamepad-off{height:100vh}}.menu .content-top-row>div{display:flex}.menu .content-bottom-row{display:flex;justify-content:center}.menu .content-bottom-row .button-update-setting{margin:0 min(2vw,2vh)}.square{aspect-ratio:1 / 1}.square.snake{background:var(--square-snake-color);z-index:1}.square.food{background:var(--square-food-color);z-index:1}.square.flash{background:var(--yellow)}button{display:block;padding:0;margin:0;background:none;border:none;cursor:pointer;line-height:0;font-size:0}.button-toggle-menu{position:absolute;padding:min(8vw,8vh);top:0;right:0;z-index:3}@media (min-width: 768px){.button-toggle-menu{padding:min(4vw,4vh)}}@media (min-width: 768px){.button-toggle-menu{padding:min(2vw,2vh)}}.button-toggle-menu .len-9-chars-grid .block-1{background:var(--light-gray)}.button-toggle-menu:hover .len-9-chars-grid .block-1{background:var(--medium-gray-2)}.button-navigate .len-9-chars-grid .block-1{background:var(--block-color)}.button-navigate:hover .len-9-chars-grid .block-1{background:var(--medium-gray-3)}.button-update-setting{padding:min(1vw,1vh);border:min(1vw,1vh) solid var(--button-border-color)}.button-update-setting+.button-update-setting{margin-left:2vw}.button-update-setting.isActive{border:min(1vw,1vh) solid var(--accent-color);background:var(--button-active-bg)!important}.button-update-setting.isActive .len-9-chars-grid .block-1{background:var(--button-active-text)}.button-update-setting.isActive:hover{cursor:default}.button-update-setting:hover{background:var(--button-hover-bg)}.button-update-setting .len-9-chars-grid .block-1{background:var(--block-color)}.button-update-setting:hover .len-9-chars-grid .block-1{background:var(--button-hover-text)}.len-9-chars-grid{display:grid;grid-auto-rows:1fr}.gamepad-on .marquee-messages-row .marquee-desktop,.gamepad-off .marquee-messages-row .marquee-gamepad{display:none}@media (min-width: 768px){.gamepad-off .marquee-messages-row .marquee-gamepad,.gamepad-responsive .marquee-messages-row .marquee-gamepad{display:none}}@media (max-width: 767px){.gamepad-on .marquee-messages-row .marquee-desktop,.gamepad-responsive .marquee-messages-row .marquee-desktop{display:none}}.len-9-chars-grid:before{content:"";width:0;padding-bottom:100%;grid-row:1 / 1;grid-column:1 / 1}.len-9-chars-grid .block-1:first-child,.len-9-chars-grid .block:first-child{grid-row:1 / 1;grid-column:1 / 1}.block-1,.active-setting .block-1{background:var(--block-color)}.active-setting-value .block-1{background:var(--accent-color)}.high-score .block-1{background:var(--light-gray)}.high-score.isHighScore .block-1{background:var(--orange)}.hit-area-container{position:absolute;top:50%;left:50%;width:200vw;height:200vw;flex-direction:column;transform:rotate(45deg) translate(-50%) translateY(-50%);transform-origin:top left;display:none;background:var(--black)}.hit-area-container.gamepad-responsive,.hit-area-container.gamepad-on{display:flex}@media (min-width: 768px){.hit-area-container.gamepad-responsive{display:none}}.hit-area-row{display:flex;flex:1}.hit-area-up,.hit-area-left,.hit-area-right,.hit-area-down{flex:1}.hit-area-up,.hit-area-down{background:var(--black)}.hit-area-left,.hit-area-right{background:var(--dark-gray)}