@media(max-width:900px){

  /* ── App nav: compress on small screens ── */
  .app-nav{
    padding:0.6rem 1rem;
    flex-wrap:wrap;
    gap:0.4rem;
  }
  .app-logo{
    font-size:0.85rem;
    flex:1;
  }
  .app-close{
    padding:0.3rem 0.6rem;
    font-size:0.58rem;
  }
  .app-tabs{
    order:3;
    width:100%;
    overflow-x:auto;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
    gap:0;
    border-top:1px solid var(--border);
    padding-top:0.25rem;
  }
  .app-tabs::-webkit-scrollbar{ display:none }
  .app-tab{
    font-size:0.58rem;
    padding:0.5rem 0.75rem;
    white-space:nowrap;
    letter-spacing:0.06em;
  }
  #auth-user-strip{
    order:2;
    font-size:0.58rem;
    gap:0.4rem;
  }
  #auth-user-strip #auth-user-email{
    display:none; /* hide email on mobile — too long */
  }

  /* ── App body padding ── */
  .app-body{ padding:1rem; }

  /* ── Header cards: 2x2 grid on mobile ── */
  .app-grid{ grid-template-columns:repeat(2,1fr) !important; gap:0.6rem; }

  /* ── Scanner button ── */
  .scan-btn{ font-size:0.78rem; padding:0.75rem 1.25rem; }

  /* ── Signal table: HIDE on mobile, show cards instead ── */
  .app-table-head{ display:none !important; }

  .app-row{
    display:flex !important;
    flex-direction:column !important;
    min-width:0 !important;
    padding:1rem !important;
    border-bottom:1px solid var(--border);
    gap:0.5rem;
  }

  /* Card header row: stock name + score badge */
  .ar-stock{
    font-size:1rem;
    padding-left:0 !important;
  }
  .ar-score{
    position:absolute;
    top:1rem;
    right:1rem;
    font-size:0.7rem;
    font-weight:700;
  }

  /* Price row */
  .ar-val{
    font-size:0.78rem;
    text-align:left !important;
  }

  /* On mobile: make each .app-row position:relative so score badge floats */
  .app-row{ position:relative !important; }

  /* ── RS rows on mobile: undo display:contents, stack like other signal cards ── */
  .rs-row{
    grid-template-columns:unset !important;
    min-width:0 !important;
  }
  /* Undo display:contents for ALL mobile wrapper rows on mobile — force flex layout */
  .app-row .mobile-price-row,
  .app-row .mobile-meta-row,
  .rs-row  .mobile-price-row,
  .rs-row  .mobile-meta-row{
    display:flex !important;
    gap:1rem;
    flex-wrap:wrap;
  }

  /* ── News sentiment grid ── */
  #tab-news [style*="grid-template-columns:1fr 1fr 1fr"]{
    grid-template-columns:1fr !important;
  }

  /* ── Dashboard cards ── */
  #dash-cards{
    grid-template-columns:repeat(2,1fr) !important;
    gap:0.6rem;
  }
  #tab-dashboard .app-table [style*="grid-template-columns:1fr 1fr 1fr"]{
    grid-template-columns:1fr !important;
  }
  #tab-dashboard .app-table [style*="grid-template-columns:1fr 1fr"]{
    grid-template-columns:1fr !important;
  }

  /* ── Trade modal ── */
  #tab-trade .app-table [style*="grid-template-columns:1fr 1fr 1fr"]{
    grid-template-columns:1fr 1fr !important;
  }
  #tab-trade .app-table [style*="grid-template-columns:repeat(4,1fr)"]{
    grid-template-columns:repeat(2,1fr) !important;
  }

  /* ── Upgrade modal ── */
  .pricing-grid{ grid-template-columns:1fr !important; }
  #upgrade-plans-grid{ grid-template-columns:1fr !important; }

  /* ── Capital input row ── */
  #tab-signals > div:first-child{
    flex-direction:column;
    gap:0.75rem;
  }

  /* ── H2 "Top stories" ── */
  #tab-news h2{
    font-family:var(--font-display);
    font-size:1.4rem;
    color:var(--white);
    font-weight:700;
  }

  /* ── news grid ── */
  #news-container{
    grid-template-columns:1fr !important;
  }
}

@media(max-width:480px){
  .app-grid{ grid-template-columns:1fr 1fr !important; }
  .app-card-val{ font-size:1.3rem !important; }
  #dash-cards{ grid-template-columns:1fr 1fr !important; }
}


/* ═══════════════════════════════════════════════════
   MARKET TAB — TERMINAL STYLES
   ═══════════════════════════════════════════════════ */
.mkt-index-row{
  display:flex;align-items:center;padding:0.45rem 0;
  border-bottom:1px solid rgba(255,255,255,0.04);
}
.mkt-index-row:last-child{ border-bottom:none; }
.mkt-idx-name{
  font-family:var(--font-mono);font-size:0.65rem;
  color:var(--muted);letter-spacing:0.06em;flex:1;
}
.mkt-idx-val{
  font-family:var(--font-mono);font-size:0.72rem;
  color:var(--white);font-weight:600;min-width:90px;text-align:right;
}
.mkt-idx-chg{
  font-family:var(--font-mono);font-size:0.65rem;
  min-width:80px;text-align:right;
}
.mkt-skeleton{
  display:inline-block;width:60px;height:10px;
  background:linear-gradient(90deg,#1e2836 25%,#243040 50%,#1e2836 75%);
  background-size:200% 100%;border-radius:3px;
  animation:shimmer 1.4s infinite;
}
@keyframes shimmer{ 0%{background-position:200% 0} 100%{background-position:-200% 0} }
.mkt-sector-pill{
  font-family:var(--font-mono);font-size:0.55rem;letter-spacing:0.08em;
  padding:3px 8px;border-radius:3px;border:1px solid;cursor:default;
}
.mkt-sector-up  { color:var(--green);border-color:rgba(29,221,138,0.3);background:rgba(29,221,138,0.06); }
.mkt-sector-dn  { color:var(--red);border-color:rgba(255,69,96,0.3);background:rgba(255,69,96,0.06); }
.mkt-sector-na  { color:#3d5068;border-color:#1e2836;background:transparent; }
.mkt-ctx-row{
  display:flex;justify-content:space-between;align-items:center;
  padding:0.4rem 0;border-bottom:1px solid rgba(255,255,255,0.04);
}
.mkt-ctx-row:last-child{ border-bottom:none; }
.mkt-ctx-label{ font-family:var(--font-mono);font-size:0.62rem;color:var(--muted); }
.mkt-ctx-val  { font-family:var(--font-mono);font-size:0.68rem;color:var(--white);font-weight:600; }
.mkt-sched-card{
  padding:0.75rem;background:#080b0e;border:1px solid #1e2836;border-radius:4px;text-align:center;
}
.mkt-sched-card.mkt-sched-active{ border-color:rgba(29,221,138,0.35);background:rgba(29,221,138,0.05); }
.mkt-sched-card.mkt-sched-alert { border-color:rgba(245,192,24,0.35);background:rgba(245,192,24,0.05); }
.mkt-sched-time {
  font-family:var(--font-mono);font-size:0.75rem;font-weight:700;
  color:var(--white);margin-bottom:0.2rem;
}
.mkt-sched-label{ font-family:var(--font-mono);font-size:0.55rem;color:var(--muted);letter-spacing:0.08em; }
.mkt-top-row{
  display:flex;align-items:center;gap:0.5rem;padding:0.45rem 0;
  border-bottom:1px solid rgba(255,255,255,0.04);
}
.mkt-top-row:last-child{ border-bottom:none; }

/* ═══════════════════════════════════════════════════
   ACCOUNT / DASHBOARD TAB STYLES
   ═══════════════════════════════════════════════════ */
.dash-kpi{ transition:border-color 0.2s; }
.dash-kpi:hover{ border-color:rgba(0,229,200,0.2); }
.dash-section{ transition:border-color 0.2s; }
.dash-label{
  font-family:var(--font-mono);font-size:0.6rem;color:var(--muted);
  text-transform:uppercase;letter-spacing:0.1em;display:block;margin-bottom:0.4rem;
}
.dash-input{
  width:100%;background:#080b0e;border:1px solid #1e2836;
  color:var(--white);padding:0.65rem 0.85rem;
  font-family:var(--font-mono);font-size:0.8rem;outline:none;
  transition:border-color 0.2s;box-sizing:border-box;
}
.dash-input:focus{ border-color:rgba(0,229,200,0.35); }

/* ═══════════════════════════════════════════════════
   COMING SOON MODAL
   ═══════════════════════════════════════════════════ */
.cs-modal-backdrop{
  position:fixed;inset:0;background:rgba(0,0,0,0.82);
  z-index:99998;display:flex;align-items:center;justify-content:center;
  padding:1rem;animation:modalFadeIn 0.18s ease;
}
.cs-modal-box{
  background:#0d1117;border:1px solid #1e2836;border-radius:12px;
  width:100%;max-width:420px;padding:2rem;
  animation:modalSlideUp 0.22s cubic-bezier(0.34,1.56,0.64,1);
  position:relative;
}
.cs-badge{
  display:inline-block;font-family:var(--font-mono);font-size:0.55rem;
  letter-spacing:0.14em;padding:3px 10px;background:rgba(245,192,24,0.1);
  color:#f5c018;border:1px solid rgba(245,192,24,0.25);border-radius:3px;
  text-transform:uppercase;margin-bottom:1rem;
}

/* ═══════════════════════════════════════════════════
   PRICING PLAN — header badge colours
   ═══════════════════════════════════════════════════ */
#dash-header-plan-badge.plan-free   { background:rgba(245,192,24,0.1);color:#f5c018;border-color:rgba(245,192,24,0.25); }
#dash-header-plan-badge.plan-basic  { background:rgba(0,229,200,0.1);color:var(--cyan);border-color:rgba(0,229,200,0.25); }
#dash-header-plan-badge.plan-pro    { background:rgba(99,102,241,0.1);color:#818cf8;border-color:rgba(99,102,241,0.25); }
#dash-header-plan-badge.plan-elite  { background:rgba(245,192,24,0.15);color:#f5c018;border-color:rgba(245,192,24,0.4); }