/* === MOBILE RESPONSIVENESS FIX === */
@media(max-width:768px){
  /* Ensure content is visible on mobile */
  .main{margin-top:98px!important;padding:10px!important;position:relative;z-index:1}
  .mode.active{display:block!important;min-height:50vh}
  /* Three.js too heavy on mobile — hide */
  #three-canvas{display:none!important}
  /* Hide heavy overlays on mobile */
  .lain-noise-overlay,.cyber-scanline-overlay{display:none!important}
  /* Ensure nav-tabs scroll properly */
  .nav-tabs{overflow-x:auto!important;flex-wrap:nowrap!important;-webkit-overflow-scrolling:touch}
  /* Fix powers panel on mobile */
  #powers-panel{bottom:10px;right:10px}
  #powers-drawer{width:280px!important;max-height:60vh!important}
  #anim-toggle{bottom:10px;left:10px;width:36px;height:36px;font-size:1rem}
  /* Fix combo meter on mobile */
  #combo-meter{font-size:2rem!important}
  /* Fix welcome screen scrollability on mobile */
  #aot-welcome{overflow-y:auto!important;-webkit-overflow-scrolling:touch}
  .aot-content{padding:20px 16px 40px!important}
  .aot-hero-img img{height:140px!important}
  .aot-stats{grid-template-columns:repeat(2,1fr)!important;gap:8px!important}
  .aot-enter{padding:12px 28px!important}
  .aot-enter-text{font-size:.85rem!important}
  /* Cards readable on mobile */
  .card,.tricky-card,.code-lab-card,.exam-card,.oral-card{padding:14px!important;margin-bottom:10px!important}
  .card h2{font-size:.95rem!important}
  .card p,.card li{font-size:.8rem!important}
  /* Scroll intensity bar hidden on mobile */
  #scroll-intensity{display:none}
}
