#overlay{background:rgba(12,25,18,.72);backdrop-filter:blur(5px);padding:16px;overflow:auto}
#overlay .overlay-card{width:min(100%,510px);max-width:510px;max-height:100%;overflow:auto;padding:24px 32px 20px;border:20px solid transparent;border-image:url('Assets/kenney_ui-pack-pixel-adventure/Tiles/Large tiles/Thick outline/tile_0006.png') 8 fill / 20px / 0 stretch;image-rendering:pixelated;color:#3f382b;font-family:'Courier New',monospace;box-shadow:0 12px 32px #0005}
.menu-ribbon{height:64px;display:flex;align-items:center;justify-content:center;position:relative;margin:-14px auto 4px;width:min(100% - 32px,270px);background:url('Assets/kenney_ui-pack-pixel-adventure/Tiles/Large tiles/Thick outline/tile_0044.png') center/64px 64px repeat-x;isolation:isolate}
.menu-ribbon::before,.menu-ribbon::after{content:'';position:absolute;top:0;width:64px;height:64px;background-size:64px 64px;z-index:-1}.menu-ribbon::before{left:-32px;background-image:url('Assets/kenney_ui-pack-pixel-adventure/Tiles/Large tiles/Thick outline/tile_0043.png')}.menu-ribbon::after{right:-32px;background-image:url('Assets/kenney_ui-pack-pixel-adventure/Tiles/Large tiles/Thick outline/tile_0045.png')}.menu-ribbon span{color:#fff8df;letter-spacing:5px;font-size:34px;font-weight:900;text-shadow:2px 2px #8e3d37}
#overlay .eyebrow{color:#786047;font-size:9px;font-weight:bold;letter-spacing:1.5px;margin:9px 0 0}#overlay h2{font-size:24px;margin:8px 0 12px;letter-spacing:.5px;color:#403c31;text-transform:uppercase}#overlay p{color:#655a45;font:12px/1.6 Arial,sans-serif;max-width:350px;margin:auto}
.menu-hero{height:90px;position:relative;margin:6px auto 8px;max-width:270px}.menu-hero img{position:absolute;object-fit:contain;image-rendering:pixelated;filter:drop-shadow(3px 5px 0 #b09a6955)}.menu-hero .hero-player{width:65px;height:78px;left:calc(50% - 32px);top:6px;transform:rotate(-25deg)}.menu-hero .hero-enemy{width:35px;height:45px;right:13px;top:13px;transform:rotate(30deg)}.menu-hero .hero-letter{position:absolute;display:grid;place-items:center;width:32px;height:32px;border:7px solid transparent;border-image:url('Assets/kenney_ui-pack-pixel-adventure/Tiles/Large tiles/Thick outline/tile_0039.png') 8 fill / 7px / 0 stretch;font:bold 24px Arial,sans-serif;color:#87622a;image-rendering:pixelated}.menu-hero .letter-a{left:13px;top:6px}.menu-hero .letter-b{left:49px;top:46px}.menu-hero .letter-g{right:43px;top:56px}
#overlay .primary{border:12px solid transparent;border-image:url('Assets/kenney_ui-pack-pixel-adventure/Tiles/Large tiles/Thick outline/tile_0021.png') 8 fill / 12px / 0 stretch;background:transparent;color:#f8ffe7;min-height:58px;border-radius:0;padding:5px 12px;margin:14px 0 12px;font:700 16px 'Courier New',monospace;letter-spacing:1px;text-shadow:1px 2px #354638;image-rendering:pixelated;justify-content:center;gap:14px}
#overlay .primary span{font-size:22px}#overlay .instructions{display:block;color:#807053;font:9px/1.8 'Courier New',monospace}#overlay .menu-settings{gap:9px 12px;margin-top:16px}#overlay .menu-settings label{font-weight:bold;color:#6c563c;letter-spacing:1px;font-size:10px}#overlay .menu-settings select{border:8px solid transparent;border-image:url('Assets/kenney_ui-pack-pixel-adventure/Tiles/Large tiles/Thick outline/tile_0000.png') 8 fill / 8px / 0 stretch;background:#f6e6b8;color:#51402c;font:700 11px 'Courier New',monospace;border-radius:0;padding:4px;min-height:38px;color-scheme:light}#overlay .menu-settings button{border:8px solid transparent;border-image:url('Assets/kenney_ui-pack-pixel-adventure/Tiles/Large tiles/Thick outline/tile_0004.png') 8 fill / 8px / 0 stretch;background:transparent;color:#fff2cd;border-radius:0;padding:5px 7px;font:bold 10px 'Courier New',monospace;min-height:34px;image-rendering:pixelated;text-shadow:1px 1px #715232}#overlay .menu-settings input{accent-color:#a77439}#overlay .sound-setting{justify-self:stretch;grid-column:auto}#overlay #restart-run{grid-column:1/-1}#overlay .best-score{font-weight:bold;font-size:10px;color:#907b58;margin-top:15px}#overlay button:hover{filter:brightness(1.12)}#overlay button:active{transform:translateY(2px)}#overlay button:focus-visible,#overlay select:focus-visible,#overlay input:focus-visible{outline-color:#9a6329}
#overlay:not([data-mode='menu']):not([data-mode='ready']) .menu-hero{display:none}#overlay[data-mode='menu'] #restart-run,#overlay[data-mode='ready'] #restart-run{display:none}
@media(max-width:600px){#overlay{padding:10px}#overlay .overlay-card{padding:16px 12px 14px;border-width:14px;border-image-width:14px}.menu-ribbon{height:48px;background-size:48px 48px;width:min(100% - 24px,220px);margin:-8px auto 4px}.menu-ribbon::before,.menu-ribbon::after{width:48px;height:48px;background-size:48px 48px}.menu-ribbon::before{left:-24px}.menu-ribbon::after{right:-24px}.menu-ribbon span{font-size:28px}.menu-hero{height:70px;margin:0 auto 4px}.menu-hero .hero-player{width:53px;height:63px;top:3px}.menu-hero .letter-b{top:35px}.menu-hero .letter-g{top:39px}#overlay h2{font-size:20px;margin:6px 0 8px}#overlay .primary{min-height:50px;margin:12px 0 8px}#overlay .menu-settings{margin-top:10px;gap:6px 8px}#overlay .instructions{font-size:8px}#overlay .best-score{margin-top:10px}}
/* Larger text across desktop and mobile menus. */
#overlay .overlay-card{width:min(100%,560px);max-width:560px}#overlay .eyebrow{font-size:13px}#overlay h2{font-size:28px}#overlay p{font-size:15px}#overlay .primary{font-size:20px}#overlay .instructions{font-size:13px;line-height:1.6}#overlay .menu-settings label{font-size:14px}#overlay .menu-settings select{font-size:15px;min-height:44px}#overlay .menu-settings button{font-size:14px;min-height:42px}#overlay .best-score{font-size:14px}.menu-hero{height:78px}#overlay .menu-settings{grid-template-columns:140px minmax(0,1fr)}
@media(max-width:600px){#overlay h2{font-size:25px}#overlay .primary{font-size:18px}#overlay .instructions{font-size:12px}#overlay .eyebrow{font-size:12px}#overlay .menu-settings{grid-template-columns:130px minmax(0,1fr)}#overlay .menu-settings label{font-size:13px}#overlay .menu-settings select{font-size:14px}#overlay .menu-settings button{font-size:13px}#overlay .best-score{font-size:13px}.menu-hero{height:65px}}
.menu-ribbon span{letter-spacing:2px;font-size:30px}@media(max-width:600px){.menu-ribbon span{font-size:24px;letter-spacing:1px}}
