/* mobile — gate only */

#mobile-gate { display: none; }
.mg-footer { display: none; }

@media (max-width: 768px) {
  /* hide everything desktop */
  #critters, #header, #footer, #page { display: none !important; }
  .mg-footer { display: none !important; }
  #mobile-page-slot { display: none !important; }

  /* gate — full viewport, no scroll */
  #mobile-gate {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100vh;
    height: 100dvh;
    padding: 0 28px;
    text-align: center;
    overflow: hidden;
  }

  .mg-inner {
    max-width: 340px;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  /* logo */
  .mg-title {
    font-size: 2.2rem;
    font-weight: 300;
    letter-spacing: 0.5em;
    padding-left: 0.5em;
    color: var(--green);
    text-shadow: 0 0 30px var(--glow-green), 0 0 60px rgba(124,255,107,0.06);
    margin-bottom: 6px;
  }
  .mg-title span { color: var(--pink); text-shadow: 0 0 20px var(--glow-pink); }

  /* tagline */
  .mg-sub {
    font-size: 0.6rem;
    color: var(--dim);
    letter-spacing: 0.22em;
    margin-bottom: 0;
  }

  /* dividers */
  .mg-divider {
    color: var(--line);
    letter-spacing: 0.5em;
    margin: 16px 0;
    font-size: 0.5rem;
  }

  /* status row */
  .mg-status {
    display: flex;
    justify-content: center;
    gap: 20px;
    font-size: 0.62rem;
    color: var(--soft);
    letter-spacing: 0.06em;
  }
  .mg-status b {
    color: var(--green);
    font-weight: 400;
    text-shadow: 0 0 6px var(--glow-green);
  }

  /* latest entry */
  .mg-latest {
    display: block;
    margin-top: 0;
    width: 100%;
  }
  .mg-latest-label {
    font-size: 0.52rem;
    color: var(--violet);
    letter-spacing: 0.25em;
    text-transform: uppercase;
    margin-bottom: 10px;
    text-align: center;
    text-shadow: 0 0 8px var(--glow-violet);
  }
  .mg-latest-body {
    font-size: 0.68rem;
    color: var(--soft);
    line-height: 1.75;
    max-height: 36vh;
    overflow-y: auto;
    padding: 14px 16px;
    border: 1px solid var(--line);
    background: rgba(8,8,26,0.6);
    text-align: left;
    -webkit-overflow-scrolling: touch;
  }

  /* desktop prompt */
  .mg-msg {
    display: block;
    font-size: 0.56rem;
    color: var(--dim);
    letter-spacing: 0.14em;
    margin-top: 0;
    opacity: 0.7;
  }

  .mg-url { display: none; }

  .mg-x {
    display: block;
    font-size: 0.58rem;
    color: var(--violet);
    text-decoration: none;
    letter-spacing: 0.1em;
    margin-top: 12px;
    text-shadow: 0 0 8px var(--glow-violet);
  }
  .mg-x:hover { color: var(--white); }
  .mg-nav { display: none; }

  /* about-row stacks on mobile */
  .about-row {
    display: flex !important;
    flex-direction: column;
    gap: 0;
  }
  .about-row .about-section {
    border: none;
    background: none;
    padding: 0;
    margin-bottom: 24px;
  }

  /* timeline single column on mobile */
  .tl-entries {
    display: flex !important;
    flex-direction: column;
  }
}