/* Meta Upgrades: hard override to avoid menu background covering content */

#meta-screen{position:fixed!important;inset:0!important;z-index:5000!important;display:none;}
#meta-screen.active{display:flex!important;flex-direction:column;align-items:center;justify-content:flex-start;padding:48px 20px 28px;box-sizing:border-box;}

/* Ensure the background is behind everything */
#meta-screen .menu-background{position:absolute!important;inset:0!important;z-index:0!important;pointer-events:none!important;}

/* Put actual UI above */
#meta-screen .screen-header,
#meta-screen #meta-shop-list,
#meta-screen .screen-footer{position:relative!important;z-index:1!important;width:min(780px,92vw);}

#meta-screen .screen-header{margin-bottom:18px;text-align:center;}
#meta-screen .screen-header h2{margin:0 0 8px 0;}

#meta-screen #meta-shop-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px;max-height:calc(100vh - 170px);overflow:auto;padding:6px 2px;}

/* If your JS uses these classes, they will look good. If not, no harm. */
#meta-screen .meta-card{background:rgba(0,0,0,0.55);border:2px solid rgba(140,120,255,0.65);border-radius:10px;padding:14px;box-sizing:border-box;}
#meta-screen .meta-card h3{margin:0 0 8px 0;font-size:14px;}
#meta-screen .meta-card p{margin:6px 0;font-size:11px;opacity:0.9;}
#meta-screen .meta-row{display:flex;justify-content:space-between;gap:10px;font-size:11px;margin:8px 0;opacity:0.95;}

#meta-screen .screen-footer{display:flex;justify-content:center;margin-top:18px;}
#meta-screen #btn-meta-back{min-width:220px;}