/* Neon Snake — oscilloscope-grid identity */
#menuScreen{padding:0;background:#07100a;overflow:hidden}
#menuScreen::before{content:'';position:absolute;inset:7%;background:repeating-linear-gradient(0deg,rgba(103,255,142,.09) 0 1px,transparent 1px 26px),repeating-linear-gradient(90deg,rgba(103,255,142,.09) 0 1px,transparent 1px 26px);border:2px solid #295d37;box-shadow:inset 0 0 50px #020604,0 0 30px rgba(74,255,117,.08);border-radius:22px}
#menuScreen::after{content:'TRACE A  5ms/div   GRID LOCK';position:absolute;left:10%;top:10%;color:#78f5a0;font:700 .68rem/1 ui-monospace,monospace;letter-spacing:.16em}
#menuScreen .screen-panel{position:absolute;inset:0;width:100%;max-width:none;padding:0;background:transparent;border:0;box-shadow:none;text-align:left}
#menuScreen .eyebrow{position:absolute;left:10%;top:16%;color:#57d77e;background:transparent;border:0;padding:0;letter-spacing:.18em;font-family:ui-monospace,monospace}
#menuScreen h1,#menuScreen h2{position:absolute;left:10%;top:22%;margin:0!important;background:none!important;color:#b8ffc9!important;text-shadow:0 0 20px rgba(86,255,128,.45)!important;font:900 clamp(3rem,8vw,6rem)/.8 ui-monospace,monospace!important;letter-spacing:-.04em!important;max-width:52%}
#menuScreen h1::after,#menuScreen h2::after{content:'▰▰▰▰▰▰▰▰';display:block;margin-top:18px;color:#53ff84;font-size:.24em;letter-spacing:.35em;text-shadow:0 0 14px #53ff84}
#menuScreen .subtitle,#menuScreen p{position:absolute;left:10%;top:47%;width:min(42vw,500px);margin:0;color:#84b693;font-family:ui-monospace,monospace;line-height:1.45}
#menuScreen .menu-actions{position:absolute;right:10%;top:18%;width:min(28vw,320px);display:flex;flex-direction:column;gap:9px}
#menuScreen .menu-actions button{min-height:48px;border-radius:2px!important;border:1px solid #347147!important;background:#0a170e!important;color:#9effb7!important;box-shadow:inset 5px 0 0 #45d975!important;text-align:left;padding:.6rem .75rem!important;font:800 .7rem/1 ui-monospace,monospace!important;letter-spacing:.1em;text-transform:uppercase}
#menuScreen .menu-actions .primary-btn,#menuScreen #quickStartBtn,#menuScreen #introStartBtn{min-height:72px;background:#9effb7!important;color:#07110a!important;border-color:#d7ffe2!important;box-shadow:0 0 28px rgba(99,255,141,.18)!important;font-size:.88rem!important}
#pauseScreen .screen-panel{background:#07100a!important;border-radius:2px!important;border:2px solid #4ca966!important;box-shadow:0 0 28px rgba(80,255,124,.12)!important;text-align:left!important}
#gameOverScreen .screen-panel{background:#b9f9c9!important;color:#0a150d!important;border-radius:2px!important;border:0!important;border-left:10px solid #347147!important;box-shadow:none!important;text-align:left!important}
@media(max-width:680px){#menuScreen::before{inset:4%}#menuScreen h1,#menuScreen h2{left:7%;top:18%;max-width:86%;font-size:clamp(2.7rem,14vw,4.8rem)!important}#menuScreen .eyebrow{left:7%;top:12%}#menuScreen .subtitle,#menuScreen p{left:7%;top:41%;width:43%;font-size:.66rem}#menuScreen .menu-actions{right:6%;top:auto;bottom:8%;width:49%}#menuScreen .menu-actions button{min-height:41px;font-size:.56rem!important}#menuScreen .menu-actions .primary-btn,#menuScreen #quickStartBtn,#menuScreen #introStartBtn{min-height:53px}}

@media(max-height:480px) and (orientation:landscape){
  #menuScreen{overflow:auto!important;padding:18px 20px 12px!important}
  #menuScreen::before{inset:3%!important;border-radius:12px!important}
  #menuScreen::after{left:5%!important;top:9px!important;font-size:.48rem!important;letter-spacing:.1em!important}
  #menuScreen .screen-panel{position:relative!important;inset:auto!important;width:min(94vw,900px)!important;max-width:900px!important;min-height:0!important;margin:auto!important;padding:10px!important;display:grid!important;grid-template-columns:minmax(0,1fr) minmax(300px,.82fr)!important;grid-template-areas:'eyebrow actions' 'title actions' 'copy actions';column-gap:20px!important;row-gap:6px!important;overflow:visible!important}
  #menuScreen .eyebrow,#menuScreen h1,#menuScreen h2,#menuScreen .subtitle,#menuScreen p,#menuScreen .menu-actions{position:static!important;left:auto!important;right:auto!important;top:auto!important;bottom:auto!important;width:auto!important;max-width:none!important;margin:0!important}
  #menuScreen .eyebrow{grid-area:eyebrow!important;font-size:.54rem!important}
  #menuScreen h1,#menuScreen h2{grid-area:title!important;font-size:clamp(2rem,10vh,3.1rem)!important;line-height:.82!important}
  #menuScreen h1::after,#menuScreen h2::after{margin-top:7px!important;font-size:.18em!important}
  #menuScreen .subtitle,#menuScreen p{grid-area:copy!important;font-size:.6rem!important;line-height:1.35!important}
  #menuScreen .menu-actions{grid-area:actions!important;align-self:center!important;display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:6px!important}
  #menuScreen .menu-actions button{min-width:0!important;min-height:36px!important;padding:.45rem .55rem!important;font-size:.52rem!important}
  #menuScreen .menu-actions .primary-btn,#menuScreen #quickStartBtn,#menuScreen #introStartBtn{grid-column:1/-1!important;min-height:44px!important}
  #pauseScreen,#gameOverScreen{overflow:auto!important;padding:8px!important}
  #pauseScreen .screen-panel,#gameOverScreen .screen-panel{max-height:none!important;margin:auto!important;padding:10px 14px!important}
}