/* Mobile optimization — stacks nav/cards/grids, full-width inputs & buttons */
/* Reuses theme tokens: --bg #050508, --neon-cyan #00f3ff, --neon-gold #ffb700,
   --neon-pink #ff00aa, --line rgba(0,243,255,.28); fonts Inter/Righteous/VT323/Heebo */

/* === Global mobile guard (§2 backstop + root-cause caps) === */
html,body{max-width:100%;overflow-x:hidden}
img,svg,video,iframe,canvas{max-width:100%;height:auto}
*{-webkit-tap-highlight-color:transparent}

/* === Tablet / large phone (<=768px) === */
@media (max-width:768px){
  .container{padding:12px}
  .nav{flex-direction:column;align-items:stretch;gap:10px}
  .nav-links{display:flex;flex-direction:column;gap:8px}
  .nav-links .btn-outline{width:100%;min-width:0;font-size:15px;padding:12px 14px;min-height:44px}
  .card{padding:14px;margin:10px 0}
  .guides-grid{grid-template-columns:1fr;gap:12px}
  .cat-grid{grid-template-columns:1fr;gap:12px}
  .guide-card{width:100%}
  .asset-card{width:100%}
  .model-row{flex-direction:column;align-items:stretch;gap:10px}
  .model-row .btn-outline,.model-row .btn-gold{width:100%}
  input,textarea,select{width:100%;font-size:16px;min-height:44px;padding:10px 12px}
  .btn-gold,.btn-outline,.enter-btn{width:100%;font-size:16px;min-height:44px;padding:12px 16px}
  .footer-links{display:flex;flex-direction:column;gap:10px;align-items:center}
  .text-micro{margin-left:0}
  .loader-tagline{margin:8px 0;letter-spacing:.04em}
  .cat-card{min-height:64px}
}

/* === Small phone (<=480px) === */
@media (max-width:480px){
  .container{padding:8px}
  .logo{font-size:18px;text-align:center}
  .nav-links{gap:6px}
  .nav-links .btn-outline{font-size:14px;padding:10px 12px}
  .card{padding:12px;margin:8px 0}
  .cat-grid{gap:10px}
  .guide-img{height:120px}
  .guide-head{font-size:15px}
  .text-potato{font-size:40px}
  .text-micro{font-size:20px;letter-spacing:12px}
  .potato-svg{width:100px;height:133px}
  .field{margin-bottom:12px}
  .field label{display:block;font-size:14px;margin-bottom:4px}
  .enter-btn{padding:14px 20px}
  .btn-gold,.btn-outline{padding:12px 16px}
  .footer{padding:20px 12px}
  .footer-links{gap:8px}
  .loader-tagline{font-size:13px;letter-spacing:.03em}
  /* Post-login injected content: no overflow, wrap long words */
  .about-card,.legal-card,.keys-card,.pricing-card{overflow-wrap:break-word;word-break:break-word}
  .pricing-table{table-layout:fixed;width:100%;font-size:12px}
  .pricing-table th,.pricing-table td{padding:8px 10px}
}

/* === Tiny phone (<=360px) — tighten balance, keep >=44px targets === */
@media (max-width:360px){
  .container{padding:6px}
  .card{padding:10px;margin:6px 0}
  .text-potato{font-size:34px}
  .text-micro{font-size:18px;letter-spacing:8px}
  .potato-svg{width:84px;height:112px}
  .logo{font-size:16px}
  .section-title{font-size:22px}
}