/* Let the welcome screen grow with a desktop display, without scaling the game. */
@media (min-width: 1101px) {
  #lobby {
    width: 92%;
    max-width: 3000px;
    min-height: calc(100dvh - 190px);
    padding: 24px 0;
    gap: clamp(48px, 5vw, 160px);
    grid-template-columns: minmax(0, 1.35fr) minmax(380px, .9fr);
  }

  #lobby .eyebrow { font-size: clamp(11px, .7vw, 18px); }
  #lobby .welcome h1 {
    font-size: clamp(46px, 3.7vw, 116px);
    letter-spacing: -.045em;
    margin: clamp(18px, 1.2vw, 36px) 0;
  }
  #lobby .welcome p {
    font-size: clamp(16px, 1.05vw, 29px);
    margin-bottom: clamp(24px, 1.6vw, 48px);
  }
  #lobby .welcome-art .table-preview {
    height: clamp(340px, min(26vw, 45dvh), 800px);
  }
  #lobby .travel-cards { width: 36%; right: 3%; }
  #lobby .travel-stamp {
    left: 3%;
    bottom: 6%;
    padding: clamp(12px, 1vw, 28px);
    gap: clamp(12px, .8vw, 24px);
    font-size: clamp(11px, .75vw, 21px);
  }
  #lobby .travel-stamp strong { font-size: clamp(14px, .95vw, 27px); }
  #lobby .passport-dots i { width: clamp(9px, .6vw, 17px); height: clamp(20px, 1.4vw, 40px); }
  #lobby .passport-dots i:nth-child(2) { height: clamp(26px, 1.8vw, 52px); }
  #lobby .feature-row {
    gap: clamp(26px, 2vw, 60px);
    padding-top: clamp(26px, 2vw, 60px);
    font-size: clamp(12px, .8vw, 22px);
    flex-wrap: wrap;
  }
  #lobby .feature-row b { font-size: clamp(26px, 1.65vw, 48px); }

  #lobby .lobby-card {
    min-width: 0;
    padding: clamp(28px, 2.2vw, 68px);
    border-radius: clamp(22px, 1.5vw, 40px);
    font-size: clamp(16px, 1vw, 27px);
  }
  #lobby .lobby-card h2 { font-size: clamp(28px, 2vw, 56px); }
  #lobby .account-panel {
    padding: clamp(26px, 1.8vw, 54px);
    margin-bottom: clamp(24px, 1.5vw, 44px);
  }
  #lobby .account-panel h2 { font-size: clamp(30px, 2.1vw, 60px); }
  #lobby .account-panel small,
  #lobby .lobby-card details,
  #lobby .mode-hint,
  #lobby .muted { font-size: clamp(13px, .85vw, 23px); }
  #lobby .google-login {
    min-height: clamp(56px, 4vw, 108px);
    margin-top: clamp(28px, 2vw, 56px);
    font-size: clamp(17px, 1.15vw, 32px);
  }
  #lobby .account-identity { flex-wrap: wrap; }
  #lobby .account-identity strong { font-size: clamp(24px, 1.5vw, 42px); overflow-wrap: anywhere; }
  #lobby .account-panel h3,
  #lobby .account-rooms button,
  #lobby .account-identity button { font-size: clamp(14px, .95vw, 25px); }
  #lobby .setup-choices legend,
  #lobby label { font-size: clamp(13px, .85vw, 23px); }
  #lobby .mode-picker .choice-card { padding: clamp(17px, 1.2vw, 34px); }
  #lobby .mode-picker .choice-card strong { font-size: clamp(19px, 1.25vw, 34px); }
  #lobby .mode-picker .choice-card small { font-size: clamp(12px, .8vw, 22px); }
  #lobby input,
  #lobby select,
  #lobby .primary { min-height: clamp(48px, 3vw, 84px); }
  body:not(.playing) > footer {
    width: 92%;
    max-width: 3000px;
    padding: 24px 0;
    font-size: clamp(11px, .75vw, 20px);
  }
}