/* Mobile-only responsive layout; desktop styling remains unchanged. */
@media (max-width: 700px) {
  html,body { width:100%; max-width:100%; overflow-x:hidden; }
  body { height:auto; min-height:100dvh; overflow-x:hidden; overflow-y:auto; }
  #shared-header .site-header { position:relative !important; top:auto; left:auto; right:auto; width:100%; height:auto !important; min-height:70px; padding:12px 12px !important; gap:7px !important; align-items:center !important; justify-content:space-between !important; background:rgba(2,15,40,.88) !important; }
  #shared-header .brand { min-width:0; flex:0 1 auto; }
  #shared-header .brand img { width:clamp(98px,29vw,145px) !important; max-width:100%; height:auto; }
  #shared-header .main-nav { flex:0 0 auto; gap:4px !important; padding-top:0 !important; }
  #shared-header .nav-link { min-width:0 !important; min-height:34px !important; padding:7px 8px !important; font-size:11px !important; gap:3px !important; border-radius:10px !important; white-space:nowrap; }
  #shared-header .dropdown-menu { right:0 !important; max-width:calc(100vw - 24px); }
  .backdrop { background-size:contain !important; background-position:center 90px !important; background-repeat:no-repeat !important; }
  .home { min-height:calc(100dvh - 70px); height:auto !important; display:flex; flex-direction:column; justify-content:flex-end; padding:0 12px 25px; }
  .home .features { position:relative !important; left:auto !important; bottom:auto !important; transform:none !important; width:100% !important; grid-template-columns:repeat(2,minmax(0,1fr)) !important; gap:10px !important; margin-top:clamp(280px,58vh,620px); }
  .home .feature { min-height:92px !important; font-size:12px !important; padding:10px 6px !important; }
  .home .feature svg { width:30px !important; height:30px !important; }
  .home .feature:last-child { grid-column:1/-1; }
  .home .tip { z-index:3; max-width:190px; }
  .tv-content { width:100% !important; max-width:100% !important; padding:30px 18px 50px !important; margin:0 !important; }
  .tv-actions { grid-template-columns:repeat(2,minmax(0,1fr)) !important; gap:10px !important; }
  .tv-title { font-size:clamp(30px,9vw,48px) !important; }
  .tv-detail { max-width:100%; }
  .page { min-height:100dvh; }
  .page main { padding:32px 16px 55px !important; display:block !important; }
  .page .content { width:100% !important; max-width:100% !important; padding:0 !important; margin:0 !important; }
  .page h1 { font-size:clamp(29px,8vw,42px) !important; white-space:normal !important; overflow-wrap:anywhere; }
  .page .heading { padding-left:12px !important; margin-bottom:24px !important; }
  .page .tagline { font-size:15px !important; line-height:1.5; }
  .page .features { grid-template-columns:repeat(2,minmax(0,1fr)) !important; gap:10px !important; }
  .page .feature { width:100% !important; min-width:0 !important; height:116px !important; }
  .page .detail, .page .store, .page .intro, .page .contact-panel { width:100% !important; max-width:100% !important; }
  .page .actions { display:flex; flex-wrap:wrap; gap:10px; }
  .page .action { max-width:100%; }
  .page .preview { position:static !important; max-width:100%; }
}
@media (max-width:370px) {
  #shared-header .brand img { width:94px !important; }
  #shared-header .nav-link { font-size:10px !important; padding:6px !important; }
}