/* ═══════════════════════════════════════════════════════════════
   OmicsLab — Gene Expression Heatmap + Volcano styles (Prompt 15)
   ═══════════════════════════════════════════════════════════════ */
.hm-wrap { max-width: 1200px; margin: 0 auto; padding: 2rem 1.5rem 4rem; }

.hm-header { margin-bottom: 1.25rem; }
.hm-badge { font-size: .65rem; font-weight: 700; letter-spacing: .12em; color: #e3b341; background: rgba(227,179,65,.1); border: 1px solid rgba(227,179,65,.25); border-radius: 20px; padding: .25rem .7rem; display: inline-block; margin-bottom: .5rem; }
.hm-title { font-size: 1.9rem; font-weight: 700; margin: 0 0 .4rem; }
.hm-subtitle { color: #8b949e; font-size: .92rem; max-width: 620px; margin: 0; }

/* ── Cards ── */
.hm-card { background: #161b22; border: 1px solid #21262d; border-radius: 10px; padding: 1rem 1.1rem; margin-bottom: 1.1rem; }
.hm-card-title { font-size: .85rem; font-weight: 700; color: #e6edf3; margin-bottom: .75rem; display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: .4rem; }
.hm-load-btn { font-size: .72rem; padding: .22rem .6rem; border: 1px solid #30363d; border-radius: 5px; background: transparent; color: #e3b341; cursor: pointer; transition: all .12s; }
.hm-load-btn:hover { border-color: #e3b341; background: rgba(227,179,65,.08); }

/* ── Input panel ── */
.hm-input-panel { }
.hm-textarea { width: 100%; box-sizing: border-box; background: #0d1117; border: 1px solid #30363d; border-radius: 6px; color: #e6edf3; font-family: 'JetBrains Mono', monospace; font-size: .78rem; padding: .65rem .8rem; resize: vertical; line-height: 1.5; }
.hm-textarea:focus { outline: none; border-color: #e3b341; }
.hm-params-row { display: flex; align-items: flex-end; gap: .85rem; flex-wrap: wrap; margin-top: .75rem; }
.hm-param-lbl { font-size: .76rem; color: #8b949e; display: flex; flex-direction: column; gap: .25rem; }
.hm-param-inp { width: 75px; background: #0d1117; border: 1px solid #30363d; border-radius: 5px; color: #e6edf3; font-size: .82rem; padding: .3rem .5rem; }
.hm-param-inp:focus { outline: none; border-color: #e3b341; }
.hm-run-btn { display: flex; align-items: center; gap: .4rem; padding: .4rem .9rem; background: linear-gradient(90deg,#2a2010,#201a08); border: 1px solid #e3b341; border-radius: 7px; color: #e3b341; font-size: .85rem; font-weight: 700; cursor: pointer; transition: all .15s; }
.hm-run-btn:hover { background: rgba(227,179,65,.1); box-shadow: 0 0 10px rgba(227,179,65,.2); }
.hm-status { font-size: .78rem; color: #8b949e; margin-top: .5rem; min-height: 1.2rem; }

/* ── Plots row ── */
.hm-plots-row { display: grid; grid-template-columns: 1fr 280px; gap: 1.1rem; margin-bottom: 1.1rem; }
@media (max-width: 900px) { .hm-plots-row { grid-template-columns: 1fr; } }
.hm-plot-empty { min-height: 150px; display: flex; align-items: center; justify-content: center; }
.hm-empty-state { font-size: .82rem; color: #6e7681; text-align: center; padding: 1.5rem; }
.hm-empty-inner { font-size: .8rem; color: #6e7681; padding: .5rem 0; }

/* ── Volcano ── */
.hm-volcano-wrap { overflow-x: auto; }
.hm-card-volcano { }
.hm-card-heatmap { }
.hm-heatmap-wrap { overflow-x: auto; }

/* ── Table ── */
.hm-table-wrap { overflow-x: auto; max-height: 400px; overflow-y: auto; }
.hm-table { width: 100%; border-collapse: collapse; font-size: .8rem; }
.hm-table thead th { position: sticky; top: 0; background: #161b22; padding: .35rem .6rem; color: #8b949e; text-align: left; font-size: .7rem; text-transform: uppercase; letter-spacing: .07em; border-bottom: 1px solid #21262d; }
.hm-table tbody tr:hover td { background: rgba(88,166,255,.04); }
.hm-table tbody td { padding: .32rem .6rem; border-bottom: 1px solid rgba(48,54,61,.5); font-family: 'JetBrains Mono', monospace; }
.hm-t-gene { font-weight: 600; color: #e6edf3; font-family: 'JetBrains Mono', monospace; }

/* ── Info grid ── */
.hm-info-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: .75rem; margin-top: 1rem; }
.hm-info-card { background: #161b22; border: 1px solid #21262d; border-radius: 7px; padding: .7rem .85rem; }
.hm-info-t { font-size: .8rem; font-weight: 700; color: #e3b341; margin-bottom: .25rem; }
.hm-info-d { font-size: .75rem; color: #8b949e; line-height: 1.5; }