/* ===================== Mobile ===================== */
.m-app { display: none; }

@media (max-width: 768px) {
  .app { display: none; }
  .m-app {
    position: relative; z-index: 1;
    display: grid; grid-template-rows: 52px 78px 62px 1fr 70px;
    height: 100vh; height: 100dvh;
  }

  .m-top {
    display: flex; align-items: center; justify-content: space-between;
    background: #333438; padding: 0 14px;
  }
  .m-top h1 { font-size: 21px; font-weight: 500; letter-spacing: .3px; }

  .m-search {
    display: flex; align-items: center; margin: 14px 10px;
    background: rgba(90, 96, 118, .55); padding: 0 10px;
  }
  .m-search input {
    flex: 1; height: 48px; background: none; border: 0; outline: 0;
    color: #fff; font-size: 20px;
  }
  .m-search input::placeholder { color: rgba(255,255,255,.75); }

  .m-head, .m-row {
    display: grid; grid-template-columns: 86px 1fr 104px 52px; align-items: center;
  }
  .m-head { background: #1f1f23; font-size: 16px; height: 62px; }
  .m-head > span { padding: 0 8px; }
  .m-head .m-c-name { border-left: 1px solid #444; height: 100%; display: flex; align-items: center; }
  .m-head .m-c-stakes { text-align: center; }
  .m-head .m-c-plrs { padding: 0; }

  .m-list { overflow-y: auto; min-height: 0; background: #1c2a52; }
  .m-list::-webkit-scrollbar { width: 0; }

  .m-row { height: 75px; margin-bottom: 2px; font-size: 12px; }
  .m-row .m-c-game { text-align: center; }
  .m-row .m-c-name {
    min-width: 0; height: 60px; padding-left: 10px;
    border-left: 1px solid rgba(255,255,255,.35);
    display: flex; flex-direction: column; justify-content: center;
  }
  .m-kind {
    align-self: flex-start;
    font-size: 9px; font-weight: 700; font-style: italic;
    border: 1.5px solid currentColor; border-radius: 3px; padding: 0 2px; line-height: 12px;
  }
  .m-name {
    font-size: 16px; font-weight: 700; font-style: italic;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  }
  .m-meta { display: flex; gap: 14px; font-size: 13px; white-space: nowrap; overflow: hidden; }
  .m-c-stakes { display: flex; justify-content: center; }
  .m-stakes {
    width: 96px; height: 58px; background: #9a9a9a;
    display: flex; align-items: center; justify-content: center; text-align: center;
    font-size: 11px; line-height: 1.3;
  }
  .m-c-plrs { text-align: center; font-size: 13px; }

  .m-holdem  { background: #000; color: #fff; }
  .m-holdem  .m-name, .m-holdem .m-stakes { color: #ffef3a; }
  .m-holdem  .m-kind, .m-holdem .m-meta { color: #fff; }
  .m-lowrake { background: #000; color: #fff; }
  .m-lowrake .m-name, .m-lowrake .m-stakes, .m-lowrake .m-c-game { color: #7cf03c; }
  .m-omaha   { background: #4c63d9; color: #fff; }
  .m-omaha   .m-kind { background: #fff; color: #4c63d9; border-color: #fff; }
  .m-vip     { background: #fdfb3e; color: #111; }
  .m-vip     .m-c-name { border-left-color: rgba(0,0,0,.3); }
  .m-vip     .m-kind { color: #fff; background: #f2c335; border-color: #f2c335; }
  .m-omaha6  { background: #ea9437; color: #1c1c1c; }
  .m-omaha6  .m-c-name { border-left-color: rgba(0,0,0,.3); }

  .m-nav {
    display: grid; grid-template-columns: repeat(6, 1fr);
    background: #2b2b2f; align-items: center;
  }
  .m-nav-item {
    position: relative;
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    font-size: 14px; line-height: 1.05; text-align: center; gap: 2px;
  }
  .m-nav-item.dim { color: #777; }
  .m-badge {
    position: absolute; top: -8px; right: 2px;
    background: #c62a2a; border-radius: 50%; width: 26px; height: 26px;
    display: flex; align-items: center; justify-content: center; font-size: 15px;
  }
}
